:root{--black:#0a0a0a;--off-black:#141414;--grey-deep:#1c1c1c;--grey-dark:#2a2a2a;--grey:#6a6a6a;--grey-soft:#9a9a9a;--grey-light:#c4c4c4;--ivory:#f4f1ec;--off-white:#ebe7df;--white:#fff;--serif:'Cormorant','Times New Roman',serif;--display:'Cinzel','Trajan Pro',serif;--sans:'Manrope',system-ui,sans-serif}
*{margin:0;padding:0;box-sizing:border-box}
/* IMPORTANT: NO overflow-x:hidden — that breaks position:sticky in Safari */
/* Body matches the Collection background (#0a0a0a / var(--black)) so the stage
   fade-out doesn't briefly expose a darker color underneath — the handoff into
   Selected Pieces is seamless. */
html,body{background:var(--black);color:var(--ivory);font-family:var(--sans);-webkit-font-smoothing:antialiased}
body{font-weight:300;letter-spacing:.01em}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
::selection{background:var(--ivory);color:var(--black)}

nav.top{position:fixed;top:0;left:0;right:0;z-index:100;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:1.4rem 2.4rem;background:linear-gradient(to bottom,rgba(10,10,10,.7) 0%,rgba(10,10,10,0) 100%);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);transition:padding .4s ease,background .4s ease}
nav.top.scrolled{padding:.85rem 2.4rem;background:rgba(10,10,10,.94);border-bottom:1px solid rgba(255,255,255,.05)}
nav.top .left,nav.top .right{display:flex;gap:2.2rem;align-items:center}
nav.top .right{justify-content:flex-end}
nav.top a.link{font-family:var(--sans);font-size:.7rem;font-weight:400;letter-spacing:.26em;text-transform:uppercase;color:var(--off-white);opacity:.78;transition:opacity .3s ease;padding:.4rem 0;border-bottom:1px solid transparent}
nav.top a.link:hover{opacity:1;border-bottom-color:var(--off-white)}
nav.top .brand-logo{height:32px;opacity:.96}
nav.top.scrolled .brand-logo{height:26px}
nav.top .inquire{font-family:var(--sans);font-size:.68rem;font-weight:500;letter-spacing:.3em;text-transform:uppercase;padding:.65rem 1.3rem;border:1px solid rgba(244,241,236,.5);color:var(--ivory);transition:all .4s ease}
nav.top .inquire:hover{background:var(--ivory);color:var(--black);border-color:var(--ivory)}
@media (max-width:820px){nav.top{grid-template-columns:auto 1fr auto;padding:1rem 1.2rem}nav.top .left{display:none}nav.top .brand-logo{height:24px}nav.top .right a.link{display:none}nav.top .inquire{padding:.5rem .9rem;font-size:.6rem}}

/* CINEMATIC SECTION — uses position:fixed for the stage so it's bulletproof */
/* Shortened from 520vh → 200vh. Combined with the JS trigger that hides the stage at
   scrollProgress=1, the scene now transitions to the Collection without dead-scroll. */
.cinematic-scroll{position:relative;height:200vh;z-index:1}
.stage{
  position:fixed;
  top:0;left:0;
  width:100vw;height:100vh;
  overflow:hidden;
  z-index:1;
  background:radial-gradient(ellipse 80% 60% at 50% 22%,#3a2d1c 0%,#1f1810 28%,#0e0a06 58%,#040301 100%);
  /* Force its own compositing layer for perf */
  transform:translateZ(0);
  -webkit-transform:translateZ(0);
  will-change:transform;
}
/* .gone is now a "render-pause" flag only. Stage opacity is set inline from JS,
   tied directly to scrollProgress, so the cross-fade is continuous in both
   directions and we never get the stale 0.6s fade trapping a white flash. */
.stage.gone{pointer-events:none}
#scene-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.stage .vignette{position:absolute;inset:0;pointer-events:none;z-index:2;background:radial-gradient(ellipse at 50% 35%,transparent 35%,rgba(0,0,0,.5) 100%)}
.stage .grain{position:absolute;inset:0;pointer-events:none;z-index:3;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")}

.hero-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none;z-index:4;text-align:center;padding:0 1.5rem}
/* Heavier weights + multi-layer text-shadow give the hero text a solid edge
   against the bright sparkling diamonds behind it. Brand-color preserved. */
.hero-overlay .eyebrow{font-family:var(--sans);font-size:.7rem;font-weight:500;letter-spacing:.5em;text-transform:uppercase;color:var(--ivory);opacity:.92;margin-bottom:2.4rem;text-shadow:0 1px 4px rgba(0,0,0,.85),0 0 18px rgba(0,0,0,.55)}
.hero-overlay .wordmark-img{width:clamp(280px,42vw,540px);height:auto;margin:0 auto 2rem;filter:drop-shadow(0 2px 12px rgba(0,0,0,.55)) drop-shadow(0 0 28px rgba(255,255,255,.1))}
.hero-overlay .tagline{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1.05rem,1.55vw,1.3rem);color:var(--ivory);opacity:.96;letter-spacing:.03em;max-width:38ch;margin-bottom:.9rem;line-height:1.5;text-shadow:0 1px 6px rgba(0,0,0,.9),0 0 22px rgba(0,0,0,.6)}
.hero-overlay .location{font-family:var(--sans);font-size:.68rem;font-weight:500;letter-spacing:.42em;text-transform:uppercase;color:var(--ivory);opacity:.82;text-shadow:0 1px 4px rgba(0,0,0,.85),0 0 16px rgba(0,0,0,.5)}
/* Instagram link — sits at the bottom of the hero, same typographic language */
.hero-overlay .hero-ig{display:inline-flex;align-items:center;gap:.55rem;margin-top:2.6rem;padding:.55rem .9rem;border:1px solid rgba(244,241,236,.28);border-radius:2px;color:var(--ivory);font-family:var(--sans);font-size:.62rem;font-weight:500;letter-spacing:.34em;text-transform:uppercase;opacity:.82;pointer-events:auto;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);background:rgba(10,10,10,.18);transition:opacity .3s ease,border-color .3s ease,background .3s ease;text-shadow:0 1px 4px rgba(0,0,0,.7)}
.hero-overlay .hero-ig:hover{opacity:1;border-color:var(--ivory);background:rgba(10,10,10,.4)}
.hero-overlay .hero-ig svg{flex-shrink:0;opacity:.95}
/* Tighten letter-spacing on small viewports so the eyebrow and location lines don't wrap mid-word */
@media (max-width:540px){
  .hero-overlay .eyebrow{letter-spacing:.3em;font-size:.6rem;margin-bottom:1.8rem}
  .hero-overlay .location{letter-spacing:.28em;font-size:.6rem}
  .hero-overlay .wordmark-img{width:clamp(220px,68vw,360px)}
  .hero-overlay .tagline{font-size:1.02rem;max-width:30ch}
  .hero-overlay .hero-ig{font-size:.58rem;letter-spacing:.28em;margin-top:2rem;padding:.5rem .8rem}
}

.scroll-hint{position:absolute;bottom:2.4rem;left:50%;transform:translateX(-50%);font-family:var(--sans);font-size:.6rem;font-weight:400;letter-spacing:.55em;text-transform:uppercase;color:var(--grey-soft);opacity:.55;z-index:4;pointer-events:none}
.scroll-hint .line{display:block;width:1px;height:42px;margin:1rem auto 0;background:linear-gradient(to bottom,var(--grey-soft),transparent);animation:scrollPulse 2.4s ease-in-out infinite}
@keyframes scrollPulse{0%,100%{transform:scaleY(1);opacity:.6}50%{transform:scaleY(1.4);opacity:1}}
.flash-overlay{position:absolute;inset:0;background:var(--white);opacity:0;z-index:5;pointer-events:none}

/* DIAGNOSTIC HUD — hidden in production; append ?debug to URL to show */
.hud{position:fixed;left:0;right:0;bottom:0;z-index:9999;background:rgba(0,0,0,0.78);color:#9ad;font-family:'SF Mono',Menlo,Consolas,monospace;font-size:11px;letter-spacing:0.02em;padding:6px 12px;display:none;gap:18px;align-items:center;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-top:1px solid rgba(255,255,255,0.08);transition:transform .4s ease}
.hud.show{display:flex}
.hud.dismissed{transform:translateY(100%)}
.hud .item{display:flex;gap:6px;align-items:center}
.hud .item b{color:#fff;font-weight:500}
.hud .item .v{color:#5ec}
.hud .item.err .v{color:#f77}
.hud .item.warn .v{color:#fc7}
.hud .close{margin-left:auto;background:transparent;border:1px solid rgba(255,255,255,0.2);color:#aaa;padding:2px 8px;border-radius:3px;font-family:inherit;font-size:10px;cursor:pointer}
.hud .close:hover{background:rgba(255,255,255,0.05);color:#fff}

/* COLLECTION — sits above the fixed stage in z-order */
.collection{position:relative;background:var(--black);padding:8rem 2.4rem 6rem;min-height:100vh;z-index:10}
.collection::before{content:'';position:absolute;top:0;left:0;right:0;height:240px;background:radial-gradient(circle at 8% 22%,rgba(255,255,255,.9) 0,transparent 2.5px),radial-gradient(circle at 18% 8%,rgba(255,255,255,.65) 0,transparent 2px),radial-gradient(circle at 32% 30%,rgba(255,255,255,.8) 0,transparent 2.5px),radial-gradient(circle at 47% 14%,rgba(255,255,255,.55) 0,transparent 1.8px),radial-gradient(circle at 62% 28%,rgba(255,255,255,.75) 0,transparent 2px),radial-gradient(circle at 78% 10%,rgba(255,255,255,.9) 0,transparent 2.5px),radial-gradient(circle at 92% 24%,rgba(255,255,255,.6) 0,transparent 1.8px),linear-gradient(to bottom,rgba(255,255,255,.05),transparent);pointer-events:none}
.collection .strings{position:absolute;top:0;left:0;right:0;height:280px;pointer-events:none;opacity:.2}
.collection .strings svg{width:100%;height:100%}
.section-head{text-align:center;margin-bottom:5rem;position:relative;z-index:2}
.section-head .label{font-family:var(--sans);font-size:.66rem;letter-spacing:.5em;text-transform:uppercase;color:var(--grey-soft);margin-bottom:1.6rem}
.section-head h2{font-family:var(--display);font-weight:400;font-size:clamp(2.2rem,5vw,4rem);letter-spacing:.18em;text-transform:uppercase;color:var(--ivory);margin-bottom:1.2rem}
.section-head .sub{font-family:var(--serif);font-style:italic;font-weight:300;font-size:1.05rem;color:var(--grey-light);max-width:50ch;margin:0 auto;line-height:1.6;opacity:.78}
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem 2rem;max-width:1320px;margin:0 auto;position:relative;z-index:2}
@media (max-width:960px){.product-grid{grid-template-columns:repeat(2,1fr);gap:2rem 1.2rem}}
@media (max-width:560px){.product-grid{grid-template-columns:1fr}}
.product{cursor:pointer;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.product:hover{transform:translateY(-4px)}
.product .frame{position:relative;aspect-ratio:4/5;background:radial-gradient(ellipse at center,#2c2c2c 0%,#0d0d0d 75%);overflow:hidden;margin-bottom:1.4rem}
.product .frame::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,.6) 100%);pointer-events:none}
.product .frame .glow{position:absolute;inset:0;display:grid;place-items:center;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.product:hover .frame .glow{transform:scale(1.04) rotate(2deg)}
.product .frame svg{width:55%;height:auto;filter:drop-shadow(0 0 30px rgba(255,255,255,.4))}
.product .meta{display:flex;justify-content:space-between;align-items:baseline;padding:0 .1rem}
.product .meta .name{font-family:var(--serif);font-weight:400;font-size:1.05rem;color:var(--ivory);letter-spacing:.02em}
.product .meta .price{font-family:var(--sans);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--grey-light)}
.product .meta .price.inquire{color:var(--grey-soft);font-style:italic;letter-spacing:.06em;text-transform:none;font-family:var(--serif);font-size:.95rem}
.product .sub-meta{font-family:var(--sans);font-size:.62rem;letter-spacing:.32em;text-transform:uppercase;color:var(--grey);margin-top:.4rem}

footer.site{position:relative;z-index:10;background:var(--black);color:var(--grey-light);padding:6rem 2.4rem 3rem;border-top:1px solid rgba(255,255,255,.05)}
footer.site .inner{max-width:1320px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem}
@media (max-width:820px){footer.site .inner{grid-template-columns:1fr 1fr;gap:2.4rem}}
footer.site .brand-block .footer-logo{height:36px;margin-bottom:1.2rem;opacity:.95}
footer.site .brand-block p{font-family:var(--serif);font-style:italic;font-size:.98rem;line-height:1.7;color:var(--grey-light);max-width:38ch;opacity:.72}
footer.site h4{font-family:var(--sans);font-size:.66rem;letter-spacing:.32em;text-transform:uppercase;color:var(--grey-soft);margin-bottom:1.4rem;font-weight:500}
footer.site ul{list-style:none}
footer.site ul li{margin-bottom:.7rem}
footer.site ul li a{font-family:var(--sans);font-size:.85rem;color:var(--grey-light);opacity:.75;transition:opacity .3s}
footer.site ul li a:hover{opacity:1}
footer.site .bottom{max-width:1320px;margin:4rem auto 0;padding-top:2rem;border-top:1px solid rgba(255,255,255,.06);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
footer.site .bottom span{font-family:var(--sans);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--grey)}

.loader{position:fixed;inset:0;background:var(--black);z-index:1000;display:grid;place-items:center;transition:opacity 1.2s ease}
.loader.done{opacity:0;pointer-events:none}
.loader img{height:48px;opacity:0;animation:loaderFade 2.4s ease-in-out infinite}
@keyframes loaderFade{0%,100%{opacity:.3}50%{opacity:1}}

.webgl-error{position:absolute;inset:0;z-index:6;display:none;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(ellipse at center,#1a1a1a 0%,#050505 100%);color:var(--ivory);text-align:center;padding:2rem}
.webgl-error.show{display:flex}
.webgl-error .e-mark{height:60px;opacity:.6;margin-bottom:2rem}
.webgl-error h3{font-family:var(--display);font-weight:400;font-size:1.4rem;letter-spacing:.3em;text-transform:uppercase;margin-bottom:1rem}
.webgl-error p{font-family:var(--serif);font-style:italic;font-size:1rem;max-width:40ch;opacity:.7;line-height:1.6}
.webgl-error code{font-family:monospace;font-size:.85rem;opacity:.5;margin-top:1rem;max-width:80ch;word-break:break-word}

/* ===== EXHIBITION SECTIONS ===== */
.section-divider{position:relative;z-index:10;height:1px;max-width:1320px;margin:0 auto;background:linear-gradient(to right,transparent,rgba(255,255,255,.08) 20%,rgba(255,255,255,.08) 80%,transparent)}

.exhibition{position:relative;z-index:10;background:var(--black);padding:7rem 2.4rem 6rem}
.exhibition .inner{max-width:1320px;margin:0 auto}
@media (max-width:820px){.exhibition{padding:5rem 1.4rem 4rem}}

/* Gallery — asymmetric editorial grid */
#gallery{background:linear-gradient(180deg,var(--black) 0%,#080706 100%)}
.gallery-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:120px;gap:1.2rem;margin-top:4rem}
@media (max-width:820px){.gallery-grid{grid-template-columns:repeat(6,1fr);grid-auto-rows:90px;gap:.8rem}}
.gal{position:relative;overflow:hidden;background:radial-gradient(ellipse at center,#2a2622 0%,#0a0807 80%);cursor:pointer;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.gal:hover{transform:scale(1.01)}
.gal::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 30%,rgba(0,0,0,.55) 100%);pointer-events:none}
.gal .gal-shine{position:absolute;inset:0;display:grid;place-items:center;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.gal:hover .gal-shine{transform:scale(1.06) rotate(3deg)}
.gal .gal-shine svg{width:46%;height:auto;filter:drop-shadow(0 0 38px rgba(255,235,200,.45)) drop-shadow(0 0 10px rgba(255,255,255,.3))}
.gal .gal-caption{position:absolute;left:1.4rem;right:1.4rem;bottom:1.2rem;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;color:var(--ivory);opacity:.92}
.gal .gal-caption .t{font-family:var(--serif);font-size:1.05rem;letter-spacing:.02em;line-height:1.25}
.gal .gal-caption .t small{display:block;font-family:var(--sans);font-size:.58rem;letter-spacing:.34em;text-transform:uppercase;color:var(--grey-soft);margin-bottom:.4rem;font-weight:400}
.gal .gal-caption .n{font-family:var(--sans);font-size:.62rem;letter-spacing:.3em;text-transform:uppercase;color:var(--grey-soft);white-space:nowrap}
.gal.tall{grid-row:span 4}
.gal.wide{grid-column:span 6;grid-row:span 3}
.gal.square{grid-column:span 4;grid-row:span 3}
.gal.feature{grid-column:span 8;grid-row:span 5}
.gal.slim{grid-column:span 4;grid-row:span 2}
.gal.med{grid-column:span 4;grid-row:span 3}
.gal.full{grid-column:span 12;grid-row:span 4}
@media (max-width:820px){
  .gal.tall,.gal.wide,.gal.square,.gal.feature,.gal.slim,.gal.med,.gal.full{grid-column:span 6;grid-row:span 3}
  .gal.feature{grid-row:span 4}
  .gal .gal-caption .t{font-size:.92rem}
}

/* About */
#about{background:linear-gradient(180deg,#080706 0%,var(--off-black) 100%)}
.about-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:5rem;align-items:start;margin-top:4rem}
@media (max-width:820px){.about-grid{grid-template-columns:1fr;gap:3rem}}
.about-grid .lede{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(1.4rem,2.1vw,1.85rem);line-height:1.55;color:var(--off-white);letter-spacing:.005em}
.about-grid .lede::before{content:'';display:block;width:48px;height:1px;background:var(--ivory);opacity:.5;margin-bottom:1.8rem}
.about-grid .body p{font-family:var(--serif);font-weight:300;font-size:1.08rem;line-height:1.85;color:var(--grey-light);margin-bottom:1.3rem;opacity:.88}
.about-grid .signature{margin-top:2rem;font-family:var(--serif);font-style:italic;font-size:1.1rem;color:var(--off-white);opacity:.85}
.about-grid .signature small{display:block;font-family:var(--sans);font-size:.6rem;letter-spacing:.4em;text-transform:uppercase;color:var(--grey-soft);margin-top:.5rem;font-style:normal}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:5rem;padding-top:4rem;border-top:1px solid rgba(255,255,255,.07)}
@media (max-width:820px){.pillars{grid-template-columns:1fr;gap:2.4rem}}
.pillar h4{font-family:var(--display);font-size:.85rem;font-weight:500;letter-spacing:.34em;text-transform:uppercase;color:var(--ivory);margin-bottom:1rem}
.pillar .pillar-num{font-family:var(--display);font-size:.7rem;letter-spacing:.4em;color:var(--grey-soft);margin-bottom:1.4rem;display:block}
.pillar p{font-family:var(--serif);font-style:italic;font-size:1rem;line-height:1.7;color:var(--grey-light);opacity:.78}

/* Commission */
#commission{background:linear-gradient(180deg,var(--off-black) 0%,#0e0c0a 100%)}
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;margin-top:5rem;counter-reset:step}
@media (max-width:820px){.process{grid-template-columns:1fr 1fr;gap:1.4rem}}
@media (max-width:520px){.process{grid-template-columns:1fr}}
.step{padding:2.2rem 1.6rem 2rem;border:1px solid rgba(255,255,255,.07);background:linear-gradient(180deg,rgba(255,255,255,.015) 0%,transparent 100%);position:relative}
.step .step-num{font-family:var(--display);font-size:.7rem;letter-spacing:.4em;color:var(--grey-soft);margin-bottom:1.4rem}
.step h4{font-family:var(--serif);font-weight:400;font-size:1.25rem;color:var(--ivory);margin-bottom:.9rem;letter-spacing:.01em}
.step p{font-family:var(--serif);font-style:italic;font-size:.95rem;line-height:1.65;color:var(--grey-light);opacity:.8}

/* Booking form */
#book{background:linear-gradient(180deg,#0e0c0a 0%,var(--black) 100%)}
.book-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;margin-top:4rem;align-items:start}
@media (max-width:820px){.book-grid{grid-template-columns:1fr;gap:2.5rem}}
.book-info p{font-family:var(--serif);font-size:1.05rem;line-height:1.75;color:var(--grey-light);margin-bottom:1.2rem;opacity:.82}
.book-info .info-row{display:flex;gap:.8rem;align-items:baseline;padding:1.2rem 0;border-bottom:1px solid rgba(255,255,255,.06);font-family:var(--sans);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase}
.book-info .info-row .l{color:var(--grey-soft);min-width:90px;font-size:.62rem;letter-spacing:.32em}
.book-info .info-row .v{color:var(--ivory);text-transform:none;letter-spacing:.04em;font-size:.88rem}
.book-info .info-row .v a{border-bottom:1px solid rgba(255,255,255,.18);padding-bottom:2px;transition:border-color .3s}
.book-info .info-row .v a:hover{border-bottom-color:var(--ivory)}
form.book-form{display:flex;flex-direction:column;gap:1.4rem}
form.book-form .row{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem}
@media (max-width:560px){form.book-form .row{grid-template-columns:1fr}}
form.book-form label{display:flex;flex-direction:column;gap:.5rem;font-family:var(--sans);font-size:.6rem;letter-spacing:.32em;text-transform:uppercase;color:var(--grey-soft)}
form.book-form input,form.book-form select,form.book-form textarea{background:transparent;border:none;border-bottom:1px solid rgba(255,255,255,.18);color:var(--ivory);font-family:var(--serif);font-size:1.05rem;font-weight:300;padding:.6rem 0;outline:none;transition:border-color .3s;letter-spacing:.01em}
form.book-form input:focus,form.book-form select:focus,form.book-form textarea:focus{border-bottom-color:var(--ivory)}
form.book-form select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' stroke='%23c4c4c4' fill='none' stroke-width='1'/></svg>");background-repeat:no-repeat;background-position:right .4rem center;padding-right:1.6rem;cursor:pointer}
form.book-form select option{background:var(--off-black);color:var(--ivory)}
form.book-form textarea{resize:vertical;min-height:90px;font-family:var(--serif);line-height:1.55}
form.book-form button{margin-top:1rem;font-family:var(--sans);font-size:.68rem;font-weight:500;letter-spacing:.34em;text-transform:uppercase;padding:1.1rem 2rem;border:1px solid var(--ivory);background:transparent;color:var(--ivory);cursor:pointer;transition:all .4s ease;align-self:flex-start}
form.book-form button:hover{background:var(--ivory);color:var(--black)}
form.book-form button:focus-visible{outline:2px solid var(--ivory);outline-offset:3px}
form.book-form button:disabled{opacity:.5;cursor:not-allowed}
form.book-form .form-note{font-family:var(--serif);font-style:italic;font-size:.88rem;color:var(--grey-soft);opacity:.7;margin-top:.6rem}

/* CALL CTA — prominent tap-to-call block at the top of the booking section.
   Same dark-luxury treatment as the rest of the page. Generous touch target. */
.call-cta{display:flex;flex-direction:column;align-items:center;gap:.9rem;max-width:520px;margin:0 auto 4rem;padding:2.2rem 2rem;border:1px solid rgba(244,241,236,.22);background:linear-gradient(180deg,rgba(255,255,255,.02) 0%,transparent 100%);color:var(--ivory);text-align:center;text-decoration:none;transition:border-color .35s ease,background .35s ease,transform .35s cubic-bezier(.2,.7,.2,1)}
.call-cta:hover{border-color:var(--ivory);background:linear-gradient(180deg,rgba(255,255,255,.045) 0%,transparent 100%);transform:translateY(-1px)}
.call-cta:focus-visible{outline:2px solid var(--ivory);outline-offset:4px}
.call-cta-label{font-family:var(--sans);font-size:.66rem;font-weight:500;letter-spacing:.4em;text-transform:uppercase;color:var(--grey-soft)}
.call-cta-number{display:inline-flex;align-items:center;gap:.85rem;font-family:var(--display);font-size:clamp(1.5rem,3vw,2.1rem);font-weight:500;letter-spacing:.16em;color:var(--ivory)}
.call-cta-number svg{flex-shrink:0;opacity:.85}
.call-cta-note{font-family:var(--serif);font-style:italic;font-size:.92rem;color:var(--grey-light);opacity:.78}
@media (max-width:540px){
  .call-cta{padding:1.8rem 1.2rem;gap:.7rem;margin-bottom:3rem}
  .call-cta-label{font-size:.6rem;letter-spacing:.32em}
  .call-cta-number{font-size:1.45rem;gap:.65rem;letter-spacing:.12em}
  .call-cta-number svg{width:16px;height:16px}
  .call-cta-note{font-size:.85rem}
}

/* Journal */
#journal{background:linear-gradient(180deg,var(--black) 0%,#0a0907 100%)}
.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2.6rem;margin-top:4rem}
@media (max-width:820px){.journal-grid{grid-template-columns:1fr;gap:2.4rem}}
.entry{cursor:pointer;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.entry:hover{transform:translateY(-3px)}
.entry .entry-img{position:relative;aspect-ratio:4/3;background:radial-gradient(ellipse at 60% 35%,#2c241b 0%,#0a0806 90%);overflow:hidden;margin-bottom:1.5rem}
.entry .entry-img::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 60% 35%,transparent 35%,rgba(0,0,0,.65) 100%)}
.entry .entry-img .shine{position:absolute;inset:0;display:grid;place-items:center}
.entry .entry-img .shine svg{width:38%;filter:drop-shadow(0 0 30px rgba(255,230,190,.4))}
.entry .meta{font-family:var(--sans);font-size:.6rem;letter-spacing:.34em;text-transform:uppercase;color:var(--grey-soft);margin-bottom:.8rem;display:flex;gap:1rem;align-items:center}
.entry .meta .dot{width:3px;height:3px;border-radius:50%;background:var(--grey-soft);opacity:.5}
.entry h3{font-family:var(--serif);font-weight:400;font-size:1.5rem;line-height:1.3;color:var(--ivory);margin-bottom:.8rem;letter-spacing:.005em}
.entry p{font-family:var(--serif);font-style:italic;font-size:1rem;line-height:1.6;color:var(--grey-light);opacity:.78}
.entry .read{display:inline-block;margin-top:1.2rem;font-family:var(--sans);font-size:.62rem;letter-spacing:.34em;text-transform:uppercase;color:var(--off-white);opacity:.78;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:3px;transition:opacity .3s,border-color .3s}
.entry:hover .read{opacity:1;border-bottom-color:var(--ivory)}

/* VIP */
#vip{background:linear-gradient(180deg,#0a0907 0%,#100c08 60%,#0a0807 100%);position:relative;overflow:hidden}
#vip::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 50% at 50% 30%,rgba(180,140,90,.06) 0%,transparent 70%);pointer-events:none}
.vip-inner{position:relative;z-index:2;text-align:center;max-width:780px;margin:0 auto}
.vip-mark{font-family:var(--display);font-size:.7rem;letter-spacing:.45em;color:var(--grey-soft);margin-bottom:1.6rem}
.vip-h{font-family:var(--display);font-weight:400;font-size:clamp(2rem,4vw,3.4rem);letter-spacing:.18em;text-transform:uppercase;color:var(--ivory);margin-bottom:2rem;line-height:1.2}
.vip-h em{font-family:var(--serif);font-style:italic;font-weight:300;text-transform:none;letter-spacing:0;color:var(--off-white)}
.vip-sub{font-family:var(--serif);font-style:italic;font-size:1.15rem;line-height:1.65;color:var(--grey-light);max-width:54ch;margin:0 auto 3rem;opacity:.85}
.vip-perks{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin:0 auto 3.5rem;text-align:left}
@media (max-width:820px){.vip-perks{grid-template-columns:1fr;gap:1.2rem}}
.perk{padding:1.6rem 1.4rem;border:1px solid rgba(255,255,255,.07);background:linear-gradient(180deg,rgba(255,230,190,.025) 0%,transparent 100%)}
.perk .perk-mark{font-family:var(--display);font-size:.6rem;letter-spacing:.4em;color:var(--grey-soft);margin-bottom:.8rem;display:block}
.perk h5{font-family:var(--serif);font-weight:400;font-size:1.1rem;color:var(--ivory);margin-bottom:.5rem}
.perk p{font-family:var(--serif);font-style:italic;font-size:.92rem;line-height:1.55;color:var(--grey-light);opacity:.78}
.vip-cta{display:inline-block;font-family:var(--sans);font-size:.7rem;font-weight:500;letter-spacing:.36em;text-transform:uppercase;padding:1.2rem 2.6rem;border:1px solid var(--ivory);color:var(--ivory);transition:all .4s ease;cursor:pointer}
.vip-cta:hover{background:var(--ivory);color:var(--black)}

/* ===== PAGE HEADER (for sub-pages without the cinematic hero) ===== */
.page-header{position:relative;z-index:10;min-height:62vh;display:flex;align-items:center;justify-content:center;padding:9rem 2.4rem 5rem;background:radial-gradient(ellipse 70% 60% at 50% 42%,#26201a 0%,#120e09 45%,#070503 100%);overflow:hidden;border-bottom:1px solid rgba(255,255,255,.05)}
.page-header::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 14% 18%,rgba(255,255,255,.55) 0,transparent 2px),radial-gradient(circle at 28% 8%,rgba(255,255,255,.4) 0,transparent 1.6px),radial-gradient(circle at 46% 22%,rgba(255,255,255,.55) 0,transparent 2px),radial-gradient(circle at 64% 12%,rgba(255,255,255,.35) 0,transparent 1.5px),radial-gradient(circle at 78% 26%,rgba(255,255,255,.5) 0,transparent 1.8px),radial-gradient(circle at 92% 9%,rgba(255,255,255,.45) 0,transparent 1.6px);pointer-events:none;opacity:.7}
.page-header::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 60% 40% at 50% 50%,rgba(255,220,160,.05) 0%,transparent 70%);pointer-events:none}
.page-header-inner{position:relative;z-index:2;text-align:center;max-width:720px;margin:0 auto}
.page-header .label{font-family:var(--sans);font-size:.66rem;letter-spacing:.5em;text-transform:uppercase;color:var(--grey-soft);margin-bottom:1.6rem;opacity:.85}
.page-header h1{font-family:var(--display);font-weight:400;font-size:clamp(2.4rem,5.5vw,4.4rem);letter-spacing:.18em;text-transform:uppercase;color:var(--ivory);margin-bottom:1.6rem;line-height:1.15}
.page-header .sub{font-family:var(--serif);font-style:italic;font-weight:300;font-size:clamp(1.05rem,1.5vw,1.2rem);color:var(--grey-light);max-width:54ch;margin:0 auto;line-height:1.65;opacity:.82}
@media (max-width:820px){.page-header{min-height:50vh;padding:7rem 1.4rem 4rem}}

/* Active nav state */
nav.top a.link.active{opacity:1;border-bottom-color:var(--off-white)}

/* Subpage body background — no fixed cinematic stage to fall back on */
body.subpage{background:var(--black)}

/* Reduced motion — gracefully tone down the heavy animation */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  .scroll-hint .line{animation:none}
  .loader img{animation:none;opacity:1}
}