/**
 * Luna Mega Menu -- Acadia National Park Tours Design
 *
 * Palette + type match the Acadia homepage design.
 * Prefix: .lmm-  to avoid collisions with theme CSS.
 *
 * Sections:
 *   1. Custom properties (design tokens)
 *   2. Root reset / body offset
 *   3. Navigation bar
 *   4. Logo cartouche
 *   5. Nav items & CTA
 *   6. Hamburger (mobile trigger)
 *   7. Mega panel wrapper & background
 *   8. Mega panel inner (header, rule, footer)
 *   9. Tile grid layouts
 *  10. Tile component
 *  11. Mobile drawer
 *  12. Responsive breakpoints (1240, 1040, 768, 480)
 *  13. Reduced motion
 */


/* ═══════════════════════════════════════════════════════════════════════════
   1. CUSTOM PROPERTIES -- from design lines 369-383
   ═══════════════════════════════════════════════════════════════════════════ */

#lmm-root {
    /* Acadia palette (see layouts/index.html) */
    --lmm-parchment:     #FFFFFF;   /* nav bar background */
    --lmm-parchment-2:   #F5F6F4;   /* off-white section */
    --lmm-parchment-3:   #E4EDD6;   /* pale sage */
    --lmm-paper:         #FFFFFF;
    --lmm-ink:           #22411F;   /* deep forest green (text/headings) */
    --lmm-ink-2:         #356A31;   /* spruce green (links/secondary) */
    --lmm-ink-3:         #5D6163;   /* muted gray text */
    --lmm-rust:          #CC4B33;   /* terracotta (primary CTA) */
    --lmm-rust-dk:       #B03E23;   /* terracotta hover */
    --lmm-cream:         #F1EADB;
    --lmm-sage:          #E4EDD6;
    --lmm-sage-2:        #BFD49E;
    --lmm-gold:          #F6B73C;   /* rating stars */
    --lmm-hairline:      rgba(84,89,90,.32);
    --lmm-hairline-soft: rgba(46,90,42,.12);

    /* Families */
    --lmm-serif:  "Fraunces", Georgia, serif;
    --lmm-sans:   "Libre Franklin", ui-sans-serif, system-ui, sans-serif;
    --lmm-mono:   "Spline Sans Mono", ui-monospace, monospace;

    /* Nav height tokens for offset calculations (JS overrides at runtime) */
    --lmm-nav-height: 118px;

    font-family: var(--lmm-sans);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.5;
}


/* ═══════════════════════════════════════════════════════════════════════════
   2. ROOT RESET / BODY OFFSET
   ═══════════════════════════════════════════════════════════════════════════ */

/* Defensive resets on root */
#lmm-root,
#lmm-root *,
#lmm-root *::before,
#lmm-root *::after {
    box-sizing: border-box;
}

#lmm-root {
    border: none;
    outline: none;
    box-shadow: none;
}

/* Push page content below the fixed nav */
.lmm-nav-spacer {
    height: var(--lmm-nav-height);
    display: block;
}


/* ═══════════════════════════════════════════════════════════════════════════
   3. NAVIGATION BAR -- design lines 438-516
   ═══════════════════════════════════════════════════════════════════════════ */

.lmm-navwrap {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 9999;
    background: var(--lmm-parchment);
    transition: background .25s ease, box-shadow .25s ease;
    contain: layout style;
}

/* Scroll shadow -- toggled by JS adding .lmm-scrolled */
.lmm-navwrap.lmm-scrolled {
    box-shadow: 0 1px 0 var(--lmm-hairline-soft);
}

/* WordPress admin bar offset. WP pushes normal-flow content down with
   html{margin-top:32px} (46px on narrow screens), but our fixed header is
   pinned to the viewport top, so without this it hides under the admin bar
   and leaves a matching gap below the header. Only logged-in editors see it. */
.admin-bar .lmm-navwrap,
.admin-bar .lmm-mobile-drawer {
    top: 32px;
}
@media screen and (max-width: 782px) {
    .admin-bar .lmm-navwrap,
    .admin-bar .lmm-mobile-drawer {
        top: 46px;
    }
}

.lmm-nav {
    max-width: 1400px;
    margin: 0 auto;
    padding: 18px 40px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 40px;
    min-width: 0;
}

.lmm-nav > * {
    min-width: 0;
}


/* ═══════════════════════════════════════════════════════════════════════════
   4. LOGO CARTOUCHE -- design lines 454-474
   ═══════════════════════════════════════════════════════════════════════════ */

.lmm-logo {
    display: flex;
    align-items: center;
    gap: 14px;
    text-decoration: none;
    color: var(--lmm-ink);
    flex-shrink: 0;
}

.lmm-cartouche {
    border: 1.5px solid var(--lmm-ink);
    border-radius: 8px;
    padding: 8px 18px 8px 14px;
    background: var(--lmm-paper);
    display: flex;
    align-items: center;
    gap: 12px;
    position: relative;
    /* Double border with dot decorations -- design line 464 */
    box-shadow: inset 0 0 0 3px var(--lmm-parchment), inset 0 0 0 4px var(--lmm-ink);
}

/* Dot decorations on sides of cartouche -- design lines 466-470 */
.lmm-cartouche::before,
.lmm-cartouche::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--lmm-ink);
    transform: translateY(-50%);
}
.lmm-cartouche::before { left: -3px; }
.lmm-cartouche::after  { right: -3px; }

.lmm-horse {
    width: 32px;
    height: 24px;
    color: var(--lmm-ink);
    flex-shrink: 0;
}

.lmm-stack {
    display: flex;
    flex-direction: column;
    line-height: 1;
    white-space: nowrap;
}

.lmm-logo-top {
    font-family: var(--lmm-serif);
    font-weight: 600;
    font-size: 18px;
    letter-spacing: .04em;
    color: var(--lmm-ink);
}

.lmm-logo-bot {
    font-family: var(--lmm-sans);
    font-size: 9px;
    letter-spacing: .32em;
    font-weight: 600;
    margin-top: 4px;
    color: var(--lmm-ink-2);
}


/* ═══════════════════════════════════════════════════════════════════════════
   5. NAV ITEMS & CTA -- design lines 476-516
   ═══════════════════════════════════════════════════════════════════════════ */

.lmm-navitems {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.lmm-nav-item {
    position: relative;
}

.lmm-nav-item button {
    appearance: none;
    border: 0;
    background: transparent;
    font-family: var(--lmm-sans);
    color: var(--lmm-ink);
    cursor: pointer;
    padding: 14px 16px;
    letter-spacing: .16em;
    text-transform: uppercase;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: color .2s ease;
    white-space: nowrap;
    line-height: 1;
}

.lmm-chev {
    width: 9px;
    height: 9px;
    opacity: .55;
    transition: transform .25s ease, opacity .25s ease;
    flex-shrink: 0;
}

/* Open state -- chevron rotates, text turns rust */
.lmm-nav-item[data-lmm-open="true"] .lmm-chev {
    transform: rotate(180deg);
    opacity: 1;
}
.lmm-nav-item[data-lmm-open="true"] button {
    color: var(--lmm-rust);
}
.lmm-nav-item button:hover {
    color: var(--lmm-rust);
}

/* Hierarchical weighting -- design lines 501-504 */
/* "hier" = 3 primary larger/bolder, 2 secondary smaller/lighter */
[data-lmm-weighting="hier"] .lmm-tier-primary button {
    font-size: 13.5px;
    font-weight: 600;
}
[data-lmm-weighting="hier"] .lmm-tier-secondary button {
    font-size: 11px;
    font-weight: 500;
    color: var(--lmm-ink-3);
    letter-spacing: .18em;
}
[data-lmm-weighting="hier"] .lmm-tier-secondary button:hover {
    color: var(--lmm-rust);
}

/* Equal weighting -- design line 504 */
[data-lmm-weighting="equal"] .lmm-nav-item button {
    font-size: 12.5px;
    font-weight: 500;
}

/* CTA button -- design lines 506-516 */
.lmm-cta {
    appearance: none;
    border: 0;
    cursor: pointer;
    background: var(--lmm-rust);
    color: var(--lmm-paper);
    padding: 16px 28px;
    font: 600 12px/1 var(--lmm-sans);
    letter-spacing: .18em;
    text-transform: uppercase;
    border-radius: 2px;
    box-shadow: 0 6px 14px -8px rgba(155,55,15,.6);
    transition: background .2s ease, transform .2s ease;
    text-decoration: none;
    display: inline-block;
    white-space: nowrap;
    flex-shrink: 0;
    text-align: center;
}
.lmm-cta:hover {
    background: var(--lmm-rust-dk);
    transform: translateY(-1px);
    color: var(--lmm-paper);
    text-decoration: none;
}

/* Hamburger -- hidden on desktop */
.lmm-hamburger {
    display: none;
}


/* ═══════════════════════════════════════════════════════════════════════════
   7. MEGA PANEL WRAPPER & BACKGROUND -- design lines 518-541
   ═══════════════════════════════════════════════════════════════════════════ */

.lmm-megawrap {
    position: fixed;
    left: 0;
    right: 0;
    top: var(--lmm-nav-height);
    bottom: 0;
    z-index: 9998;
    pointer-events: none;
}

.lmm-megawrap.lmm-open {
    pointer-events: auto;
}

/* Background overlay -- covers full viewport below nav */
.lmm-megabg {
    position: absolute;
    inset: 0;
    background: rgba(28, 33, 25, .55);
    opacity: 0;
    transition: opacity .35s ease;
    pointer-events: none;
}
.lmm-megawrap.lmm-open .lmm-megabg {
    opacity: 1;
    pointer-events: auto;
}

/* Individual mega panel -- design lines 533-541 */
.lmm-mega {
    background: var(--lmm-parchment);
    border-top: 1px solid var(--lmm-hairline-soft);
    box-shadow: 0 28px 60px -32px rgba(0,0,0,.35);
    transform: translateY(-12px);
    opacity: 0;
    transition: opacity .28s ease, transform .32s cubic-bezier(.2,.7,.2,1);
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    visibility: hidden;
    max-height: calc(90vh - var(--lmm-nav-height));
}

/* Panel open state */
.lmm-mega[aria-hidden="false"],
.lmm-mega:not([hidden]) {
    visibility: visible;
}
.lmm-megawrap.lmm-open .lmm-mega.lmm-panel-active {
    opacity: 1;
    transform: translateY(0);
    visibility: visible;
}


/* ═══════════════════════════════════════════════════════════════════════════
   8. MEGA PANEL INNER -- design lines 542-716
   ═══════════════════════════════════════════════════════════════════════════ */

.lmm-mega-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px 40px 20px;
}

/* Western rule -- design lines 710-716 */
.lmm-west-rule {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--lmm-ink-3);
    font: 600 11px/1 var(--lmm-sans);
    letter-spacing: .22em;
    text-transform: uppercase;
    margin-bottom: 12px;
}
.lmm-rule-line {
    flex: 1;
    height: 1px;
    background: var(--lmm-hairline-soft);
}
.lmm-rule-glyph {
    color: var(--lmm-rust);
    font-size: 14px;
}

/* Panel header -- design lines 546-563 */
.lmm-mega-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 16px;
    border-bottom: 1px solid var(--lmm-hairline-soft);
    padding-bottom: 12px;
    gap: 40px;
}

.lmm-kicker {
    color: var(--lmm-rust);
    letter-spacing: .22em;
    font-size: 10.5px;
    font-weight: 600;
    text-transform: uppercase;
    font-family: var(--lmm-sans);
}

.lmm-panel-title {
    font-family: var(--lmm-serif);
    font-weight: 500;
    font-style: italic;
    font-size: 36px;
    line-height: 1;
    margin: 6px 0 0;
    color: var(--lmm-ink);
}

.lmm-mega-head-right {
    text-align: right;
    color: var(--lmm-ink-3);
    font-size: 13px;
    max-width: 340px;
    flex-shrink: 0;
}

.lmm-blurb {
    line-height: 1.45;
}

.lmm-more {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 8px;
    color: var(--lmm-ink);
    text-decoration: none;
    border-bottom: 1px solid var(--lmm-ink);
    padding-bottom: 2px;
    font: 600 11px/1 var(--lmm-sans);
    letter-spacing: .18em;
    text-transform: uppercase;
    transition: color .2s ease, border-color .2s ease;
}
.lmm-more:hover {
    color: var(--lmm-rust);
    border-color: var(--lmm-rust);
}

/* Panel footer -- design lines 698-708 */
.lmm-mega-foot {
    margin-top: 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 12px;
    border-top: 1px solid var(--lmm-hairline-soft);
    color: var(--lmm-ink-3);
    font-size: 12.5px;
}
.lmm-mega-foot-left {
    display: flex;
    align-items: center;
    gap: 28px;
}
.lmm-mega-foot-left a {
    color: var(--lmm-ink);
    text-decoration: none;
    letter-spacing: .12em;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    transition: color .2s ease;
}
.lmm-mega-foot-left a:hover {
    color: var(--lmm-rust);
}
.lmm-phone-label {
    letter-spacing: .18em;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--lmm-ink-3);
    margin-right: 10px;
}
.lmm-phone {
    font-family: var(--lmm-serif);
    font-style: italic;
    font-size: 18px;
}
.lmm-phone a {
    color: var(--lmm-ink);
    text-decoration: none;
    transition: color .2s ease;
}
.lmm-phone a:hover {
    color: var(--lmm-rust);
}


/* ═══════════════════════════════════════════════════════════════════════════
   9. TILE GRID LAYOUTS -- design lines 565-578
   ═══════════════════════════════════════════════════════════════════════════ */

/* Tile grid fills 90vh minus nav bar, header, rule, footer, and padding (~220px) */
.lmm-tiles {
    display: grid;
    gap: 12px;
    height: calc(90vh - var(--lmm-nav-height) - 220px);
    min-height: 260px;
}

/* Featured-left: big tile left + stack right */
.lmm-tiles[data-layout="left"] {
    grid-template-columns: 1.2fr 1fr;
    grid-template-rows: 1fr;
}
/* Featured-right: stack left + big tile right */
.lmm-tiles[data-layout="right"] {
    grid-template-columns: 1fr 1.2fr;
    grid-template-rows: 1fr;
}

.lmm-tiles[data-layout="left"] .lmm-stack,
.lmm-tiles[data-layout="right"] .lmm-stack {
    display: grid;
    gap: 12px;
}

/* Stack grid varies by count -- design lines 573-575 */
.lmm-stack { height: 100%; }
.lmm-stack[data-stack="3"] { grid-template-columns: 1fr; grid-template-rows: repeat(3, 1fr); }
.lmm-stack[data-stack="4"] { grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr); }
.lmm-stack[data-stack="6"] { grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(2, 1fr); }

/* Equal row: N across -- design lines 577-579 */
.lmm-tiles[data-layout="none"][data-count="4"] { grid-template-columns: repeat(4, 1fr); }
.lmm-tiles[data-layout="none"][data-count="5"] { grid-template-columns: repeat(5, 1fr); gap: 12px; }
.lmm-tiles[data-layout="none"][data-count="7"] { grid-template-columns: repeat(7, 1fr); gap: 10px; }

/* ── Mosaic layout: featured 3/5 width + balanced small tiles ── */
.lmm-tiles[data-layout="mosaic"] {
    grid-template-columns: 3fr 1fr 1fr;
    grid-template-rows: repeat(3, 1fr);
    grid-auto-flow: dense;
}
/* Featured tile spans 1 wide col + all 3 rows */
.lmm-tiles[data-layout="mosaic"] .lmm-tile--featured {
    grid-row: span 3;
}
/* Small tiles fill naturally — 2 columns x 3 rows */
.lmm-tiles[data-layout="mosaic"] .lmm-tile {
    height: 100%;
    min-height: 0;
}

/* ── Grid layout: balanced uniform cards ── */
.lmm-tiles[data-layout="grid"] {
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
}
.lmm-tiles[data-layout="grid"] .lmm-tile {
    height: 100%;
    min-height: 0;
}



/* ═══════════════════════════════════════════════════════════════════════════
   10. TILE COMPONENT -- design lines 581-697
   ═══════════════════════════════════════════════════════════════════════════ */

.lmm-tile {
    position: relative;
    overflow: hidden;
    color: var(--lmm-paper);
    text-decoration: none;
    background: #14260F;
    isolation: isolate;
    display: block;
    cursor: pointer;
    transition: transform .35s cubic-bezier(.2,.7,.2,1);
    /* contain: layout style paint; -- cannot use due to position:absolute children */
}

/* Image background -- design lines 593-600 */
.lmm-tile-media {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    transform: scale(1.0);
    transition: transform 4s ease, filter .4s ease;
    filter: saturate(.92) brightness(.86);
}
.lmm-tile:hover .lmm-tile-media {
    transform: scale(1.08);
    filter: saturate(1.05) brightness(.78);
}

/* Gradient scrim -- design lines 601-604 */
.lmm-tile-scrim {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(20,38,18,0) 30%, rgba(20,38,18,.82) 100%);
    z-index: 2;
}

/* Decorative inner frame -- design lines 605-611 */
.lmm-tile-frame {
    position: absolute;
    inset: 10px;
    border: 1px solid rgba(241,234,219,.32);
    pointer-events: none;
    transition: inset .35s ease, border-color .35s ease;
    z-index: 3;
}
.lmm-tile:hover .lmm-tile-frame {
    inset: 14px;
    border-color: rgba(241,234,219,.6);
}

/* Copy area -- design lines 612-628 */
.lmm-tile-copy {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 22px 24px 22px;
    z-index: 4;
}
.lmm-tile-title {
    font-family: var(--lmm-serif);
    font-weight: 500;
    font-size: clamp(20px, 1.8vw, 30px);
    line-height: 1.05;
    letter-spacing: .005em;
    margin: 0;
    color: var(--lmm-paper);
}
.lmm-tile-sub {
    display: block;
    margin-top: 6px;
    font-family: var(--lmm-sans);
    font-size: 12.5px;
    letter-spacing: .04em;
    color: rgba(241,234,219,.78);
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transition: max-height .35s ease, opacity .25s ease, margin-top .25s ease;
}
.lmm-tile:hover .lmm-tile-sub {
    max-height: 60px;
    opacity: 1;
}

/* Play indicator (hover-to-play) -- design lines 631-642 */
.lmm-tile-play {
    position: absolute;
    top: 20px;
    right: 20px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(241,234,219,.18);
    border: 1px solid rgba(241,234,219,.45);
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(8px);
    opacity: 0;
    transform: scale(.9);
    transition: opacity .25s ease, transform .25s ease, background .25s ease;
    z-index: 4;
}
.lmm-tile-play svg {
    width: 12px;
    height: 12px;
    color: var(--lmm-paper);
    margin-left: 2px;
}
.lmm-tile:hover .lmm-tile-play {
    opacity: 1;
    transform: scale(1);
    background: rgba(204,75,51,.85);
}

/* Badge -- design lines 644-652 */
.lmm-tile-badge {
    position: absolute;
    top: 20px;
    left: 20px;
    font: 600 10px/1 var(--lmm-sans);
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--lmm-paper);
    padding: 6px 10px;
    border: 1px solid rgba(241,234,219,.45);
    background: rgba(20,38,18,.35);
    backdrop-filter: blur(8px);
    z-index: 4;
}

/* Featured tile: bigger type -- design lines 654-657 */
.lmm-tile--featured .lmm-tile-copy { padding: 32px 32px; }
.lmm-tile--featured .lmm-tile-title { font-size: clamp(34px, 3.2vw, 52px); }
.lmm-tile--featured .lmm-tile-sub { font-size: 14px; }

/* Aspect ratios -- design lines 659-669 */
/* All tiles fill their grid cell height */
.lmm-tile {
    height: 100%;
    min-height: 0;
}
/* Featured tile in left/right fills the full grid height */
.lmm-tiles[data-layout="left"]  .lmm-tile--featured,
.lmm-tiles[data-layout="right"] .lmm-tile--featured {
    height: 100%;
}

/* Equal cinema strip aspect ratios -- design lines 667-669 */
/* None layout: all tiles equal, single row fills grid height */
.lmm-tiles[data-layout="none"] {
    grid-auto-rows: 1fr;
}

/* Dense equal strips -- shrink type -- design lines 671-677 */
.lmm-tiles[data-layout="none"][data-count="5"] .lmm-tile-copy { padding: 18px 18px; }
.lmm-tiles[data-layout="none"][data-count="5"] .lmm-tile-title { font-size: clamp(18px, 1.5vw, 24px); }
.lmm-tiles[data-layout="none"][data-count="7"] .lmm-tile-copy { padding: 14px 14px; }
.lmm-tiles[data-layout="none"][data-count="7"] .lmm-tile-title { font-size: clamp(15px, 1.2vw, 20px); line-height: 1.05; }
.lmm-tiles[data-layout="none"][data-count="7"] .lmm-tile-badge { padding: 4px 7px; font-size: 9px; top: 12px; left: 12px; }
.lmm-tiles[data-layout="none"][data-count="7"] .lmm-tile-play { width: 28px; height: 28px; top: 12px; right: 12px; }
.lmm-tiles[data-layout="none"][data-count="7"] .lmm-tile-frame { inset: 7px; }

/* Stack tile adjustments -- design lines 679-688 */
.lmm-stack[data-stack="6"] .lmm-tile-copy { padding: 14px 14px; }
.lmm-stack[data-stack="6"] .lmm-tile-title { font-size: clamp(15px, 1.2vw, 20px); line-height: 1.05; }
.lmm-stack[data-stack="6"] .lmm-tile-badge { padding: 4px 7px; font-size: 9px; top: 12px; left: 12px; }
.lmm-stack[data-stack="6"] .lmm-tile-play { width: 28px; height: 28px; top: 12px; right: 12px; }
.lmm-stack[data-stack="4"] .lmm-tile-copy { padding: 16px 16px; }
.lmm-stack[data-stack="4"] .lmm-tile-title { font-size: clamp(16px, 1.35vw, 22px); }

/* Stack fills its grid cell and tiles fill the stack */
.lmm-tiles[data-layout="left"]  .lmm-stack,
.lmm-tiles[data-layout="right"] .lmm-stack {
    height: 100%;
    overflow: hidden;
}
.lmm-tiles[data-layout="left"]  .lmm-stack .lmm-tile,
.lmm-tiles[data-layout="right"] .lmm-stack .lmm-tile {
    height: 100%;
    min-height: 0;
}

/* Border treatments -- design lines 690-696 */
[data-lmm-border="square"] .lmm-tile { border-radius: 0; }
[data-lmm-border="soft"]   .lmm-tile { border-radius: 10px; }
[data-lmm-border="soft"]   .lmm-tile-frame { border-radius: 4px; }
[data-lmm-border="arched"] .lmm-tile { border-radius: 50% 50% 4px 4px / 18% 18% 4px 4px; }
[data-lmm-border="arched"] .lmm-tile-frame { border-radius: 50% 50% 0 0 / 18% 18% 0 0; }
[data-lmm-border="arched"] .lmm-tile-copy { padding-bottom: 22px; }


/* ═══════════════════════════════════════════════════════════════════════════
   11. MOBILE DRAWER
   ═══════════════════════════════════════════════════════════════════════════ */

/* Hamburger trigger — 48x48 min touch target */
.lmm-hamburger {
    display: none;
    appearance: none;
    border: 1.5px solid var(--lmm-hairline);
    background: var(--lmm-paper);
    cursor: pointer;
    padding: 0;
    width: 48px;
    height: 48px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    flex-shrink: 0;
    border-radius: 8px;
    transition: background .15s ease, border-color .15s ease;
}
.lmm-hamburger:hover,
.lmm-hamburger:active {
    background: var(--lmm-parchment-2);
    border-color: var(--lmm-hairline);
}
.lmm-hamburger-line {
    display: block;
    width: 22px;
    height: 2px;
    background: var(--lmm-ink);
    border-radius: 2px;
    transition: transform .3s ease, opacity .3s ease;
    pointer-events: none;
}

/* Hamburger → X animation */
.lmm-hamburger[aria-expanded="true"] .lmm-hamburger-line:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
}
.lmm-hamburger[aria-expanded="true"] .lmm-hamburger-line:nth-child(2) {
    opacity: 0;
}
.lmm-hamburger[aria-expanded="true"] .lmm-hamburger-line:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
}

/* Drawer */
.lmm-mobile-drawer {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10000;
    background: var(--lmm-parchment);
    transform: translateX(100%);
    transition: transform .35s cubic-bezier(.2,.7,.2,1);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

.lmm-mobile-drawer[aria-hidden="false"] {
    transform: translateX(0);
}

.lmm-mobile-drawer-inner {
    padding: 20px 24px;
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

/* Mobile header — logo + close, vertically centered */
.lmm-mobile-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--lmm-hairline);
    min-height: 56px;
}
.lmm-mobile-logo {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: var(--lmm-ink);
    outline: none;
}
.lmm-mobile-logo:focus-visible {
    outline: 2px solid var(--lmm-rust);
    outline-offset: 4px;
    border-radius: 4px;
}
.lmm-mobile-close {
    appearance: none;
    border: 1.5px solid var(--lmm-hairline);
    background: var(--lmm-paper);
    cursor: pointer;
    color: var(--lmm-ink);
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    transition: background .15s ease, border-color .15s ease;
    flex-shrink: 0;
}
.lmm-mobile-close span {
    font-size: 24px;
    line-height: 1;
    font-weight: 300;
}
.lmm-mobile-close:hover,
.lmm-mobile-close:active {
    background: var(--lmm-parchment-2);
    border-color: var(--lmm-hairline);
}

/* Mobile accordion nav */
.lmm-mobile-nav {
    flex: 1;
}
.lmm-mobile-section {
    border-bottom: 1px solid var(--lmm-hairline-soft);
}
.lmm-mobile-section:first-child {
    border-top: none;
}
.lmm-mobile-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 0;
    min-height: 48px;
    cursor: pointer;
    list-style: none;
    font: 600 13px/1 var(--lmm-sans);
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--lmm-ink);
    -webkit-tap-highlight-color: transparent;
}
.lmm-mobile-item::-webkit-details-marker { display: none; }
.lmm-mobile-item::marker { display: none; content: ""; }
.lmm-mobile-section[open] .lmm-mobile-item {
    color: var(--lmm-rust);
}
.lmm-mobile-chev {
    width: 12px;
    height: 12px;
    transition: transform .25s ease;
    flex-shrink: 0;
    opacity: .5;
}
.lmm-mobile-section[open] .lmm-mobile-chev {
    transform: rotate(180deg);
    opacity: 1;
}

/* Expanded panel content */
.lmm-mobile-panel {
    padding: 0 0 20px;
}
.lmm-mobile-panel-head {
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--lmm-hairline-soft);
}
.lmm-mobile-panel-head .lmm-kicker {
    margin-bottom: 4px;
    font-size: 10px;
}
.lmm-mobile-panel-title {
    font-family: var(--lmm-serif);
    font-weight: 500;
    font-style: italic;
    font-size: 22px;
    line-height: 1.15;
    margin: 0;
    color: var(--lmm-ink);
}

/* Tile list */
.lmm-mobile-tiles {
    list-style: none;
    margin: 0;
    padding: 0;
}
.lmm-mobile-tiles li {
    border-bottom: 1px solid var(--lmm-hairline-soft);
}
.lmm-mobile-tiles li:first-child {
    border-top: none;
}
.lmm-mobile-tile-link {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 0;
    min-height: 48px;
    text-decoration: none;
    color: var(--lmm-ink);
    transition: color .15s ease;
    -webkit-tap-highlight-color: transparent;
}
.lmm-mobile-tile-link:active {
    color: var(--lmm-rust);
}
.lmm-mobile-tile-thumb {
    width: 48px;
    height: 48px;
    border-radius: 6px;
    overflow: hidden;
    flex-shrink: 0;
    background: var(--lmm-ink);
}
.lmm-mobile-tile-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.lmm-mobile-tile-text {
    flex: 1;
    min-width: 0;
}
.lmm-mobile-tile-title {
    display: block;
    font-family: var(--lmm-serif);
    font-weight: 500;
    font-size: 17px;
    line-height: 1.2;
}
.lmm-mobile-tile-sub {
    display: block;
    font-family: var(--lmm-sans);
    font-size: 11.5px;
    color: var(--lmm-ink-3);
    margin-top: 1px;
}
.lmm-mobile-badge {
    font: 600 8px/1 var(--lmm-sans);
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--lmm-rust);
    padding: 3px 6px;
    border: 1px solid var(--lmm-rust);
    border-radius: 3px;
    flex-shrink: 0;
    white-space: nowrap;
    opacity: .8;
}
.lmm-mobile-more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    color: var(--lmm-rust);
    text-decoration: none;
    font: 600 11px/1 var(--lmm-sans);
    letter-spacing: .16em;
    text-transform: uppercase;
    padding: 10px 0;
}

/* Mobile footer */
.lmm-mobile-footer {
    margin-top: auto;
    padding-top: 24px;
    border-top: 1px solid var(--lmm-hairline);
    text-align: center;
}
.lmm-mobile-cta {
    display: block;
    width: 100%;
    background: var(--lmm-rust);
    color: var(--lmm-paper);
    padding: 16px 24px;
    font: 600 12px/1 var(--lmm-sans);
    letter-spacing: .18em;
    text-transform: uppercase;
    border-radius: 4px;
    text-decoration: none;
    text-align: center;
    box-shadow: 0 4px 12px -4px rgba(155,55,15,.5);
    transition: background .15s ease, transform .15s ease;
}
.lmm-mobile-cta:active {
    background: var(--lmm-rust-dk);
    transform: scale(.98);
}
.lmm-mobile-phone {
    margin-top: 16px;
    padding-bottom: 8px;
}
.lmm-mobile-phone .lmm-phone-label {
    display: block;
    font: 500 10px/1 var(--lmm-sans);
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--lmm-ink-3);
    margin-bottom: 4px;
}
.lmm-mobile-phone a {
    color: var(--lmm-ink);
    text-decoration: none;
    font-family: var(--lmm-serif);
    font-style: italic;
    font-size: 20px;
}


/* ═══════════════════════════════════════════════════════════════════════════
   12. RESPONSIVE BREAKPOINTS -- design lines 718-740
   ═══════════════════════════════════════════════════════════════════════════ */

/* 1240px -- compress nav -- design lines 719-730 */
@media (max-width: 1240px) {
    #lmm-root { --lmm-nav-height: 70px; }

    .lmm-nav {
        padding: 14px 24px;
        gap: 20px;
    }
    .lmm-navitems { gap: 0; }
    .lmm-nav-item button {
        padding: 12px 11px;
        letter-spacing: .14em;
        font-size: 11.5px;
    }
    [data-lmm-weighting="hier"] .lmm-tier-primary button { font-size: 12px; }
    [data-lmm-weighting="hier"] .lmm-tier-secondary button { font-size: 10.5px; letter-spacing: .16em; }
    .lmm-cta { padding: 13px 18px; font-size: 10.5px; letter-spacing: .14em; }

    .lmm-cartouche { padding: 7px 14px 7px 12px; }
    .lmm-logo-top { font-size: 15px; }
    .lmm-logo-bot { font-size: 8px; letter-spacing: .28em; }
    .lmm-horse { width: 28px; height: 20px; }
}

/* 1040px -- further compress -- design lines 731-740 */
@media (max-width: 1040px) {
    #lmm-root { --lmm-nav-height: 62px; }

    .lmm-nav {
        padding: 12px 16px;
        gap: 12px;
    }
    .lmm-nav-item button {
        padding: 10px 7px;
        font-size: 10.5px !important;
        letter-spacing: .1em;
    }
    [data-lmm-weighting="hier"] .lmm-tier-primary button { font-size: 11px !important; }
    [data-lmm-weighting="hier"] .lmm-tier-secondary button { font-size: 10px !important; }
    .lmm-cta { padding: 11px 14px; font-size: 10px; }
    .lmm-mega-inner { padding: 28px 24px 32px; }
}

/* 768px -- mobile breakpoint */
@media (max-width: 768px) {
    #lmm-root { --lmm-nav-height: 60px; }

    .lmm-nav {
        grid-template-columns: 1fr auto;
        padding: 8px 16px;
        gap: 12px;
    }

    /* Scale down the logo cartouche */
    .lmm-cartouche {
        padding: 5px 12px 5px 10px;
    }
    .lmm-horse {
        width: 24px;
        height: 18px;
    }
    .lmm-logo-top {
        font-size: 14px;
    }
    .lmm-logo-bot {
        font-size: 7px;
        letter-spacing: .24em;
    }

    /* Hamburger: sized for mobile, not oversized */
    .lmm-hamburger {
        width: 44px;
        height: 44px;
    }
    .lmm-hamburger-line {
        width: 20px;
    }

    /* Hide desktop nav items and show hamburger */
    .lmm-navitems { display: none; }
    .lmm-cta { display: none; }
    .lmm-hamburger { display: flex; }

    /* Hide mega panels on mobile -- drawer takes over */
    .lmm-megawrap { display: none; }

    /* Tile grid collapses to 2 columns */
    .lmm-tiles[data-layout="left"],
    .lmm-tiles[data-layout="right"] {
        grid-template-columns: 1fr;
    }
    .lmm-tiles[data-layout="none"][data-count="4"],
    .lmm-tiles[data-layout="none"][data-count="5"],
    .lmm-tiles[data-layout="none"][data-count="7"] {
        grid-template-columns: repeat(2, 1fr);
    }
    .lmm-stack[data-stack="3"],
    .lmm-stack[data-stack="4"],
    .lmm-stack[data-stack="6"] {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto;
    }
}

/* 480px -- small mobile */
@media (max-width: 480px) {
    .lmm-nav {
        padding: 12px 16px;
    }
    .lmm-cartouche {
        padding: 6px 12px 6px 10px;
    }
    .lmm-horse { width: 24px; height: 18px; }
    .lmm-logo-top { font-size: 14px; }
    .lmm-logo-bot { font-size: 7px; }

    .lmm-mobile-drawer-inner {
        padding: 20px 16px;
    }
    .lmm-mobile-panel-title {
        font-size: 20px;
    }
}


/* ═══════════════════════════════════════════════════════════════════════════
   13. REDUCED MOTION
   ═══════════════════════════════════════════════════════════════════════════ */

@media (prefers-reduced-motion: reduce) {
    .lmm-navwrap,
    .lmm-mega,
    .lmm-megabg,
    .lmm-tile,
    .lmm-tile-media,
    .lmm-tile-frame,
    .lmm-tile-sub,
    .lmm-tile-play,
    .lmm-chev,
    .lmm-mobile-drawer,
    .lmm-hamburger-line,
    .lmm-mobile-chev,
    .lmm-cta {
        transition-duration: 0.01ms !important;
    }
    .lmm-tile:hover .lmm-tile-media {
        transform: none;
    }
}


/* ═══════════════════════════════════════════════════════════════════════════
   VIDEO OVERLAY (injected by JS for hover-to-play)
   ═══════════════════════════════════════════════════════════════════════════ */

.lmm-tile-video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 1;
    opacity: 0;
    transition: opacity .4s ease;
}
.lmm-tile--video-playing .lmm-tile-video {
    opacity: 1;
}
.lmm-tile-iframe-wrap {
    position: absolute;
    inset: 0;
    z-index: 1;
    opacity: 0;
    transition: opacity .4s ease;
}
.lmm-tile-iframe-wrap iframe {
    width: 100%;
    height: 100%;
    border: 0;
}
.lmm-tile--video-playing .lmm-tile-iframe-wrap {
    opacity: 1;
}


/* ═══════════════════════════════════════════════════════════════════════════
   WORDPRESS THEME COMPAT -- prevent theme CSS from breaking the menu
   ═══════════════════════════════════════════════════════════════════════════ */

/* Hide theme header when Luna Mega Menu is active.
   Targets Twenty Twenty-Five and common block theme header patterns. */
body.has-luna-mega-menu .wp-block-template-part:first-child:has(.wp-block-site-title),
body.has-luna-mega-menu .wp-block-template-part:first-child:has(.wp-block-navigation) {
    display: none !important;
}

/* Ensure our z-index wins */
.lmm-navwrap {
    z-index: 9999 !important;
}
.lmm-megawrap {
    z-index: 9998 !important;
}
.lmm-mobile-drawer {
    z-index: 10000 !important;
}

/* Reset any theme typography overrides inside our root */
#lmm-root h3,
#lmm-root h4 {
    margin: 0;
    padding: 0;
    border: none;
    font-size: inherit;
    line-height: inherit;
}
#lmm-root ul {
    margin: 0;
    padding: 0;
    list-style: none;
}
#lmm-root a {
    text-decoration: none;
}
#lmm-root button {
    font-family: inherit;
}


/* ═══════════════════════════════════════════════════════════════════════════
   ACADIA FLAT NAV + TRUST BAR  (overrides the mega defaults above)
   Values from layouts/index.html header (.s1–.sf)
   ═══════════════════════════════════════════════════════════════════════════ */

.lmm-navwrap {
    background: #FFFFFF;
    border-bottom: 1px solid rgba(84,89,90,.32);
}
.lmm-navwrap.lmm-scrolled {
    box-shadow: 0 2px 10px -6px rgba(24,51,26,.25);
}

/* Nav row: logo left, links + CTA right */
.lmm-nav {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 24px;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 32px;
    min-height: 78px;
}

/* Logo */
.lmm-logo { gap: 13px; color: var(--lmm-ink); }
.lmm-logo-img { height: 48px; width: auto; display: block; }
.lmm-logo-mark { color: var(--lmm-ink-2); display: inline-flex; }
.lmm-logo-mark svg { width: 30px; height: 38px; display: block; }
.lmm-stack { display: flex; flex-direction: column; line-height: 1.1; }
.lmm-logo-top {
    font-family: var(--lmm-serif);
    font-weight: 600;
    font-size: 18px;
    color: var(--lmm-ink);
    letter-spacing: .01em;
    text-transform: none;
}
.lmm-logo-bot {
    font-size: 10px;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--lmm-ink-3);
    font-weight: 600;
    margin-top: 3px;
}

/* Flat nav links + CTA pushed as a group to the far right (matches design). */
.lmm-nav .lmm-logo { margin-right: auto; }
.lmm-nav .lmm-navitems {
    margin-left: 0;
    gap: 26px;
    justify-content: flex-end;
}
.lmm-nav-link {
    /* inline-flex on every link, not just the ones with a dropdown chevron.
       On an inline box the vertical padding and bottom border below do not add
       to line-box height, but on inline-flex they do -- so a mixed nav gave the
       plain links a shorter <li> than the chevron ones, and align-items:center
       on .lmm-navitems then centred the two heights independently, dropping the
       plain labels 2.64px. Same display keeps every label on one baseline. */
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: var(--lmm-sans);
    font-size: 14.5px;
    font-weight: 500;
    color: var(--lmm-ink);
    text-decoration: none;
    padding: 4px 0;
    border-bottom: 2px solid transparent;
    letter-spacing: 0;
    text-transform: none;
    white-space: nowrap;
    transition: color .2s ease, border-color .2s ease;
}
.lmm-nav-link:hover {
    color: var(--lmm-ink-2);
    border-bottom-color: var(--lmm-rust);
}
/* Active (current page): keep ink text, terracotta underline (design .s-header link active). */
.lmm-nav-link.is-active,
.lmm-nav-link[aria-current="page"] {
    color: var(--lmm-ink);
    border-bottom-color: var(--lmm-rust);
}

/* CTA button (design .sa) */
.lmm-cta {
    background: var(--lmm-rust);
    color: #fff;
    /* line-height matched to the nav links (1.5). With /1 the tight line box
       gave negative half-leading and dropped the label ~1.1px below the nav
       baseline; padding is trimmed to hold the button's original height. */
    font: 600 14.5px/1.5 var(--lmm-sans);
    letter-spacing: .01em;
    text-transform: none;
    /* 0.5px off-centre on purpose: the nav links carry a 2px transparent
       border-bottom, which lifts their text that much above their own box
       centre. Matching it here puts every label in the header on one line. */
    padding: 6.5px 21px 7.5px;
    display: inline-flex;
    align-items: center;
    border-radius: 3px;
    box-shadow: 0 1px 0 rgba(24,51,26,.25);
}
.lmm-cta:hover { background: var(--lmm-rust-dk); }

/* Trust / utility bar (design .sb–.sf) */
.lmm-utility {
    background: var(--lmm-sage);
    border-top: 1px solid rgba(46,90,42,.28);
    border-bottom: 1px solid rgba(46,90,42,.28);
    font-family: var(--lmm-sans);
}
.lmm-utility-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 10px 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}
.lmm-rating {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 11.5px;
    letter-spacing: .13em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--lmm-ink-2);
}
.lmm-stars { color: var(--lmm-rust); letter-spacing: 0; }
.lmm-trust-points { display: flex; align-items: center; flex-wrap: wrap; }
.lmm-trust-point {
    font-size: 11.5px;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--lmm-ink-2);
    padding-left: 18px;
    margin-left: 18px;
    border-left: 1px solid rgba(46,90,42,.3);
}
.lmm-trust-points .lmm-trust-point:first-child {
    padding-left: 0;
    margin-left: 0;
    border-left: 0;
}

/* Desktop: no hamburger */
.lmm-hamburger { display: none; }

/* ── Mobile: collapse to hamburger (wins over earlier breakpoints) ── */
@media (max-width: 900px) {
    .lmm-navitems,
    .lmm-cta { display: none; }
    .lmm-hamburger { display: flex; }
    .lmm-nav { min-height: 64px; padding: 0 20px; }
    .lmm-utility-inner { padding: 8px 20px; justify-content: center; text-align: center; }
    .lmm-logo-img { height: 40px; }
    .lmm-logo-top { font-size: 16px; }
}
@media (max-width: 480px) {
    .lmm-trust-points { display: none; }
}

/* The theme header template part is hidden (LMM provides the header + spacer),
   but the theme still applies its block-gap above the first visible content
   block. Remove it so content sits flush under the fixed header. */
body.has-luna-mega-menu .wp-site-blocks > .wp-block-template-part:first-child + * {
    margin-top: 0 !important;
}

/* ═══════════════════════════════════════════════════════════════════════════
   SIMPLE TEXT DROPDOWN (.lmm-nav-item--menu > .lmm-submenu)
   A plain list of child links for nav items that have pages beneath them.
   Distinct from the image mega panel (.lmm-has-panel / .lmm-mega): this is
   CSS-only (hover + focus-within), so luna-mega-menu.js never touches it.
   ═══════════════════════════════════════════════════════════════════════════ */
/* Box model now lives on .lmm-nav-link itself so chevron and plain links share
   a baseline; the gap here only ever shows when a chevron is present. */
.lmm-nav-chev {
    width: 9px;
    height: 9px;
    opacity: .55;
    flex-shrink: 0;
    transition: transform .2s ease, opacity .2s ease;
}
.lmm-nav-item--menu:hover > .lmm-nav-link .lmm-nav-chev,
.lmm-nav-item--menu:focus-within > .lmm-nav-link .lmm-nav-chev {
    transform: rotate(180deg);
    opacity: 1;
}

.lmm-submenu {
    position: absolute;
    top: calc(100% + 12px);
    left: -14px;
    z-index: 5;
    min-width: 224px;
    margin: 0;
    padding: 6px 0;
    list-style: none;
    background: var(--lmm-paper);
    border: 1px solid var(--lmm-hairline);
    border-radius: 3px;
    box-shadow: 0 12px 30px rgba(20, 38, 18, .14);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-4px);
    transition: opacity .16s ease, transform .16s ease, visibility .16s ease;
}
/* Bridges the gap between the trigger and the panel so travelling the pointer
   across it does not drop the hover and close the menu. */
.lmm-submenu::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -12px;
    height: 12px;
}
.lmm-nav-item--menu:hover > .lmm-submenu,
.lmm-nav-item--menu:focus-within > .lmm-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.lmm-submenu li {
    margin: 0;
    padding: 0;
    list-style: none;
}
.lmm-submenu-link {
    display: block;
    padding: 9px 18px;
    font: 500 14px/1.35 var(--lmm-sans);
    color: var(--lmm-ink);
    text-decoration: none;
    white-space: nowrap;
    border-left: 2px solid transparent;
    transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.lmm-submenu-link:hover,
.lmm-submenu-link:focus-visible {
    background: rgba(46, 90, 42, .06);
    color: var(--lmm-ink-2);
    border-left-color: var(--lmm-rust);
}
.lmm-submenu-link.is-active {
    color: var(--lmm-ink);
    background: rgba(46, 90, 42, .05);
    border-left-color: var(--lmm-rust);
}

/* The desktop bar (and so the dropdown) is replaced by the drawer at 900px. */
@media (max-width: 900px) {
    .lmm-submenu { display: none; }
}