@media(max-width:960px){
  /* Mobile header always stays readable over photographic heroes. */
  .site-header{
    background:#0b2a32 !important;
    color:#fffdf8 !important;
    z-index:300 !important;
  }

  .site-header__inner{
    min-height:72px !important;
  }

  .nav-toggle{
    position:relative;
    z-index:322;
    display:block !important;
    color:#fffdf8 !important;
  }

  .nav-toggle span{
    background:#fffdf8 !important;
  }

  /*
   * Real opaque mobile navigation panel.
   * It no longer inherits any transparent/hero treatment.
   */
  .primary-nav{
    position:fixed !important;
    z-index:320 !important;
    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;
    width:min(390px,92vw) !important;
    height:100dvh !important;
    min-height:100svh !important;
    padding:102px 28px max(92px,calc(28px + env(safe-area-inset-bottom))) !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    gap:0 !important;
    overflow-y:auto !important;
    background:#061d25 !important;
    color:#fffdf8 !important;
    border-left:1px solid rgba(255,255,255,.10);
    box-shadow:-24px 0 70px rgba(0,0,0,.42) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    transform:translate3d(102%,0,0) !important;
    visibility:hidden;
    pointer-events:none;
    transition:transform .28s ease,visibility 0s linear .28s !important;
  }

  .primary-nav.is-open{
    transform:translate3d(0,0,0) !important;
    visibility:visible;
    pointer-events:auto;
    transition:transform .28s ease,visibility 0s linear 0s !important;
  }

  .primary-nav a{
    width:100% !important;
    padding:15px 0 !important;
    color:#fffdf8 !important;
    font-size:1rem !important;
    line-height:1.25 !important;
    letter-spacing:.12em !important;
    border-bottom:1px solid rgba(255,255,255,.11);
  }

  .primary-nav a.is-current,
  .primary-nav a:hover,
  .primary-nav a:focus-visible{
    color:var(--gold-2) !important;
  }

  /* Dark backdrop behind the open menu. */
  body.nav-open::before{
    content:"";
    position:fixed;
    z-index:310;
    inset:0;
    background:rgba(1,12,17,.58);
    backdrop-filter:blur(3px);
    -webkit-backdrop-filter:blur(3px);
  }
}

@media(max-width:760px){
  /*
   * The desktop side rail becomes a permanent bottom action bar.
   * All actions remain available — no social icons are hidden.
   */
  .utility-rail{
    position:fixed !important;
    z-index:290 !important;
    top:auto !important;
    left:50% !important;
    right:auto !important;
    bottom:max(10px,env(safe-area-inset-bottom)) !important;
    transform:translateX(-50%) !important;
    width:auto !important;
    max-width:calc(100vw - 18px) !important;
    height:54px !important;
    padding:5px 7px !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;
    gap:3px !important;
    border-radius:999px !important;
    background:rgba(5,28,36,.96) !important;
    border:1px solid rgba(255,255,255,.17) !important;
    box-shadow:0 12px 34px rgba(0,0,0,.24) !important;
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
  }

  .utility-rail__item,
  .utility-rail__item:nth-child(2),
  .utility-rail__item:nth-child(3),
  .utility-rail__item:nth-child(4){
    display:grid !important;
    flex:0 0 36px !important;
    width:36px !important;
    height:36px !important;
  }

  .utility-rail__item svg{
    width:16px !important;
    height:16px !important;
  }

  .utility-rail__item>span{
    display:none !important;
  }

  .utility-rail__divider{
    flex:0 0 1px !important;
    width:1px !important;
    height:28px !important;
    margin:0 2px !important;
  }

  /* Leave comfortable room above the fixed action bar. */
  .horizontal-track > .h-slide{
    padding-bottom:82px !important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior-y:auto !important;
  }

  .booking-cta{
    padding-bottom:118px !important;
  }

  /* Fixed deck receives touch gestures; JS maps them to the native timeline. */
  .horizontal-track{
    -webkit-user-select:none;
    user-select:none;
  }

  .horizontal-track input,
  .horizontal-track textarea,
  .horizontal-track select{
    -webkit-user-select:text;
    user-select:text;
  }
}

@media(max-width:390px){
  .utility-rail{
    gap:1px !important;
    padding-inline:5px !important;
  }

  .utility-rail__item,
  .utility-rail__item:nth-child(2),
  .utility-rail__item:nth-child(3),
  .utility-rail__item:nth-child(4){
    flex-basis:33px !important;
    width:33px !important;
    height:33px !important;
  }

  .utility-rail__item svg{
    width:15px !important;
    height:15px !important;
  }
}




@media(max-width:960px){
  /* Absolutely no blur on the mobile header/menu. */
  .site-header,
  .site-header.is-scrolled,
  .site-header.scrolled,
  .site-header.solid,
  body.horizontal-after-hero .site-header{
    background:#0b2a32 !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    filter:none !important;
    box-shadow:none !important;
  }

  .site-header::before,
  .site-header::after{
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    filter:none !important;
  }

  .primary-nav,
  .primary-nav.is-open{
    width:100vw !important;
    max-width:none !important;
    left:0 !important;
    right:0 !important;
    top:0 !important;
    bottom:0 !important;
    height:100dvh !important;
    min-height:100svh !important;
    padding:104px 28px 76px !important;
    background:#061d25 !important;
    background-image:none !important;
    opacity:1 !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    filter:none !important;
    box-shadow:none !important;
    border:0 !important;
  }

  .primary-nav a{
    opacity:1 !important;
    text-shadow:none !important;
    filter:none !important;
  }

  body.nav-open::before{
    background:rgba(1,12,17,.72) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    filter:none !important;
  }
}

@media(max-width:760px){
  /*
   * Critical mobile gesture fix.
   * The browser is not allowed to interpret a swipe on the fixed deck;
   * JS owns the gesture completely and updates the visual timeline itself.
   */
  .horizontal-track,
  .horizontal-track > .h-slide{
    touch-action:none !important;
  }

  .horizontal-track input,
  .horizontal-track textarea,
  .horizontal-track select,
  .horizontal-track button,
  .horizontal-track a{
    touch-action:manipulation !important;
  }

  /*
   * Flat, thin, edge-to-edge bottom tool strip.
   * Not floating, not a pill.
   */
  .utility-rail{
    position:fixed !important;
    z-index:290 !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    top:auto !important;
    transform:none !important;

    width:100% !important;
    max-width:none !important;
    height:44px !important;
    min-height:44px !important;
    margin:0 !important;
    padding:3px max(8px,env(safe-area-inset-right)) max(3px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left)) !important;

    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;
    gap:4px !important;

    border:0 !important;
    border-top:1px solid rgba(255,255,255,.12) !important;
    border-radius:0 !important;

    background:#061d25 !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    filter:none !important;
  }

  .utility-rail__item,
  .utility-rail__item:nth-child(2),
  .utility-rail__item:nth-child(3),
  .utility-rail__item:nth-child(4){
    display:grid !important;
    flex:0 0 34px !important;
    width:34px !important;
    height:34px !important;
    min-width:34px !important;
    min-height:34px !important;
    border-radius:4px !important;
  }

  .utility-rail__item--accent{
    border-radius:4px !important;
  }

  .utility-rail__item svg{
    width:15px !important;
    height:15px !important;
  }

  .utility-rail__divider{
    flex:0 0 1px !important;
    width:1px !important;
    height:24px !important;
    margin:0 3px !important;
  }

  .horizontal-track > .h-slide{
    padding-bottom:64px !important;
  }

  .booking-cta{
    padding-bottom:88px !important;
  }
}

@media(max-width:390px){
  .utility-rail{
    height:42px !important;
    min-height:42px !important;
    gap:2px !important;
    padding-inline:5px !important;
  }

  .utility-rail__item,
  .utility-rail__item:nth-child(2),
  .utility-rail__item:nth-child(3),
  .utility-rail__item:nth-child(4){
    flex-basis:31px !important;
    width:31px !important;
    height:31px !important;
    min-width:31px !important;
    min-height:31px !important;
  }
}




@media(max-width:960px){
  /* The menu must live above every other layer. */
  .site-header,
  .site-header.is-scrolled,
  .site-header.scrolled,
  .site-header.solid,
  body.horizontal-after-hero .site-header{
    z-index:420 !important;
    background:#0b2a32 !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    filter:none !important;
  }

  .primary-nav,
  .primary-nav.is-open{
    z-index:440 !important;
    background:#061d25 !important;
    background-image:none !important;
    opacity:1 !important;
    filter:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    pointer-events:none;
  }

  .primary-nav.is-open{
    pointer-events:auto !important;
  }

  .nav-toggle{
    z-index:450 !important;
  }

  /*
   * v1.21 backdrop was in a separate body stacking context above the header,
   * making the menu appear darker and swallowing clicks.
   * Remove it entirely on mobile.
   */
  body.nav-open::before{
    content:none !important;
    display:none !important;
    pointer-events:none !important;
  }

  /* Ensure no fixed deck can sit above the mobile nav. */
  .horizontal-track{
    z-index:40 !important;
  }

  .utility-rail{
    z-index:300 !important;
  }
}

@media(max-width:760px){
  /*
   * Touch is handled only by JS while swiping.
   * Links and controls remain tappable.
   */
  .horizontal-track{
    touch-action:none !important;
  }

  .horizontal-track a,
  .horizontal-track button,
  .horizontal-track input,
  .horizontal-track textarea,
  .horizontal-track select{
    touch-action:manipulation !important;
  }
}




@media(max-width:760px){
  :root{
    --mobile-header-safe:88px;
    --mobile-tools-h:52px;
  }

  /*
   * Reserve a real visual safe area below the fixed header.
   * Content remains full-bleed, but headings/cards cannot start underneath it.
   */
  .horizontal-track > .h-slide{
    box-sizing:border-box !important;
    padding-top:var(--mobile-header-safe) !important;
    padding-bottom:calc(var(--mobile-tools-h) + 24px) !important;
  }

  /*
   * Full-bleed photographic layers must still fill the whole slide;
   * only readable content receives the safe-area inset.
   */
  .horizontal-track > .h-slide > .hero__image,
  .horizontal-track > .h-slide > .hero__shade,
  .horizontal-track > .h-slide > .quote-scene__shade,
  .horizontal-track > .h-slide > .blog-hero__image,
  .horizontal-track > .h-slide > .blog-hero__shade{
    top:0 !important;
    bottom:0 !important;
    height:100% !important;
  }

  /*
   * Some sections already have their own top padding.
   * Ensure their first textual container clears the header even when
   * section-level layout rules override padding internally.
   */
  .horizontal-track > .h-slide > .shell:first-of-type,
  .horizontal-track > .h-slide > .hero__inner,
  .horizontal-track > .h-slide > .blog-hero__inner{
    position:relative;
    z-index:2;
  }

  /* Slightly larger bottom strip for real thumb usability. */
  .utility-rail{
    height:var(--mobile-tools-h) !important;
    min-height:var(--mobile-tools-h) !important;
    padding:
      4px
      max(9px,env(safe-area-inset-right))
      max(4px,env(safe-area-inset-bottom))
      max(9px,env(safe-area-inset-left)) !important;
    gap:5px !important;
  }

  .utility-rail__item,
  .utility-rail__item:nth-child(2),
  .utility-rail__item:nth-child(3),
  .utility-rail__item:nth-child(4){
    flex:0 0 40px !important;
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    min-height:40px !important;
  }

  .utility-rail__item svg{
    width:18px !important;
    height:18px !important;
  }

  .utility-rail__divider{
    height:28px !important;
    margin-inline:3px !important;
  }

  .booking-cta{
    padding-top:max(118px,var(--mobile-header-safe)) !important;
    padding-bottom:calc(var(--mobile-tools-h) + 38px) !important;
  }
}

@media(max-width:390px){
  :root{
    --mobile-header-safe:84px;
    --mobile-tools-h:50px;
  }

  .utility-rail{
    gap:3px !important;
    padding-inline:5px !important;
  }

  .utility-rail__item,
  .utility-rail__item:nth-child(2),
  .utility-rail__item:nth-child(3),
  .utility-rail__item:nth-child(4){
    flex-basis:37px !important;
    width:37px !important;
    height:37px !important;
    min-width:37px !important;
    min-height:37px !important;
  }

  .utility-rail__item svg{
    width:17px !important;
    height:17px !important;
  }
}




@media(max-width:760px){
  :root{
    --mobile-header-h:72px;
    --mobile-tools-h:52px;
  }

  html,
  body.horizontal-experience{
    height:100% !important;
    overflow:hidden !important;
  }

  .site-header,
  .site-header__inner{
    height:var(--mobile-header-h) !important;
    min-height:var(--mobile-header-h) !important;
  }

  main.horizontal-main{
    position:fixed !important;
    z-index:20 !important;
    top:var(--mobile-header-h) !important;
    right:0 !important;
    bottom:var(--mobile-tools-h) !important;
    left:0 !important;
    width:100vw !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    overflow:hidden !important;
  }

  .horizontal-track{
    position:absolute !important;
    z-index:40 !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    min-height:0 !important;
    overflow:hidden !important;
    touch-action:pan-y !important;
  }

  /*
   * Each slide owns the vertical scrolling area.
   * Header and tool bar are outside the slide viewport, so they can no
   * longer cover headings or bottom content.
   */
  .horizontal-track > .h-slide{
    height:100% !important;
    min-height:100% !important;
    max-height:100% !important;
    box-sizing:border-box !important;

    overflow-x:hidden !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior-y:contain !important;
    touch-action:pan-y !important;

    /*
     * Remove the old artificial header/footer safe padding. The viewport
     * itself now provides those safe areas.
     */
    padding-top:24px !important;
    padding-bottom:30px !important;
  }

  /* Hero/visual slides keep their intended full-height composition. */
  .horizontal-track > .hero.h-slide,
  .horizontal-track > .blog-hero.h-slide,
  .horizontal-track > .quote-scene.h-slide{
    padding-top:0 !important;
    padding-bottom:0 !important;
  }

  /* Dense editorial sections receive compact breathing room. */
  .horizontal-track > .contact-connect-section,
  .horizontal-track > .contact-map-section,
  .horizontal-track > .faq-section,
  .horizontal-track > .menu-feature,
  .horizontal-track > .menu-compact,
  .horizontal-track > .feature-panel,
  .horizontal-track > .directions-section,
  .horizontal-track > .blog-index-section,
  .horizontal-track > .privacy-section{
    padding-top:34px !important;
    padding-bottom:38px !important;
  }

  .horizontal-track > .booking-cta{
    padding-top:46px !important;
    padding-bottom:46px !important;
  }

  /*
   * Only the active card receives pointer/touch events.
   * Cards behind remain visible as the photographic stack but cannot
   * steal a swipe or tap.
   */
  .horizontal-track > .h-slide{
    pointer-events:none;
  }

  .horizontal-track > .h-slide.is-mobile-active{
    pointer-events:auto;
  }

  .horizontal-track > .h-slide a,
  .horizontal-track > .h-slide button,
  .horizontal-track > .h-slide input,
  .horizontal-track > .h-slide textarea,
  .horizontal-track > .h-slide select{
    touch-action:manipulation !important;
  }

  /* Flat bottom strip remains outside the usable slide viewport. */
  .utility-rail{
    z-index:300 !important;
    height:var(--mobile-tools-h) !important;
    min-height:var(--mobile-tools-h) !important;
  }

  /* Menu remains the highest interactive layer. */
  .site-header{
    z-index:420 !important;
  }
  .primary-nav{
    z-index:440 !important;
  }
  .nav-toggle{
    z-index:450 !important;
  }
}

@media(max-width:390px){
  :root{
    --mobile-header-h:68px;
    --mobile-tools-h:50px;
  }

  .site-header,
  .site-header__inner{
    height:var(--mobile-header-h) !important;
    min-height:var(--mobile-header-h) !important;
  }
}




@media(max-width:760px){
  /*
   * On mobile, editorial slides should flow naturally from the top.
   * Centering/fill logic from the desktop deck can cause cards to appear
   * visually cut or start halfway down.
   */
  .horizontal-track > .curve-section,
  .horizontal-track > .dark-wave,
  .horizontal-track > .feature-strip,
  .horizontal-track > .feature-panel,
  .horizontal-track > .location-preview,
  .horizontal-track > .contact-section,
  .horizontal-track > .faq-section,
  .horizontal-track > .directions-section,
  .horizontal-track > .contact-connect-section,
  .horizontal-track > .contact-map-section,
  .horizontal-track > .blog-index-section,
  .horizontal-track > .booking-cta,
  .horizontal-track > .privacy-section,
  .horizontal-track > .menu-feature,
  .horizontal-track > .menu-compact{
    display:block !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    min-height:auto !important;
    height:auto !important;
  }

  .horizontal-track > .curve-section > .shell,
  .horizontal-track > .dark-wave > .shell,
  .horizontal-track > .feature-strip > .shell,
  .horizontal-track > .feature-panel > .shell,
  .horizontal-track > .location-preview > .shell,
  .horizontal-track > .contact-section > .shell,
  .horizontal-track > .faq-section > .shell,
  .horizontal-track > .directions-section > .shell,
  .horizontal-track > .contact-connect-section > .shell,
  .horizontal-track > .contact-map-section > .shell,
  .horizontal-track > .blog-index-section > .shell,
  .horizontal-track > .booking-cta > .shell,
  .horizontal-track > .privacy-section > .shell,
  .horizontal-track > .menu-feature > .shell,
  .horizontal-track > .menu-compact > .shell{
    width:min(var(--shell),calc(100% - 38px)) !important;
    margin-inline:auto !important;
  }

  /*
   * Keep the first meaningful content clearly below the fixed site header.
   */
  .horizontal-track > .curve-section > .shell:first-child,
  .horizontal-track > .dark-wave > .shell:first-child,
  .horizontal-track > .feature-strip > .shell:first-child,
  .horizontal-track > .feature-panel > .shell:first-child,
  .horizontal-track > .location-preview > .shell:first-child,
  .horizontal-track > .contact-section > .shell:first-child,
  .horizontal-track > .faq-section > .shell:first-child,
  .horizontal-track > .directions-section > .shell:first-child,
  .horizontal-track > .contact-connect-section > .shell:first-child,
  .horizontal-track > .contact-map-section > .shell:first-child,
  .horizontal-track > .blog-index-section > .shell:first-child,
  .horizontal-track > .booking-cta > .shell:first-child,
  .horizontal-track > .privacy-section > .shell:first-child,
  .horizontal-track > .menu-feature > .shell:first-child,
  .horizontal-track > .menu-compact > .shell:first-child{
    padding-top:18px !important;
  }

  .horizontal-track > .h-slide{
    padding-top:34px !important;
    padding-bottom:34px !important;
  }

  .horizontal-track > .hero.h-slide,
  .horizontal-track > .blog-hero.h-slide,
  .horizontal-track > .quote-scene.h-slide{
    padding-top:0 !important;
    padding-bottom:0 !important;
  }
}


/* v2.3: coarse-pointer tablets use the same physical mobile-deck viewport. */
@media (min-width:761px) and (max-width:1024px) and (pointer:coarse), (min-width:761px) and (max-width:1024px) and (hover:none){
  :root{--mobile-header-h:72px;--mobile-tools-h:66px}
  html,body.horizontal-experience{height:100%!important;overflow:hidden!important}
  main.horizontal-main{position:fixed!important;z-index:20!important;top:var(--mobile-header-h)!important;right:0!important;bottom:var(--mobile-tools-h)!important;left:0!important;width:100vw!important;height:auto!important;min-height:0!important;margin:0!important;overflow:hidden!important}
  .horizontal-track{position:absolute!important;z-index:40!important;inset:0!important;width:100%!important;height:100%!important;overflow:hidden!important;touch-action:pan-y!important}
  .horizontal-track>.h-slide{height:100%!important;min-height:100%!important;max-height:100%!important;box-sizing:border-box!important;overflow-x:hidden!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important;overscroll-behavior-y:contain!important;touch-action:pan-y!important;padding-top:28px!important;padding-bottom:34px!important;pointer-events:none}
  .horizontal-track>.hero.h-slide,.horizontal-track>.blog-hero.h-slide,.horizontal-track>.quote-scene.h-slide{padding-top:0!important;padding-bottom:0!important}
  .horizontal-track>.h-slide.is-mobile-active{pointer-events:auto}
  .utility-rail{display:none!important}.mobile-action-bar{display:grid!important}
}
.form-status:focus{outline:3px solid var(--gold-2);outline-offset:4px}