/* ==========================================================================
   W&W CLUB  |  bespoke design layer on the Clario engine (site.js)
   Palette: cellar blacks, antique gold, a drop of claret, a drop of amber.
   Type: Bodoni Moda (display, echoes the Didone W's of the mark)
         Instrument Sans (body, quiet and legible)
   Motion persona: cinematic-restrained. Slow, weighty, one signature moment.
   ========================================================================== */
:root{
  --teal:#1c1612;        /* dark surface (engine token name kept) */
  --teal-deep:#0c0907;   /* deepest surface */
  --gold:#c3a062;        /* antique brushed gold */
  --gold-lt:#e4cd9c;
  --cream:#140f0c;       /* page ground: cellar */
  --sand:#1a1410;        /* alt ground: oak */
  --ink:#efe6d6;         /* parchment text */
  --muted:#b3a492;
  --claret:#7a1d2e;
  --amber:#c07a2c;
  --font-display:'Bodoni Moda',Georgia,serif;
  --font-body:'Instrument Sans',system-ui,sans-serif;
  --r-sm:8px; --r-md:14px; --r-lg:24px; --r-pill:999px;
  --ease:cubic-bezier(.25,.6,.3,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
  --gut:clamp(20px,5vw,56px);
  --max:1240px;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--cream); color:var(--ink);
  font-family:var(--font-body); font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img,video{max-width:100%; display:block;}
a{color:inherit;}
::selection{background:var(--gold); color:var(--teal-deep);}
.wrap{max-width:var(--max); margin:0 auto; padding:0 var(--gut);}
h1,h2,h3{font-family:var(--font-display); font-weight:500; line-height:1.08; margin:0; letter-spacing:-.01em;}
p{margin:0;}
.lead-in{font-family:var(--font-display); font-style:italic; color:var(--gold); font-size:19px; margin-bottom:14px; display:block;}
:focus-visible{outline:2px solid var(--gold-lt); outline-offset:3px; border-radius:4px;}

/* ---------- 1. engine loader (inner pages) ---------- */
#bc-loader{position:fixed; inset:0; z-index:2000; display:flex; align-items:center; justify-content:center;
  background:var(--teal-deep); transition:opacity .7s var(--ease), visibility .7s var(--ease);}
#bc-loader .ld-mark{font-family:var(--font-display); font-size:clamp(40px,7vw,64px); color:var(--gold); letter-spacing:.02em;
  opacity:0; animation:ldIn .9s var(--ease-out) .1s forwards;}
@keyframes ldIn{from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;}}
body.bc-loaded #bc-loader{opacity:0; visibility:hidden;}

/* ---------- 2. signature intro: the logo pour (home only) ---------- */
#ww-intro{position:fixed; inset:0; z-index:2100; background:#0a0806; display:flex; align-items:center; justify-content:center;
  transition:opacity 1s var(--ease), visibility 1s var(--ease);}
#ww-intro video{width:min(78vmin,560px); height:auto; aspect-ratio:1; object-fit:cover;
  -webkit-mask-image:radial-gradient(circle at 50% 50%,#000 58%,transparent 72%); mask-image:radial-gradient(circle at 50% 50%,#000 58%,transparent 72%);}
#ww-intro .skip{position:absolute; bottom:clamp(22px,5vh,44px); left:50%; transform:translateX(-50%);
  background:none; border:1px solid rgba(195,160,98,.4); color:var(--muted); font:500 13px/1 var(--font-body);
  padding:11px 20px; border-radius:var(--r-pill); cursor:pointer; letter-spacing:.04em; transition:color .3s, border-color .3s;}
#ww-intro .skip:hover{color:var(--gold-lt); border-color:var(--gold);}
#ww-intro.done{opacity:0; visibility:hidden;}
html:not(.ww-intro-on) #ww-intro:not(.done){display:none;}
html.ww-intro-on body{overflow:hidden;}

/* ---------- 3. progress + header ---------- */
#bc-progress{position:fixed; top:0; left:0; height:2px; width:0; z-index:1200; pointer-events:none;
  background:linear-gradient(90deg,var(--claret),var(--gold),var(--amber));}
.bc-head{position:fixed; top:0; left:0; right:0; z-index:1000; background:transparent;
  transition:transform .5s var(--ease), background .4s ease, box-shadow .4s ease, backdrop-filter .4s ease;}
.bc-head.is-hidden{transform:translateY(-104%);}
.bc-head.is-condensed{background:rgba(12,9,7,.84); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  box-shadow:0 1px 0 rgba(195,160,98,.14);}
.bc-head .nav-row{max-width:var(--max); margin:0 auto; padding:22px var(--gut); display:flex; align-items:center; justify-content:space-between; gap:24px; transition:padding .4s ease;}
.bc-head.is-condensed .nav-row{padding-top:13px; padding-bottom:13px;}
.bc-logo{text-decoration:none; display:inline-flex; align-items:baseline; gap:10px; color:var(--gold);}
.bc-logo .wm{font-family:var(--font-display); font-size:28px; font-weight:500; letter-spacing:.01em; line-height:1;}
.bc-logo .wm i{font-style:italic; font-weight:400;}
.bc-logo .kick{font-size:12px; letter-spacing:.32em; color:var(--muted); text-transform:uppercase;}
.bc-nav{display:flex; align-items:center; gap:34px;}
.navlink{text-decoration:none; font-size:15px; color:var(--ink); opacity:.86; position:relative; padding:4px 0; transition:opacity .3s;}
.navlink::after{content:""; position:absolute; left:0; bottom:-2px; height:1px; width:0; background:var(--gold); transition:width .45s var(--ease);}
.navlink:hover{opacity:1;} .navlink:hover::after,.navlink.active::after{width:100%;}
.bc-burger{display:none; position:relative; width:30px; height:22px; background:none; border:0; cursor:pointer; padding:0;}
.bc-burger span{position:absolute; left:0; right:0; height:1.5px; background:var(--gold-lt); transition:transform .4s var(--ease), opacity .3s, top .4s var(--ease);}
.bc-burger span:nth-child(1){top:3px;} .bc-burger span:nth-child(2){top:10px;} .bc-burger span:nth-child(3){top:17px;}
.bc-burger.open span:nth-child(1){top:10px; transform:rotate(45deg);} .bc-burger.open span:nth-child(2){opacity:0;} .bc-burger.open span:nth-child(3){top:10px; transform:rotate(-45deg);}
.bc-mobile{position:fixed; inset:0; z-index:990; background:var(--teal-deep); transform:translateY(-100%); visibility:hidden;
  transition:transform .55s var(--ease), visibility 0s .55s;}
.bc-mobile.open{transform:none; visibility:visible; transition:transform .55s var(--ease);}
.bc-mobile .inner{height:100%; display:flex; flex-direction:column; justify-content:center; gap:22px; padding:0 var(--gut);}
.bc-mobile a{font-family:var(--font-display); font-size:38px; text-decoration:none; color:var(--ink); opacity:0; transform:translateY(14px); transition:opacity .5s, transform .5s var(--ease-out);}
.bc-mobile.open a{opacity:1; transform:none;}
.bc-mobile.open a:nth-child(2){transition-delay:.08s} .bc-mobile.open a:nth-child(3){transition-delay:.16s} .bc-mobile.open a:nth-child(4){transition-delay:.24s}
.bc-mobile a.m-cta{color:var(--gold);}
@media(max-width:880px){ .bc-nav{display:none;} .bc-burger{display:block; z-index:1001;} .bc-logo .kick{display:none;} }

/* ---------- 4. buttons ---------- */
.btn{display:inline-flex; align-items:center; gap:.55em; position:relative; overflow:hidden; isolation:isolate;
  text-decoration:none; font:500 15px/1 var(--font-body); letter-spacing:.02em; padding:16px 28px; border-radius:var(--r-pill);
  border:1px solid transparent; cursor:pointer; transition:color .45s var(--ease), border-color .45s, transform .45s var(--ease);}
.btn::before{content:""; position:absolute; inset:0; z-index:-1; transform:scaleX(0); transform-origin:left; transition:transform .6s var(--ease);}
.btn:hover::before{transform:scaleX(1);}
.btn .arr{display:inline-block; width:14px; height:1px; background:currentColor; position:relative; transition:width .45s var(--ease);}
.btn .arr::after{content:""; position:absolute; right:0; top:-3px; width:7px; height:7px; border-top:1px solid currentColor; border-right:1px solid currentColor; transform:rotate(45deg);}
.btn:hover .arr{width:22px;}
.btn-gold{background:linear-gradient(135deg,#d2b377,#b38d4f); color:#16100b;}
.btn-gold::before{background:var(--gold-lt);}
.btn-ghost{border-color:rgba(228,205,156,.45); color:var(--ink);}
.btn-ghost::before{background:rgba(195,160,98,.16);}
.btn-ghost:hover{border-color:var(--gold);}
.btn-sm{padding:12px 22px; font-size:14px;}

/* ---------- 5. reveals (engine) ---------- */
.reveal{opacity:0; transform:translateY(16px); transition:opacity .95s var(--ease-out), transform .95s var(--ease-out);}
.reveal.in{opacity:1; transform:none;}
.reveal[data-d="1"]{transition-delay:.06s} .reveal[data-d="2"]{transition-delay:.14s} .reveal[data-d="3"]{transition-delay:.22s} .reveal[data-d="4"]{transition-delay:.3s} .reveal[data-d="5"]{transition-delay:.38s}
.img-reveal > img{clip-path:inset(0 0 100% 0); transition:clip-path 1.3s var(--ease-out), transform 1.4s var(--ease-out);} .img-reveal.in > img{clip-path:inset(0);}
.seq > *{opacity:0; transform:translateY(18px); animation:seqRise 1.1s var(--ease-out) forwards;}
.seq > *:nth-child(1){animation-delay:.2s} .seq > *:nth-child(2){animation-delay:.42s} .seq > *:nth-child(3){animation-delay:.64s}
html.ww-intro-on .seq > *{animation-play-state:paused;}
@keyframes seqRise{to{opacity:1; transform:none;}}

/* ---------- 6. hero: "The Meeting" ---------- */
.bc-hero.ww-hero{position:relative; min-height:100vh; min-height:100svh; display:flex; align-items:center; overflow:hidden; background:#0d0a08;}
.ww-hero .hero-bg{position:absolute; inset:-4% 0 -8% 0; background:url(img/hero-still.jpg) 88% center/cover no-repeat; will-change:transform;}
.ww-hero video.hero-video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:88% center; opacity:0; transition:opacity 1.4s ease;}
.ww-hero video.hero-video.ready{opacity:1;}
.ww-hero .hero-scrim{position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg,rgba(10,8,6,.9) 0%,rgba(10,8,6,.62) 34%,rgba(10,8,6,.08) 62%,rgba(10,8,6,0) 100%),
             linear-gradient(0deg,rgba(20,15,12,1) 0%,rgba(20,15,12,0) 22%);}
.ww-hero .hero-inner{position:relative; z-index:2; width:100%; max-width:var(--max); margin:0 auto; padding:clamp(120px,18vh,190px) var(--gut) clamp(70px,12vh,120px);}
.ww-hero h1{font-size:clamp(42px,5.4vw,80px); max-width:10.5ch; color:#f4ecde; font-weight:500;}
.ww-hero .sub{margin-top:26px; max-width:40ch; color:var(--muted); font-size:clamp(16px,1.35vw,19px);}
.ww-hero .ctas{display:flex; flex-wrap:wrap; gap:14px; margin-top:38px;}
.scroll-cue{position:absolute; left:50%; bottom:26px; z-index:3; width:1px; height:46px; background:linear-gradient(180deg,rgba(195,160,98,0),rgba(195,160,98,.8)); transform:translateX(-50%);}
.scroll-cue::after{content:""; position:absolute; left:-2px; top:0; width:5px; height:5px; border-radius:50%; background:var(--gold-lt); animation:cue 2.6s var(--ease) infinite;}
@keyframes cue{0%{opacity:0; top:0;}30%{opacity:1;}100%{opacity:0; top:42px;}}
@media(max-width:880px){
  .ww-hero{align-items:flex-end;}
  .ww-hero .hero-scrim{background:linear-gradient(0deg,rgba(12,9,7,.96) 0%,rgba(12,9,7,.78) 42%,rgba(12,9,7,.1) 72%);}
  .ww-hero .hero-inner{padding-bottom:72px;}
  .ww-hero video.hero-video{object-position:66% center;} .ww-hero .hero-bg{background-position:66% center;}
}

/* ---------- 7. intro statement ---------- */
.ww-intro-sec{padding:clamp(90px,12vw,170px) 0 clamp(70px,9vw,120px);}
.ww-intro-sec .grid-2{display:grid; grid-template-columns:1.25fr 1fr; gap:clamp(36px,6vw,96px); align-items:end;}
.ww-intro-sec h2{font-size:clamp(32px,3.9vw,56px); color:#f1e8da;}
.ww-intro-sec h2 em{font-style:italic; color:var(--gold-lt);}
.ww-intro-sec p{color:var(--muted); font-size:18px; max-width:44ch;}
.ww-intro-sec p + p{margin-top:18px;}
@media(max-width:880px){.ww-intro-sec .grid-2{grid-template-columns:1fr;}}

/* ---------- 8. SIGNATURE: where the two meet ---------- */
.ww-meet{position:relative; height:190vh; background:var(--cream);}
.ww-meet .stage{position:sticky; top:0; height:100vh; overflow:hidden; display:flex; align-items:center; justify-content:center;}
.ww-meet .half{position:absolute; top:9vh; bottom:9vh; width:calc(50% - 2px); overflow:hidden; background:#0b0907; border-radius:var(--r-lg);
  will-change:transform; transition:border-radius .6s var(--ease);}
.ww-meet .half.l{right:50%; transform:translateX(calc(var(--gap,1) * -9vw)); transform-origin:right center;}
.ww-meet .half.r{left:50%; transform:translateX(calc(var(--gap,1) * 9vw)); transform-origin:left center;}
.ww-meet .half .bg{position:absolute; inset:0; background-size:cover; background-position:center;}
.ww-meet .half video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1.2s ease;}
.ww-meet .half video.ready{opacity:1;}
.ww-meet .half.l .bg, .ww-meet .half.l video{object-position:70% center; background-position:70% center;}
.ww-meet .half.r .bg, .ww-meet .half.r video{object-position:78% center; background-position:78% center;}
.ww-meet .half::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(8,6,5,.82) 0%,rgba(8,6,5,0) 46%);}
.ww-meet .half.l::before,.ww-meet .half.r::before{content:""; position:absolute; inset:0; z-index:1; mix-blend-mode:soft-light; opacity:.5;}
.ww-meet .half.l::before{background:radial-gradient(circle at 70% 40%,var(--claret),transparent 60%);}
.ww-meet .half.r::before{background:radial-gradient(circle at 60% 60%,var(--amber),transparent 60%);}
.ww-meet .cap{position:absolute; bottom:clamp(26px,5vh,54px); z-index:2; max-width:30ch;}
.ww-meet .half.l .cap{left:clamp(24px,4vw,56px);} .ww-meet .half.r .cap{left:clamp(24px,4vw,56px);}
.ww-meet .cap h3{font-size:clamp(30px,3.4vw,50px); color:#f4ecde;}
.ww-meet .cap p{color:var(--muted); margin-top:8px; font-size:16px;}
.ww-meet .amp{position:absolute; z-index:4; left:50%; top:50%; transform:translate(-50%,-50%) scale(calc(.6 + (1 - var(--gap,1)) * .4));
  opacity:calc(1 - var(--gap,1)); font-family:var(--font-display); font-style:italic; font-weight:400; line-height:1;
  font-size:clamp(120px,15vw,230px); pointer-events:none;
  background:linear-gradient(160deg,#f1dcae 0%,#c3a062 45%,#8a6a36 100%); -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 10px 30px rgba(0,0,0,.55));}
.ww-meet .title{position:absolute; top:calc(9vh + 26px); left:50%; transform:translateX(-50%); z-index:4; text-align:center;
  opacity:calc(1 - var(--gap,1)); width:max-content; max-width:90vw;}
.ww-meet .title span{display:inline-block; font-family:var(--font-display); font-size:clamp(18px,1.6vw,24px); color:#f4ecde;
  background:rgba(12,9,7,.55); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); padding:10px 22px; border-radius:var(--r-pill); border:1px solid rgba(195,160,98,.25);}
@media(max-width:880px){
  .ww-meet{height:auto; padding:40px 0;}
  .ww-meet .stage{position:relative; height:auto; flex-direction:column; gap:14px; padding:0 var(--gut);}
  .ww-meet .half, .ww-meet .half.l, .ww-meet .half.r{position:relative; top:auto; bottom:auto; left:auto; right:auto; width:100%; height:62vh; transform:none !important;}
  .ww-meet .amp{position:relative; left:auto; top:auto; transform:none; opacity:1; font-size:110px; margin:-40px 0; order:1;}
  .ww-meet .half.r{order:2;}
  .ww-meet .title{position:relative; top:auto; left:auto; transform:none; opacity:1; order:-1; margin-bottom:6px;}
}

/* ---------- 9. experiences reel ---------- */
.ww-exp-head{padding:clamp(80px,10vw,140px) 0 clamp(36px,4vw,54px);}
.ww-exp-head h2{font-size:clamp(34px,4.2vw,60px); max-width:16ch; color:#f1e8da;}
.ww-exp-head p{color:var(--muted); max-width:46ch; margin-top:18px; font-size:18px;}
.reel{position:relative; background:var(--cream);}
.reel-stage{position:sticky; top:0; height:100vh; overflow:hidden;}
.reel-frame{position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; will-change:opacity,transform;}
.reel-frame:first-child{opacity:1;}
.reel-frame .reel-vid{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity 1.1s ease;}
.reel-frame .reel-vid.ready{opacity:1;}
.reel-frame::after{content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(10,8,6,.82) 0%,rgba(10,8,6,.35) 45%,rgba(10,8,6,0) 75%),linear-gradient(0deg,rgba(10,8,6,.7),rgba(10,8,6,0) 45%);}
.reel-cap{position:absolute; inset:0; z-index:3; pointer-events:none;}
.reel-cap .row{position:absolute; left:max(var(--gut),calc((100vw - var(--max))/2 + var(--gut))); bottom:clamp(60px,12vh,120px); max-width:min(520px,82vw);
  opacity:0; transform:translateY(20px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);}
.reel-cap .row.on{opacity:1; transform:none;}
.reel-cap .no{font-family:var(--font-display); font-style:italic; color:var(--gold); font-size:18px; display:block; margin-bottom:10px;}
.reel-cap h3{font-size:clamp(38px,5vw,74px); color:#f6eee1;}
.reel-cap p{color:#d6cab8; margin-top:14px; font-size:18px; max-width:36ch;}
.reel-cap .real{display:inline-block; margin-top:16px; font-size:13px; color:var(--muted); border:1px solid rgba(195,160,98,.3); border-radius:var(--r-pill); padding:6px 12px;}
.reel-rail{position:absolute; right:var(--gut); top:50%; transform:translateY(-50%); z-index:3; display:flex; flex-direction:column; gap:14px;}
.reel-rail i{display:block; width:2px; height:26px; background:rgba(239,230,214,.25); border-radius:2px; transition:background .5s, height .5s var(--ease);}
.reel-rail i.on{background:var(--gold); height:46px;}

/* ---------- 10. gallery: real moments ---------- */
.ww-gallery{padding:clamp(90px,11vw,150px) 0; background:linear-gradient(180deg,var(--cream),var(--sand));}
.ww-gallery .head{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:end; margin-bottom:clamp(36px,4vw,56px);}
.ww-gallery h2{font-size:clamp(34px,4.2vw,60px); color:#f1e8da;}
.ww-gallery .head p{color:var(--muted); max-width:42ch; justify-self:end;}
.g-grid{display:grid; grid-template-columns:1.2fr 1fr 1fr; grid-template-rows:auto auto; gap:clamp(12px,1.6vw,20px);}
.g-grid figure{margin:0; border-radius:var(--r-md); overflow:hidden; position:relative; background:#0c0907;}
.g-grid img{width:100%; height:100%; object-fit:cover; transition:transform 1.4s var(--ease-out); filter:saturate(.92) contrast(1.02);}
.g-grid figure:hover img{transform:scale(1.04);}
.g-grid .a{grid-row:1 / span 2; aspect-ratio:3/4;}
.g-grid .b,.g-grid .c{aspect-ratio:4/5;} .g-grid .d{grid-column:2 / span 2; aspect-ratio:16/8;}
.g-grid .d img{object-position:center 60%;}
@media(max-width:880px){
  .ww-gallery .head{grid-template-columns:1fr;} .ww-gallery .head p{justify-self:start;}
  .g-grid{grid-template-columns:1fr 1fr;} .g-grid .a{grid-row:auto; grid-column:1 / span 2; aspect-ratio:4/5;} .g-grid .d{grid-column:1 / span 2;}
}

/* ---------- 11. ambient CTA panel ---------- */
.ww-cta{padding:clamp(40px,6vw,90px) var(--gut) clamp(90px,10vw,140px); background:var(--sand);}
.ww-cta .panel{position:relative; overflow:hidden; isolation:isolate; max-width:var(--max); margin:0 auto; border-radius:var(--r-lg);
  padding:clamp(56px,8vw,110px) clamp(28px,6vw,90px); text-align:center;
  background:linear-gradient(160deg,#211913 0%,#120d0a 60%,#0d0907 100%); border:1px solid rgba(195,160,98,.18);}
.ww-cta .panel::before,.ww-cta .panel::after{content:""; position:absolute; z-index:-1; width:60%; aspect-ratio:1; border-radius:50%; filter:blur(70px); opacity:.2;}
.ww-cta .panel::before{background:var(--claret); left:-12%; top:-40%; animation:auroraDriftA 26s ease-in-out infinite alternate;}
.ww-cta .panel::after{background:var(--amber); right:-14%; bottom:-45%; animation:auroraDriftB 32s ease-in-out infinite alternate;}
@keyframes auroraDriftA{to{transform:translate(18%,22%) scale(1.15);}}
@keyframes auroraDriftB{to{transform:translate(-20%,-16%) scale(1.1);}}
.ww-cta blockquote{margin:0 auto; font-family:var(--font-display); font-size:clamp(28px,3.6vw,52px); line-height:1.15; color:#f4ecde; max-width:20ch;}
.ww-cta .by{margin-top:22px; color:var(--muted);}
.ww-cta .btn{margin-top:40px;}

/* ---------- 12. footer ---------- */
.ww-foot{background:var(--teal-deep); padding:clamp(64px,8vw,100px) 0 36px; border-top:1px solid rgba(195,160,98,.12);}
.ww-foot .cols{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px;}
.ww-foot .mark{width:120px; border-radius:var(--r-md); margin-bottom:22px;}
.ww-foot p,.ww-foot a{color:var(--muted); font-size:15px;}
.ww-foot h4{font-family:var(--font-display); font-weight:500; font-size:20px; color:var(--gold-lt); margin:0 0 16px;}
.ww-foot ul{list-style:none; padding:0; margin:0; display:grid; gap:10px;}
.ww-foot a{text-decoration:none; transition:color .3s;} .ww-foot a:hover{color:var(--gold-lt);}
.ww-foot .base{margin-top:56px; padding-top:22px; border-top:1px solid rgba(195,160,98,.1); display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; font-size:13px; color:#7d705f;}
@media(max-width:880px){.ww-foot .cols{grid-template-columns:1fr;}}

#bc-top{position:fixed; right:22px; bottom:22px; z-index:900; width:48px; height:48px; border-radius:50%; border:1px solid rgba(195,160,98,.4);
  background:rgba(12,9,7,.8); color:var(--gold-lt); cursor:pointer; opacity:0; transform:translateY(12px); pointer-events:none;
  transition:opacity .4s, transform .4s var(--ease), background .3s; display:flex; align-items:center; justify-content:center;}
#bc-top.show{opacity:1; transform:none; pointer-events:auto;} #bc-top:hover{background:var(--gold); color:#16100b;}
#bc-top svg{width:16px; height:16px;}

/* ---------- 13. book page ---------- */
.ww-page-head{padding:clamp(150px,20vh,210px) 0 clamp(40px,5vw,64px); position:relative; overflow:hidden;}
.ww-page-head::before{content:""; position:absolute; inset:0; background:url(img/swirl-still.jpg) 85% center/cover no-repeat; opacity:.35;
  -webkit-mask-image:linear-gradient(90deg,transparent 25%,#000 80%); mask-image:linear-gradient(90deg,transparent 25%,#000 80%);}
.ww-page-head .wrap{position:relative;}
.ww-page-head h1{font-size:clamp(46px,6vw,86px); color:#f4ecde; max-width:12ch;}
.ww-page-head p{color:var(--muted); max-width:46ch; margin-top:20px; font-size:18px;}
.ww-book{padding:0 0 clamp(90px,10vw,140px);}
.ww-book .grid-2{display:grid; grid-template-columns:1.5fr 1fr; gap:clamp(24px,3vw,40px); align-items:start;}
.card{background:linear-gradient(165deg,#1f1813,#15100c); border:1px solid rgba(195,160,98,.16); border-radius:var(--r-lg); padding:clamp(26px,3.4vw,44px);
  box-shadow:0 30px 60px -40px rgba(0,0,0,.8);}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px 20px;}
.form-grid .full{grid-column:1 / -1;}
.field label{display:block; font-size:14px; color:var(--muted); margin-bottom:8px;}
.field input,.field select,.field textarea{width:100%; background:rgba(12,9,7,.7); border:1px solid rgba(195,160,98,.22); border-radius:var(--r-sm);
  color:var(--ink); font:400 16px/1.4 var(--font-body); padding:14px 16px; transition:border-color .3s, box-shadow .3s;}
.field textarea{min-height:130px; resize:vertical;}
.field select{appearance:none; -webkit-appearance:none; background-image:linear-gradient(45deg,transparent 50%,var(--gold) 50%),linear-gradient(135deg,var(--gold) 50%,transparent 50%);
  background-position:calc(100% - 20px) 50%, calc(100% - 15px) 50%; background-size:5px 5px; background-repeat:no-repeat;}
.field input:focus,.field select:focus,.field textarea:focus{outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(195,160,98,.15);}
.field input::placeholder,.field textarea::placeholder{color:#6f6354;}
.form-foot{display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:28px;}
.form-foot small{color:#8c7e6c; font-size:13px; max-width:32ch;}
.form-msg{margin-top:16px; color:#e8a8a8; font-size:14px; min-height:1em;}
.info h3{font-size:28px; color:#f1e8da; margin-bottom:8px;}
.info > p{color:var(--muted);}
.info .rows{margin-top:24px; display:grid;}
.info .rows a,.info .rows div{display:block; padding:16px 0; text-decoration:none; border-bottom:1px solid rgba(195,160,98,.12);}
.info .rows > :last-child{border-bottom:0;}
.info .rows span{display:block; font-size:13px; color:#8c7e6c;}
.info .rows strong{font-weight:500; color:var(--ink); font-size:17px; word-break:break-word;}
.info .rows a:hover strong{color:var(--gold-lt);}
.chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:22px;}
.chips span{font-size:13px; color:var(--gold-lt); border:1px solid rgba(195,160,98,.28); border-radius:var(--r-pill); padding:7px 13px;}
@media(max-width:880px){.ww-book .grid-2{grid-template-columns:1fr;} .form-grid{grid-template-columns:1fr;}}

/* ---------- 14. reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
  .reveal{opacity:1 !important; transform:none !important;} .img-reveal > img{clip-path:none !important;}
  .seq > *{opacity:1 !important; transform:none !important;}
  #bc-loader,#ww-intro{display:none !important;}
  .scroll-cue{display:none;}
  .ww-meet{height:auto;} .ww-meet .stage{position:relative;}
  .ww-meet .half{transform:none !important;} .ww-meet .amp,.ww-meet .title{opacity:1 !important;}
}

/* ================= multi-page additions ================= */
.navlink.active{opacity:1; color:var(--gold-lt);}
.ww-page-head.ph-board::before{background-image:url(img/boardroom-still.jpg); background-position:70% center; opacity:.42;}
.ww-page-head.ph-about::before{background-image:url(img/hero-still.jpg); background-position:90% center; opacity:.4;}
.ww-page-head.ph-gal::before{background-image:url(img/ev-tasting-room.jpg); background-position:center 55%; opacity:.3;}
.jump{display:flex; flex-wrap:wrap; gap:10px; margin-top:30px;}
.jump a{font-size:14px; text-decoration:none; color:var(--gold-lt); border:1px solid rgba(195,160,98,.3); border-radius:var(--r-pill); padding:9px 16px; transition:background .3s, border-color .3s;}
.jump a:hover{background:rgba(195,160,98,.14); border-color:var(--gold);}
.real{display:inline-block; margin-top:16px; font-size:13px; color:var(--muted); border:1px solid rgba(195,160,98,.3); border-radius:var(--r-pill); padding:6px 12px;}

/* experience rows */
.exp-row{padding:clamp(48px,6vw,90px) 0; scroll-margin-top:80px;}
.exp-row + .exp-row{padding-top:0;}
.exp-grid{display:grid; grid-template-columns:1.15fr 1fr; gap:clamp(30px,5vw,80px); align-items:center;}
.exp-row.flip .exp-media{order:2;}
.exp-media{position:relative; aspect-ratio:4/3; border-radius:var(--r-lg); overflow:hidden; background:#0b0907 center/cover no-repeat;
  box-shadow:0 40px 80px -50px rgba(0,0,0,.9); border:1px solid rgba(195,160,98,.12);}
.exp-media video,.exp-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.exp-media video{opacity:0; transition:opacity 1.2s ease;} .exp-media video.ready{opacity:1;}
.exp-copy h2{font-size:clamp(34px,3.8vw,56px); color:#f1e8da;}
.exp-copy .line{font-family:var(--font-display); font-style:italic; font-size:clamp(19px,1.6vw,23px); color:var(--gold-lt); margin-top:14px;}
.exp-copy p{color:var(--muted); margin-top:14px; max-width:44ch;}
.exp-copy .act{margin-top:28px;}
@media(max-width:880px){.exp-grid{grid-template-columns:1fr;} .exp-row.flip .exp-media{order:0;}}

/* about teaser on home */
.ww-meet-host{padding:clamp(80px,10vw,140px) 0 0;}
.ww-meet-host .grid-2{display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(30px,6vw,90px); align-items:center;}
.host-card{border-radius:var(--r-lg); overflow:hidden; border:1px solid rgba(195,160,98,.16); max-width:420px;}
.ww-meet-host h2{font-size:clamp(34px,4.2vw,60px); color:#f1e8da;}
.ww-meet-host p{color:var(--muted); max-width:46ch; margin-top:16px; font-size:18px;}
@media(max-width:880px){.ww-meet-host .grid-2{grid-template-columns:1fr;}}

/* about page */
.about-body{padding:0 0 clamp(80px,9vw,120px);}
.about-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(30px,6vw,90px); align-items:start;}
.portrait{margin:0; border-radius:var(--r-lg); overflow:hidden; border:1px solid rgba(195,160,98,.18); position:relative;}
.portrait figcaption{position:absolute; left:0; right:0; bottom:0; padding:14px 18px; font-size:13px; color:var(--muted); background:linear-gradient(0deg,rgba(10,8,6,.9),rgba(10,8,6,0));}
.about-copy .big{font-family:var(--font-display); font-size:clamp(26px,2.6vw,38px); line-height:1.25; color:#f1e8da;}
.about-copy p{color:var(--muted); margin-top:20px; max-width:52ch; font-size:18px;}
.about-copy .big + p{margin-top:24px;}
.draft-note{margin-top:34px; padding:24px 26px; border-radius:var(--r-md); border:1px dashed rgba(195,160,98,.5); background:rgba(195,160,98,.06);}
.draft-note strong{font-family:var(--font-display); font-weight:500; font-size:22px; color:var(--gold-lt);}
.draft-note p{margin-top:8px; font-size:16px;}
@media(max-width:880px){.about-grid{grid-template-columns:1fr;} .portrait{max-width:420px;}}

/* gallery page */
.gal-page{padding:0 0 clamp(80px,9vw,120px);}
.gal-grid{columns:3 280px; column-gap:clamp(12px,1.6vw,20px);}
.gal-grid figure{margin:0 0 clamp(12px,1.6vw,20px); break-inside:avoid; border-radius:var(--r-md); overflow:hidden; background:#0c0907;}
.gal-grid img{width:100%; height:auto; transition:transform 1.4s var(--ease-out);}
.gal-grid figure:hover img{transform:scale(1.03);}

/* featured event + form extras */
.ww-featured{padding:clamp(10px,2vw,30px) 0 clamp(70px,8vw,110px);}
.feat-card{display:grid; grid-template-columns:1fr 1.1fr; border-radius:var(--r-lg); overflow:hidden; border:1px solid rgba(195,160,98,.25); background:linear-gradient(160deg,#211913,#140f0c);}
.feat-img{min-height:340px; background:center/cover no-repeat;}
.feat-copy{padding:clamp(28px,4vw,56px);}
.feat-copy h2{font-size:clamp(36px,4.2vw,60px); color:#f4ecde; margin-top:14px;}
.feat-copy .when{font-family:var(--font-display); font-style:italic; color:var(--gold-lt); font-size:clamp(18px,1.6vw,22px); margin-top:10px;}
.feat-copy p{color:var(--muted); margin-top:14px; max-width:44ch;}
.feat-copy .act{margin-top:26px;}
.feat-pill{display:inline-block; font-size:12px; letter-spacing:.08em; color:#16100b; background:linear-gradient(135deg,#d2b377,#b38d4f); border-radius:var(--r-pill); padding:6px 12px; font-weight:600;}
@media(max-width:880px){.feat-card{grid-template-columns:1fr;} .feat-img{min-height:240px;}}
.about-h{font-size:22px; color:var(--gold-lt); margin-top:34px;}
.hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}
.sent h3{font-size:30px; color:#f1e8da;} .sent p{color:var(--muted); margin-top:10px;}

/* Packages (added 21 Oct) */
.ww-packages{padding:clamp(56px,7vw,110px) 0 clamp(24px,3vw,40px); scroll-margin-top:80px;}
.pk-head{max-width:640px; margin-bottom:clamp(28px,4vw,48px);}
.pk-head h2{margin:0 0 12px;}
.pk-head p{opacity:.85;}
.pk-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(16px,2vw,26px);}
.pk-card{display:flex; flex-direction:column; border-radius:var(--r-lg); overflow:hidden; border:1px solid rgba(195,160,98,.25); background:linear-gradient(160deg,#211913,#140f0c);}
.pk-card.pk-feat{border-color:rgba(195,160,98,.6); box-shadow:0 0 0 1px rgba(195,160,98,.15) inset;}
.pk-img{aspect-ratio:4/3; background-size:cover; background-position:center;}
.pk-body{padding:clamp(20px,2.4vw,30px); display:flex; flex-direction:column; gap:10px; flex:1;}
.pk-body h3{font-family:var(--font-display); font-size:clamp(24px,2.4vw,30px); margin:0;}
.pk-no{font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold);}
.pk-price{font-family:var(--font-display); font-size:22px; color:var(--gold-lt); margin:0;}
.pk-price small{font-family:inherit; font-size:14px; opacity:.75;}
.pk-where{font-size:13px; opacity:.7; margin:0;}
.pk-body .btn{margin-top:auto; align-self:flex-start;}
@media (max-width:900px){ .pk-grid{grid-template-columns:1fr;} }
.pk-head h2{font-size:clamp(34px,4.4vw,58px); line-height:1.05;}

/* honeypot hidden */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden;}
.ww-pay{padding:72px 0;background:#0c0907;color:#f3ead8;text-align:center}
.ww-pay h2{font-family:'Bodoni Moda',serif;font-weight:400;font-size:clamp(28px,4vw,42px);margin:0 0 10px}
.ww-pay-sub{opacity:.75;margin:0 0 32px}
.ww-pay-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;max-width:1000px;margin:0 auto;align-items:start}
.ww-pay-btn{justify-content:center;width:100%;border:1px solid #c9a24b;color:#f3ead8;padding:16px 18px;border-radius:2px;text-decoration:none;font-size:15px}
.ww-pay-btn:hover{background:#c9a24b;color:#0c0907}
.ww-pay-note{font-size:13px;opacity:.7;margin:8px 0 0}
