/* ============================================================
   1370 CLUBHOUSE — V8.3 DESKTOP CLEANUP
   Targeted continuity layer on top of V8.1 / V7.7.
   Existing layout / SEO / content remain the source of truth.
   ============================================================ */

:root{
  --v8-ease:cubic-bezier(.16,1,.3,1);
  --v8-ease-sharp:cubic-bezier(.76,0,.24,1);
  --v8-motion-terra:#b14a1d;
  --v8-motion-orange:#dd5e1f;
  --v8-glass:rgba(255,253,248,.76);
}

html.v8-super{scroll-behavior:auto}
html.v8-super body{overscroll-behavior-y:none}
html.v8-super body.v8-intro-lock{overflow:hidden}

/* ------------------------------------------------------------
   01. FIRST-LOAD CINEMATIC CURTAIN
   ------------------------------------------------------------ */
.v8-intro{
  position:fixed;z-index:100000;inset:0;display:grid;place-items:center;
  overflow:hidden;background:var(--deep);color:var(--cream);
  isolation:isolate;pointer-events:auto
}
.v8-intro[hidden]{display:none!important}
.v8-intro__panel{position:absolute;inset:0;will-change:transform}
.v8-intro__panel--green{z-index:1;background:linear-gradient(145deg,#174b37 0%,#0e3827 47%,#061e16 100%)}
.v8-intro__panel--cream{z-index:2;inset:auto 0 0;height:0;background:var(--cream);border-radius:70% 70% 0 0/30% 30% 0 0}
.v8-intro__orb{position:absolute;z-index:3;border-radius:50%;filter:blur(.1px);opacity:.9;will-change:transform}
.v8-intro__orb--a{width:min(55vw,780px);aspect-ratio:1;right:-18vw;top:-28vw;border:clamp(45px,8vw,120px) solid rgba(221,94,31,.45)}
.v8-intro__orb--b{width:min(38vw,520px);aspect-ratio:1;left:-13vw;bottom:-24vw;border:clamp(34px,6vw,90px) solid rgba(154,174,147,.22)}
.v8-intro__center{position:relative;z-index:5;width:min(760px,80vw);text-align:center;display:grid;justify-items:center;gap:24px}
.v8-intro__logo{width:min(330px,52vw);filter:drop-shadow(0 26px 45px rgba(0,0,0,.18));opacity:0;transform:translateY(28px) scale(.96)}
.v8-intro__rule{width:0;height:1px;background:rgba(245,238,228,.56)}
.v8-intro__meta{font-size:clamp(9px,1vw,13px);font-weight:800;letter-spacing:.28em;text-transform:uppercase;color:#ff9b6e;opacity:0;transform:translateY(12px)}
.v8-intro__count{position:absolute;right:30px;bottom:26px;z-index:5;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(245,238,228,.5)}

/* ------------------------------------------------------------
   02. GLOBAL PAGE MOTION UI
   ------------------------------------------------------------ */
.v8-progress{position:fixed;z-index:9997;left:0;top:0;width:100%;height:3px;pointer-events:none;background:transparent}
.v8-progress span{display:block;width:100%;height:100%;background:linear-gradient(90deg,var(--terra),var(--orange));transform-origin:left center;transform:scaleX(0);will-change:transform;box-shadow:0 0 18px rgba(221,94,31,.35)}

.v8-transition{position:fixed;z-index:99990;inset:0;pointer-events:none;visibility:hidden;overflow:hidden}
.v82-transition__green{position:absolute;inset:-2%;z-index:2;background:linear-gradient(145deg,#174b37 0%,#0e3827 52%,#071f17 100%);transform:translate3d(0,104%,0);will-change:transform}
.v82-transition.is-arrival .v82-transition__green{transform:translate3d(0,0,0)}
.v8-transition__mark{position:absolute;z-index:3;left:50%;top:50%;width:clamp(150px,14vw,220px);transform:translate(-50%,-50%);opacity:0;filter:drop-shadow(0 20px 40px rgba(0,0,0,.12))}
.v82-transition.is-arrival .v8-transition__mark{opacity:1}
html.v82-arriving{background:#0e3827}
html.v82-arriving body{visibility:hidden;overflow:hidden}

/* V8.2 cursor: SVG silhouette morphs through the organic 1370 blob family. */
.v8-cursor.v82-blob-cursor{
  position:fixed;z-index:99995;left:0;top:0;width:34px;height:34px;
  pointer-events:none;display:grid;place-items:center;opacity:0;background:transparent;border:0;
  border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
  transform:translate3d(-100px,-100px,0) translate(-50%,-50%);
  transition:width .38s var(--v8-ease),height .38s var(--v8-ease),opacity .2s ease,filter .3s ease;
  animation:none;will-change:transform,width,height
}
.v8-cursor.v82-blob-cursor:before{display:none}
.v82-blob-cursor__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 10px 13px rgba(116,42,20,.22))}
.v82-blob-cursor__path{fill:rgba(177,74,29,.95);stroke:rgba(255,253,248,.7);stroke-width:1.6;vector-effect:non-scaling-stroke}
.v8-cursor.v82-blob-cursor span{position:relative;z-index:2;font-size:8px;font-weight:850;letter-spacing:.12em;text-transform:uppercase;color:var(--cream);opacity:0;transition:opacity .2s;white-space:nowrap}
.v8-cursor.v82-blob-cursor.is-visible{opacity:1}
.v8-cursor.v82-blob-cursor.is-active{width:88px;height:82px;background:transparent;box-shadow:none;filter:saturate(1.03)}
.v8-cursor.v82-blob-cursor.is-active span{opacity:1;color:var(--cream)}

/* Approved navigation, enhanced rather than redesigned. */
.site-header .header-shell{transition:transform .55s var(--v8-ease)}
.site-header.v8-compact .header-shell{transform:translate3d(0,-4px,0) scale(.986)}
@media(pointer:fine){
  .brand-dock,.nav-dock,.social-icon,.lang-trigger,.reserve-head,.menu-toggle{transform-style:preserve-3d}
}

/* ------------------------------------------------------------
   03. HERO — SPOTLIGHT, DEPTH, KINETIC TYPE
   ------------------------------------------------------------ */
.page-hero{--v8-mx:50%;--v8-my:42%}
.page-hero .hero-shell{perspective:1400px;transform-style:preserve-3d}
.page-hero .hero-shell:after{
  content:"";position:absolute;z-index:1;inset:-1px;pointer-events:none;
  background:radial-gradient(circle at var(--v8-mx) var(--v8-my),rgba(255,255,255,.13),transparent 20%),radial-gradient(circle at 78% 24%,rgba(221,94,31,.12),transparent 30%);
  mix-blend-mode:screen;opacity:.7;transition:opacity .35s
}
.page-hero .hero-grid{transform-style:preserve-3d}
.page-hero .hero-copy{position:relative;z-index:4;transform:translate3d(0,var(--copy-shift,0),42px)}
.page-hero .hero-media{transform-style:preserve-3d;will-change:transform}
.page-hero .hero-photo-main{transform:translate3d(var(--v8-hero-x,0),calc(var(--p-main,0px) + var(--v8-hero-y,0px)),0) rotate(-1.5deg)!important}
.page-hero .hero-photo-small{transform:translate3d(calc(var(--v8-hero-x,0) * -1.15),calc(var(--p-small,0px) + var(--v8-hero-y,0px) * -1),0) rotate(3deg)!important}
.page-hero .hero-photo-detail{transform:translate3d(calc(var(--v8-hero-x,0) * .8),calc(var(--p-detail,0px) + var(--v8-hero-y,0px) * .7),0) rotate(-4deg)!important}
.page-hero .hero-photo-main,.page-hero .hero-photo-small,.page-hero .hero-photo-detail{transition:box-shadow .5s ease,filter .5s ease}
.page-hero:hover .hero-photo-main{box-shadow:0 42px 95px rgba(0,0,0,.34)}

.hero-word{position:relative}
.hero-word:after{content:"";position:absolute;left:0;right:0;bottom:.05em;height:.018em;background:#ff8b53;transform:scaleX(0);transform-origin:left;opacity:.85}
.page-hero.hero-started .hero-word-wrap:last-child .hero-word:after{animation:v8-word-line .7s 1.35s var(--v8-ease) forwards}
@keyframes v8-word-line{to{transform:scaleX(1)}}

/* Motion ribbon — inserted by JS right after the hero. */
.v8-marquee{position:relative;z-index:7;margin:-18px 0 0;overflow:hidden;border-top:1px solid rgba(14,56,39,.1);border-bottom:1px solid rgba(14,56,39,.1);background:rgba(255,253,248,.92);backdrop-filter:blur(14px);transform:rotate(-.75deg);box-shadow:0 20px 55px rgba(6,29,21,.08);pointer-events:none}
.v8-marquee__track{display:flex;width:max-content;gap:0;will-change:transform;animation:v8-marquee 24s linear infinite}
.v8-marquee__item{display:flex;align-items:center;gap:24px;padding:17px 24px;color:var(--green);font-size:12px;font-weight:850;letter-spacing:.13em;text-transform:uppercase;white-space:nowrap}
.v8-marquee__item:after{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 6px rgba(221,94,31,.08)}
@keyframes v8-marquee{to{transform:translate3d(-50%,0,0)}}

/* ------------------------------------------------------------
   04. EXPERIENCE CARDS — DEEP TILT + SCROLL LIFT
   ------------------------------------------------------------ */
.experience-card,.gallery-preview figure,.gallery-item,.instagram-post,.map-card,.reserve-panel,.menu-card,.drink-card,.form-shell{transform-style:preserve-3d}
.experience-card{--v8-rx:0deg;--v8-ry:0deg;--v8-lift:0px;transform:perspective(1100px) translateY(var(--v8-lift)) rotateX(var(--v8-rx)) rotateY(var(--v8-ry));transition:transform .55s var(--v8-ease),box-shadow .55s var(--v8-ease)}
@media(pointer:fine){.experience-card:hover{box-shadow:0 42px 100px rgba(6,29,21,.27)}}

/* ------------------------------------------------------------
   05. PINNED HORIZONTAL PHOTO STORY (desktop)
   ------------------------------------------------------------ */
@media(min-width:1025px){
  .v82-gallery-scene{position:relative;height:var(--v82-gallery-scene-h,210vh);min-height:0;padding:0!important;overflow:visible}
  .v82-gallery-sticky{
    position:sticky!important;top:88px;height:calc(100dvh - 102px);min-height:560px;
    padding-top:clamp(20px,3vh,34px);padding-bottom:clamp(18px,2.5vh,28px);
    overflow:hidden;display:grid!important;grid-template-rows:auto minmax(0,1fr);align-content:stretch
  }
  .v82-gallery-sticky .section-head{margin-bottom:clamp(15px,2.1vh,23px);align-items:end}
  .v82-gallery-sticky .section-head .display{font-size:clamp(46px,4.8vw,78px);line-height:.92}
  .v82-gallery-viewport{position:relative;width:100%;min-width:0;min-height:0;height:100%;overflow:hidden;border-radius:0;contain:layout paint}
  .v82-gallery-scene .gallery-preview{
    position:absolute;left:0;top:0;height:100%;display:flex!important;
    grid-template:none!important;grid-template-columns:none!important;grid-template-rows:none!important;
    gap:22px;width:max-content;min-width:max-content;align-items:center;
    will-change:transform;transform:translate3d(var(--v82-gallery-x,0px),0,0)!important
  }
  .v82-gallery-scene .gallery-preview.motion-clip{clip-path:none!important;opacity:1!important}
  .v82-gallery-scene .gallery-preview figure{
    position:relative!important;grid-column:auto!important;grid-row:auto!important;
    flex:0 0 clamp(500px,48vw,680px);width:clamp(500px,48vw,680px);
    height:min(49vh,420px)!important;max-height:calc(100% - 12px);margin:0!important;
    border-radius:30px 30px 100px 30px
  }
  .v82-gallery-scene .gallery-preview figure:nth-child(2),
  .v82-gallery-scene .gallery-preview figure:nth-child(4){
    flex-basis:clamp(450px,43vw,610px);width:clamp(450px,43vw,610px);
    height:min(43vh,360px)!important;transform:translateY(2.4vh)
  }
  .v82-gallery-scene .gallery-preview figure:nth-child(3){
    flex-basis:clamp(480px,45vw,640px);width:clamp(480px,45vw,640px)
  }
}

/* ------------------------------------------------------------
   06. SECTION REVEALS + SOFT DEPTH
   ------------------------------------------------------------ */
.v8-section-enter{opacity:.15;transform:translate3d(0,62px,0) scale(.982);filter:blur(8px);transition:opacity 1s ease,transform 1.1s var(--v8-ease),filter 1.05s ease}
.v8-section-enter.is-v8-visible{opacity:1;transform:none;filter:blur(0)}

.instagram-section,.location-section,.reserve-section{position:relative;isolation:isolate}
.instagram-section:after,.reserve-section:after{content:"";position:absolute;z-index:-1;width:420px;aspect-ratio:1;border-radius:50%;filter:blur(90px);opacity:.12;pointer-events:none}
.instagram-section:after{right:-160px;bottom:-160px;background:var(--orange)}
.reserve-section:after{left:-180px;top:-160px;background:var(--sage)}

.location-section:before{will-change:transform;transform:translate3d(var(--jodoigne-shift,0),0,0)}

/* ------------------------------------------------------------
   07. FORM + MENU MICRO-MOTION
   ------------------------------------------------------------ */
.field{position:relative}
.field:after{content:"";position:absolute;left:18px;right:18px;bottom:1px;height:2px;background:linear-gradient(90deg,var(--terra),var(--orange));transform:scaleX(0);transform-origin:left;transition:transform .42s var(--v8-ease);pointer-events:none}
.field:focus-within:after{transform:scaleX(1)}
.field:focus-within label{color:var(--terra)!important}
.menu-card,.drink-card{transition:transform .55s var(--v8-ease),box-shadow .55s var(--v8-ease)}
@media(pointer:fine){.menu-card:hover,.drink-card:hover{transform:translateY(-6px) rotateX(.8deg);box-shadow:0 34px 80px rgba(6,29,21,.16)}}


/* Terracotta cards: dark-green eyebrow copy for clean brand contrast. */
.drink-card.terra header span,
.menu-card.featured .card-note,
.note-card:first-child>span{color:var(--deep)!important}

/* ------------------------------------------------------------
   08. CUSTOM LIGHTBOX ENTRANCE
   ------------------------------------------------------------ */
.lightbox[open]{animation:v8-dialog .38s var(--v8-ease) both}
.lightbox[open] img{animation:v8-lightbox-image .56s var(--v8-ease) both}
@keyframes v8-dialog{from{opacity:0}to{opacity:1}}
@keyframes v8-lightbox-image{from{opacity:0;transform:translateY(20px) scale(.965);filter:blur(8px)}to{opacity:1;transform:none;filter:blur(0)}}

/* ------------------------------------------------------------
   09. MOBILE — STILL MOTION-RICH, NEVER HEAVY
   ------------------------------------------------------------ */
@media(max-width:1024px){
  .v8-cursor{display:none!important}
  .v8-gallery-scene,.v82-gallery-scene{min-height:auto!important}
  .v8-gallery-scene>.container,.v82-gallery-scene>.container{position:relative!important;top:auto!important;height:auto!important;min-height:0!important;overflow:visible!important;display:block!important}
}
@media(max-width:820px){
  .v8-intro__logo{width:min(230px,58vw)}
  .v8-intro__center{gap:18px}
  .v8-intro__meta{font-size:8px;letter-spacing:.2em}
  .v8-intro__orb--a{width:86vw;right:-43vw;top:-24vw;border-width:48px}
  .v8-intro__orb--b{width:70vw;left:-38vw;bottom:-30vw;border-width:38px}
  .v8-marquee{margin-top:-7px;transform:rotate(-.5deg)}
  .v8-marquee__item{font-size:9px;padding:13px 17px;gap:17px}
  .page-hero .hero-shell:after{opacity:.36}
  .page-hero .hero-copy{transform:none}
  .page-hero .hero-photo-main{transform:translate3d(0,var(--p-main,0px),0) rotate(-1.5deg)!important}
  .page-hero .hero-photo-small{transform:translate3d(0,var(--p-small,0px),0) rotate(3deg)!important}
  .page-hero .hero-photo-detail{transform:translate3d(0,var(--p-detail,0px),0) rotate(-4deg)!important}
  .experience-card{transform:none!important}
  .v8-section-enter{transform:translate3d(0,28px,0);filter:blur(4px)}
  .site-header.v8-compact .header-shell{transform:none}
}

/* ------------------------------------------------------------
   10. ACCESSIBILITY / PERFORMANCE
   ------------------------------------------------------------ */
@media(prefers-reduced-motion:reduce){
  .v8-intro{display:none!important}
  .v8-progress,.v8-cursor,.v8-transition{display:none!important}
  .v8-marquee__track{animation:none!important;transform:none!important}
  .v8-section-enter{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
  .page-hero .hero-photo-main,.page-hero .hero-photo-small,.page-hero .hero-photo-detail{transform:none!important}
}


/* ============================================================
   V8.3 — TARGETED CLIENT FIXES
   - native cursor hidden only while custom cursor is active
   - softer rounded organic cursor silhouettes
   - desktop homepage gallery restored to the normal editorial grid
   - stronger clipping on rounded visual cards
   - hero image layers kept in one compositing plane
   ============================================================ */

@media (pointer:fine){
  html.v8-custom-cursor,
  html.v8-custom-cursor body,
  html.v8-custom-cursor body *{cursor:none!important}
}

/* Desktop: no pinned/horizontal scroll-telling. Use the approved normal grid. */
@media (min-width:1025px){
  .gallery-preview{
    display:grid!important;
    grid-template-columns:1.2fr .8fr .8fr!important;
    grid-template-rows:330px 260px!important;
    gap:14px!important;
    width:auto!important;
    min-width:0!important;
    height:auto!important;
    transform:none!important;
  }
  .gallery-preview figure{
    position:relative!important;
    width:auto!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    transform:none!important;
  }
  .gallery-preview figure:first-child{
    grid-column:auto!important;
    grid-row:1 / 3!important;
  }
  .gallery-preview figure:nth-child(2),
  .gallery-preview figure:nth-child(3){grid-column:auto!important;grid-row:auto!important}
  .gallery-preview figure:nth-child(4){grid-column:2 / 4!important;grid-row:auto!important}
}

/* Rounded cards must clip their transformed image layers cleanly. */
.hero-photo-main,
.hero-photo-small,
.hero-photo-detail,
.experience-card,
.gallery-preview figure,
.gallery-item,
.instagram-post,
.map-card,
.reserve-panel,
.menu-card,
.drink-card,
.note-card,
.inner-photo{
  isolation:isolate;
  overflow:hidden;
  transform-style:flat;
  background-clip:padding-box;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}
.hero-photo-main picture,
.hero-photo-small picture,
.hero-photo-detail picture,
.experience-card picture,
.gallery-preview figure picture,
.gallery-item picture,
.inner-photo picture{
  display:block;
  width:100%;
  height:100%;
  overflow:hidden;
  border-radius:inherit;
}
.hero-photo-main img,
.hero-photo-small img,
.hero-photo-detail img,
.experience-card img,
.gallery-preview figure img,
.gallery-item img,
.inner-photo img{
  border-radius:inherit;
}

/* Hero compositing fix: no layer can escape the rounded hero surface. */
.page-hero .hero-shell{isolation:isolate;overflow:hidden}
.page-hero .hero-media{isolation:isolate;transform-style:flat}
.page-hero .hero-photo-main{z-index:2}
.page-hero .hero-photo-small{z-index:4}
.page-hero .hero-photo-detail{z-index:5}

/* At the one-column desktop/tablet layout, disable 3D projection completely. */
@media (max-width:1120px){
  .page-hero .hero-shell{perspective:none}
  .page-hero .hero-media{transform-style:flat}
}


/* ============================================================
   V8.4 — FINAL POLISH PASS
   ============================================================ */

/* Route transition: the panel is fully opaque and visually self-contained. */
.v82-transition__green{inset:-3%;backface-visibility:hidden;transform:translate3d(0,104%,0)}
.v8-transition__mark{will-change:transform,opacity;backface-visibility:hidden}
html.v82-arriving,html.v82-arriving body{background:#0e3827!important}

/* Rounded-media hygiene.
   Paint containment + radial masks stop GPU-composited image layers from
   exposing square corners beside asymmetric cards, without clipping shadows. */
.hero-photo-main>picture,
.hero-photo-small>picture,
.hero-photo-detail>picture,
.experience-card>picture,
.gallery-preview figure>picture,
.gallery-item>button,
.gallery-item>button>picture,
.inner-photo>picture{
  border-radius:inherit;
  background-clip:padding-box;
  -webkit-mask-image:-webkit-radial-gradient(white,black);
  mask-image:radial-gradient(white,black);
}
.hero-photo-main>picture,
.hero-photo-small>picture,
.hero-photo-detail>picture,
.experience-card>picture,
.gallery-preview figure>picture,
.gallery-item>button,
.gallery-item>button>picture,
.inner-photo>picture{
  overflow:clip;
  contain:paint;
  transform:translateZ(0);
}
.gallery-item>button{border-radius:inherit;overflow:clip;background:transparent}
.experience-card,.gallery-preview figure,.gallery-item,.instagram-post,.map-card,.reserve-panel,.menu-card,.drink-card,.note-card,.inner-photo{
  background-clip:padding-box;
  -webkit-background-clip:padding-box;
}
.experience-card:after{border-radius:inherit}
.gallery-preview figure:after,.gallery-item:after{border-radius:inherit}

/* Avoid 3D parent compositing on asymmetric cards: it is a frequent source of
   one-pixel square corner bleed in Chromium. Image hover motion is preserved. */
.experience-card{transform:none!important;transform-style:flat!important}

/* Small finishing details: consistent focus, card edge and optical spacing. */
:is(a,button,input,textarea,select):focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.gallery-preview figure,.experience-card,.gallery-item,.menu-card,.drink-card,.note-card{
  outline:1px solid rgba(255,255,255,.18);outline-offset:-1px
}
.footer-links a{transition:border-color .25s ease,background .25s ease,transform .25s ease}
@media(pointer:fine){.footer-links a:hover{border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.035);transform:translateY(-2px)}}

/* DVSTUDIO credit — deliberately quiet, but polished and clickable. */
.footer-credit{margin-top:18px;display:flex;justify-content:flex-end}
.footer-credit a{
  display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:7px 10px 7px 12px;
  border:1px solid rgba(255,255,255,.12);border-radius:999px;
  color:rgba(255,255,255,.56);font-size:8px;letter-spacing:.07em;
  transition:color .25s ease,border-color .25s ease,background .25s ease,transform .25s ease
}
.footer-credit strong{color:rgba(255,255,255,.84);font-size:8px;letter-spacing:.1em}
.footer-credit__site{color:#df9676}
.footer-credit svg{width:12px;height:12px;flex:0 0 auto;opacity:.78}
@media(pointer:fine){.footer-credit a:hover{color:#fff;border-color:rgba(255,255,255,.24);background:rgba(255,255,255,.045);transform:translateY(-2px)}.footer-credit a:hover .footer-credit__site{color:#ff9b6e}}
@media(max-width:820px){.footer-credit{justify-content:flex-start;margin-top:20px}.footer-credit a{font-size:7.5px}}

/* ============================================================
   V8.5 — PRECISION POLISH + ROUNDED-CORNER FIX
   Research-backed Chromium fix: do not leave a square clip-path
   on elements whose real surface has asymmetric border radii.
   ============================================================ */

/* V8.4's reveal mask ended as `inset(... round 0)`. On Chromium that
   creates a rectangular compositing clip around rounded cards and can make
   pale square corners visible beside the real radius. Keep the reveal as a
   soft opacity/translate motion on rounded structural cards and let their
   native border-radius do all final clipping. */
.motion-ready :is(
  .experience-card,
  .gallery-preview figure,
  .gallery-item,
  .instagram-post,
  .map-card,
  .reserve-panel,
  .inner-photo,
  .menu-card,
  .drink-card,
  .note-card,
  .form-shell
).motion-clip,
.motion-ready :is(
  .experience-card,
  .gallery-preview figure,
  .gallery-item,
  .instagram-post,
  .map-card,
  .reserve-panel,
  .inner-photo,
  .menu-card,
  .drink-card,
  .note-card,
  .form-shell
).motion-clip.motion-in{
  clip-path:none!important;
  -webkit-clip-path:none!important;
}

/* Rounded surfaces own their clipping. No square helper outline behind them. */
.experience-card,
.gallery-preview figure,
.gallery-item,
.instagram-post,
.map-card,
.reserve-panel,
.inner-photo,
.menu-card,
.drink-card,
.note-card,
.form-shell{
  outline:0!important;
  isolation:isolate;
}

/* The three modules visible in the QA screenshots get an explicit clipping
   boundary. This avoids child/compositor bleed while preserving the parent's
   rounded box-shadow. */
.experience-card,
.map-card,
.reserve-panel{
  overflow:hidden!important;
  -webkit-background-clip:padding-box;
  background-clip:padding-box;
}

.experience-card>picture{
  display:block;
  width:100%;
  height:100%;
  overflow:hidden;
  border-radius:inherit;
  -webkit-clip-path:inset(0 round 28px 28px 92px 28px);
  clip-path:inset(0 round 28px 28px 92px 28px);
}
.experience-card>picture>img{
  width:100%;
  height:100%;
  border-radius:inherit;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.experience-card:after{border-radius:inherit;pointer-events:none}
.map-frame,.map-frame iframe{display:block;min-width:0}
.map-frame{overflow:hidden}
.reserve-panel:after{pointer-events:none}

/* Do not force GPU promotion on direct rounded media wrappers; browser-native
   clipping is cleaner here than a separate composited square layer. */
.experience-card>picture,
.map-card,
.reserve-panel{
  transform:none;
  will-change:auto;
}

/* Optical consistency: prevent 1px background seams in grid cards. */
.experience-grid{isolation:isolate}
.experience-card{background:#0e3827}

@media(max-width:820px){
  .experience-card>picture{
    -webkit-clip-path:inset(0 round 28px 28px 92px 28px);
    clip-path:inset(0 round 28px 28px 92px 28px);
  }
}

/* Preserve the hero's real asymmetric radius during and after its reveal too. */
.motion-ready .page-hero .hero-shell{
  -webkit-clip-path:inset(0 0 100% 0 round 34px 34px 150px 34px);
  clip-path:inset(0 0 100% 0 round 34px 34px 150px 34px);
}
.motion-ready .page-hero.hero-started .hero-shell{
  -webkit-clip-path:inset(0 round 34px 34px 150px 34px);
  clip-path:inset(0 round 34px 34px 150px 34px);
}
@media(max-width:820px){
  .motion-ready .page-hero .hero-shell{
    -webkit-clip-path:inset(0 0 100% 0 round 22px 22px 75px 22px);
    clip-path:inset(0 0 100% 0 round 22px 22px 75px 22px);
  }
  .motion-ready .page-hero.hero-started .hero-shell{
    -webkit-clip-path:inset(0 round 22px 22px 75px 22px);
    clip-path:inset(0 round 22px 22px 75px 22px);
  }
}

/* ============================================================
   V8.6 — REGRESSION FIX
   Keep V8.5 SEO/polish, restore approved V8.4 hero geometry and
   preserve the intrinsic 1370 logo proportions everywhere.
   ============================================================ */

/* HTML width/height attributes are kept for layout stability, but whenever
   CSS changes the rendered width the height must remain automatic or the
   1300×508 logo gets stretched vertically. */
.brand-dock img,
.hero-logo,
.hero-badge img,
.footer-logo,
.v8-intro__logo{
  height:auto!important;
  object-fit:contain;
  object-position:center;
}

/* Restore the exact V8.4 hero reveal. The V8.5 rounded clip-path override
   subtly changed the approved hero silhouette during/after reveal. */
.motion-ready .page-hero .hero-shell{
  -webkit-clip-path:inset(0 0 100% 0)!important;
  clip-path:inset(0 0 100% 0)!important;
}
.motion-ready .page-hero.hero-started .hero-shell{
  -webkit-clip-path:inset(0 0 0 0)!important;
  clip-path:inset(0 0 0 0)!important;
  transition:clip-path .9s cubic-bezier(.76,0,.24,1),-webkit-clip-path .9s cubic-bezier(.76,0,.24,1)!important;
}
@media(max-width:820px){
  .motion-ready .page-hero .hero-shell{
    -webkit-clip-path:inset(0 0 100% 0)!important;
    clip-path:inset(0 0 100% 0)!important;
  }
  .motion-ready .page-hero.hero-started .hero-shell{
    -webkit-clip-path:inset(0 0 0 0)!important;
    clip-path:inset(0 0 0 0)!important;
    transition-duration:.72s!important;
  }
}
@media(prefers-reduced-motion:reduce){
  .motion-ready .page-hero .hero-shell,
  .motion-ready .page-hero.hero-started .hero-shell{
    -webkit-clip-path:none!important;
    clip-path:none!important;
  }
}

/* ============================================================
   V9.6 — MOBILE ROUTE TRANSITION / IOS SAFARI FULL-VIEWPORT FIX
   Keep the logo exactly as designed, but overscan the animated
   green curtain so Safari's floating bottom/top browser chrome
   can never reveal the page underneath during navigation.
   ============================================================ */
.v8-transition{
  overflow:visible;
  min-height:100svh;
}
.v82-transition__green{
  position:fixed;
  inset:-35vh -3vw -45vh;
  inset:-35lvh -3vw -45lvh;
}

/* ============================================================
   V9.7 — SEAMLESS ROUTE HANDOFF / SAFARI FLICKER FIX
   One transition system only. The custom 1370 curtain owns the
   full navigation handoff; native cross-document snapshots are
   disabled so Safari/Chrome cannot cross-fade underneath it.
   ============================================================ */
@view-transition{navigation:none}
.site-header,main{view-transition-name:none!important}

/* Give the curtain its own stable compositor surface. */
.v8-transition{
  z-index:2147483000;
  isolation:isolate;
  contain:layout paint style;
  -webkit-transform:translateZ(0);
  transform:translateZ(0);
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
}
.v82-transition__green{
  -webkit-transform-style:preserve-3d;
  transform-style:preserve-3d;
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
  will-change:transform;
}
.v8-transition__mark{
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
  will-change:transform,opacity;
}

/* First-paint bridge on the destination document. This exists before the
   deferred motion JS runs, so there is never a frame where the new page can
   appear between the outgoing and incoming curtains. */
html.v82-arriving{
  background:#0e3827!important;
  overflow:hidden!important;
}
html.v82-arriving::before{
  content:"";
  position:fixed;
  z-index:2147482000;
  left:0;
  top:0;
  width:100vw;
  height:100vh;
  height:100lvh;
  min-height:100dvh;
  pointer-events:none;
  background:linear-gradient(145deg,#174b37 0%,#0e3827 52%,#071f17 100%);
  -webkit-transform:translateZ(0);
  transform:translateZ(0);
}
html.v82-arriving body{
  visibility:hidden!important;
  overflow:hidden!important;
  background:#0e3827!important;
}
/* The real curtain is allowed to remain visible even while destination body
   content is held back for the handoff. */
html.v82-arriving body>.v8-transition{
  visibility:visible!important;
}

/* V9.7 mobile compositor optimisation: V9.6 used a ~180vh overscanned fixed
   gradient to survive Safari chrome changes. 100lvh gives us the same full
   device coverage with a much smaller GPU surface, which is noticeably
   smoother during cross-document navigation on iPhone. */
.v8-transition{
  width:100vw;
  height:100vh;
  height:100lvh;
  min-height:100dvh;
  overflow:hidden;
  contain:layout style;
}
.v82-transition__green{
  position:absolute;
  inset:-3px;
}