body.horizontal-experience{
  overflow-x:hidden;
}

/* Each page main becomes one viewport-high horizontal stage. */
main.horizontal-main{
  position:relative;
  height:100svh;
  min-height:640px;
  overflow:hidden;
  background:var(--cream);
}

/* Actual horizontal scroller */
.horizontal-track{
  position:absolute;
  inset:0;
  display:flex;
  flex-wrap:nowrap;
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
  -ms-overflow-style:none;
  touch-action:pan-x pan-y;
}
.horizontal-track::-webkit-scrollbar{
  display:none;
}

/* One page section = one slide */
.horizontal-track > .h-slide{
  position:relative;
  flex:0 0 100%;
  width:100%;
  max-width:none;
  height:100%;
  min-height:0 !important;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior-y:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(212,162,73,.55) transparent;
}
.horizontal-track > .h-slide::-webkit-scrollbar{width:6px}
.horizontal-track > .h-slide::-webkit-scrollbar-track{background:transparent}
.horizontal-track > .h-slide::-webkit-scrollbar-thumb{
  background:rgba(212,162,73,.5);
  border-radius:999px;
}

/* Make shorter editorial sections fill the screen gracefully. */
.horizontal-track > .hero{
  min-height:100% !important;
  height:100%;
}
.horizontal-track > .curve-section{
  display:flex;
  align-items:center;
}
.horizontal-track > .feature-strip{
  display:flex;
  align-items:center;
  padding-top:92px;
  padding-bottom:52px;
}
.horizontal-track > .feature-strip > .shell{
  width:min(var(--shell),calc(100% - 96px));
}
.horizontal-track > .soft-split{
  min-height:100%;
}
.horizontal-track > .location-preview{
  display:flex;
  align-items:center;
}
.horizontal-track > .feature-panel{
  min-height:100%;
  display:flex;
  align-items:center;
}
.horizontal-track > .quote-scene{
  min-height:100%;
}
.horizontal-track > .location-gallery{
  min-height:100%;
  height:100%;
}
.horizontal-track > .dark-wave,
.horizontal-track > .directions-section{
  min-height:100%;
  display:flex;
  align-items:center;
}
.horizontal-track > .contact-section,
.horizontal-track > .faq-section{
  min-height:100%;
  display:flex;
  align-items:center;
}
.horizontal-track > .menu-feature{
  min-height:100%;
}
.horizontal-track > .menu-compact{
  min-height:100%;
}

/* Menu category nav lives above the horizontal panels, not as a slide. */

/* Side section label: one elegant dynamic label for the active slide. */





/* Accessible horizontal navigation controls */




.h-slide-status{
  min-width:66px;
  text-align:center;
  font-size:.69rem;
  font-weight:800;
  letter-spacing:.12em;
  font-variant-numeric:tabular-nums;
}
.h-slide-progress{
  position:absolute;
  z-index:39;
  left:50%;
  bottom:0;
  width:min(420px,40vw);
  height:3px;
  transform:translateX(-50%);
  background:rgba(255,255,255,.16);
  overflow:hidden;
  pointer-events:none;
}
.h-slide-progress > span{
  display:block;
  width:0;
  height:100%;
  background:linear-gradient(90deg,var(--gold),var(--gold-2));
  transition:width .35s ease;
}

/* Keep header legible after leaving the photographic hero. */
body.horizontal-after-hero .site-header{
  background:rgba(7,30,38,.93);
  backdrop-filter:blur(16px);
  box-shadow:0 12px 40px rgba(0,0,0,.14);
}

/* Hide slide UI once the user continues to the real footer. */


/* High-quality selected external Vertigo shot: tune crop on Contact hero. */
.hero--contact .hero__image,
body.page-template-page-contact .hero__image{
  object-position:center 52%;
}

/* Desktop gets the most cinematic label treatment. */
@media(min-width:1100px){
  .horizontal-track > .h-slide{
    padding-left:0;
    padding-right:0;
  }
}

/* Tablet / mobile: still horizontal, but labels are slimmer. */
@media(max-width:900px){
  main.horizontal-main{
    min-height:560px;
  }
  
  
  
  
  
  
  .h-slide-progress{
    width:52vw;
  }
}

/* Very narrow screens: preserve horizontal swipe, reduce visual obstruction. */
@media(max-width:620px){
  main.horizontal-main{
    min-height:520px;
  }
  
  
  
  
  .h-slide-status{
    min-width:54px;
  }
  .h-slide-progress{
    display:none;
  }
}

/* Respect reduced-motion preferences while preserving navigation. */
@media(prefers-reduced-motion:reduce){
  .horizontal-track{
    scroll-behavior:auto !important;
  }
  
}




@view-transition{
  navigation:auto;
}

/* Retire the old floating section badge. */


/* Structural label rail integrated into the slide edge. */
.h-slide{
  --rail-size:42px;
}




/* Dark/photo slides get a seamless dark rail instead of a cream badge. */




/* Keep controls clear of the integrated rail. */

.h-slide-progress{
  left:calc(50% + 18px);
}

/* Footer is now an actual horizontal slide. */



/* Cross-page hint inside the footer slide */



/* ---------------------------------------------------------
   CONTACT — reorganized for one clear task per slide
   --------------------------------------------------------- */
.contact-connect-section{
  background:#f7efe2;
  padding:clamp(128px,13vh,170px) 0 72px;
}
.contact-connect-grid{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(440px,1.1fr);
  gap:clamp(58px,7vw,115px);
  align-items:center;
}
.contact-details-panel{
  max-width:620px;
}
.contact-details-panel h2{
  margin:10px 0 22px;
  font-size:clamp(3.7rem,5.5vw,6.6rem);
  line-height:.84;
}
.contact-lead{
  max-width:570px;
  margin-bottom:32px;
  color:#4c4943;
  font-size:1.04rem;
}
.contact-actions{
  display:grid;
  gap:11px;
  margin-bottom:30px;
}
.contact-action{
  min-height:76px;
  display:grid;
  grid-template-columns:48px 1fr auto;
  align-items:center;
  gap:14px;
  padding:13px 16px;
  border:1px solid rgba(7,30,39,.14);
  border-radius:18px;
  background:rgba(255,255,255,.42);
  color:var(--ink);
}
.contact-action:hover,
.contact-action:focus-visible{
  border-color:rgba(199,145,51,.58);
  background:#fffaf3;
}
.contact-action__icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--gold-2);
  color:var(--navy);
}
.contact-action__icon svg{
  width:24px;
  height:24px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.contact-action span:nth-child(2){
  display:grid;
  gap:3px;
  min-width:0;
}
.contact-action small{
  color:#746b61;
  font-size:.63rem;
  font-weight:850;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.contact-action strong{
  overflow-wrap:anywhere;
  font-size:.96rem;
}
.contact-action>b{
  color:var(--gold);
  font-size:1.2rem;
}
.contact-facts{
  margin:0;
  border-top:1px solid rgba(7,30,39,.13);
}
.contact-facts>div{
  display:grid;
  grid-template-columns:145px 1fr;
  gap:20px;
  padding:16px 0;
  border-bottom:1px solid rgba(7,30,39,.13);
}
.contact-facts dt{
  font-size:.68rem;
  font-weight:850;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.contact-facts dd{
  margin:0;
  color:#403d38;
}

.contact-form-card{
  width:100%;
  max-width:650px;
  justify-self:end;
  padding:clamp(28px,3vw,42px);
  border-radius:26px;
}
.contact-form-heading{
  margin-bottom:24px;
}
.contact-form-heading h2{
  margin:8px 0 0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(2.7rem,3.7vw,4.4rem);
  line-height:.87;
  letter-spacing:-.03em;
  text-transform:none;
}
.contact-form-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}
.contact-form-card textarea{
  min-height:138px;
}
.contact-form-card .button{
  justify-self:start;
  min-width:180px;
}

/* Dedicated map slide */
.contact-map-section{
  padding:clamp(116px,12vh,155px) 0 66px;
  background:#ede5d7;
}
.contact-map-grid{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(330px,.55fr);
  gap:22px;
  align-items:stretch;
  height:min(650px,72vh);
  min-height:500px;
}
.contact-map-frame{
  overflow:hidden;
  border-radius:26px;
  box-shadow:0 25px 70px rgba(7,30,39,.10);
}
.contact-map-frame iframe{
  width:100%;
  height:100%;
  border:0;
}
.contact-route-card{
  overflow:hidden;
  border-radius:26px;
  background:#071e27;
  color:#fff;
  box-shadow:0 25px 70px rgba(7,30,39,.13);
}
.contact-route-card>img{
  width:100%;
  height:34%;
  min-height:170px;
  object-fit:cover;
}
.contact-route-card__body{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:26px 28px 30px;
}
.contact-route-card h2{
  margin:8px 0 10px;
  color:#fff;
  font-size:3rem;
}
.contact-route-card p{
  margin:0 0 18px;
  color:#d3dcde;
}
.contact-route-meta{
  width:100%;
  display:grid;
  gap:10px;
  margin-bottom:22px;
  padding-top:17px;
  border-top:1px solid rgba(255,255,255,.14);
}
.contact-route-meta span{
  color:#dce5e6;
  font-size:.79rem;
  line-height:1.5;
}

/* FAQ gets more air and less visual competition */
.faq-section{
  padding:clamp(125px,13vh,170px) 0 85px;
}
.faq-grid{
  align-items:center;
}
.faq details{
  background:rgba(255,255,255,.44);
}

/* ---------------------------------------------------------
   Responsive adjustments
   --------------------------------------------------------- */
@media(max-width:1050px){
  .contact-connect-grid{
    grid-template-columns:1fr 1fr;
    gap:38px;
  }
  .contact-map-grid{
    grid-template-columns:1.2fr .8fr;
  }
}

@media(max-width:820px){
  .h-slide{
    --rail-size:30px;
  }
  
  
  

  .contact-connect-section,
  .contact-map-section,
  .faq-section{
    padding-top:110px;
  }
  .contact-connect-grid{
    grid-template-columns:1fr;
    align-items:start;
  }
  .contact-details-panel{
    max-width:none;
  }
  .contact-form-card{
    max-width:none;
    justify-self:stretch;
  }
  .contact-map-grid{
    grid-template-columns:1fr;
    height:auto;
    min-height:0;
  }
  .contact-map-frame{
    height:54vh;
    min-height:360px;
  }
  .contact-route-card{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
  }
  .contact-route-card>img{
    height:100%;
    min-height:0;
  }
}

@media(max-width:620px){
  .h-slide{
    --rail-size:22px;
  }
  
  
  
  
  

  .contact-connect-section,
  .contact-map-section,
  .faq-section{
    padding-top:94px;
  }
  .contact-details-panel h2{
    font-size:3.55rem;
  }
  .contact-form-row{
    grid-template-columns:1fr;
  }
  .contact-facts>div{
    grid-template-columns:1fr;
    gap:6px;
  }
  .contact-route-card{
    grid-template-columns:1fr;
  }
  .contact-route-card>img{
    height:210px;
  }
  .contact-map-frame{
    height:48vh;
    min-height:330px;
  }
}



:root{--legal-footer-h:56px;--section-rail-w:58px}











main.horizontal-main{height:calc(100svh - var(--legal-footer-h));min-height:584px;margin-bottom:var(--legal-footer-h)}
.horizontal-track{bottom:0}.horizontal-track>.h-slide{height:100%}.h-slide-progress{bottom:0}
.h-slide{--rail-size:var(--section-rail-w);box-sizing:border-box;padding-left:var(--section-rail-w)!important}






.h-slide>.hero__image,.h-slide>.hero__shade,.h-slide>.quote-scene__shade{left:var(--section-rail-w);width:calc(100% - var(--section-rail-w))}
@media(max-width:760px){:root{--legal-footer-h:52px;--section-rail-w:34px}}





/* Footer removed entirely. */


/* Restore the full viewport to the horizontal experience. */
:root{
  --legal-footer-h:0px;
}
main.horizontal-main{
  height:100svh !important;
  min-height:100svh !important;
  margin-bottom:0 !important;
}

/* Remove previous/next controls and progress UI completely. */


/* Each slide can scroll vertically if its real content exceeds viewport height. */
.horizontal-track > .h-slide{
  height:100% !important;
  min-height:100% !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-y:contain;
  padding-bottom:clamp(28px,4vh,52px);
  box-sizing:border-box;
}

/* Never vertically center dense slides: it can hide content above/below viewport. */
.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 > .dark-wave{
  align-items:flex-start !important;
}

/* Every dense content slide gets enough top room for the sticky header. */
.contact-connect-section,
.contact-map-section,
.faq-section,
.menu-feature,
.menu-compact,
.feature-panel,
.directions-section{
  padding-top:max(116px,12vh) !important;
  padding-bottom:max(54px,7vh) !important;
}

/* Contact form: prevent visual clipping at common laptop heights. */
.contact-connect-grid{
  align-items:start !important;
  min-height:0 !important;
}
.contact-details-panel,
.contact-form-card{
  align-self:start;
}
.contact-form-card{
  margin-bottom:32px;
}
.contact-form-card form{
  display:grid;
  gap:14px;
}
.contact-form-card label{
  min-width:0;
}
.contact-form-card input,
.contact-form-card textarea{
  width:100%;
  box-sizing:border-box;
}
.contact-form-card textarea{
  min-height:150px !important;
  max-height:none !important;
  resize:vertical;
}

/* Map slide: stop forcing a height that can cut the card. */
.contact-map-grid{
  height:auto !important;
  min-height:0 !important;
  align-items:stretch;
}
.contact-map-frame{
  min-height:520px;
  height:min(68vh,700px) !important;
}
.contact-route-card{
  min-height:520px;
}
.contact-route-card__body{
  min-height:0;
}

/* FAQ should size to content instead of a viewport-centered block. */
.faq-section{
  min-height:100%;
}
.faq-grid{
  align-items:start !important;
}
.faq{
  padding-bottom:30px;
}

/* Avoid any fixed min-heights that can cause clipped lower content. */
.horizontal-track > .h-slide > .shell{
  min-height:0 !important;
}

/* Tablet/laptop height safety */
@media(max-height:820px) and (min-width:821px){
  .contact-connect-section,
  .contact-map-section,
  .faq-section,
  .menu-feature,
  .menu-compact,
  .feature-panel,
  .directions-section{
    padding-top:104px !important;
    padding-bottom:40px !important;
  }

  .contact-connect-grid{
    gap:38px;
  }
  .contact-details-panel h2{
    font-size:clamp(3.1rem,4.4vw,5rem) !important;
    margin-bottom:14px;
  }
  .contact-lead{
    margin-bottom:20px;
  }
  .contact-actions{
    margin-bottom:20px;
  }
  .contact-form-card{
    padding:26px !important;
  }
  .contact-form-heading{
    margin-bottom:16px;
  }
  .contact-form-heading h2{
    font-size:clamp(2.4rem,3.1vw,3.6rem) !important;
  }
  .contact-form-card textarea{
    min-height:120px !important;
  }
}

/* Mobile: allow comfortable full vertical scrolling within each slide. */
@media(max-width:820px){
  main.horizontal-main{
    min-height:100svh !important;
  }

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

  .contact-connect-section,
  .contact-map-section,
  .faq-section,
  .menu-feature,
  .menu-compact,
  .feature-panel,
  .directions-section{
    padding-top:92px !important;
    padding-bottom:42px !important;
  }

  .contact-connect-grid{
    grid-template-columns:1fr !important;
    gap:34px !important;
  }
  .contact-form-card{
    margin-bottom:20px;
  }
  .contact-map-frame{
    min-height:360px !important;
    height:52vh !important;
  }
  .contact-route-card{
    min-height:0 !important;
  }
}

@media(max-width:620px){
  .contact-map-frame{
    height:48vh !important;
    min-height:330px !important;
  }
}




:root{--utility-rail-w:58px;--polaroid-top:92px}

/* Header is clean: brand + navigation only. */
.site-header__inner{grid-template-columns:auto 1fr auto!important}
.primary-nav{justify-self:end}


/* Kill every trace of the old horizontal experience. */
body.horizontal-experience{overflow:auto!important}
main.horizontal-main,main{height:auto!important;min-height:0!important;overflow:visible!important;margin:0!important}
.horizontal-track{position:static!important;display:block!important;overflow:visible!important;scroll-snap-type:none!important}
.h-slide{width:auto!important;height:auto!important;min-height:0!important;padding-left:0!important;overflow:visible!important;scroll-snap-align:none!important}

.h-slide>.hero__image,.h-slide>.hero__shade,.h-slide>.quote-scene__shade{left:0!important;width:100%!important}

/* POLAROID STACK: each next section rises over the previous one. */
main>section,.menu-page>section,.standard-page>section{
  position:sticky;
  top:var(--polaroid-top);
  min-height:calc(100svh - var(--polaroid-top));
  margin:0;
  overflow:visible;
  border-radius:24px 24px 0 0;
  box-shadow:0 -18px 46px rgba(7,30,39,.14),0 -1px 0 rgba(255,255,255,.62);
  transform-origin:center top;
  isolation:isolate;
}
.menu-page{position:relative;z-index:2}
.menu-page>section{top:148px}

/* paper edge, visually distinct but subtle */
main>section::before,.menu-page>section::before{
  content:"";position:absolute;z-index:30;left:24px;right:24px;top:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(7,30,39,.16) 12%,rgba(7,30,39,.16) 88%,transparent);
  pointer-events:none
}

/* Long sections remain fully readable and can extend beyond viewport. */
.menu-feature,.menu-compact,.contact-connect-section,.contact-map-section,.faq-section,.privacy-section{
  min-height:auto!important;
}

/* Right sticky utility rail */
.utility-rail{
  position:fixed;z-index:180;top:50%;right:14px;transform:translateY(-50%);
  width:var(--utility-rail-w);display:flex;flex-direction:column;align-items:center;gap:6px;
  padding:9px 7px;border:1px solid rgba(255,255,255,.20);border-radius:999px;
  background:rgba(5,28,36,.92);box-shadow:0 18px 50px rgba(0,0,0,.17);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)
}
.utility-rail__item{position:relative;width:42px;height:42px;display:grid;place-items:center;border-radius:50%;color:#fffdf8;border:1px solid transparent;transition:.2s ease}
.utility-rail__item svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.utility-rail__item:nth-child(2) svg,.utility-rail__item:nth-child(3) svg,.utility-rail__item:nth-child(4) svg{fill:currentColor;stroke:none}
.utility-rail__item .utility-youtube-play{fill:#05202a}
.utility-rail__item>span{position:absolute;right:52px;top:50%;transform:translateY(-50%) translateX(8px);padding:7px 10px;border-radius:999px;background:#071e27;color:#fff;font-size:.67rem;font-weight:800;letter-spacing:.08em;white-space:nowrap;opacity:0;pointer-events:none;transition:.18s ease}
.utility-rail__item:hover,.utility-rail__item:focus-visible{background:#fffaf3;color:var(--navy);border-color:#fffaf3;transform:scale(1.04)}
.utility-rail__item:hover>span,.utility-rail__item:focus-visible>span{opacity:1;transform:translateY(-50%) translateX(0)}
.utility-rail__item--accent{background:var(--gold-2);color:var(--navy)}
.utility-rail__divider{width:28px;height:1px;margin:2px 0;background:rgba(255,255,255,.18)}

/* Keep content safely clear of the fixed right rail. */
.hero__content{padding-right:76px}

/* Privacy page */
.privacy-section{padding:150px 0 100px;background:#f7efe2}
.privacy-copy{max-width:900px}
.privacy-copy h1{font-size:clamp(4rem,7vw,7.5rem);margin:14px 0 28px}
.privacy-copy p{max-width:760px}

@media(max-width:900px){
  :root{--utility-rail-w:50px;--polaroid-top:78px}
  .utility-rail{right:7px;width:50px;padding:7px 5px}
  .utility-rail__item{width:38px;height:38px}
  .utility-rail__item>span{display:none}
  .menu-page>section{top:132px}
  main>section,.menu-page>section,.standard-page>section{border-radius:18px 18px 0 0}
}

@media(max-width:620px){
  :root{--utility-rail-w:44px;--polaroid-top:70px}
  .utility-rail{right:5px;width:44px;padding:5px 3px;gap:3px}
  .utility-rail__item{width:34px;height:34px}
  .utility-rail__item svg{width:16px;height:16px}
  .utility-rail__item:nth-child(2),.utility-rail__item:nth-child(3),.utility-rail__item:nth-child(4){display:none}
  .utility-rail__divider{width:24px}
  .hero__content{padding-right:42px}
  .menu-page>section{top:118px}
  main>section,.menu-page>section,.standard-page>section{border-radius:14px 14px 0 0}
}

@media(prefers-reduced-motion:reduce){main>section,.menu-page>section{transition:none!important}}




/* ---------- HEADER: restore/lock readable dark styling ---------- */
.site-header,
.site-header.scrolled,
.site-header.solid,
body.horizontal-after-hero .site-header{
  background:#0b2a32 !important;
  color:#fffdf8 !important;
  border-bottom:1px solid rgba(255,255,255,.10) !important;
  box-shadow:0 8px 28px rgba(3,18,24,.12);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.site-header .brand,
.site-header .brand *,
.site-header .primary-nav a,
.site-header .nav-phone,
.site-header .menu-toggle{
  color:#fffdf8 !important;
}
.site-header .primary-nav a:hover,
.site-header .primary-nav a:focus-visible,
.site-header .primary-nav a.is-current,
.site-header .primary-nav a.current{
  color:var(--gold-2) !important;
}
.site-header .primary-nav a.is-current:after,
.site-header .primary-nav a.current:after{
  background:var(--gold-2) !important;
}
.site-header .brand-sub{
  color:#e5dcce !important;
}

/* v1.7 vertical polaroid behavior is disabled. */
main > section,
.menu-page > section,
.standard-page > section{
  position:relative !important;
  top:auto !important;
  transform:none !important;
  filter:none !important;
  border-radius:0 !important;
  box-shadow:none !important;
}

/* ---------- horizontal stage ---------- */
body.horizontal-experience{
  overflow-x:hidden !important;
}
main.horizontal-main{
  position:relative;
  height:100svh !important;
  min-height:620px !important;
  overflow:hidden !important;
  margin:0 !important;
  background:var(--cream);
}
.horizontal-track{
  position:absolute !important;
  inset:0 !important;
  display:flex !important;
  flex-wrap:nowrap !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  scroll-snap-type:x mandatory !important;
  scroll-behavior:smooth;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
  -ms-overflow-style:none;
}
.horizontal-track::-webkit-scrollbar{
  display:none;
}

/* The key effect:
   every slide is sticky to the left edge and has increasing z-index.
   The incoming slide therefore covers the previous one instead of pushing it away. */
.horizontal-track > .h-slide{
  position:sticky !important;
  left:0 !important;
  flex:0 0 100%;
  width:100% !important;
  height:100% !important;
  min-height:100% !important;
  scroll-snap-align:start;
  scroll-snap-stop:always;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior-y:contain;
  -webkit-overflow-scrolling:touch;
  box-sizing:border-box;
  border-radius:0 !important;
  box-shadow:
    -18px 0 42px rgba(3,18,24,.13),
    -1px 0 0 rgba(255,255,255,.18);
  transform:none !important;
  filter:none !important;
}
.horizontal-track > .h-slide:nth-child(1){z-index:1}
.horizontal-track > .h-slide:nth-child(2){z-index:2}
.horizontal-track > .h-slide:nth-child(3){z-index:3}
.horizontal-track > .h-slide:nth-child(4){z-index:4}
.horizontal-track > .h-slide:nth-child(5){z-index:5}
.horizontal-track > .h-slide:nth-child(6){z-index:6}
.horizontal-track > .h-slide:nth-child(7){z-index:7}
.horizontal-track > .h-slide:nth-child(8){z-index:8}
.horizontal-track > .h-slide:nth-child(9){z-index:9}
.horizontal-track > .h-slide:nth-child(10){z-index:10}
.horizontal-track > .h-slide:nth-child(11){z-index:11}
.horizontal-track > .h-slide:nth-child(12){z-index:12}

/* subtle "photo edge" on the incoming panel */
.horizontal-track > .h-slide:before{
  content:"";
  position:absolute;
  z-index:50;
  top:0;
  bottom:0;
  left:0;
  width:1px;
  background:rgba(255,255,255,.32);
  pointer-events:none;
}
.horizontal-track > .h-slide:after{
  content:"";
  position:absolute;
  z-index:49;
  top:0;
  bottom:0;
  left:0;
  width:24px;
  background:linear-gradient(90deg,rgba(4,20,27,.13),transparent);
  pointer-events:none;
}

/* No left rails/titles. */


/* No visual previous/next controls. */


/* Full-bleed media returns to the full slide width. */
.h-slide > .hero__image,
.h-slide > .hero__shade,
.h-slide > .quote-scene__shade{
  left:0 !important;
  width:100% !important;
}

/* Dense slides: vertical reading first, horizontal step only at top/bottom. */
.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{
  align-items:flex-start !important;
  min-height:100% !important;
  overflow-y:auto !important;
}

/* Menu tabs remain visible and integrated. */

/* Kill the v1.7 section card edges. */
main > section::after,
.menu-page > section::after{
  content:none !important;
}

/* Desktop enhancement: tiny offset of previous photo edge remains visible while next arrives. */
@media(min-width:1100px){
  .horizontal-track{
    padding-right:0;
  }
  .horizontal-track > .h-slide{
    will-change:transform;
  }
}

/* Tablet/mobile: same overlay behavior, no forced visual tilt. */
@media(max-width:900px){
  main.horizontal-main{
    min-height:560px !important;
  }
}
@media(max-width:620px){
  main.horizontal-main{
    min-height:520px !important;
  }
}

/* Reduced motion keeps the structure but removes animated smoothness. */
@media(prefers-reduced-motion:reduce){
  .horizontal-track{
    scroll-behavior:auto !important;
  }
}




:root{
  --deck-left:64px;
  --deck-right:82px;
  --deck-radius:26px;
}

/* A neutral "table" behind the stacked page cards. */
main.horizontal-main{
  background:
    radial-gradient(circle at 16% 25%,rgba(255,255,255,.65),transparent 26%),
    linear-gradient(135deg,#d9d0c2,#c9bda9) !important;
}

/* Stride remains one viewport, while each visual card is inset.
   This leaves room to see the previously browsed cards underneath. */
.horizontal-track{
  scroll-padding-left:0;
  padding:0 !important;
}

/* Each section is a physical-looking card. */
.horizontal-track > .h-slide{
  --deck-depth:0;
  --deck-rotate:0deg;
  --deck-x:0px;
  --deck-y:0px;
  --deck-scale:1;

  flex:0 0 calc(100% - var(--deck-left) - var(--deck-right)) !important;
  width:calc(100% - var(--deck-left) - var(--deck-right)) !important;
  margin-left:var(--deck-left) !important;
  margin-right:var(--deck-right) !important;

  position:sticky !important;
  left:var(--deck-left) !important;

  border-radius:var(--deck-radius) !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;

  transform:
    translate3d(var(--deck-x),var(--deck-y),0)
    rotate(var(--deck-rotate))
    scale(var(--deck-scale)) !important;

  transform-origin:46% 52%;
  transition:
    box-shadow .18s linear,
    filter .18s linear;

  box-shadow:
    0 24px 58px rgba(4,19,25,.19),
    0 4px 12px rgba(4,19,25,.12),
    0 0 0 1px rgba(255,255,255,.34);

  background-clip:padding-box;
}

/* White photographic border, similar to a premium printed photograph. */
.horizontal-track > .h-slide::before{
  content:"" !important;
  position:absolute;
  z-index:90;
  inset:0;
  border:6px solid rgba(255,252,246,.90);
  border-radius:inherit;
  background:none !important;
  pointer-events:none;
  box-sizing:border-box;
}

/* Soft shadow on the left edge of the incoming card. */
.horizontal-track > .h-slide::after{
  content:"" !important;
  position:absolute;
  z-index:89;
  top:10px;
  bottom:10px;
  left:0;
  width:34px;
  background:linear-gradient(90deg,rgba(1,14,20,.17),transparent);
  border-radius:var(--deck-radius) 0 0 var(--deck-radius);
  pointer-events:none;
}

/* The first panel should already read as one large photo/card. */
.horizontal-track > .h-slide:first-child{
  box-shadow:
    0 28px 65px rgba(4,19,25,.20),
    0 4px 12px rgba(4,19,25,.10),
    0 0 0 1px rgba(255,255,255,.34);
}

/* Give visual media the same rounded clipping as the physical card. */
.horizontal-track > .h-slide > .hero__image,
.horizontal-track > .h-slide > .hero__shade,
.horizontal-track > .h-slide > .quote-scene__shade{
  border-radius:inherit;
}

/* The right sticky utility rail remains visually outside the photo deck. */
.utility-rail{
  z-index:190 !important;
}

/* Header remains above every card. */
.site-header{
  z-index:200 !important;
}

/* At laptop sizes keep enough content width while retaining visible deck edges. */
@media(max-width:1180px){
  :root{
    --deck-left:46px;
    --deck-right:68px;
    --deck-radius:22px;
  }
}

/* Tablet: a smaller visible stack. */
@media(max-width:900px){
  :root{
    --deck-left:30px;
    --deck-right:52px;
    --deck-radius:18px;
  }

  .horizontal-track > .h-slide::before{
    border-width:4px;
  }
}

/* Mobile keeps the overlap but with restrained margins. */
@media(max-width:620px){
  :root{
    --deck-left:14px;
    --deck-right:28px;
    --deck-radius:14px;
  }

  .horizontal-track > .h-slide{
    transform-origin:center center;
  }

  .horizontal-track > .h-slide::before{
    border-width:3px;
  }
}




.horizontal-track > .h-slide{
  box-sizing:border-box !important;

  /*
   * Content width + left margin + right margin = exactly 100% of the track.
   * JS therefore uses track.clientWidth as a stable step for every card.
   */
  flex-basis:calc(100% - var(--deck-left) - var(--deck-right)) !important;
  min-width:calc(100% - var(--deck-left) - var(--deck-right)) !important;
  max-width:calc(100% - var(--deck-left) - var(--deck-right)) !important;
  flex-grow:0 !important;
  flex-shrink:0 !important;
}

/* Do not allow browser flex rounding to collapse later cards. */
.horizontal-track{
  align-items:stretch;
  justify-content:flex-start;
}



html{
  overflow-y:scroll !important;
  overflow-x:hidden !important;
}
body,
body.horizontal-experience{
  overflow:visible !important;
  overflow-x:hidden !important;
}

/* Preview only: inactive routes must contribute no document height. */
.preview-route:not(.is-active){
  display:none !important;
}
.preview-route.is-active{
  display:block !important;
}

main.horizontal-main{
  position:relative !important;
  height:var(--driver-height,100svh) !important;
  min-height:100svh !important;
  overflow:visible !important;
  margin:0 !important;
}
.horizontal-track{
  position:sticky !important;
  top:0 !important;
  inset:auto !important;
  height:100svh !important;
  width:100% !important;
  display:flex !important;
  flex-wrap:nowrap !important;
  overflow-x:hidden !important;
  overflow-y:hidden !important;
  scroll-snap-type:none !important;
  scroll-behavior:auto !important;
  overscroll-behavior:none;
  scrollbar-width:none;
}
.horizontal-track::-webkit-scrollbar{display:none}

/* Vertical overflow is driven by the document scrollbar and mirrored into the active card. */
.horizontal-track > .h-slide{
  overflow-x:hidden !important;
  overflow-y:auto !important;
  scrollbar-width:none;
  overscroll-behavior:none;
}
.horizontal-track > .h-slide::-webkit-scrollbar{display:none}

/* More substantial editorial copy without becoming visually heavy. */
.hero__content p{
  max-width:720px;
  font-size:clamp(1rem,1.35vw,1.18rem);
  line-height:1.7;
}
.copy-block p,
.soft-split__copy p,
.contact-lead,
.contact-route-card p,
.privacy-copy p{
  font-size:clamp(.98rem,1.18vw,1.08rem);
  line-height:1.72;
}
.copy-block p + p,
.soft-split__copy p + p,
.location-preview__grid p + p{
  margin-top:14px;
}
.feature-item p{
  max-width:250px;
  margin-left:auto;
  margin-right:auto;
  line-height:1.55;
}

@media(max-width:760px){
  .hero__content p,
  .copy-block p,
  .soft-split__copy p,
  .contact-lead{
    font-size:1rem;
  }
}




/*
 * The main element is only the vertical scroll driver.
 * Its height is set dynamically by JS through --driver-height.
 */
main.horizontal-main{
  position:relative !important;
  height:var(--driver-height,100svh) !important;
  min-height:100svh !important;
  overflow:visible !important;
  margin:0 !important;
}

/*
 * Critical fix:
 * the visual photo deck is fixed to the viewport rather than sticky inside
 * the tall main. Dragging the browser scrollbar therefore changes only the
 * deck timeline; the deck itself never scrolls out of view.
 */
.horizontal-track{
  position:fixed !important;
  z-index:40 !important;
  top:0 !important;
  right:0 !important;
  bottom:0 !important;
  left:0 !important;
  inset:0 !important;
  width:100vw !important;
  height:100svh !important;
  min-height:100svh !important;
  margin:0 !important;

  display:flex !important;
  flex-wrap:nowrap !important;

  overflow-x:hidden !important;
  overflow-y:hidden !important;

  scroll-snap-type:none !important;
  scroll-behavior:auto !important;
  overscroll-behavior:none !important;
  scrollbar-width:none !important;

  background:
    radial-gradient(circle at 16% 25%,rgba(255,255,255,.65),transparent 26%),
    linear-gradient(135deg,#d9d0c2,#c9bda9);
}
.horizontal-track::-webkit-scrollbar{
  display:none !important;
}

/* Header and utility rail must remain above the fixed deck. */
.site-header{
  z-index:200 !important;
}
.utility-rail{
  z-index:210 !important;
}

/*
 * Prevent the tall driver document itself from painting content underneath
 * the fixed deck while the native scrollbar is being dragged.
 */
body.horizontal-experience{
  overflow-x:hidden !important;
  background:#cfc4b3 !important;
}

/* The active card remains the only vertically scrollable visual layer. */
.horizontal-track > .h-slide{
  height:100svh !important;
  min-height:100svh !important;
  max-height:100svh !important;
  overflow-x:hidden !important;
  overflow-y:auto !important;
  overscroll-behavior:none !important;
}

/* In the self-contained preview only the selected route may expose a fixed deck. */
.preview-route:not(.is-active){
  display:none !important;
}
.preview-route.is-active{
  display:block !important;
}

/* Keep mobile browser chrome changes from moving the deck away from the viewport. */
@supports(height:100dvh){
  .horizontal-track,
  .horizontal-track > .h-slide{
    height:100dvh !important;
    min-height:100dvh !important;
    max-height:100dvh !important;
  }
}



.booking-cta{
  display:grid;
  place-items:center;
  min-height:100%;
  padding:clamp(128px,15vh,176px) 7vw clamp(70px,9vh,110px);
  text-align:center;
  color:#fffdf8;
  background:
    radial-gradient(circle at 22% 18%,rgba(214,171,83,.18),transparent 28%),
    radial-gradient(circle at 80% 78%,rgba(46,108,111,.22),transparent 32%),
    linear-gradient(135deg,#071e27 0%,#0b3038 55%,#10282f 100%);
}
.booking-cta__inner{
  width:min(840px,100%);
  margin:auto;
}
.booking-cta h2{
  margin:.2em 0 .32em;
  color:#fffdf8;
  font-size:clamp(3.9rem,7.7vw,8.6rem);
  line-height:.82;
  letter-spacing:-.052em;
}
.booking-cta p{
  width:min(650px,100%);
  margin:0 auto 30px;
  color:rgba(255,253,248,.82);
  font-size:clamp(1rem,1.3vw,1.18rem);
  line-height:1.75;
}
.booking-cta__button{
  min-width:178px;
  justify-content:center;
}
.booking-cta__button span{
  display:inline-block;
  margin-left:8px;
  transition:transform .2s ease;
}
.booking-cta__button:hover span,
.booking-cta__button:focus-visible span{
  transform:translateX(4px);
}

@media(max-width:620px){
  .booking-cta{
    padding:108px 28px 72px;
  }
  .booking-cta h2{
    font-size:clamp(3.25rem,15vw,5.5rem);
  }
}