@charset "UTF-8";
/* =============================================================
   STUDIO VAIBHAVA — "Midnight Champagne" design system
   Cormorant Garamond · Italiana · Jost
   ============================================================= */

/* ---------- 1. Tokens ---------- */
:root{
  /* surfaces */
  --ink:#08080A;
  --ink-soft:#0F0F12;
  --ink-warm:#15110C;
  --ink-glass:rgba(8,8,10,.72);

  /* light surfaces */
  --sand:#F6F1E8;
  --sand-2:#EDE4D6;

  /* type colours */
  --ivory:#F5F0E8;
  --ivory-dim:#B5ADA0;
  --muted:#7E786E;

  /* champagne */
  --gold:#C8A96B;
  --gold-hi:#EBD9AE;
  --gold-deep:#8B7340;
  --gold-grad:linear-gradient(100deg,#8B7340 0%,#C8A96B 24%,#EBD9AE 50%,#C8A96B 76%,#8B7340 100%);

  --line:rgba(245,240,232,.14);
  --line-strong:rgba(245,240,232,.28);
  --line-dark:rgba(8,8,10,.14);

  /* fonts */
  --f-display:"Cormorant Garamond",'Times New Roman',Times,serif;
  --f-logo:"Italiana","Cormorant Garamond",serif;
  --f-ui:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;

  /* rhythm */
  --gut:clamp(20px,4vw,64px);
  --sec:clamp(72px,10vw,150px);
  --maxw:1440px;
  --maxw-narrow:920px;

  /* motion */
  --e-out:cubic-bezier(.16,1,.3,1);
  --e-io:cubic-bezier(.65,0,.35,1);
  --t:.6s var(--e-out);

  --hdr-h:88px;
}

/* ---------- 2. Reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html:focus-within{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--ink);
  color:var(--ivory);
  font-family:var(--f-ui);
  font-weight:300;
  font-size:16px;
  line-height:1.75;
  letter-spacing:.012em;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}
body.no-scroll{overflow:hidden}
[hidden]{display:none !important}
img,svg,video{display:block;max-width:100%}
img{height:auto;border:0}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;cursor:pointer;padding:0}
ul,ol{list-style:none;margin:0;padding:0}
h1,h2,h3,h4,h5,p,figure,blockquote{margin:0}
hr{border:0;border-top:1px solid var(--line);margin:0}
::selection{background:var(--gold);color:#0A0A0C}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* scrollbar */
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:#0B0B0E}
::-webkit-scrollbar-thumb{background:#2E2A22;border-radius:9px}
::-webkit-scrollbar-thumb:hover{background:var(--gold-deep)}

/* ---------- 3. Typography ---------- */
.display{
  font-family:var(--f-display);
  font-weight:300;
  line-height:1.02;
  letter-spacing:-.012em;
  text-wrap:balance;
}
.d1{font-size:clamp(2.6rem,9.2vw,8.4rem)}
.d2{font-size:clamp(2.5rem,6.2vw,5.3rem)}
.d3{font-size:clamp(2rem,4.2vw,3.5rem)}
.d4{font-size:clamp(1.5rem,2.5vw,2.2rem)}
.display em{font-style:italic;color:var(--gold-hi)}
.display .thin{font-weight:200}

.eyebrow{
  font-family:var(--f-ui);
  font-size:clamp(.62rem,.85vw,.72rem);
  font-weight:400;
  letter-spacing:.42em;
  text-transform:uppercase;
  color:var(--gold);
  line-height:1;
  display:inline-flex;
  align-items:center;
  gap:14px;
}
.eyebrow::before,.eyebrow::after{
  content:"";width:34px;height:1px;background:currentColor;opacity:.55;
}
.eyebrow--l::after{display:none}
.eyebrow--l::before{width:26px}
.eyebrow--plain::before,.eyebrow--plain::after{display:none}

.lead{
  font-size:clamp(1rem,1.35vw,1.15rem);
  color:var(--ivory-dim);
  line-height:1.9;
  font-weight:300;
}
.body-copy p+p{margin-top:1.15em}
.body-copy p{color:var(--ivory-dim);line-height:1.95}
.body-copy strong{color:var(--ivory);font-weight:400}

.script{
  font-family:var(--f-display);
  font-style:italic;
  font-weight:300;
  color:var(--gold-hi);
  font-size:clamp(1.25rem,2.4vw,1.9rem);
  line-height:1.4;
}
.gold-text{
  background:var(--gold-grad);
  -webkit-background-clip:text;background-clip:text;
  color:transparent;
}

/* ---------- 4. Layout ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}
.wrap--narrow{max-width:var(--maxw-narrow)}
.wrap--wide{max-width:1720px}
.section{padding-block:var(--sec);position:relative}
.section--tight{padding-block:clamp(52px,6vw,88px)}
.section--light{background:var(--sand);color:#161310}
.section--light .lead,.section--light .body-copy p{color:#5A5248}
.section--light .eyebrow{color:#8B7340}
.section--light .display,.section--light h2,.section--light h3,.section--light h4{color:#161310}
.section--light .display em,.section--light .script,.section--light .tlink{color:#8B7340}
.section--light .rule{background:linear-gradient(#8B7340,transparent)}
.section--light .btn{--fg:#1D1A15;--bd:rgba(29,26,21,.25)}
.section--light .btn--solid{--fg:#0A0A0C}
.section--light .story__meta,.section--light .mini-stats small,.section--light .field label{color:#877F72}
.section--warm{background:var(--ink-warm)}
.section--soft{background:var(--ink-soft)}
.grid{display:grid;gap:clamp(20px,3vw,44px)}
.center{text-align:center}
.sec-head{display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center;margin-bottom:clamp(44px,6vw,80px)}
.sec-head .lead{max-width:62ch}
.sec-head--left{align-items:flex-start;text-align:left}

/* thin decorative rule */
.rule{width:1px;height:clamp(48px,7vw,92px);background:linear-gradient(var(--gold),transparent);margin-inline:auto}
.rule--dark{background:linear-gradient(var(--gold-deep),transparent)}

/* ---------- 5. Buttons ---------- */
.btn{
  --bg:transparent;--fg:var(--ivory);--bd:var(--line-strong);
  position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;
  padding:17px 38px;
  font-size:.7rem;font-weight:400;letter-spacing:.28em;text-transform:uppercase;
  color:var(--fg);background:var(--bg);
  border:1px solid var(--bd);
  overflow:hidden;isolation:isolate;
  transition:color .5s var(--e-out),border-color .5s var(--e-out);
  white-space:nowrap;
}
.btn::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:var(--gold-grad);
  transform:translateY(101%);
  transition:transform .55s var(--e-out);
}
.btn:hover{color:#0A0A0C;border-color:transparent}
.btn:hover::before{transform:translateY(0)}
.btn--gold{--bd:var(--gold);--fg:var(--gold)}
.btn--solid{--fg:#0A0A0C;--bd:transparent;background:var(--gold-grad)}
.btn--solid::before{background:var(--ivory)}
.btn--solid:hover{color:#0A0A0C}
.btn--ghost-dark{--fg:#1A1712;--bd:rgba(26,23,18,.28)}
.btn--sm{padding:13px 26px;font-size:.62rem;letter-spacing:.24em}
.btn--lg{padding:20px 50px}

/* text link with sliding underline */
.tlink{
  position:relative;display:inline-flex;align-items:center;gap:11px;
  font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);
  padding-bottom:7px;
}
.tlink::after{
  content:"";position:absolute;left:0;bottom:0;height:1px;width:100%;
  background:currentColor;transform-origin:right;transform:scaleX(1);
  transition:transform .5s var(--e-out);
}
.tlink:hover::after{transform-origin:left;animation:sweep .6s var(--e-out)}
@keyframes sweep{0%{transform:scaleX(1);transform-origin:right}49%{transform:scaleX(0);transform-origin:right}50%{transform:scaleX(0);transform-origin:left}100%{transform:scaleX(1);transform-origin:left}}
.tlink svg{width:15px;height:15px;transition:transform .45s var(--e-out)}
.tlink:hover svg{transform:translateX(6px)}
.tlink--dark{color:#5C4A24}

/* ---------- 6. Preloader ---------- */
#preload{
  position:fixed;inset:0;z-index:9999;background:var(--ink);
  display:grid;place-items:center;gap:0;
  transition:opacity .8s var(--e-out),visibility .8s;
}
#preload.done{opacity:0;visibility:hidden}
.pl-inner{display:flex;flex-direction:column;align-items:center;gap:26px}
.pl-mark{
  font-family:var(--f-logo);font-size:clamp(1.15rem,4vw,2.6rem);
  letter-spacing:.3em;text-indent:.3em;color:var(--ivory);
  text-align:center;padding-inline:20px;
  opacity:0;animation:plIn 1.1s var(--e-out) .12s forwards;
}
.pl-sub{font-size:.6rem;letter-spacing:.5em;text-transform:uppercase;color:var(--gold);opacity:0;animation:plIn 1s var(--e-out) .32s forwards}
.pl-bar{width:min(230px,44vw);height:1px;background:var(--line);position:relative;overflow:hidden}
.pl-bar i{position:absolute;inset:0;background:var(--gold-grad);transform:translateX(-100%);animation:plBar 1.6s var(--e-io) infinite}
@keyframes plIn{to{opacity:1}}
@keyframes plBar{0%{transform:translateX(-100%)}55%{transform:translateX(0)}100%{transform:translateX(100%)}}

/* ---------- 7. Header ---------- */
.hdr{
  position:fixed;top:0;left:0;right:0;z-index:800;
  height:var(--hdr-h);
  display:flex;align-items:center;
  transition:height .45s var(--e-out),background-color .45s var(--e-out),border-color .45s var(--e-out),backdrop-filter .45s;
  border-bottom:1px solid transparent;
}
.hdr::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(to bottom,rgba(8,8,10,.78),rgba(8,8,10,0));
  transition:opacity .45s var(--e-out);
}
.hdr.is-stuck{height:70px;background:var(--ink-glass);backdrop-filter:blur(16px) saturate(140%);border-bottom-color:var(--line)}
.hdr.is-stuck::before{opacity:0}
.hdr.is-hidden{transform:translateY(-100%);transition:transform .5s var(--e-out)}
.hdr__in{width:100%;max-width:1720px;margin-inline:auto;padding-inline:var(--gut);display:flex;align-items:center;justify-content:space-between;gap:28px}

.brand{display:flex;flex-direction:column;gap:5px;line-height:1;flex-shrink:0}
.brand__name{font-family:var(--f-logo);font-size:clamp(1.05rem,1.7vw,1.4rem);letter-spacing:.24em;text-indent:.24em;color:var(--ivory);white-space:nowrap}
.brand__tag{font-size:.5rem;letter-spacing:.42em;text-transform:uppercase;color:var(--gold);white-space:nowrap;opacity:.9}
.hdr.is-stuck .brand__tag{opacity:.75}

.nav{display:flex;align-items:center;gap:clamp(16px,2vw,34px)}
.nav__item{position:relative}
.nav__link{
  position:relative;display:inline-flex;align-items:center;gap:7px;
  font-size:.68rem;font-weight:400;letter-spacing:.24em;text-transform:uppercase;
  color:var(--ivory);padding:11px 0;white-space:nowrap;
  transition:color .4s var(--e-out);
}
.nav__link::after{
  content:"";position:absolute;left:0;right:0;bottom:4px;height:1px;
  background:var(--gold);transform:scaleX(0);transform-origin:right;
  transition:transform .45s var(--e-out);
}
.nav__item:hover>.nav__link,.nav__link.is-active{color:var(--gold-hi)}
.nav__item:hover>.nav__link::after,.nav__link.is-active::after{transform:scaleX(1);transform-origin:left}
.nav__link .caret{width:8px;height:8px;transition:transform .4s var(--e-out);opacity:.7}
.nav__item:hover .caret{transform:rotate(180deg)}

.drop{
  position:absolute;top:100%;left:50%;translate:-50% 0;
  min-width:250px;padding:14px;
  background:rgba(13,13,16,.96);backdrop-filter:blur(18px);
  border:1px solid var(--line);
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:opacity .4s var(--e-out),transform .4s var(--e-out),visibility .4s;
  box-shadow:0 30px 70px -20px rgba(0,0,0,.85);
}
.nav__item:hover .drop{opacity:1;visibility:visible;transform:translateY(0)}
.drop a{
  display:flex;align-items:center;gap:12px;padding:11px 14px;
  font-size:.72rem;letter-spacing:.13em;text-transform:uppercase;color:var(--ivory-dim);
  transition:color .35s,background-color .35s,padding-left .35s var(--e-out);
}
.drop a::before{content:"";width:0;height:1px;background:var(--gold);transition:width .35s var(--e-out)}
.drop a:hover{color:var(--gold-hi);background:rgba(200,169,107,.07);padding-left:18px}
.drop a:hover::before{width:14px}
.drop__head{
  display:block;padding:14px 14px 7px;margin-top:4px;
  font-size:.55rem;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);
  border-top:1px solid var(--line);
}
.drop__head:first-child{border-top:0;margin-top:0;padding-top:8px}
.mnav__sub .drop__head{padding:12px 0 4px;border-top:0}

/* answer blocks: short, factual, quotable — the shape answer engines lift */
.facts{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.fact{background:var(--ink);padding:clamp(24px,3vw,38px);display:flex;flex-direction:column;gap:10px}
.section--soft .fact{background:var(--ink-soft)}
.section--warm .fact{background:var(--ink-warm)}
.fact dt{font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin:0}
.fact dd{margin:0;color:var(--ivory-dim);font-size:.95rem;line-height:1.9}
.fact dd strong{color:var(--ivory);font-weight:400}

.venues{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.venue{background:var(--ink);padding:clamp(22px,2.6vw,32px);display:flex;flex-direction:column;gap:8px;transition:background-color .5s}
.section--soft .venue{background:var(--ink-soft)}
.venue:hover{background:rgba(200,169,107,.05)}
.venue b{font-family:var(--f-display);font-size:clamp(1.15rem,1.7vw,1.4rem);font-weight:300;color:var(--ivory)}
.venue small{font-size:.58rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold)}
.venue a{font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ivory-dim);margin-top:4px}
.venue a:hover{color:var(--gold-hi)}
@media (max-width:1024px){.facts,.venues{grid-template-columns:1fr}}

.hdr__cta{display:flex;align-items:center;gap:18px;flex-shrink:0}
.hdr__phone{display:inline-flex;align-items:center;gap:9px;font-size:.68rem;letter-spacing:.16em;color:var(--ivory-dim);transition:color .4s}
.hdr__phone:hover{color:var(--gold-hi)}
.hdr__phone svg{width:14px;height:14px;color:var(--gold)}

/* burger */
.burger{display:none;width:44px;height:44px;position:relative;flex-shrink:0}
.burger span{position:absolute;left:11px;width:22px;height:1px;background:var(--ivory);transition:transform .45s var(--e-out),opacity .3s,width .45s var(--e-out)}
.burger span:nth-child(1){top:17px}
.burger span:nth-child(2){top:22px;width:15px}
.burger span:nth-child(3){top:27px}
.burger.is-open span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.burger.is-open span:nth-child(2){opacity:0}
.burger.is-open span:nth-child(3){transform:translateY(-5px) rotate(-45deg);width:22px}

/* mobile drawer */
.mnav{
  position:fixed;inset:0;z-index:790;background:var(--ink);
  padding:calc(var(--hdr-h) + 26px) var(--gut) 40px;
  overflow-y:auto;
  clip-path:inset(0 0 100% 0);
  transition:clip-path .75s var(--e-out);
  display:flex;flex-direction:column;
}
.mnav.is-open{clip-path:inset(0 0 0 0)}
.mnav__list{display:flex;flex-direction:column;gap:2px;flex:1}
.mnav__list>li{border-bottom:1px solid var(--line);opacity:0;transform:translateY(22px)}
.mnav.is-open .mnav__list>li{animation:mIn .7s var(--e-out) forwards;animation-delay:calc(.16s + var(--i,0)*.055s)}
@keyframes mIn{to{opacity:1;transform:none}}
.mnav__link{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:19px 2px;font-family:var(--f-display);font-size:1.85rem;font-weight:300;color:var(--ivory);
}
.mnav__link small{font-family:var(--f-ui);font-size:.55rem;letter-spacing:.3em;color:var(--gold);text-transform:uppercase}
.mnav__sub{padding:0 2px 16px;display:none;flex-direction:column;gap:9px}
.mnav__sub.is-open{display:flex}
.mnav__sub a{font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ivory-dim);padding:5px 0}
.mnav__foot{margin-top:32px;display:flex;flex-direction:column;gap:18px;opacity:0}
.mnav.is-open .mnav__foot{animation:mIn .7s var(--e-out) .55s forwards}
.mnav__social{display:flex;gap:20px}
.mnav__social a{font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}

/* ---------- 8. Hero ---------- */
.hero{position:relative;height:100svh;min-height:620px;overflow:hidden;background:#000}
.hero--inner{height:clamp(460px,68svh,720px);min-height:420px}
.hero__stage{position:absolute;inset:0}
.hero__slide{
  position:absolute;inset:0;opacity:0;
  transition:opacity 1.5s var(--e-io);
  will-change:opacity;
}
.hero__slide.is-active{opacity:1;z-index:2}
.hero__slide img{width:100%;height:100%;object-fit:cover;object-position:center 38%}
.hero__slide.is-active img{animation:kb 9s linear forwards}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.15)}}
.hero__scrim{
  position:absolute;inset:0;z-index:3;pointer-events:none;
  background:
    linear-gradient(to top,rgba(6,6,8,.92) 0%,rgba(6,6,8,.45) 32%,rgba(6,6,8,.12) 58%,rgba(6,6,8,.62) 100%),
    radial-gradient(120% 82% at 50% 46%,transparent 32%,rgba(6,6,8,.72) 100%);
}
.hero__grain{
  position:absolute;inset:0;z-index:4;pointer-events:none;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
.hero__body{
  position:relative;z-index:6;height:100%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:clamp(18px,2.4vw,30px);
  padding:var(--hdr-h) var(--gut) clamp(96px,12vh,150px);
}
.hero__title{color:#fff;text-shadow:0 6px 44px rgba(0,0,0,.5)}
.hero__title .ln{display:block;overflow:hidden}
.hero__title .ln>span{display:block;transform:translateY(105%);animation:lnUp 1.25s var(--e-out) forwards}
.hero__title .ln:nth-child(2)>span{animation-delay:.14s}
@keyframes lnUp{to{transform:none}}
.hero__sub{max-width:56ch;color:rgba(245,240,232,.86);font-size:clamp(.92rem,1.2vw,1.05rem);line-height:1.95;opacity:0;animation:fadeUp 1.1s var(--e-out) .5s forwards}
.hero__actions{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;opacity:0;animation:fadeUp 1.1s var(--e-out) .68s forwards}
.hero .eyebrow{opacity:0;animation:fadeUp 1s var(--e-out) .25s forwards;color:var(--gold-hi)}
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

/* hero chrome */
.hero__rail{
  position:absolute;left:clamp(16px,2.6vw,42px);top:50%;translate:0 -50%;z-index:7;
  display:flex;flex-direction:column;align-items:center;gap:22px;
  opacity:0;animation:fadeUp 1s var(--e-out) .9s forwards;
}
.hero__rail a{
  writing-mode:vertical-rl;font-size:.58rem;letter-spacing:.34em;text-transform:uppercase;
  color:rgba(245,240,232,.62);transition:color .4s;
}
.hero__rail a:hover{color:var(--gold-hi)}
.hero__rail i{width:1px;height:64px;background:linear-gradient(var(--gold),transparent)}

.hero__meta{
  position:absolute;left:0;right:0;bottom:clamp(26px,4vh,44px);z-index:7;
  padding-inline:var(--gut);
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;
  opacity:0;animation:fadeUp 1s var(--e-out) 1s forwards;
}
.hero__count{display:flex;align-items:baseline;gap:9px;font-size:.66rem;letter-spacing:.22em;color:rgba(245,240,232,.6)}
.hero__count b{font-family:var(--f-display);font-size:1.7rem;font-weight:300;color:var(--gold-hi);letter-spacing:0}
.hero__dots{display:flex;gap:12px;align-items:center}
.hero__dots button{
  width:38px;height:2px;background:rgba(245,240,232,.25);position:relative;overflow:hidden;
  transition:background-color .4s;
}
.hero__dots button.is-active{background:rgba(245,240,232,.18)}
.hero__dots button i{position:absolute;inset:0;background:var(--gold-hi);transform:scaleX(0);transform-origin:left}
.hero__dots button.is-active i{animation:dotFill 6s linear forwards}
@keyframes dotFill{to{transform:scaleX(1)}}
.hero__scroll{
  position:absolute;left:50%;translate:-50% 0;bottom:clamp(24px,4vh,42px);z-index:7;
  display:flex;flex-direction:column;align-items:center;gap:11px;
  font-size:.55rem;letter-spacing:.34em;text-transform:uppercase;color:rgba(245,240,232,.55);
  opacity:0;animation:fadeUp 1s var(--e-out) 1.15s forwards;
}
.hero__scroll i{width:1px;height:52px;background:linear-gradient(rgba(245,240,232,.4),transparent);position:relative;overflow:hidden}
.hero__scroll i::after{content:"";position:absolute;left:0;top:0;width:1px;height:18px;background:var(--gold-hi);animation:scrollDot 2.2s var(--e-io) infinite}
@keyframes scrollDot{0%{transform:translateY(-20px)}60%,100%{transform:translateY(52px)}}

/* inner page hero */
.hero--inner .hero__body{justify-content:flex-end;padding-bottom:clamp(48px,8vh,86px);align-items:center}
.crumbs{display:flex;gap:10px;align-items:center;font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:rgba(245,240,232,.55)}
.crumbs a:hover{color:var(--gold-hi)}
.crumbs span{color:var(--gold)}

/* ---------- 9. Marquee ---------- */
.marquee{
  border-block:1px solid var(--line);
  padding-block:clamp(16px,2vw,24px);
  overflow:hidden;background:var(--ink-soft);
}
.marquee__track{display:flex;width:max-content;animation:mq 34s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__group{display:flex;align-items:center;gap:clamp(26px,4vw,58px);padding-right:clamp(26px,4vw,58px)}
.marquee span{
  font-family:var(--f-display);font-size:clamp(1.15rem,2.3vw,1.95rem);font-weight:300;
  letter-spacing:.06em;color:var(--ivory-dim);white-space:nowrap;
}
.marquee span em{font-style:italic;color:var(--gold-hi)}
.marquee .dia{width:6px;height:6px;background:var(--gold);rotate:45deg;flex-shrink:0}
@keyframes mq{to{transform:translateX(-50%)}}

/* ---------- 10. Split / About ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,6vw,96px);align-items:center}
.split--rev .split__media{order:2}
.split__copy{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(18px,2.2vw,28px);max-width:56ch}
.stack{position:relative;padding:0 0 clamp(40px,6vw,74px) clamp(40px,6vw,74px)}
.stack__a{position:relative;overflow:hidden;aspect-ratio:4/5;box-shadow:0 40px 90px -40px rgba(0,0,0,.9)}
.stack__a img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--e-out)}
.stack:hover .stack__a img{transform:scale(1.05)}
.stack__b{
  position:absolute;left:0;bottom:0;width:52%;aspect-ratio:1/1;overflow:hidden;
  border:8px solid var(--ink);box-shadow:0 30px 70px -30px rgba(0,0,0,.9);
}
.section--light .stack__b{border-color:var(--sand)}
.stack__b img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--e-out)}
.stack:hover .stack__b img{transform:scale(1.07)}
.stack__badge{
  position:absolute;right:clamp(-8px,-1vw,0px);top:clamp(20px,4vw,46px);
  width:clamp(96px,11vw,138px);aspect-ratio:1/1;border-radius:50%;
  background:var(--gold-grad);color:#14100A;
  display:grid;place-items:center;text-align:center;gap:0;
  box-shadow:0 22px 50px -18px rgba(0,0,0,.7);
  z-index:3;
}
.stack__badge b{display:block;font-family:var(--f-display);font-size:clamp(1.7rem,2.6vw,2.3rem);font-weight:500;line-height:1}
.stack__badge small{display:block;font-size:.5rem;letter-spacing:.24em;text-transform:uppercase;margin-top:3px}

/* stat inline row */
.mini-stats{display:flex;flex-wrap:wrap;gap:clamp(22px,3vw,48px);margin-top:6px}
.mini-stats div{display:flex;flex-direction:column;gap:4px}
.mini-stats b{font-family:var(--f-display);font-size:clamp(1.9rem,3vw,2.7rem);font-weight:300;color:var(--gold-hi);line-height:1}
.section--light .mini-stats b{color:#8B7340}
.mini-stats small{font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}

/* ---------- 11. Steps ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--line)}
.step{padding:clamp(30px,3.6vw,54px);border-right:1px solid var(--line);position:relative;overflow:hidden;transition:background-color .6s var(--e-out)}
.step:last-child{border-right:0}
.step:hover{background:rgba(200,169,107,.045)}
.step__n{
  font-family:var(--f-display);font-size:clamp(3.2rem,6vw,5.2rem);font-weight:300;line-height:.9;
  color:transparent;-webkit-text-stroke:1px rgba(200,169,107,.42);
  transition:color .6s var(--e-out),-webkit-text-stroke-color .6s;
  display:block;margin-bottom:20px;
}
.step:hover .step__n{color:rgba(200,169,107,.14);-webkit-text-stroke-color:rgba(235,217,174,.7)}
.step h3{font-family:var(--f-ui);font-size:.74rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);font-weight:400;margin-bottom:10px}
.step h4{font-family:var(--f-display);font-size:clamp(1.35rem,2vw,1.7rem);font-weight:300;margin-bottom:14px;color:var(--ivory)}
.step p{color:var(--ivory-dim);font-size:.92rem;line-height:1.9}
.step__ico{position:absolute;right:-14px;bottom:-14px;width:110px;opacity:.05;filter:invert(1)}

/* multi-row variant: hairline gaps separate rows as well as columns */
.steps--tiles{
  grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--line);border-color:var(--line);
}
.steps--tiles .step{border:0;background:var(--ink)}
.section--soft .steps--tiles .step{background:var(--ink-soft)}
.section--warm .steps--tiles .step{background:var(--ink-warm)}
.steps--tiles .step:hover{background:rgba(200,169,107,.05)}

/* text-led landing pages read at lead size, not body size */
.body-copy--lead p{font-size:clamp(1rem,1.3vw,1.12rem);line-height:1.95}

/* ---------- 12. Stories grid ---------- */
.stories{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(14px,1.6vw,26px)}
.story{
  position:relative;overflow:hidden;display:block;background:#0C0C0F;
  grid-column:span 4;aspect-ratio:3/4;
}
.story--wide{grid-column:span 8;aspect-ratio:16/10}
.story--tall{grid-column:span 4;aspect-ratio:3/4}
.story--half{grid-column:span 6;aspect-ratio:4/3}
.story--full{grid-column:span 12;aspect-ratio:21/8}
.story img{width:100%;height:100%;object-fit:cover;transition:transform 1.5s var(--e-out),filter 1s var(--e-out);filter:saturate(.92)}
.story::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top,rgba(6,6,8,.88) 0%,rgba(6,6,8,.28) 42%,rgba(6,6,8,0) 72%);
  transition:opacity .7s var(--e-out);
}
.story:hover img{transform:scale(1.07);filter:saturate(1.05)}
.story__in{
  position:absolute;left:0;right:0;bottom:0;z-index:3;
  padding:clamp(20px,2.4vw,34px);
  display:flex;flex-direction:column;gap:9px;align-items:flex-start;
}
.story__cat{font-size:.56rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-hi)}
.story__name{font-family:var(--f-display);font-size:clamp(1.35rem,2.3vw,2.05rem);font-weight:300;color:#fff;line-height:1.1}
.story__meta{font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,240,232,.62)}
.story__go{
  overflow:hidden;height:0;opacity:0;
  transition:height .55s var(--e-out),opacity .45s var(--e-out),margin-top .55s var(--e-out);
  font-size:.6rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-hi);
  display:flex;align-items:center;gap:10px;
}
.story:hover .story__go{height:20px;opacity:1;margin-top:4px}
.story__frame{
  position:absolute;inset:14px;border:1px solid rgba(235,217,174,.42);z-index:2;
  opacity:0;transform:scale(1.03);
  transition:opacity .6s var(--e-out),transform .6s var(--e-out);
  pointer-events:none;
}
.story:hover .story__frame{opacity:1;transform:scale(1)}

/* ---------- 13. Films ---------- */
.films{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:clamp(16px,2vw,30px)}
.film{position:relative;display:block;overflow:hidden;background:#0C0C0F;cursor:pointer;text-align:left;width:100%}
.film__thumb{position:relative;aspect-ratio:16/9;overflow:hidden}
.film__thumb img{width:100%;height:100%;object-fit:cover;transition:transform 1.3s var(--e-out),filter .7s;filter:saturate(.9) brightness(.82)}
.film:hover .film__thumb img{transform:scale(1.06);filter:saturate(1.02) brightness(.66)}
.film__play{
  position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:3;
  width:clamp(56px,5vw,72px);aspect-ratio:1;border-radius:50%;
  border:1px solid rgba(245,240,232,.55);
  display:grid;place-items:center;
  background:rgba(8,8,10,.25);backdrop-filter:blur(3px);
  transition:background-color .5s var(--e-out),border-color .5s,transform .5s var(--e-out);
}
.film__play svg{width:16px;height:16px;fill:var(--ivory);margin-left:3px;transition:fill .4s}
.film:hover .film__play{background:var(--gold-grad);border-color:transparent;transform:translate(-50%,-50%) scale(1.08)}
.film:hover .film__play svg{fill:#0A0A0C}
.film__play::after{
  content:"";position:absolute;inset:-1px;border-radius:50%;border:1px solid rgba(235,217,174,.5);
  opacity:0;
}
.film:hover .film__play::after{animation:ping 1.6s var(--e-out) infinite}
@keyframes ping{0%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(1.5)}}
.film__body{padding:18px 4px 0;display:flex;flex-direction:column;gap:7px}
.film__tag{font-size:.55rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.film__title{
  font-family:var(--f-display);font-size:1.22rem;font-weight:300;color:var(--ivory);line-height:1.35;
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
  transition:color .4s;
}
.film:hover .film__title{color:var(--gold-hi)}

/* film modal */
.vmodal{
  position:fixed;inset:0;z-index:950;display:grid;place-items:center;
  background:rgba(4,4,6,.94);backdrop-filter:blur(10px);
  padding:var(--gut);
  opacity:0;visibility:hidden;transition:opacity .5s var(--e-out),visibility .5s;
}
.vmodal.is-open{opacity:1;visibility:visible}
.vmodal__box{width:min(1180px,100%);aspect-ratio:16/9;background:#000;position:relative;transform:scale(.96);transition:transform .6s var(--e-out);box-shadow:0 50px 120px -30px #000}
.vmodal.is-open .vmodal__box{transform:none}
.vmodal iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vmodal__x,.lb__x{
  position:absolute;top:-52px;right:0;width:42px;height:42px;
  border:1px solid var(--line-strong);display:grid;place-items:center;color:var(--ivory);
  transition:background-color .4s,color .4s,border-color .4s,rotate .5s var(--e-out);
}
.vmodal__x:hover,.lb__x:hover{background:var(--gold);border-color:var(--gold);color:#0A0A0C;rotate:90deg}
.vmodal__x svg,.lb__x svg{width:16px;height:16px}

/* ---------- 14. Stats ---------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line)}
.stat{background:var(--ink);padding:clamp(30px,3.6vw,52px) clamp(16px,2vw,28px);text-align:center;display:flex;flex-direction:column;gap:9px;transition:background-color .6s}
.stat:hover{background:var(--ink-soft)}
.stat b{font-family:var(--f-display);font-size:clamp(2.6rem,5vw,4rem);font-weight:300;line-height:1;color:var(--gold-hi)}
.stat span{font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}

/* ---------- 15. Testimonials ---------- */
.tst{position:relative;max-width:1000px;margin-inline:auto}
.tst__viewport{overflow:hidden}
.tst__track{display:flex;transition:transform .8s var(--e-out)}
.tst__item{min-width:100%;padding-inline:clamp(4px,3vw,52px);text-align:center;display:flex;flex-direction:column;align-items:center;gap:26px}
.tst__quote{
  font-family:var(--f-display);font-weight:300;font-style:italic;
  font-size:clamp(1.12rem,1.9vw,1.6rem);line-height:1.72;color:var(--ivory);
  max-width:74ch;
}
.tst__mark{font-family:var(--f-display);font-size:clamp(4rem,8vw,7rem);line-height:.6;color:var(--gold);opacity:.32;height:.45em}
.tst__who{display:flex;flex-direction:column;gap:5px;align-items:center}
.tst__who b{font-family:var(--f-ui);font-size:.72rem;font-weight:400;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-hi)}
.tst__who small{font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.tst__nav{display:flex;justify-content:center;align-items:center;gap:26px;margin-top:clamp(28px,4vw,46px)}
.tst__nav button{
  width:46px;height:46px;border:1px solid var(--line-strong);display:grid;place-items:center;color:var(--ivory);
  transition:background-color .45s,border-color .45s,color .45s;
}
.tst__nav button:hover{background:var(--gold);border-color:var(--gold);color:#0A0A0C}
.tst__nav button svg{width:15px;height:15px}
.tst__pips{display:flex;gap:9px}
.tst__pips i{width:6px;height:6px;rotate:45deg;background:var(--line-strong);transition:background-color .4s,scale .4s}
.tst__pips i.on{background:var(--gold);scale:1.35}
.section--light .tst__quote{color:#1D1A15}
.section--light .tst__nav button{border-color:var(--line-dark);color:#1D1A15}
.section--light .tst__who b{color:#8B7340}

/* ---------- 16. Instagram ---------- */
.insta{display:grid;grid-template-columns:repeat(8,1fr);gap:2px}
.insta a{position:relative;aspect-ratio:1;overflow:hidden;display:block;background:#0C0C0F}
.insta img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--e-out),filter .6s;filter:grayscale(.25) brightness(.85)}
.insta a:hover img{transform:scale(1.09);filter:none}
.insta a::after{
  content:"";position:absolute;inset:0;background:rgba(200,169,107,.24);
  opacity:0;transition:opacity .5s;
}
.insta a:hover::after{opacity:1}
.insta__ico{position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:2;width:22px;height:22px;color:#fff;opacity:0;transform:scale(.7);transition:opacity .45s var(--e-out),transform .45s var(--e-out)}
.insta a:hover .insta__ico{opacity:1;transform:translate(0,0) scale(1)}

/* ---------- 17. Parallax CTA ---------- */
.cta{position:relative;overflow:hidden;isolation:isolate}
.cta__bg{position:absolute;inset:-12% 0;z-index:-2}
.cta__bg img{width:100%;height:100%;object-fit:cover;object-position:center 40%}
.cta::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(rgba(6,6,8,.74),rgba(6,6,8,.86))}
.cta__in{padding-block:clamp(88px,13vw,180px);display:flex;flex-direction:column;align-items:center;gap:26px;text-align:center}

/* ---------- 18. Gallery / masonry ---------- */
.filters{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:clamp(34px,4.5vw,58px)}
.filters button{
  padding:11px 24px;border:1px solid var(--line);
  font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ivory-dim);
  transition:color .4s,border-color .4s,background-color .4s;
}
.filters button:hover{color:var(--gold-hi);border-color:var(--gold-deep)}
.filters button.is-active{background:var(--gold-grad);border-color:transparent;color:#0A0A0C}

.masonry{columns:4;column-gap:clamp(10px,1.4vw,20px)}
.masonry figure{
  break-inside:avoid;margin:0 0 clamp(10px,1.4vw,20px);position:relative;overflow:hidden;
  background:#0C0C0F;cursor:zoom-in;display:block;
}
.masonry img{width:100%;display:block;transition:transform 1.3s var(--e-out),filter .7s;filter:saturate(.95)}
.masonry figure:hover img{transform:scale(1.05);filter:saturate(1.06)}
.masonry figure::after{
  content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,6,8,.62),transparent 55%);
  opacity:0;transition:opacity .5s;
}
.masonry figure:hover::after{opacity:1}
.masonry figcaption{
  position:absolute;left:0;right:0;bottom:0;z-index:2;padding:16px 18px;
  font-size:.6rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold-hi);
  opacity:0;transform:translateY(10px);
  transition:opacity .5s var(--e-out),transform .5s var(--e-out);
}
.masonry figure:hover figcaption{opacity:1;transform:none}
.masonry figure.is-hidden{display:none}

/* lightbox */
.lb{
  position:fixed;inset:0;z-index:960;background:rgba(4,4,6,.96);backdrop-filter:blur(8px);
  display:grid;place-items:center;padding:clamp(46px,7vw,80px) var(--gut);
  opacity:0;visibility:hidden;transition:opacity .45s var(--e-out),visibility .45s;
}
.lb.is-open{opacity:1;visibility:visible}
.lb__stage{position:relative;max-width:min(1300px,100%);max-height:100%;display:flex;flex-direction:column;align-items:center;gap:16px}
.lb__img{max-width:100%;max-height:78svh;object-fit:contain;box-shadow:0 40px 100px -30px #000;opacity:0;transform:scale(.97);transition:opacity .5s var(--e-out),transform .5s var(--e-out)}
.lb.is-open .lb__img{opacity:1;transform:none}
.lb__cap{font-size:.62rem;letter-spacing:.26em;text-transform:uppercase;color:var(--ivory-dim)}
.lb__nav{position:absolute;top:50%;translate:0 -50%;width:48px;height:48px;border:1px solid var(--line-strong);display:grid;place-items:center;color:var(--ivory);transition:background-color .4s,color .4s,border-color .4s;z-index:3}
.lb__nav:hover{background:var(--gold);border-color:var(--gold);color:#0A0A0C}
.lb__nav svg{width:16px;height:16px}
.lb__prev{left:clamp(-8px,-2vw,0px)}
.lb__next{right:clamp(-8px,-2vw,0px)}
.lb__x{top:clamp(-56px,-5vw,-46px)}

/* ---------- 19. Team ---------- */
.team{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,36px)}
.member{position:relative;overflow:hidden;background:#0C0C0F;display:block}
.member__ph{aspect-ratio:3/4;overflow:hidden;position:relative}
.member__ph img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.04);transition:filter .8s var(--e-out),transform 1.4s var(--e-out)}
.member:hover .member__ph img{filter:none;transform:scale(1.05)}
.member__ph::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(6,6,8,.85),transparent 55%)}
.member__in{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(18px,2.2vw,28px);display:flex;flex-direction:column;gap:5px}
.member__in b{font-family:var(--f-display);font-size:1.5rem;font-weight:300;color:#fff}
.member__in small{font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-hi)}

/* ---------- 20. Services cards ---------- */
.svc{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,28px)}
.svc__card{
  position:relative;overflow:hidden;aspect-ratio:4/5;display:flex;flex-direction:column;justify-content:flex-end;
  padding:clamp(22px,2.6vw,36px);background:#0C0C0F;
}
.svc__card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform 1.5s var(--e-out);filter:brightness(.6)}
.svc__card:hover img{transform:scale(1.07)}
.svc__card::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(6,6,8,.9),rgba(6,6,8,.15) 65%)}
.svc__card>*{position:relative;z-index:2}
.svc__card h3{font-family:var(--f-display);font-size:clamp(1.5rem,2.2vw,1.95rem);font-weight:300;color:#fff;margin-bottom:8px}
.svc__card p{font-size:.86rem;color:rgba(245,240,232,.72);line-height:1.85;max-height:0;opacity:0;overflow:hidden;transition:max-height .6s var(--e-out),opacity .5s,margin-top .6s}
.svc__card:hover p{max-height:140px;opacity:1;margin-top:4px}
.svc__num{font-size:.56rem;letter-spacing:.3em;color:var(--gold-hi);margin-bottom:12px;display:block}

/* ---------- 21. Contact ---------- */
.ct-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(36px,6vw,86px);align-items:start}
.ct-info{display:flex;flex-direction:column;gap:clamp(24px,3vw,38px)}
.ct-block{display:flex;flex-direction:column;gap:8px;padding-bottom:26px;border-bottom:1px solid var(--line)}
.ct-block b{font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.ct-block p,.ct-block a{color:var(--ivory-dim);line-height:1.85;font-size:.96rem}
.ct-block a:hover{color:var(--gold-hi)}

.form{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2vw,26px)}
.field{display:flex;flex-direction:column;gap:9px;position:relative}
.field--full{grid-column:1/-1}
.field label{font-size:.58rem;letter-spacing:.28em;text-transform:uppercase;color:var(--muted)}
.field input,.field select,.field textarea{
  width:100%;background:transparent;border:0;border-bottom:1px solid var(--line);
  padding:12px 0;font-size:.95rem;font-weight:300;color:var(--ivory);
  transition:border-color .45s var(--e-out);
  border-radius:0;
}
.field textarea{resize:vertical;min-height:110px}
.field select{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C8A96B' stroke-width='1.5'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 2px center;background-size:16px}
.field select option{background:#131316;color:var(--ivory)}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-bottom-color:var(--gold)}
.field input::placeholder,.field textarea::placeholder{color:#5A554D}
.field input[type=date]::-webkit-calendar-picker-indicator{filter:invert(.7) sepia(1) saturate(3) hue-rotate(2deg);cursor:pointer}
.form__note{grid-column:1/-1;font-size:.72rem;color:var(--muted);letter-spacing:.06em}

.map{position:relative;aspect-ratio:16/7;overflow:hidden;border:1px solid var(--line);filter:grayscale(1) invert(.92) contrast(.86);transition:filter .8s var(--e-out)}
.map:hover{filter:grayscale(.35) invert(.9) contrast(.9)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---------- 22. Blog ---------- */
.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,2.6vw,38px)}
.post{display:flex;flex-direction:column;gap:18px;group:post}
.post__ph{aspect-ratio:4/3;overflow:hidden;position:relative;background:#0C0C0F}
.post__ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--e-out);filter:saturate(.92)}
.post:hover .post__ph img{transform:scale(1.06)}
.post__date{position:absolute;left:16px;top:16px;z-index:2;background:var(--ink-glass);backdrop-filter:blur(6px);padding:8px 14px;font-size:.58rem;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-hi)}
.post h3{font-family:var(--f-display);font-size:clamp(1.3rem,1.9vw,1.6rem);font-weight:300;line-height:1.3;color:var(--ivory);transition:color .4s}
.post:hover h3{color:var(--gold-hi)}
.post p{font-size:.9rem;color:var(--ivory-dim);line-height:1.85}

/* ---------- 23. Story page extras ---------- */
.story-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border-block:1px solid var(--line)}
.story-meta div{background:var(--ink);padding:clamp(22px,2.6vw,34px);display:flex;flex-direction:column;gap:7px}
.story-meta small{font-size:.56rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.story-meta b{font-family:var(--f-display);font-size:clamp(1.1rem,1.6vw,1.35rem);font-weight:300;color:var(--ivory)}

.pager{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line)}
.pager a{
  position:relative;overflow:hidden;background:var(--ink);
  min-height:clamp(180px,22vw,280px);display:flex;flex-direction:column;justify-content:center;gap:8px;
  padding:clamp(24px,3vw,46px);
}
.pager a:last-child{align-items:flex-end;text-align:right}
.pager img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;opacity:.28;transition:opacity .7s var(--e-out),transform 1.5s var(--e-out);filter:grayscale(1)}
.pager a:hover img{opacity:.5;transform:scale(1.06);filter:grayscale(.3)}
.pager a>*{position:relative;z-index:2}
.pager small{font-size:.58rem;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.pager b{font-family:var(--f-display);font-size:clamp(1.5rem,2.6vw,2.2rem);font-weight:300;color:var(--ivory)}

/* ---------- 24. Footer ---------- */
.ftr{background:var(--ink-soft);border-top:1px solid var(--line);padding-top:clamp(62px,8vw,104px)}
.ftr__top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.25fr;gap:clamp(28px,4vw,64px);padding-bottom:clamp(48px,6vw,78px)}
.ftr__brand{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.ftr__brand .brand__name{font-size:1.55rem}
.ftr__brand p{color:var(--muted);font-size:.9rem;line-height:1.9;max-width:34ch}
.ftr h4{font-size:.6rem;letter-spacing:.32em;text-transform:uppercase;color:var(--gold);font-weight:400;margin-bottom:22px}
.ftr ul{display:flex;flex-direction:column;gap:12px}
.ftr ul a,.ftr address{font-size:.88rem;color:var(--ivory-dim);font-style:normal;line-height:1.9;transition:color .4s,padding-left .4s var(--e-out)}
.ftr ul a:hover{color:var(--gold-hi);padding-left:7px}
.ftr address a:hover{color:var(--gold-hi)}
.ftr__social{display:flex;gap:12px;margin-top:6px}
.ftr__social a{width:40px;height:40px;border:1px solid var(--line);display:grid;place-items:center;color:var(--ivory-dim);transition:background-color .45s,color .45s,border-color .45s,transform .45s var(--e-out)}
.ftr__social a:hover{background:var(--gold);border-color:var(--gold);color:#0A0A0C;transform:translateY(-3px)}
.ftr__social svg{width:15px;height:15px}
.ftr__bot{border-top:1px solid var(--line);padding-block:26px;display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between;align-items:center}
.ftr__bot p,.ftr__bot a{font-size:.7rem;letter-spacing:.1em;color:var(--muted)}
.ftr__bot a:hover{color:var(--gold-hi)}

/* floating quick actions */
.quick{position:fixed;right:clamp(12px,1.6vw,24px);bottom:clamp(12px,1.6vw,24px);z-index:700;display:flex;flex-direction:column;gap:10px}
.quick a,.quick button{
  width:48px;height:48px;display:grid;place-items:center;
  background:var(--ink-glass);backdrop-filter:blur(10px);border:1px solid var(--line);
  color:var(--ivory);transition:background-color .45s,color .45s,border-color .45s,transform .45s var(--e-out),opacity .4s,visibility .4s;
}
.quick a:hover,.quick button:hover{background:var(--gold);border-color:var(--gold);color:#0A0A0C;transform:translateY(-3px)}
.quick svg{width:18px;height:18px}
.quick .wa:hover{background:#25D366;border-color:#25D366;color:#fff}
#toTop{opacity:0;visibility:hidden}
#toTop.on{opacity:1;visibility:visible}

/* ---------- 25. Reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(34px);transition:opacity 1s var(--e-out),transform 1s var(--e-out);transition-delay:var(--d,0ms)}
[data-reveal="left"]{transform:translateX(-40px)}
[data-reveal="right"]{transform:translateX(40px)}
[data-reveal="scale"]{transform:scale(.94)}
[data-reveal="mask"]{opacity:1;transform:none;clip-path:inset(0 100% 0 0);transition:clip-path 1.3s var(--e-out)}
[data-reveal].in{opacity:1;transform:none;clip-path:inset(0 0 0 0)}

/* ---------- 26. Responsive ---------- */
@media (max-width:1180px){
  .stories{grid-template-columns:repeat(6,1fr)}
  .story,.story--tall{grid-column:span 3}
  .story--wide,.story--half{grid-column:span 6;aspect-ratio:16/10}
  .story--full{grid-column:span 6;aspect-ratio:16/9}
  .masonry{columns:3}
  .ftr__top{grid-template-columns:1fr 1fr}
  .insta{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:1024px){
  .nav,.hdr__phone{display:none}
  .burger{display:block}
  .hdr__cta .btn{display:none}
  .split{grid-template-columns:1fr}
  .split--rev .split__media{order:0}
  .stack{padding-bottom:clamp(30px,7vw,56px)}
  .steps{grid-template-columns:1fr}
  .step{border-right:0;border-bottom:1px solid var(--line)}
  .step:last-child{border-bottom:0}
  .stats{grid-template-columns:repeat(2,1fr)}
  .team,.svc,.posts{grid-template-columns:repeat(2,1fr)}
  .ct-grid{grid-template-columns:1fr}
  .story-meta{grid-template-columns:repeat(2,1fr)}
  .hero__rail{display:none}
}
@media (max-width:720px){
  :root{--hdr-h:70px}
  .masonry{columns:2}
  .stories{grid-template-columns:1fr}
  .story,.story--tall,.story--wide,.story--half,.story--full{grid-column:span 1;aspect-ratio:4/5}
  .films{grid-template-columns:1fr}
  .team,.svc,.posts{grid-template-columns:1fr}
  .form{grid-template-columns:1fr}
  .ftr__top{grid-template-columns:1fr;gap:36px}
  .insta{grid-template-columns:repeat(2,1fr)}
  .hero__meta{flex-direction:column;align-items:flex-start;gap:14px}
  .hero__scroll{display:none}
  .pager{grid-template-columns:1fr}
  .pager a:last-child{align-items:flex-start;text-align:left}
  .stats{grid-template-columns:1fr}
  .vmodal__x{top:-46px}
  .lb__nav{top:auto;bottom:-58px;translate:0 0}
  .lb__prev{left:calc(50% - 58px)}
  .lb__next{right:calc(50% - 58px)}
}
@media (max-width:420px){
  .masonry{columns:1}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  [data-reveal]{opacity:1;transform:none;clip-path:none}
  .hero__slide.is-active img{animation:none}
}

/* print */
@media print{
  .hdr,.quick,.mnav,#preload,.hero__meta,.hero__scroll{display:none !important}
  body{background:#fff;color:#000}
}

/* how-to-choose tiles on the light band */
.section--light .steps--tiles{background:rgba(26,23,18,.16);border-color:rgba(26,23,18,.16)}
.section--light .steps--tiles .step{background:var(--sand)}
.section--light .steps--tiles .step:hover{background:var(--sand-2)}
.section--light .step h4{color:#161310}
.section--light .step p{color:#5A5248}
.section--light .step__n{-webkit-text-stroke-color:rgba(139,115,64,.5)}
.section--light .step:hover .step__n{color:rgba(139,115,64,.14);-webkit-text-stroke-color:rgba(139,115,64,.8)}

/* FAQ questions are h3 — keep the label look, drop the heading defaults */
.ct-block h3{
  font-family:var(--f-ui);font-size:.6rem;font-weight:400;
  letter-spacing:.3em;text-transform:uppercase;color:var(--gold);line-height:1.7;
}
.section--light .ct-block h3{color:#8B7340}
