/* iRolls — ir3.css (2026-10-18). Magazine-cover system. No dependencies. */
:root{
  --ink:#0b0b0c; --ink-2:#141416; --paper:#f1f0ec; --paper-2:#e7e5df;
  --white:#fff; --grey:#8b8b8f; --grey-d:#5c5c61;
  --line-d:rgba(255,255,255,.14); --line-l:rgba(11,11,12,.14);
  --red:#ff2600;
  --f-wide:"Archivo",system-ui,sans-serif;
  --f-sans:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --gut:clamp(16px,3.2vw,48px);
  --ease:cubic-bezier(.19,1,.22,1);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:64px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--ink);color:var(--white);font:400 16px/1.55 var(--f-sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
img,video,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mono{font:500 11px/1.4 var(--f-mono);letter-spacing:.08em;text-transform:uppercase}
.wide{font-family:var(--f-wide);font-stretch:125%;font-weight:800;text-transform:uppercase;letter-spacing:-.01em}
.wrap{padding-left:var(--gut);padding-right:var(--gut)}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px)}

/* ───────── nav ───────── */
.nav{position:fixed;inset:0 0 auto 0;z-index:50;display:flex;align-items:center;gap:18px;height:64px;padding:0 var(--gut);transition:background .4s,backdrop-filter .4s,color .4s}
.nav.is-solid{background:rgba(11,11,12,.72);-webkit-backdrop-filter:saturate(1.4) blur(18px);backdrop-filter:saturate(1.4) blur(18px)}
.nav.is-light{color:var(--ink);background:rgba(241,240,236,.78)}
.brand{display:flex;align-items:center;gap:10px}
.brand svg{width:28px;height:28px}
.brand b{font:800 15px/1 var(--f-wide);font-stretch:125%;letter-spacing:-.01em}
.nav-mid{margin-left:auto;display:flex;gap:26px}
.nav-mid a{opacity:.72;transition:opacity .2s}.nav-mid a:hover{opacity:1}
.burger{width:34px;height:34px;display:grid;place-content:center;gap:5px}
.burger i{display:block;width:18px;height:1.5px;background:currentColor;transition:transform .35s var(--ease)}
body.menu-open .burger i:first-child{transform:translateY(3.25px) rotate(45deg)}
body.menu-open .burger i:last-child{transform:translateY(-3.25px) rotate(-45deg)}
@media (max-width:860px){.nav-mid{display:none}.nav-book{margin-left:auto}}
.menu{position:fixed;inset:0;z-index:45;background:var(--ink);color:var(--white);display:flex;flex-direction:column;justify-content:flex-end;padding:96px var(--gut) var(--gut);clip-path:inset(0 0 100% 0);transition:clip-path .7s var(--ease);visibility:hidden}
body.menu-open .menu{clip-path:inset(0);visibility:visible}
body.menu-open .nav{background:transparent;color:var(--white);-webkit-backdrop-filter:none;backdrop-filter:none}
.menu nav{display:flex;flex-direction:column}
.menu nav a{font:800 clamp(34px,7.4vw,104px)/.98 var(--f-wide);font-stretch:125%;text-transform:uppercase;letter-spacing:-.02em;color:rgba(255,255,255,.38);transition:color .25s}
.menu nav a:hover,.menu nav a[aria-current]{color:var(--white)}
.menu-foot{display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:40px;color:var(--grey)}

/* ───────── cover (magazine) ───────── */
.cover{position:relative;height:100vh;height:100svh;min-height:620px;overflow:hidden;color:var(--white);isolation:isolate;background:#000}
.cover-media{position:absolute;inset:0;z-index:-2}
.cover-media img,.cover-media video{width:100%;height:100%;object-fit:cover}
.cover::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,0) 34%,rgba(0,0,0,0) 52%,rgba(0,0,0,.72) 100%)}
.cover-in{position:absolute;inset:0;display:flex;flex-direction:column;padding:76px var(--gut) var(--gut)}
.cover-meta{display:flex;justify-content:space-between;gap:16px;color:rgba(255,255,255,.82)}
.cover-meta span:nth-child(2){text-align:center}
.cover-word{margin:clamp(14px,2vw,28px) 0 0;font:800 clamp(56px,16vw,260px)/.86 var(--f-wide);font-stretch:125%;letter-spacing:-.035em;text-transform:uppercase;white-space:nowrap;color:var(--white)}
.cover-word.fit{display:block;width:max-content;max-width:none}
.cover-wordbox{width:100%}
.cover-bot{margin-top:auto;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px);row-gap:28px;align-items:end}
.cover-lines{grid-column:1/span 5;grid-row:2;display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;list-style:none;margin:0;padding:0}
.cover-lines li{display:grid;grid-template-columns:26px 1fr;gap:4px;font:500 13px/1.3 var(--f-sans);max-width:240px}
.cover-lines li b{font:500 11px/1.6 var(--f-mono);color:rgba(255,255,255,.6)}
.cover-head{grid-column:1/span 6;grid-row:1}
.cover-tag{grid-row:2}
/* portrait-on-backdrop covers: photo sits right, backdrop colour continues left */
.cover.pt{background:radial-gradient(120% 90% at 72% 38%,var(--bg2,#2d2d33) 0%,var(--bg,#151518) 62%)}
.cover.pt .cover-media{left:34%}
.cover.pt .cover-media img{object-position:50% 12%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
.cover.pt::after{background:linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,0) 26%,rgba(0,0,0,0) 58%,rgba(0,0,0,.6) 100%)}
@media (max-width:900px){
  .cover.pt .cover-media{left:0}
  .cover.pt .cover-media img{-webkit-mask-image:none;mask-image:none;object-position:50% 8%}
}
/* mosaic cover (platform) */
.mosaic{position:absolute;inset:-4% -2%;display:grid;grid-template-columns:repeat(6,1fr);gap:8px;transform:rotate(-6deg) scale(1.12);opacity:.55}
.mosaic img{width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:6px}
.mosaic img:nth-child(6n+2),.mosaic img:nth-child(6n+5){transform:translateY(-22%)}
@media (max-width:700px){.mosaic{grid-template-columns:repeat(4,1fr)}.mosaic img:nth-child(n+17){display:none}}
.cover-head h2,.cover-head .h{margin:0;font:500 clamp(28px,3.3vw,54px)/1.02 var(--f-sans);letter-spacing:-.035em}
.cover-head p{margin:14px 0 0;max-width:560px;font-size:clamp(15px,1.15vw,18px);line-height:1.5;color:rgba(255,255,255,.84)}
.cover-tag{grid-column:11/span 2;justify-self:end;text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.cover-price{font:800 clamp(22px,2vw,30px)/1 var(--f-wide);font-stretch:125%}
.cover-price small{display:block;font:500 10px/1.4 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.7);margin-bottom:4px}
.barcode{width:84px;height:30px;background:repeating-linear-gradient(90deg,#fff 0 2px,transparent 2px 3px,#fff 3px 4px,transparent 4px 7px,#fff 7px 10px,transparent 10px 11px);opacity:.85}
.cover-cta{display:inline-flex;align-items:center;gap:10px;margin-top:22px;height:44px;padding:0 22px;border-radius:999px;background:var(--white);color:var(--ink);font:500 14px/1 var(--f-sans)}
.cover-cta span{transition:transform .3s var(--ease)}.cover-cta:hover span{transform:translateX(4px)}
.cover-cta.ghost{background:transparent;color:var(--white);box-shadow:inset 0 0 0 1px rgba(255,255,255,.5);margin-left:8px}
@media (max-width:900px){
  .cover-in{padding-top:72px}
  .cover-meta span:nth-child(2){display:none}
  .cover-bot{display:flex;flex-direction:column;align-items:stretch;gap:20px}
  .cover-lines{order:2;gap:8px 14px}
  .cover-lines li{font-size:12px;grid-template-columns:22px 1fr}
  .cover-head{order:1}
  .cover-tag{display:none}
  .cover::after{background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,0) 26%,rgba(0,0,0,.2) 46%,rgba(0,0,0,.85) 100%)}
}

/* hero entrance (CSS only, ~1s, never blocks) */
.hero .cover-media img,.hero .cover-media video{animation:heroImg 1.8s var(--ease) both}
.hero .cover-word{animation:wordIn 1.1s .15s var(--ease) both}
.hero .cover-meta,.hero .cover-lines li,.hero .cover-head>*,.hero .cover-tag{animation:fadeUp .9s var(--ease) both}
.hero .cover-meta{animation-delay:.1s}
.hero .cover-head>*:nth-child(1){animation-delay:.45s}.hero .cover-head>*:nth-child(2){animation-delay:.55s}.hero .cover-head>*:nth-child(3){animation-delay:.65s}
.hero .cover-lines li:nth-child(1){animation-delay:.6s}.hero .cover-lines li:nth-child(2){animation-delay:.68s}.hero .cover-lines li:nth-child(3){animation-delay:.76s}.hero .cover-lines li:nth-child(4){animation-delay:.84s}
.hero .cover-tag{animation-delay:.9s}
@keyframes heroImg{from{transform:scale(1.08);opacity:0}to{transform:none;opacity:1}}
@keyframes wordIn{from{clip-path:inset(0 0 100% 0);transform:translateY(.18em)}to{clip-path:inset(0 0 0 0);transform:none}}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* scroll-driven touches where supported (Chrome, Safari 26+) — otherwise static */
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .cover:not(.hero) .cover-media>*{animation:coverZoom linear both;animation-timeline:view();animation-range:entry 0% exit 100%}
    .hero .cover-media{animation:heroOut linear both;animation-timeline:scroll(root);animation-range:0 100vh}
    .spread-img img{animation:imgDrift linear both;animation-timeline:view()}
  }
}
@keyframes coverZoom{from{transform:scale(1.18) translateY(-3%)}to{transform:scale(1) translateY(3%)}}
@keyframes wordSlide{from{transform:translateX(12%);opacity:.0}to{transform:none;opacity:1}}
@keyframes heroOut{to{transform:translateY(18%) scale(1.04);filter:brightness(.6)}}
@keyframes imgDrift{from{transform:scale(1.12) translateY(-4%)}to{transform:scale(1.02) translateY(4%)}}

/* reveal */
.rv{opacity:0;transform:translateY(28px);transition:opacity 1s var(--ease),transform 1s var(--ease)}
.rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}.hero *{animation:none!important}}

/* ───────── sections ───────── */
.sec{position:relative;padding:clamp(80px,12vw,180px) 0}
.light{background:var(--paper);color:var(--ink)}
.dark{background:var(--ink);color:var(--white)}
.kick{display:flex;justify-content:space-between;gap:16px;padding-bottom:16px;margin-bottom:clamp(40px,6vw,88px);border-bottom:1px solid var(--line-l)}
.dark .kick{border-color:var(--line-d)}
.kick span:last-child{color:var(--grey)}
.lede{grid-column:1/span 10;margin:0;font:500 clamp(30px,4.4vw,72px)/1.02 var(--f-sans);letter-spacing:-.04em}
.lede em{font-style:normal;color:var(--grey)}
.dark .lede em{color:var(--grey-d)}
.body-col{grid-column:7/span 5;margin-top:clamp(28px,4vw,56px);font-size:clamp(16px,1.2vw,19px);line-height:1.55;color:#3d3d40}
.dark .body-col{color:#b9b9bd}
@media (max-width:900px){.lede,.body-col{grid-column:1/-1}}

/* stat strip */
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-l);margin-top:clamp(56px,8vw,120px)}
.dark .stats{border-color:var(--line-d)}
.stat{padding:22px 18px 0 0}
.stat b{display:block;font:800 clamp(34px,4.6vw,76px)/.9 var(--f-wide);font-stretch:125%;letter-spacing:-.03em}
.stat span{display:block;margin-top:10px;color:var(--grey)}
@media (max-width:700px){.stats{grid-template-columns:1fr 1fr;row-gap:32px}}

/* editorial spread of portraits */
.spread{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(10px,1.4vw,20px);margin-top:clamp(56px,8vw,120px);align-items:end}
.spread figure{margin:0}
.spread-img{overflow:hidden;background:var(--paper-2)}
.spread-img img{width:100%;height:100%;object-fit:cover}
.spread figcaption{display:flex;justify-content:space-between;gap:10px;margin-top:10px;color:var(--grey)}
.sp-a{grid-column:1/span 5}.sp-a .spread-img{aspect-ratio:4/5}
.sp-b{grid-column:6/span 3;align-self:start}.sp-b .spread-img{aspect-ratio:4/5}
.sp-c{grid-column:9/span 4}.sp-c .spread-img{aspect-ratio:4/5}
.sp-d{grid-column:2/span 4}.sp-d .spread-img{aspect-ratio:4/5}
.sp-e{grid-column:7/span 6}.sp-e .spread-img{aspect-ratio:3/2}
.pull{grid-column:6/span 6;margin:clamp(40px,6vw,90px) 0;font:500 clamp(22px,2.4vw,38px)/1.15 var(--f-sans);letter-spacing:-.03em}
.pull small{display:block;margin-top:14px;color:var(--grey)}
@media (max-width:760px){
  .sp-a,.sp-b,.sp-c,.sp-d,.sp-e,.pull{grid-column:1/-1}
  .sp-b,.sp-c{grid-column:span 6}
}

/* numbered detail list */
.points{list-style:none;margin:clamp(48px,7vw,100px) 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-l)}
.dark .points{border-color:var(--line-d)}
.points li{padding:26px 28px 36px 0;border-bottom:1px solid var(--line-l)}
.dark .points li{border-color:var(--line-d)}
.points b{display:block;margin-bottom:28px;color:var(--grey)}
.points h3{margin:0 0 10px;font:500 clamp(19px,1.5vw,24px)/1.15 var(--f-sans);letter-spacing:-.02em}
.points p{margin:0;color:#4a4a4e;font-size:15px}
.dark .points p{color:#a7a7ac}
@media (max-width:900px){.points{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.points{grid-template-columns:1fr}}

/* privacy: crossed-out list */
.nope{list-style:none;margin:clamp(40px,6vw,80px) 0 0;padding:0}
.nope li{position:relative;display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:clamp(14px,1.6vw,22px) 0;border-bottom:1px solid var(--line-d);font:800 clamp(30px,6.4vw,104px)/.95 var(--f-wide);font-stretch:125%;letter-spacing:-.03em;text-transform:uppercase;color:var(--grey-d)}
.nope li span.mono{flex:none;color:var(--grey);font-size:11px;letter-spacing:.08em}
.nope li::after{content:"";position:absolute;left:0;top:54%;height:clamp(3px,.5vw,7px);width:0;background:var(--red);transition:width 1.1s var(--ease)}
.nope.in li::after{width:calc(100% - 140px)}
.nope.in li:nth-child(2)::after{transition-delay:.12s}.nope.in li:nth-child(3)::after{transition-delay:.24s}.nope.in li:nth-child(4)::after{transition-delay:.36s}.nope.in li:nth-child(5)::after{transition-delay:.48s}
.yes{margin-top:clamp(40px,6vw,80px);font:800 clamp(30px,6.4vw,104px)/.95 var(--f-wide);font-stretch:125%;letter-spacing:-.03em;text-transform:uppercase}
@media (max-width:600px){.nope li span.mono{display:none}.nope.in li::after{width:100%}}

/* ───────── platform demos ───────── */
.demos{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(12px,1.6vw,24px);margin-top:clamp(56px,8vw,120px)}
.demo{position:relative;border-radius:22px;background:var(--ink-2);border:1px solid var(--line-d);padding:clamp(20px,2.2vw,32px);overflow:hidden;display:flex;flex-direction:column;min-height:440px}
.demo h3{margin:0;font:500 clamp(22px,2vw,32px)/1.08 var(--f-sans);letter-spacing:-.03em}
.demo p{margin:10px 0 0;max-width:420px;color:#a7a7ac;font-size:15px}
.demo .mono.tag{color:var(--grey);margin-bottom:18px}
.demo-stage{margin-top:auto;padding-top:28px}
.d-formats{grid-column:8/span 5}.d-retouch{grid-column:1/span 5}.d-spec{grid-column:6/span 4}.d-book{grid-column:10/span 3}
@media (max-width:1100px){.d-gallery,.d-formats{grid-column:1/-1}.d-retouch{grid-column:1/span 7}.d-spec{grid-column:8/span 5}.d-book{grid-column:1/-1}}
@media (max-width:760px){.d-retouch,.d-spec{grid-column:1/-1}.demo{min-height:0}}

/* gallery mock */
.gx-window{border-radius:14px;background:#0f0f11;border:1px solid var(--line-d);overflow:hidden}
.gx-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--line-d);color:var(--grey)}
.gx-bar i{width:8px;height:8px;border-radius:50%;background:#2a2a2e}
.gx-bar .mono{margin-left:6px}
.gx-bar .ok{margin-left:auto;color:#bfbfc4;display:flex;align-items:center;gap:6px}
.gx-bar .ok::before{content:"";width:6px;height:6px;border-radius:50%;background:#3ddc84}
.gx-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;padding:10px}
.gx-grid div{position:relative;aspect-ratio:4/5;border-radius:6px;overflow:hidden;background:#1b1b1e}
.gx-grid img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);opacity:0;transition:opacity .6s var(--ease),transform .9s var(--ease)}
.in .gx-grid img{opacity:1;transform:none}
.gx-grid div:nth-child(n){}
.gx-grid div.fav::after{content:"★";position:absolute;top:5px;right:6px;font-size:10px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.gx-grid div.fav{outline:1.5px solid rgba(255,255,255,.9);outline-offset:-1.5px}
@media (max-width:560px){.gx-grid{grid-template-columns:repeat(4,1fr)}.gx-grid div:nth-child(n+9){display:none}}

/* formats */
.fmt figure:nth-child(3) .f{transition-delay:.2s}.fmt figure:nth-child(4) .f{transition-delay:.3s}
.f-bw img{filter:grayscale(1) contrast(1.08)}

/* retouch one-tap */
/* before/after (real pairs only) */

/* spec card */
.spec{border-radius:14px;border:1px solid var(--line-d);background:#0f0f11;font:400 13px/1.2 var(--f-mono)}
.spec div{display:flex;justify-content:space-between;padding:12px 14px;border-bottom:1px solid var(--line-d)}
.spec div:last-child{border:0}
.spec span{color:var(--grey)}
.spec .sw{display:inline-block;width:12px;height:12px;border-radius:3px;background:#6d6f73;vertical-align:-2px;margin-right:6px}

/* booking mock */
.cal{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.cal span{display:grid;place-items:center;height:36px;border-radius:9px;border:1px solid var(--line-d);font:500 12px var(--f-mono);color:#cfcfd4}
.cal span.x{color:#47474b;text-decoration:line-through}
.cal span.on{background:var(--white);color:var(--ink);border-color:var(--white)}
.cal-h{display:flex;justify-content:space-between;color:var(--grey);margin-bottom:10px}

/* ───────── sessions ───────── */
.loc-toggle{position:relative;display:inline-grid;grid-template-columns:1fr 1fr;padding:4px;border-radius:999px;background:#1a1a1d;margin-bottom:28px}
.loc-thumb{position:absolute;top:4px;bottom:4px;left:4px;width:calc(50% - 4px);border-radius:999px;background:var(--white);transition:transform .45s var(--ease)}
.loc-toggle[data-mode="office"] .loc-thumb{transform:translateX(100%)}
.loc-opt{position:relative;z-index:1;padding:10px 22px;border-radius:999px;text-align:left;transition:color .3s}
.loc-opt[aria-selected="true"]{color:var(--ink)}
.loc-main{display:block}.loc-sub{display:block;opacity:.6;font-size:10px;margin-top:2px}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,1.4vw,20px)}
.tier{position:relative;display:flex;flex-direction:column;min-height:420px;padding:clamp(22px,2.2vw,32px);border-radius:22px;border:1px solid var(--line-d);background:var(--ink-2);transition:border-color .3s,transform .5s var(--ease)}
.tier:hover{border-color:rgba(255,255,255,.5);transform:translateY(-4px)}
.tier .n{color:var(--grey)}
.tier h3{margin:28px 0 0;font:800 clamp(40px,4.4vw,72px)/.9 var(--f-wide);font-stretch:125%;letter-spacing:-.03em;text-transform:uppercase}
.tier ul{list-style:none;margin:22px 0 0;padding:0;color:#b4b4b9;font-size:14px}
.tier li{padding:7px 0;border-bottom:1px solid var(--line-d)}
.tier .p{margin-top:auto;padding-top:28px;display:flex;justify-content:space-between;align-items:flex-end}
.tier .amt-w{font:800 clamp(32px,3vw,46px)/1 var(--f-wide);font-stretch:125%}
.tier .cur{font-size:.55em;vertical-align:.55em;margin-right:2px}
.tier .go{display:inline-flex;align-items:center;height:40px;padding:0 18px;border-radius:999px;background:var(--white);color:var(--ink);font-size:14px;font-weight:500}
.tier .book-sub{display:block;margin-top:6px;color:var(--grey)}
.tier.feat{background:var(--white);color:var(--ink);border-color:var(--white)}
.tier.feat ul{color:#4a4a4e}.tier.feat li{border-color:var(--line-l)}
.tier.feat .go{background:var(--ink);color:var(--white)}
@media (max-width:900px){.tiers{grid-template-columns:1fr}.tier{min-height:0}}
.extras{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:clamp(28px,4vw,48px);border-top:1px solid var(--line-d)}
.extras a{display:flex;justify-content:space-between;padding:18px 18px 18px 0;border-bottom:1px solid var(--line-d);color:#cfcfd4}
.extras a span:last-child{color:var(--grey)}
@media (max-width:760px){.extras{grid-template-columns:1fr}}
.note{margin-top:22px;max-width:760px;color:var(--grey);font-size:14px}

/* teams grid */
.team{margin-top:clamp(64px,9vw,130px)}
.team-head,.tg-row{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center}
.team-head{padding:0 0 12px;color:var(--grey);border-bottom:1px solid var(--line-d)}
.tg-row{border-bottom:1px solid var(--line-d)}
.tg-row>span{padding:14px 0;font:500 15px var(--f-mono)}
.tc-cell{display:block;padding:14px 0;font:500 clamp(16px,1.3vw,20px) var(--f-sans);transition:padding .3s var(--ease),color .2s}
.tc-cell:hover{padding-left:10px}
.tc-cell::after{content:" →";opacity:0;transition:opacity .2s}.tc-cell:hover::after{opacity:1}
.tg-more{display:none}
.team.is-open .tg-more{display:grid}
.tg-toggle{margin-top:18px;height:40px;padding:0 18px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.4)}
.team.is-open .tg-toggle{display:none}

/* ───────── FAQ ───────── */
.faq-wrap{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px)}
.faq-side{grid-column:1/span 4}
.faq-side .stick{position:sticky;top:96px}
.faq-side h2{margin:0;font:800 clamp(44px,6vw,104px)/.88 var(--f-wide);font-stretch:125%;letter-spacing:-.04em;text-transform:uppercase}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.chip{height:34px;padding:0 14px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-l);font:500 11px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;transition:background .2s,color .2s}
.chip[aria-pressed="true"]{background:var(--ink);color:var(--white);box-shadow:none}
.faq-list{grid-column:6/span 7}
.faq-group{margin:0 0 56px}
.faq-group>h3{margin:0 0 6px;color:var(--grey)}
details{border-bottom:1px solid var(--line-l)}
summary{list-style:none;display:grid;grid-template-columns:1fr 24px;gap:16px;align-items:center;padding:20px 0;cursor:pointer;font:500 clamp(17px,1.35vw,21px)/1.25 var(--f-sans);letter-spacing:-.015em}
summary::-webkit-details-marker{display:none}
summary .x{position:relative;width:14px;height:14px;justify-self:end}
summary .x::before,summary .x::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;background:currentColor;transition:transform .35s var(--ease)}
summary .x::after{transform:rotate(90deg)}
details[open] summary .x::after{transform:rotate(0)}
details p{margin:0;padding:0 40px 24px 0;color:#45454a;max-width:680px}
details a{text-decoration:underline;text-underline-offset:3px}
.faq-group[hidden]{display:none}
@media (max-width:900px){.faq-side,.faq-list{grid-column:1/-1}.faq-side .stick{position:static;margin-bottom:40px}}

/* clients */
.clients{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid var(--line-l);border-left:1px solid var(--line-l);margin-top:clamp(40px,6vw,80px)}
.clients div{display:grid;place-items:center;aspect-ratio:2/1;border-right:1px solid var(--line-l);border-bottom:1px solid var(--line-l);padding:18%}
.clients img{max-height:34px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.8}
.clients img[src$=".svg"]{filter:grayscale(1) brightness(0);opacity:.72}
@media (max-width:760px){.clients{grid-template-columns:repeat(3,1fr)}}

/* ───────── footer ───────── */
.foot{background:var(--ink);color:#cfcfd4;padding:clamp(64px,8vw,110px) 0 var(--gut);overflow:hidden}
.foot-cols{display:grid;grid-template-columns:repeat(4,1fr);gap:28px}
.foot-cols div{display:flex;flex-direction:column;gap:8px;font-size:14px}
.foot-cols .mono{color:var(--grey);margin-bottom:8px}
.foot-cols a:hover{color:#fff}
.foot-mark{display:flex;align-items:center;gap:clamp(12px,2vw,30px);margin-top:clamp(64px,9vw,140px);color:#fff}
.foot-mark svg{width:clamp(60px,12vw,190px);height:auto;flex:none}
.foot-mark b{font:800 clamp(80px,21vw,360px)/.78 var(--f-wide);font-stretch:125%;letter-spacing:-.05em}
.foot-base{display:flex;justify-content:space-between;gap:16px;margin-top:28px;padding-top:16px;border-top:1px solid var(--line-d);color:var(--grey)}
@media (max-width:760px){.foot-cols{grid-template-columns:1fr 1fr}}

/* booking modal tweaks to match */
.book-modal .book-dialog{border-radius:20px!important}

/* giant cover words: clip reveal when the cover arrives (IO adds .in) */
@media (prefers-reduced-motion:no-preference){
  .cover:not(.hero) .cover-wordbox .cover-word{clip-path:inset(0 0 100% 0);transform:translateY(.22em);transition:clip-path 1.1s var(--ease),transform 1.1s var(--ease)}
  .cover:not(.hero) .cover-wordbox.in .cover-word{clip-path:inset(0 0 0 0);transform:none}
}
@media (max-width:600px){
  .cover-lines{display:none}
  .cover-head>p.mono{display:none}
  .cover-head p{font-size:14px;margin-top:10px}
  .cover-cta{height:40px;padding:0 18px;margin-top:16px}
  .cover::after,.cover.pt::after{background:linear-gradient(180deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,0) 22%,rgba(0,0,0,0) 40%,rgba(0,0,0,.88) 78%)}
}

/* ───────── v4 additions ───────── */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,1.6vw,24px);counter-reset:s}
.steps li{position:relative;padding-top:28px;border-top:2px solid var(--ink)}
.steps li::before{content:"";position:absolute;top:-2px;left:0;height:2px;width:0;background:var(--red);transition:width 1.2s var(--ease)}
.steps li.in::before{width:38%}
.steps b{display:block;color:var(--grey);margin-bottom:40px}
.steps h3{margin:0 0 10px;font:500 clamp(22px,1.9vw,30px)/1.08 var(--f-sans);letter-spacing:-.03em}
.steps p{margin:0;color:#4a4a4e;font-size:15px;max-width:300px}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr;row-gap:44px}}
@media (max-width:520px){.steps{grid-template-columns:1fr}}
.points.two{grid-template-columns:1fr 1fr}
@media (max-width:560px){.points.two{grid-template-columns:1fr}}

/* split media cover (studios) */
.split{position:absolute;inset:0;display:grid;grid-template-columns:1fr 1fr}
.split>*{width:100%;height:100%;object-fit:cover}
.split::after{content:"";position:absolute;top:0;bottom:0;left:50%;width:1px;background:rgba(255,255,255,.35)}
@media (max-width:700px){.split{grid-template-columns:1fr;grid-template-rows:1fr 1fr}.split::after{top:50%;left:0;right:0;bottom:auto;width:auto;height:1px}}

.studios{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,24px)}
.studio{display:flex;flex-direction:column;gap:10px;padding:clamp(22px,2.2vw,32px);border-radius:22px;background:var(--white);min-height:340px}
.studio .mono{color:var(--grey)}
.studio h3{margin:18px 0 6px;font:800 clamp(30px,3vw,48px)/.92 var(--f-wide);font-stretch:125%;letter-spacing:-.03em;text-transform:uppercase}
.studio p{margin:0;color:#3d3d40}
.studio .muted{margin-top:auto}
.studio.soon{background:transparent;box-shadow:inset 0 0 0 1px var(--line-l)}
.go-dark,.go-ghost{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 20px;border-radius:999px;font-size:14px;font-weight:500;margin-top:14px;align-self:flex-start}
.go-dark{background:var(--ink);color:var(--white)}
.go-ghost{box-shadow:inset 0 0 0 1px var(--ink)}
@media (max-width:900px){.studios{grid-template-columns:1fr}.studio{min-height:0}}

.team-intro{align-items:end;margin-bottom:clamp(36px,5vw,64px)}
.lede-s{grid-column:1/span 7;margin:0;font:500 clamp(20px,1.9vw,30px)/1.2 var(--f-sans);letter-spacing:-.025em}
.bgs{grid-column:9/span 4;display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.bgs span{height:32px;display:inline-flex;align-items:center;padding:0 12px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line-d);color:#cfcfd4}
@media (max-width:900px){.lede-s,.bgs{grid-column:1/-1}.bgs{justify-content:flex-start;margin-top:22px}}
.call-quiet{margin:18px 0 0!important;color:rgba(255,255,255,.6)!important;font-size:11px!important}
.call-quiet a{color:#fff;text-decoration:underline;text-underline-offset:3px}

/* logo wall (ported from /about) */
.logowall{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line-l);border-left:1px solid var(--line-l)}
.lw-cell{position:relative;display:flex;align-items:center;justify-content:center;min-height:clamp(84px,9vw,128px);margin:0;padding:clamp(14px,2vw,26px);border-right:1px solid var(--line-l);border-bottom:1px solid var(--line-l);overflow:hidden}
.lw-cell img{max-width:100%;max-height:clamp(30px,3.4vw,50px);width:auto;height:auto;object-fit:contain;filter:grayscale(1) brightness(0);opacity:.6;transition:opacity .3s}
.lw-cell:hover img{opacity:.9}
.lw-cell img[src*="friedfrank"],.lw-cell img[src*="td-bank"]{filter:none}
.lw-cell img[src*="columbia"],.lw-cell img[src*="financial-times"],.lw-cell img[src*="united-nations"],.lw-cell img[src*="unesco"],.lw-cell img[src*="blue-owl"],.lw-cell img[src*="mitsubishi"],.lw-cell img[src*="merrill-lynch"],.lw-cell img[src*="friedfrank"]{transform:scale(1.35)}
.lw-cell img[src*="morgan-stanley"]{transform:scale(1.22)}
.lw-cell img[src*="axa"]{transform:scale(1.28)}
.lw-cell img[src*="holland-knight"],.lw-cell img[src*="sullivan-cromwell"],.lw-cell img[src*="wealthspire"],.lw-cell img[src*="susman-godfrey"],.lw-cell img[src*="mubadala"],.lw-cell img[src*="synthesia"],.lw-cell img[src*="walker-dunlop"],.lw-cell img[src*="duane-morris"],.lw-cell img[src*="investec"],.lw-cell img[src*="brightwood"],.lw-cell img[src*="swiss-re"]{transform:scale(1.2)}
.lw-cell img[src*="AdlerPl"],.lw-cell img[src*="raymond-james"],.lw-cell img[src*="jpmorgan"]{transform:scale(1.25)}
.lw-cell::after{content:"";position:absolute;inset:0;background:var(--ink);transform:scaleX(0);transform-origin:left;pointer-events:none}
.lw-cell.sweep::after{animation:lwSweep 1.2s cubic-bezier(.65,0,.35,1) forwards}
@keyframes lwSweep{0%{transform:scaleX(0);transform-origin:left}49%{transform:scaleX(1);transform-origin:left}51%{transform:scaleX(1);transform-origin:right}100%{transform:scaleX(0);transform-origin:right}}
@media (max-width:760px){.logowall{grid-template-columns:repeat(3,1fr)}.lw-cell:nth-child(n+16){display:none}}

#studios::after{background:linear-gradient(90deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.15) 55%,rgba(0,0,0,0) 100%),linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,.65) 100%)}

/* ───────── v5 ───────── */
.w-dim{color:#8b8b8f}
.light .w-dim{color:#9a9a9e}
.samples{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(8px,1.2vw,16px);margin-top:clamp(28px,4vw,48px)}
.samples figure{margin:0}
.samples img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px;background:var(--paper-2)}
.samples figcaption{margin-top:10px;color:var(--grey)}
@media (max-width:900px){.samples{grid-template-columns:repeat(3,1fr)}}
.industries{margin-top:clamp(40px,5vw,72px);border-top:1px solid var(--line-l);border-bottom:1px solid var(--line-l);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ind-track{display:flex;gap:44px;width:max-content;padding:18px 0;animation:marq 48s linear infinite}
.ind-track span{white-space:nowrap;color:#3d3d40}
.ind-track span::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--red);margin-right:14px;vertical-align:1px}
@keyframes marq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ind-track{animation:none;flex-wrap:wrap;width:auto}}
.tp{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.6vw,24px);margin-bottom:clamp(48px,6vw,80px)}
.tp-card{display:flex;flex-direction:column;gap:12px;padding:clamp(22px,2.4vw,36px);border-radius:22px;border:1px solid var(--line-d);background:var(--ink-2)}
.tp-card .mono{color:var(--grey)}
.tp-price{font:800 clamp(48px,6vw,96px)/.9 var(--f-wide);font-stretch:125%;letter-spacing:-.04em;margin-top:10px}
.tp-card p{margin:0;color:#b9b9bd;max-width:440px}
.tp-card strong{color:#fff;font-weight:500}
.tp-card .muted{margin-top:auto;padding-top:14px}
@media (max-width:760px){.tp{grid-template-columns:1fr}}
.team{margin-top:0}

/* redline over the word only */
.nope li::after{display:none}
.nope li .t{position:relative;display:inline-block}
.nope li .t::after{content:"";position:absolute;left:-.04em;top:52%;height:clamp(3px,.45vw,7px);width:0;background:var(--red);transition:width .9s var(--ease)}
.nope.in li .t::after{width:calc(100% + .08em)}
.nope.in li:nth-child(2) .t::after{transition-delay:.14s}.nope.in li:nth-child(3) .t::after{transition-delay:.28s}.nope.in li:nth-child(4) .t::after{transition-delay:.42s}

/* ───────── v6: no light sections — "light" becomes a raised charcoal ───────── */
.light{background:#141416;color:var(--white)}
.light .kick,.light .points,.light .points li,.light details,.light .industries,.light .stats{border-color:var(--line-d)}
.light .lede em{color:var(--grey-d)}
.light .body-col,.light .points p,.light .steps p,.light details p{color:#a9a9ae}
.light .steps li{border-top-color:rgba(255,255,255,.22)}
.light .spread-img,.light .samples img{background:#1d1d20}
.light .chip{box-shadow:inset 0 0 0 1px var(--line-d)}
.light .chip[aria-pressed="true"]{background:var(--white);color:var(--ink)}
.light .ind-track span{color:#b9b9bd}
.light .w-dim{color:#8b8b8f}
.light .faq-side .mono a{color:#fff}
.nav.is-light{color:var(--white);background:rgba(11,11,12,.72)}

.logowall{border-color:var(--line-d)}
.lw-cell{border-color:var(--line-d)}
.lw-cell img{filter:grayscale(1) brightness(0) invert(1);opacity:.55}
.lw-cell img[src*="friedfrank"],.lw-cell img[src*="td-bank"]{filter:grayscale(1) brightness(0) invert(1)}
.lw-cell::after{background:#fff}
#newyork::after,#miami::after{background:linear-gradient(90deg,rgba(0,0,0,.62) 0%,rgba(0,0,0,.2) 55%,rgba(0,0,0,0) 100%),linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,.6) 100%)}
.lw-cell::after{background:#2a2a2e}

/* ───────── v7: team looks + prepare ───────── */
.looks{display:flex;flex-direction:column;gap:clamp(28px,4vw,56px);margin-top:clamp(32px,4vw,56px)}
.look{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,9fr);gap:clamp(12px,1.6vw,24px);align-items:end;padding-top:clamp(20px,2.4vw,32px);border-top:1px solid var(--line-d)}
.look-cap b{display:block;color:var(--grey);margin-bottom:16px}
.look-cap h3{margin:0 0 10px;font:500 clamp(22px,2vw,32px)/1.05 var(--f-sans);letter-spacing:-.03em}
.look-cap p{margin:0;color:#a9a9ae;font-size:15px;max-width:300px}
.look-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(8px,1vw,14px)}
.look-tiles img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px;background:#1d1d20}
@media (max-width:760px){.look{grid-template-columns:1fr}}
.looks-bgs{justify-content:flex-start!important;margin-top:clamp(28px,3vw,40px)}
.looks-bgs .lbl{box-shadow:none!important;color:var(--grey)!important;padding-left:0!important}
.prep{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,24px)}
.prep-col{padding:clamp(22px,2.2vw,32px);border-radius:22px;background:#1b1b1e}
.prep-col b{display:block;color:var(--grey);margin-bottom:22px}
.prep-col h3{margin:18px 0 6px;font:500 19px/1.2 var(--f-sans);letter-spacing:-.015em}
.prep-col h3:first-of-type{margin-top:0}
.prep-col p{margin:0;color:#a9a9ae;font-size:15px}
@media (max-width:900px){.prep{grid-template-columns:1fr}}

/* ───────── v8: no bento boxes, originals, progress ───────── */
/* looks: company samples exactly as delivered (no crop, no frames) */
.looks{display:flex;flex-direction:column;gap:clamp(40px,5vw,72px);margin-top:clamp(40px,5vw,72px)}
.look{margin:0;display:block;padding:0;border:0}
.look figcaption{display:flex;gap:18px;align-items:baseline;padding-bottom:14px;margin-bottom:16px;border-bottom:1px solid var(--line-d);color:var(--grey)}
.look figcaption b{color:#fff;font-weight:500}
.look-row{display:flex;gap:clamp(6px,.8vw,12px)}
.look-row img{flex:1 1 0;min-width:0;width:100%;height:auto;display:block}
.look-row.one img{flex:none;width:100%}
@media (max-width:760px){.look-row{flex-direction:column}}
.bgs-line{margin:clamp(28px,3vw,40px) 0 0;color:var(--grey)}
.pull-xl{margin:clamp(72px,10vw,150px) 0 0;font:800 clamp(40px,7.4vw,124px)/.9 var(--f-wide);font-stretch:125%;letter-spacing:-.04em;text-transform:uppercase}

/* How we work: one red progress bar that fills at Delivery */
.steps.progress.go li:nth-child(2) b{transition-delay:.85s}.steps.progress.go li:nth-child(3) b{transition-delay:1.5s}.steps.progress.go li:nth-child(4) b{transition-delay:2.2s;color:var(--red)}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
  }
}
@keyframes fillbar{to{transform:scaleX(1)}}
@media (max-width:900px){.steps.progress::before,.steps.progress::after{display:none}.steps.progress li{border-top:3px solid rgba(255,255,255,.14)}}

/* flatten every card */
.demo,.prep-col,.tp-card,.tier,.studio{background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:28px 0 0!important;border-top:1px solid var(--line-d)!important;min-height:0}
.demos{row-gap:clamp(48px,6vw,88px);column-gap:clamp(24px,3vw,48px)}
.demo .demo-stage{padding-top:22px}
.tier{min-height:0;transform:none!important}
.tier:hover{border-color:var(--line-d)!important}
.tier.feat{background:none!important;color:#fff!important;border-top:3px solid var(--red)!important;padding-top:26px!important}
.tier.feat ul{color:#b4b4b9}.tier.feat li{border-color:var(--line-d)}
.tier.feat .go{background:#fff;color:var(--ink)}
.tiers,.tp,.prep{column-gap:clamp(24px,3vw,48px)}
.gx-window,.spec{border-radius:6px}

/* ───────── v9 ───────── */
/* How we work: a static line per stage, red share grows to full at Delivery */
.steps.stages li{border-top:0;padding-top:30px;position:relative}
.steps.stages li::before{display:block!important;content:"";position:absolute;left:0;right:0;top:0;height:3px;width:auto!important;background:linear-gradient(90deg,var(--red) 0 var(--f),rgba(255,255,255,.16) var(--f) 100%);transition:none!important}
.steps.stages li:nth-child(1){--f:25%}.steps.stages li:nth-child(2){--f:50%}.steps.stages li:nth-child(3){--f:75%}.steps.stages li:nth-child(4){--f:100%}
.steps.stages li:nth-child(4) b{color:var(--red)}
/* SYSTEM */
.sys{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4vw,72px);margin-top:clamp(48px,6vw,88px);align-items:start}
.sys-spec{font:400 13px/1.2 var(--f-mono);border-top:3px solid var(--red)}
.sys-h{display:flex;justify-content:space-between;padding:14px 0;color:var(--grey);border-bottom:1px solid var(--line-d)}
.sys-h .ok{color:#bfbfc4;display:flex;align-items:center;gap:6px}.sys-h .ok::before{content:"";width:6px;height:6px;border-radius:50%;background:#3ddc84}
.sys-row{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line-d)}
.sys-row span{color:var(--grey)}.sys-row b{font-weight:500;text-align:right}
.sys-row .sw{display:inline-block;width:12px;height:12px;border-radius:3px;background:#3a3a40;vertical-align:-2px;margin-right:8px}
.sys-points{grid-template-columns:1fr!important;margin-top:0!important}
.pull-sub{margin:22px 0 0;max-width:640px;color:#a9a9ae;font-size:clamp(16px,1.3vw,20px);line-height:1.5}
@media (max-width:900px){.sys{grid-template-columns:1fr}}
/* platform demos after moving the spec card to SYSTEM */
.d-book{grid-column:8/span 5}
@media (max-width:1100px){.d-retouch{grid-column:1/span 7}.d-book{grid-column:8/span 5}}
@media (max-width:760px){.d-retouch,.d-book{grid-column:1/-1}}
.look-row.tall img{flex:1 1 0}

/* ───────── v10: real gallery UI ───────── */
.gv{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,4fr);grid-template-rows:1fr auto;gap:clamp(14px,1.6vw,24px);align-items:end}
@media (max-width:760px){.gv{grid-template-columns:1fr}.gv-photo{grid-row:auto}}
.d-retouch{grid-column:7/span 6}
@media (max-width:900px){.d-formats,.d-retouch{grid-column:1/-1}}
.gv{grid-template-rows:auto 1fr;align-items:start}

/* ═════ v11 — real gallery, admin portal, GX meter, studio pages ═════ */
.points.four{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.points.four{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.points.four{grid-template-columns:1fr}}
.sys-cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:clamp(36px,5vw,64px)}
.sys-cta .cover-cta{margin-top:0}
.muted{color:var(--grey)}

/* How we work — the GX progress meter, one per stage */
@keyframes pcPillOn{
  0%{background:rgba(255,255,255,.06);box-shadow:inset 0 1px .5px rgba(255,255,255,.16),inset 0 -1px .5px rgba(0,0,0,.45),0 0 0 .5px rgba(255,255,255,.10)}
  55%{background:linear-gradient(to bottom,#ffffff 0%,#EEF4B8 40%,#b8ea62 100%);box-shadow:inset 0 .5px .5px #fff,0 0 0 1px rgba(163,219,74,1),0 0 10px 2px rgba(163,219,74,1),0 0 24px 6px rgba(163,219,74,.9),0 0 44px 11px rgba(163,219,74,.5)}
  100%{background:linear-gradient(to bottom,#ffffff 0%,#EEF4B8 40%,#A3DB4A 100%);box-shadow:inset 0 .5px .5px rgba(255,255,255,.95),0 0 0 .5px rgba(163,219,74,.9),0 0 6px 1px rgba(163,219,74,.95),0 0 16px 3px rgba(163,219,74,.6),0 0 30px 7px rgba(163,219,74,.28)}
}
.steps.stages li::before{display:none!important}
.steps.stages li{padding-top:0}
.steps.stages li:nth-child(4) b{color:inherit}
.stg{display:flex;gap:5px;margin:0 0 26px;max-width:220px}
.stg i,.pcRoot .meter i{flex:1;height:10px;border-radius:999px;background:rgba(255,255,255,.06);box-shadow:inset 0 1px .5px rgba(255,255,255,.16),inset 0 -1px .5px rgba(0,0,0,.45),0 0 0 .5px rgba(255,255,255,.10)}
.steps.stages li.in .stg i.on,.pcRoot.in .meter i[data-on="true"]{animation:pcPillOn .8s ease-out forwards}
.stg i:nth-child(1),.pcRoot .meter i:nth-child(1){animation-delay:.25s!important}
.stg i:nth-child(2),.pcRoot .meter i:nth-child(2){animation-delay:.33s!important}
.stg i:nth-child(3),.pcRoot .meter i:nth-child(3){animation-delay:.41s!important}
.stg i:nth-child(4),.pcRoot .meter i:nth-child(4){animation-delay:.49s!important}
.pcRoot .meter i:nth-child(5){animation-delay:.57s!important}.pcRoot .meter i:nth-child(6){animation-delay:.65s!important}
.pcRoot .meter i:nth-child(7){animation-delay:.73s!important}.pcRoot .meter i:nth-child(8){animation-delay:.81s!important}
.pcRoot .meter i:nth-child(9){animation-delay:.89s!important}.pcRoot .meter i:nth-child(10){animation-delay:.97s!important}
@media (prefers-reduced-motion:reduce){.steps.stages li .stg i.on,.pcRoot .meter i[data-on="true"]{animation:pcPillOn .01s forwards}}

/* Efficient — the admin portal, rendered with the portal's own styles */
.eff{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(32px,5vw,88px);align-items:center;margin-top:clamp(48px,7vw,100px)}
.eff-k{color:var(--grey)}
.eff-copy h3{margin:16px 0 18px;font:500 clamp(28px,3vw,44px)/1.05 var(--f-sans);letter-spacing:-.03em}
.eff-copy p{color:#a7a7ac;font-size:16px;max-width:30em;margin:0 0 14px}
@media (max-width:900px){.eff{grid-template-columns:1fr}}
.pcRoot{--lime:#a3db4a;--line:rgba(255,255,255,.06);--muted:#8b8f98;--sub:#a8a8ac;background:#000;color:#e4e4e7;border-radius:22px;
  font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;max-height:760px;overflow:hidden;position:relative;
  box-shadow:0 0 0 1px rgba(255,255,255,.07),0 40px 120px -40px rgba(0,0,0,.9)}
.pcRoot::after{content:"";position:absolute;left:0;right:0;bottom:0;height:140px;background:linear-gradient(transparent,#000);pointer-events:none}
.pcRoot *{box-sizing:border-box}
.pcRoot .pcMain{padding:2.2rem clamp(1.1rem,2.6vw,2.2rem) 3rem}
.pcRoot p{margin:0}
.pcRoot .pcH1{font-size:26px;font-weight:600;margin:0 0 .3rem;letter-spacing:-.01em;color:#fff}
.pcRoot .pcKick{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 .25rem}
.pcRoot .when{font-size:15px;color:var(--sub);margin:0 0 .15rem}
.pcRoot .where{font-size:13.5px;color:var(--muted);margin:0 0 1.9rem}
.pcRoot .where b{color:var(--sub);font-weight:600}
.pcRoot .adminTitle{font-size:38px;font-weight:600;margin:0 0 1.6rem;letter-spacing:-.01em;color:#fff;line-height:1.1}
.pcRoot .adminonly{display:block;margin:0 0 .5rem;font-size:10px;font-weight:700;letter-spacing:.08em;color:#ef4444;line-height:1.5}
.pcRoot .lbl{font-size:10px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 .65rem;box-shadow:none;padding:0}
.pcRoot .btn{display:inline-block;background:transparent;color:#fff;border:1px solid #fff;border-radius:999px;padding:.46rem 1.05rem;font-size:12.5px;font-weight:700;line-height:1;transition:background .22s ease,color .22s ease}
.pcRoot .btn:hover{background:#fff;color:#000}
.pcRoot .btn-main{border-width:2px;padding:.72rem 1.6rem;font-size:13px;letter-spacing:.06em}
.pcRoot .btn-q{border-color:rgba(255,255,255,.32);color:var(--sub);font-weight:600}
.pcRoot .btn-q:hover{background:#fff;border-color:#fff;color:#000}
.pcRoot .status{display:flex;align-items:center;gap:.45rem;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--sub);margin:1rem 0 0}
.pcRoot .status i{width:6px;height:6px;border-radius:999px;background:var(--lime);display:inline-block}
.pcRoot .meter{display:flex;gap:5px;margin:.2rem 0 1.8rem}
.pcRoot .rows{border-top:1px solid var(--line)}
.pcRoot .row{display:flex;align-items:center;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.pcRoot .time{width:5.6rem;flex:none;font-size:15px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums}
.pcRoot .row[data-open="true"] .time{color:var(--muted);font-weight:600}
.pcRoot .who{flex:1;min-width:0}
.pcRoot .who .n{font-size:15px;line-height:1.35;color:#e4e4e7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcRoot .who .e{font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcRoot .row[data-open="true"] .who .n{color:var(--muted)}
.pcRoot .acts{flex:none;display:flex;gap:.4rem}
@media (max-width:480px){.pcRoot .who .e{display:none}.pcRoot .time{width:4.6rem}.pcRoot .adminTitle{font-size:30px}}

/* High tech — the real gallery, four views */
.gshow{margin-top:clamp(40px,6vw,80px)}
.gs-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:22px}
.gs-tab{appearance:none;cursor:pointer;display:inline-flex;align-items:center;gap:10px;height:42px;padding:0 18px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:transparent;color:#a7a7ac;font:500 14px/1 var(--f-sans);transition:background .25s,color .25s,border-color .25s}
.gs-tab b{font:500 11px/1 var(--f-mono);color:var(--grey-d)}
.gs-tab:hover{color:#fff;border-color:rgba(255,255,255,.6)}
.gs-tab[aria-selected="true"]{background:#fff;border-color:#fff;color:#000}
.gs-tab[aria-selected="true"] b{color:#8b8b8f}
.gs-stage{position:relative;aspect-ratio:1600/822;border-radius:18px;overflow:hidden;background:#000;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 50px 140px -50px rgba(0,0,0,.9)}
.gs-stage img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s var(--ease)}
.gs-stage img.on{opacity:1}
.gs-caps{position:relative;margin-top:22px;min-height:3.4em}
.gs-caps p{position:absolute;inset:0 auto auto 0;margin:0;max-width:44em;color:#a7a7ac;font-size:16px;opacity:0;transition:opacity .4s}
.gs-caps p b{color:#fff;font-weight:500;margin-right:6px}
.gs-caps p.on{opacity:1;position:relative}
@media (max-width:600px){.gs-tab{height:38px;padding:0 13px;font-size:13px}.gs-tab b{display:none}.gs-stage{border-radius:12px}}

/* Studio pages */
.loc-hero .cover-head h1.h{margin:0}
.loc-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,88px);margin-top:clamp(48px,7vw,100px)}
.lf{margin:0;border-top:1px solid var(--line-d)}
.lf-row{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--line-d)}
.lf dt{color:var(--grey);font-size:12px;padding-top:3px}
.lf dd{margin:0;font-size:16px}
.loc-copy p{margin:0 0 16px;color:#a7a7ac;font-size:17px;line-height:1.55}
.loc-shots{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(8px,1vw,14px)}
.loc-shots figure{margin:0}
.loc-shots img{display:block;width:100%;height:auto;border-radius:6px}
.loc-map{display:block;border-radius:18px;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.loc-map img{display:block;width:100%;height:auto;transition:transform 1.2s var(--ease)}
.loc-map:hover img{transform:scale(1.015)}
.loc-addr{margin:18px 0 0;color:var(--grey)}
.kick a{color:inherit}
.loc-book{display:grid;gap:clamp(56px,7vw,100px);margin-top:clamp(36px,5vw,64px)}
.lb-k{color:var(--grey)}
.lb-col h3{margin:14px 0 14px;font:500 clamp(26px,2.6vw,38px)/1.05 var(--f-sans);letter-spacing:-.03em}
.lb-col>p{color:#a7a7ac;font-size:16px;max-width:40em;margin:0 0 26px}
.lt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.lt{display:flex;flex-direction:column;gap:10px;padding:16px 18px;border-radius:14px;border:1px solid var(--line-d);font:800 26px/1 var(--f-wide);font-stretch:125%;transition:border-color .25s,background .25s,color .25s}
.lt span{font:500 11px/1 var(--f-mono);color:var(--grey);letter-spacing:.06em;text-transform:uppercase}
.lt:hover{background:#fff;color:#000;border-color:#fff}
.lt:hover span{color:#555}
.lb-col .note{margin-top:22px}
.loc-tiers{margin-top:8px}
.loc-nexta{display:flex;flex-direction:column;gap:14px;padding:clamp(40px,6vw,80px) 0;border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d)}
.loc-nexta .mono{color:var(--grey)}
.loc-nextw{font:800 clamp(56px,11vw,190px)/.85 var(--f-wide);font-stretch:125%;letter-spacing:-.04em;text-transform:uppercase;transition:color .3s}
.loc-nexta:hover .loc-nextw{color:var(--red)}
@media (max-width:900px){.loc-split{grid-template-columns:1fr}.loc-shots{grid-template-columns:1fr 1fr}.loc-tiers{grid-template-columns:1fr}}
@media (max-width:520px){.lf-row{grid-template-columns:1fr;gap:4px}}

/* ───────── v12 sweep (principles §2: red only for strikes + live dot; no frames on small content) ───────── */
.ind-track span::before{background:#55555a}
.tier.feat{border-top:1px solid #fff!important;padding-top:28px!important}
.sys-spec{border-top:1px solid var(--line-d)}
.sys-h .ok::before{display:none}
.loc-nexta:hover .loc-nextw{color:#fff}
.loc-nextw{color:#cfcfd4}
.loc-shots img{border-radius:0}
.loc-shots.wide{grid-template-columns:repeat(3,1fr);margin-top:clamp(8px,1vw,14px);align-items:start}
.look-row{align-items:flex-start}
/* booking cells: hairline rows instead of bordered boxes */
.lt-grid{gap:0;column-gap:clamp(16px,2vw,28px);border-top:1px solid var(--line-d)}
.lt{flex-direction:row;justify-content:space-between;align-items:baseline;padding:16px 0;border:0;border-radius:0;border-bottom:1px solid var(--line-d);font-size:22px}
.lt:hover{background:none;color:#fff;border-color:#fff}
.lt:hover span{color:#fff}
/* logo wall: full-bleed, no outer padding, every logo links out */
.lw-bleed{margin-top:clamp(28px,3vw,40px);border-top:1px solid var(--line-d);border-left:0}
.lw-bleed .lw-cell{padding:0}
.lw-bleed .lw-cell:nth-child(5n){border-right:0}
.lw-cell a{display:flex;align-items:center;justify-content:center;width:100%;height:100%;min-height:inherit;padding:clamp(14px,2vw,26px)}
.lw-cell a:focus-visible{outline:1px solid #fff;outline-offset:-6px}
.sec.has-wall{padding-bottom:0}
@media (max-width:760px){.lw-bleed .lw-cell:nth-child(5n){border-right:1px solid var(--line-d)}.lw-bleed .lw-cell:nth-child(3n){border-right:0}.loc-shots.wide{grid-template-columns:1fr}}
.lw-bleed .lw-cell img{max-width:74%}
.lw-cell img[src*="friedfrank"],.lw-cell img[src*="td-bank"]{filter:grayscale(1) invert(1)}

/* ───────── v13: team booking buttons, glyph chips, pricing formulas (live /headshots/team/ merged in) ───────── */
.gchips{display:flex;flex-wrap:wrap;gap:10px 22px;margin:14px 0 16px}
.gchip{display:inline-flex;align-items:center;gap:9px;font:500 11.5px/1.2 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:#b9b9be}
.gchip svg{width:16px;height:16px;flex:none;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.gchip .swatch{width:14px;height:14px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.steps.stages h3{margin:6px 0 0}
.steps.stages .gchips{flex-direction:column;gap:8px;margin:14px 0 14px}
.steps.stages b.mono{margin-bottom:10px}
.looks{gap:clamp(8px,1vw,14px)}
.bgrow{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:clamp(28px,3vw,40px);padding-top:18px;border-top:1px solid var(--line-d)}
.bgs-k{color:var(--grey)}
.bgrow .gchips{margin:0}
.bgrow+.bgs-line{margin-top:14px}
/* pricing formulas */
.tp-price small{display:inline-block;margin-left:12px;font:500 clamp(14px,1.2vw,18px)/1 var(--f-sans);letter-spacing:0;color:var(--grey);vertical-align:.5em}
.tp-card .gchips{margin-top:auto;padding-top:16px}
.specs-note{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding:22px 0;border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d);margin-bottom:clamp(36px,5vw,56px)}
.specs-note p{margin:0;max-width:760px;color:#b9b9bd}
.specs-note strong{color:#fff;font-weight:500}
.specs-note .cover-cta{margin:0}
/* team table: real buttons, as on the live page */
.team-head,.tg-row{grid-template-columns:minmax(96px,1fr) 2fr 2fr;column-gap:clamp(8px,1vw,14px)}
.team-head{border-bottom:0;padding-bottom:10px;align-items:end}
.team-head span:not(:first-child){text-align:center;color:#fff}
.team-head small{display:block;margin-top:4px;color:var(--grey);font-size:10px}
.tg-row{border-bottom:0;padding:5px 0}
.tg-row>span{padding:0;font:500 13px var(--f-mono);letter-spacing:.04em;text-transform:uppercase;color:#cfcfd4}
.tc-cell{display:flex;align-items:center;justify-content:center;padding:14px 8px;border:1px solid rgba(255,255,255,.18);border-radius:12px;background:rgba(255,255,255,.04);font:500 clamp(15px,1.2vw,18px)/1 var(--f-sans);text-align:center;transition:background .2s,color .2s,border-color .2s}
.tc-cell:hover{padding-left:8px;background:#fff;color:#0b0b0c;border-color:#fff}
.tc-cell::after{content:none}
.tg-toggle{margin-top:14px}
/* studio-page booking cells back to buttons */
.lt-grid{gap:8px;column-gap:8px;border-top:0}
.lt{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:10px;padding:16px 18px;border:1px solid rgba(255,255,255,.18);border-radius:12px;background:rgba(255,255,255,.04);font-size:24px}
.lt:hover{background:#fff;color:#0b0b0c;border-color:#fff}
.lt:hover span{color:#555}
/* extras */
.xtras{display:grid;grid-template-columns:repeat(3,1fr);column-gap:clamp(24px,3vw,48px);margin-top:clamp(56px,7vw,96px)}
.xt{display:flex;flex-direction:column;gap:10px;padding-top:24px;border-top:1px solid var(--line-d)}
.xt .mono{color:var(--grey)}
.xt b{font:800 clamp(26px,2.4vw,38px)/1 var(--f-wide);font-stretch:125%;letter-spacing:-.03em}
.xt b small{font:500 14px var(--f-sans);letter-spacing:0;color:var(--grey);margin-left:6px}
.xt p{margin:0;color:#a9a9ae;font-size:15px}
.xt .cover-cta{align-self:flex-start;margin-top:8px;margin-left:0}
@media (max-width:900px){.xtras{grid-template-columns:1fr;row-gap:36px}}
@media (max-width:520px){.team-head,.tg-row{grid-template-columns:78px 1fr 1fr}.tg-row>span{font-size:11px}.tc-cell{padding:13px 4px;font-size:15px}.team-head span{font-size:10px}}

/* ───────── v14: hero video, ESR-style (reveal from a window on black → full bleed at 80%; slow parallax + dim on exit) ───────── */
.hv{background:#000}
.hv .cover-media{background:#000;will-change:transform}
.hv .cover-media video{opacity:.8;animation:hvReveal 1.6s cubic-bezier(.76,0,.24,1) .2s both}
.hv::after{background:linear-gradient(180deg,rgba(0,0,0,.45) 0%,rgba(0,0,0,0) 24%,rgba(0,0,0,0) 52%,rgba(0,0,0,.72) 100%)}
@keyframes hvReveal{0%{clip-path:inset(40% 36% 40% 36%);opacity:0;transform:scale(1.12)}25%{opacity:.8}100%{clip-path:inset(0 0 0 0);opacity:.8;transform:scale(1)}}
.hv .cover-meta,.hv .cover-head>*,.hv .cover-tag{animation:hvUp .9s cubic-bezier(.2,.7,.2,1) both}
.hv .cover-meta{animation-delay:1.25s}
.hv .cover-head>*:nth-child(1){animation-delay:1.35s}.hv .cover-head>*:nth-child(2){animation-delay:1.45s}.hv .cover-head>*:nth-child(3){animation-delay:1.55s}.hv .cover-tag{animation-delay:1.6s}
.hv .cover-word{animation:hvWord 1.1s cubic-bezier(.76,0,.24,1) 1.1s both}
@keyframes hvUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes hvWord{from{clip-path:inset(0 0 100% 0);transform:translateY(22%)}to{clip-path:inset(0 0 -10% 0);transform:none}}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .hv .cover-media{animation:hvPar linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
    @keyframes hvPar{to{transform:translateY(30%);opacity:.35}}
  }
}
@media (prefers-reduced-motion:reduce){.hv .cover-media video,.hv .cover-meta,.hv .cover-head>*,.hv .cover-tag,.hv .cover-word{animation:none!important;clip-path:none!important;opacity:1}.hv .cover-media video{opacity:.8}}
/* v15: ESR grade — darker, moodier video; mono pause control */
.hv .cover-media video{opacity:.6}
@keyframes hvReveal{0%{clip-path:inset(40% 36% 40% 36%);opacity:0;transform:scale(1.12)}25%{opacity:.6}100%{clip-path:inset(0 0 0 0);opacity:.6;transform:scale(1)}}
.hv .cover-media video{filter:saturate(.9) contrast(1.06)}
.hv::after{background:linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,0) 22%,rgba(0,0,0,0) 60%,rgba(0,0,0,.55) 100%)}
.hv-r{display:inline-flex;align-items:center;gap:22px}
.hv-pp{appearance:none;background:none;border:0;padding:6px 0;color:inherit;font:inherit;letter-spacing:inherit;text-transform:uppercase;cursor:pointer;opacity:.82}
.hv-pp:hover,.hv-pp:focus-visible{opacity:1;text-decoration:underline;text-underline-offset:4px}
@media (prefers-reduced-motion:reduce){.hv .cover-media video{opacity:.6}}
.hv-pp{padding:0;line-height:inherit;vertical-align:baseline}.hv-r{align-items:baseline}
.hv .cover-meta{align-items:baseline}
/* v16: highlighted action-bar strip above the Retouch / Format captions */
.gs-bar{display:block;width:min(360px,80%);height:auto;margin:0 0 14px}
.tier-ideal{margin:10px 0 0;color:var(--grey);font-size:14px}
/* v16: gallery as four phone screens, no tabs */
.gphones{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,28px);margin-top:clamp(36px,5vw,64px)}
.gp{margin:0}
.gp img{display:block;width:100%;height:auto;border-radius:clamp(16px,2vw,28px);box-shadow:0 0 0 1px rgba(255,255,255,.08)}
.gp figcaption{padding-top:18px}
.gp figcaption b{display:block;color:var(--grey);margin-bottom:8px}
.gp h3{margin:0 0 6px;font:500 19px/1.2 var(--f-sans);letter-spacing:-.015em}
.gp p{margin:0;color:#a7a7ac;font-size:15px}
@media (max-width:900px){.gphones{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:72%;overflow-x:auto;scroll-snap-type:x mandatory;margin-left:calc(var(--gut)*-1);margin-right:calc(var(--gut)*-1);padding:0 var(--gut);scrollbar-width:none}.gphones::-webkit-scrollbar{display:none}.gp{scroll-snap-align:start}}

/* v16: admin-portal replica restyled with the GX 2026 portal block (same rules as app/t/[token]/page.tsx) */
/* ── 2026 restyle — the irolls.com design system (owner, 2026-10-19) ──────
   Archivo wide (wdth 125 · 800) for the ADMINPORTAL wordmark (ADMIN in the
   site's admin gray, PORTAL white, no gap), Geist for text, Geist Mono for
   labels and times, hairlines instead of boxes around small content, a white
   primary button. The neon pill meter above is untouched — it stays the only
   glow on the page. Fonts come from app/t/[token]/layout.tsx (next/font/local
   vars); the quoted family names are the fallback when the vars are absent
   (the irolls.com replica of this page reuses this block verbatim). */
.pcRoot{--line:rgba(255,255,255,.09);--admin:#8b8b8f;
  --pcw:var(--font-pc-wide,"Archivo"),system-ui,sans-serif;
  --pcs:var(--font-pc-sans,"Geist"),system-ui,-apple-system,"Segoe UI",sans-serif;
  --pcm:var(--font-pc-mono,"Geist Mono"),ui-monospace,SFMono-Regular,Menlo,monospace;
  font-family:var(--pcs)}
.pcRoot .pcMain{max-width:64rem;padding:2.4rem clamp(16px,4vw,40px) 5rem;container-type:inline-size}
.pcRoot .adminonly{font-family:var(--pcm);font-weight:500;font-size:10.5px;letter-spacing:.1em;margin:0 0 1.1rem}
.pcRoot .adminTitle{font-family:var(--pcw);font-weight:800;font-stretch:125%;text-transform:uppercase;
  letter-spacing:-.04em;line-height:.86;white-space:nowrap;color:#fff;
  font-size:10.6vw;font-size:10.6cqi;margin:0 0 clamp(1.8rem,5cqi,3rem)}
.pcRoot .adminTitle .dim{color:var(--admin)}
.pcRoot .pcKick,.pcRoot .kick,.pcRoot .lbl,.pcRoot .status,.pcRoot .mhead .mcols,.pcRoot .fld label{font-family:var(--pcm);font-weight:500;letter-spacing:.08em}
.pcRoot .pcKick,.pcRoot .kick{font-size:11px}
.pcRoot .pcH1,.pcRoot h1{font-family:var(--pcs);font-weight:500;font-size:clamp(28px,4cqi,40px);line-height:1.05;letter-spacing:-.035em;margin:0 0 .45rem}
.pcRoot .when{font-size:16px;color:#cfcfd4}
.pcRoot .where{font-size:14px}
.pcRoot .sharenote{font-size:14px;max-width:40rem}
.pcRoot .btn{font-family:var(--pcs);font-weight:500}
.pcRoot .btn-main{background:#fff;color:#0b0b0c;border:0;height:44px;padding:0 22px;font-size:13px;letter-spacing:.05em}
.pcRoot .btn-main:hover{background:#e4e4e7;color:#0b0b0c}
.pcRoot .linkbox{border:0;border-bottom:1px solid rgba(255,255,255,.18);border-radius:0;padding:.7rem 0;font-family:var(--pcm);font-size:12px}
.pcRoot .time,.pcRoot .mrow .mtime{font-family:var(--pcm);font-weight:500;font-size:14px}
.pcRoot .who .n{font-weight:500}
.pcRoot .mcell{border:0;border-left:1px solid var(--line);border-radius:0;padding:.2rem .75rem}
.pcRoot .mcell[data-empty="true"]{border-style:solid}
.pcRoot .panel{border:0;border-top:1px solid var(--line);border-radius:0;background:none;padding:1.8rem 0 0}
.pcRoot .panel[data-hi="true"]{border-top-color:rgba(255,255,255,.4)}
.pcRoot .panel h2,.pcRoot .sheet-h h2,.pcRoot .dead h2{font-weight:500;letter-spacing:-.02em}
.pcRoot .panel h2{font-size:20px}
.pcRoot .full{border:0;border-left:2px solid rgba(255,255,255,.2);border-radius:0;padding:.2rem 0 .2rem 1rem}
.pcRoot .dead h2{font-size:26px}
.pcRoot .pcMain{padding-left:clamp(16px,3vw,32px);padding-right:clamp(16px,3vw,32px)}
@media (max-width:900px){.gphones{scroll-padding-inline:var(--gut)}}
.pcRoot .btn-main{display:inline-flex;align-items:center;justify-content:center}
/* v18: team pricing — place is the headline, price sits under it */
.tp-where{display:block;font:800 clamp(30px,4.2vw,64px)/.92 var(--f-wide);font-stretch:125%;letter-spacing:-.035em;text-transform:uppercase;margin-top:6px}
.tp-amt{display:block;margin-top:8px;font:500 clamp(17px,1.4vw,21px)/1.3 var(--f-sans);color:#cfcfd4}
.tp-amt b{font:800 clamp(22px,1.9vw,30px)/1 var(--f-wide);font-stretch:125%;letter-spacing:-.02em;color:#fff;margin-right:4px}
/* v19: pricing headings ARE the column headers; pill price buttons */
.team-head.tg-cols{align-items:end;padding-bottom:22px;margin-bottom:6px;border-bottom:1px solid var(--line-d)}
.team-head.tg-cols .tg-k{align-self:end;color:var(--grey);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.tg-col{display:flex;flex-direction:column;text-align:left;color:#fff}
.tg-col .tp-where{margin-top:0}
.tg-col p{margin:10px 0 0;color:#a9a9ae;font:400 14px/1.5 var(--f-sans);text-transform:none;letter-spacing:0;max-width:30em}
.tg-col p strong{color:#fff;font-weight:500}
.tg-col .gchips{margin:14px 0 0;gap:8px 18px}
.tc-cell{border-radius:999px}
.tc-cell:hover{padding-left:8px}
.specs-note{margin:clamp(36px,5vw,56px) 0 0}
.team{margin-top:clamp(28px,4vw,48px)}
.team-head .tg-col span{text-align:left}
.team-head .tg-col .tp-amt{color:#cfcfd4}
@media (max-width:640px){
  .team-head.tg-cols .tg-k{visibility:hidden}
  .tg-col .tp-where{font-size:21px}
  .tg-col .tp-amt{font-size:13px}.tg-col .tp-amt b{font-size:18px}
  .tg-col p{font-size:12.5px}
  .tg-col .gchips{flex-direction:column;gap:6px}
  .tg-col .gchip{font-size:10px;letter-spacing:.03em}
}
.team-head.tg-cols{align-items:start}.team-head.tg-cols .tg-k{align-self:end}
/* v20: other team size + day rates */
.tg-custom{margin-top:6px}
.tg-n{display:flex;flex-direction:column;gap:6px;font:500 11px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--grey)}
.tg-n input{width:84px;height:44px;padding:0 14px;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;font:500 17px var(--f-sans);text-align:center;-moz-appearance:textfield}
.tg-n input:focus{outline:none;border-color:#fff}
.tg-n input::-webkit-inner-spin-button,.tg-n input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
.tg-hint{margin:12px 0 0;color:var(--grey);font-size:11px;letter-spacing:.05em;text-transform:uppercase}
.tg-hint a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.dayrates{margin-top:clamp(48px,6vw,80px)}
.dr-head{display:grid;grid-template-columns:minmax(96px,1fr) 2fr 2fr;column-gap:clamp(8px,1vw,14px);padding-bottom:12px;margin-bottom:6px;border-bottom:1px solid var(--line-d)}
.dr-head .tg-k{color:#fff;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.dr-head .dr-c{color:var(--grey);font-size:11px;letter-spacing:.06em;text-transform:uppercase;text-align:center}
@media (max-width:520px){.dr-head{grid-template-columns:78px 1fr 1fr}.tg-n input{width:68px}}
/* v22: studio pages reuse the main team table; single-column variant for Miami */
.tg-one{grid-template-columns:minmax(96px,1fr) 4fr!important}
.team-head.tg-one .tg-col{max-width:34em}
@media (max-width:520px){.tg-one{grid-template-columns:78px 1fr!important}}
.lb-col .team{margin-top:clamp(24px,3vw,40px)}

/* ═════════════ v24 (2026-10-19): nav Book · text over images on mobile · image boards · motion · HEADSHOTS opening ═════════════ */
@property --nbA{syntax:"<angle>";inherits:false;initial-value:0deg}

/* nav Book: glass pill, light sweeping the rim, arrow chip that floods the pill on hover */
.nav-book{position:relative;display:inline-flex;align-items:center;gap:12px;height:40px;padding:0 4px 0 18px;border-radius:999px;isolation:isolate;overflow:hidden;
  color:#fff;font:500 14px/1 var(--f-sans);letter-spacing:-.005em;background:rgba(255,255,255,.07);
  -webkit-backdrop-filter:blur(16px) saturate(1.6);backdrop-filter:blur(16px) saturate(1.6);transition:color .45s var(--ease)}
.nav-book::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;
  background:conic-gradient(from var(--nbA),rgba(255,255,255,.16) 0deg,rgba(255,255,255,.16) 250deg,#fff 300deg,rgba(255,255,255,.16) 340deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:nbSpin 5s linear infinite}
@keyframes nbSpin{to{--nbA:360deg}}
.nav-book::after{content:"";position:absolute;z-index:-1;right:4px;top:4px;width:32px;height:32px;border-radius:50%;background:#fff;transform:scale(1);transition:transform .6s var(--ease)}
.nb-i{position:relative;width:32px;height:32px;border-radius:50%;overflow:hidden;color:var(--ink);flex:none}
.nb-i svg{position:absolute;inset:0;margin:auto;width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;transition:transform .55s var(--ease)}
.nb-i svg+svg{transform:translate(-150%,150%)}
@media (hover:hover){
  .nav-book:hover{color:var(--ink)}
  .nav-book:hover::after{transform:scale(6)}
  .nav-book:hover .nb-i svg:first-child{transform:translate(150%,-150%)}
  .nav-book:hover .nb-i svg+svg{transform:none}
}
.nav-book:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media (max-width:860px){.nav-book{margin-left:auto;height:38px;padding-left:16px}.nav-book::after,.nb-i{width:30px;height:30px}}
@media (prefers-reduced-motion:reduce){.nav-book::before{animation:none}}

/* page progress hairline under the nav */
@supports (animation-timeline:scroll()){
  @media (prefers-reduced-motion:no-preference){
    .nav::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(255,255,255,.55);transform-origin:0 50%;transform:scaleX(0);animation:navProg linear both;animation-timeline:scroll(root)}
    @keyframes navProg{to{transform:scaleX(1)}}
  }
}

/* mobile: the headline sits ON the photo, not under it — light scrim, image runs to the bottom edge */
@media (max-width:900px){
  .cover::after,.cover.pt::after,.hv::after{background:linear-gradient(180deg,rgba(0,0,0,.42) 0%,rgba(0,0,0,0) 16%,rgba(0,0,0,0) 46%,rgba(0,0,0,.22) 66%,rgba(0,0,0,.58) 100%)}
  .cover-head h2,.cover-head .h{text-shadow:0 1px 24px rgba(0,0,0,.45)}
  .cover-head p{color:#fff;text-shadow:0 1px 14px rgba(0,0,0,.6)}
  .cover-meta{text-shadow:0 1px 10px rgba(0,0,0,.5)}
  .cover-word{text-shadow:0 2px 40px rgba(0,0,0,.25)}
  .cover.pt .cover-media img{object-position:50% 0}
}

/* ── image boards: uncropped samples on an offset grid, each drifting at its own speed ── */
.board{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(12px,1.6vw,24px);row-gap:clamp(20px,3vw,44px);align-items:start;
  margin-top:clamp(48px,7vw,110px);padding-bottom:clamp(40px,7vw,140px);--amp:80px}
.bi{grid-column:var(--c);margin:var(--y) 0 0;position:relative}
.bi-f{overflow:hidden;background:#141416}
.bi img{display:block;width:100%;height:auto;transition:filter .5s var(--ease)}
.js .bi-f{clip-path:inset(100% 0 0 0);transition:clip-path 1.25s var(--ease)}
.js .bi img{transform:scale(1.22);transition:transform 1.8s var(--ease),filter .5s var(--ease)}
.js .bi.in .bi-f{clip-path:inset(0 0 0 0)}
.js .bi.in img{transform:none}
@media (hover:hover){.board:has(.bi:hover) .bi:not(:hover) img{filter:brightness(.42) saturate(.6)}}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference){
    .bi{animation:biDrift linear both;animation-timeline:view();animation-range:cover}
    @keyframes biDrift{from{translate:0 calc(var(--p) * var(--amp))}to{translate:0 calc(var(--p) * var(--amp) * -1)}}
  }
}
@media (max-width:760px){
  .board{grid-template-columns:1fr 1fr;grid-auto-flow:row dense;column-gap:8px;row-gap:10px;--amp:12px;margin-top:36px;padding-bottom:40px}
  .bi{grid-column:var(--ms);margin-top:var(--my)}
}
.loc-board{margin-top:clamp(28px,4vw,56px)}

/* ── word-by-word headline reveals (JS wraps words; IO adds .in) ── */
.sw .wd{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.sw .wi{display:inline-block;transform:translateY(108%);transition:transform 1.05s var(--ease);transition-delay:calc(var(--i) * 42ms)}
.sw.in .wi{transform:none}
.rv.sw{opacity:1;transform:none}

/* ── giant cover words: letters rise out of a blur, one after another ── */
.cover:not(.hero) .cover-wordbox .cover-word.cw{clip-path:none;transform:none;transition:none}
.cw .ch{display:inline-block;opacity:0;transform:translateY(.32em) scaleY(1.25);transform-origin:50% 100%;filter:blur(12px);
  transition:opacity .8s var(--ease),transform 1.2s var(--ease),filter .9s var(--ease);transition-delay:calc(var(--i) * 45ms)}
.cover-wordbox.in .cw .ch{opacity:1;transform:none;filter:blur(0)}

/* ── sibling stagger for every .rv (index set by JS) ── */
.rv{transition-delay:calc(var(--si,0) * 90ms)}

/* ── gallery phones: tilt up into place, then drift at two speeds ── */
.gphones{perspective:1600px}
.gp.rv{transform:translateY(70px) rotateX(16deg);transform-origin:50% 100%;transition:opacity 1.1s var(--ease),transform 1.4s var(--ease);transition-delay:calc(var(--si,0) * 110ms)}
.gp.rv.in{transform:none}
@supports (animation-timeline:view()){
  @media (prefers-reduced-motion:no-preference) and (min-width:901px){
    .gp:nth-child(even){animation:gpDrift linear both;animation-timeline:view();animation-range:cover}
    @keyframes gpDrift{from{translate:0 60px}to{translate:0 -60px}}
  }
}

/* ── pricing rows cascade in ── */
.js .team .tg-row{opacity:0;translate:0 16px;transition:opacity .7s var(--ease),translate .9s var(--ease),background .2s;transition-delay:calc(var(--i,0) * 45ms)}
.js .team.in .tg-row{opacity:1;translate:none}

/* ── FAQ: answers slide open where supported ── */
@supports (interpolate-size:allow-keywords){
  :root{interpolate-size:allow-keywords}
  details::details-content{block-size:0;overflow:hidden;transition:block-size .55s var(--ease),content-visibility .55s allow-discrete}
  details[open]::details-content{block-size:auto}
}

/* ── magnetic buttons (pointer devices) ── */
.cover-cta,.nav-book{transition-property:translate,color,background,box-shadow;transition-duration:.5s;transition-timing-function:var(--ease)}

/* ═════ opening: a play on HEADSHOTS ═════ */
.intro{display:none}
.intro-on .intro,.intro-out .intro{display:block;position:fixed;inset:0;z-index:200;color:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent}
.intro::before{content:"";position:absolute;inset:0;background:#000;transition:opacity .9s cubic-bezier(.76,0,.24,1)}
.intro-out .intro{pointer-events:none}
.intro-out .intro::before{opacity:0}
html.intro-on{overflow:hidden}
.intro-meta{position:absolute;left:var(--gut);right:var(--gut);top:calc(env(safe-area-inset-top,0px) + 24px);display:flex;justify-content:space-between;color:rgba(255,255,255,.72);transition:opacity .5s}
.intro-r{display:inline-flex;align-items:center;gap:10px}
.intro-r i{width:6px;height:6px;border-radius:50%;background:var(--red);animation:introRec 1s steps(2,jump-none) infinite}
@keyframes introRec{50%{opacity:.15}}
.intro-out .intro-meta{opacity:0;transition-duration:.25s}
.intro-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.intro-word{position:relative;margin:0;width:max-content;font:800 100px/.86 var(--f-wide);font-stretch:125%;letter-spacing:-.035em;text-transform:uppercase;white-space:nowrap;text-align:left;will-change:transform}
.intro-word .ibr{display:none}
.intro.stack .intro-word .ibr{display:block;height:0}
.il{display:inline-block;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.3);
  opacity:0;transform:translateY(55%) rotate(6deg);filter:blur(14px);
  transition:opacity .7s var(--ease),transform 1s var(--ease),filter .8s var(--ease);transition-delay:calc(var(--i) * 60ms)}
.intro.go .il{opacity:1;transform:none;filter:blur(0)}
.intro.lock .il{background-image:none!important;color:#fff;-webkit-text-fill-color:#fff}
.intro-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
.intro.snap .intro-flash{animation:introFlash .5s ease-out}
@keyframes introFlash{0%{opacity:0}12%{opacity:.72}100%{opacity:0}}
.intro-word.fly{transition:transform 1.1s cubic-bezier(.76,0,.24,1),opacity .7s}
.intro-word.fade{transition:transform .8s cubic-bezier(.76,0,.24,1),opacity .6s;opacity:0;transform:scale(.92)}

/* hold the hero until the opening hands off, then play it fast */
.intro-on .nav{opacity:0;transform:translateY(-12px)}
.nav{transition:background .4s,backdrop-filter .4s,color .4s,opacity .8s .2s,transform .8s .2s var(--ease)}
.intro-on .hv .cover-media video,.intro-on .hv .cover-meta,.intro-on .hv .cover-head>*,.intro-on .hv .cover-tag,.intro-on .hv .cover-word{animation:none;opacity:0}
.intro-ran .hv .cover-media video{animation-delay:0s}
.intro-ran .hv .cover-meta{animation-delay:.55s}
.intro-ran .hv .cover-head>*:nth-child(1){animation-delay:.6s}.intro-ran .hv .cover-head>*:nth-child(2){animation-delay:.7s}.intro-ran .hv .cover-head>*:nth-child(3){animation-delay:.8s}
.intro-ran .hv .cover-tag{animation-delay:.85s}
.intro-ran .hv .cover-word{animation-delay:.25s}
.intro-flip .hv .cover-word{animation:none}
.intro-hide .hv .cover-word{visibility:hidden}

@media (prefers-reduced-motion:reduce){
  .intro{display:none!important}
  .js .bi-f,.js .bi img,.js .team .tg-row,.cw .ch,.sw .wi,.gp.rv{clip-path:none!important;transform:none!important;opacity:1!important;filter:none!important;translate:none!important}
}

/* ═════════════ v25 ═════════════ */
/* opening v2: one face at a time across the whole word, strobe pops on every frame */
@keyframes ilPop{0%{filter:brightness(2.6) contrast(.9)}100%{filter:brightness(1.08) contrast(1.12)}}
.intro-pop{position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(60% 55% at 50% 50%,rgba(255,255,255,.55),rgba(255,255,255,0) 70%)}
.intro-pop.on{animation:introPop .42s ease-out}
@keyframes introPop{0%{opacity:0}8%{opacity:1}100%{opacity:0}}
@keyframes introFlash{0%{opacity:0}6%{opacity:.95}30%{opacity:.5}100%{opacity:0}}
.intro.snap .intro-flash{animation:introFlash .7s ease-out}

/* HIGHTECH mosaic: columns of headshots streaming up and down */
.mosaic{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;inset:-30% -4%;opacity:.5;transform:rotate(-8deg) scale(1.1)}
.mcol{overflow:hidden;opacity:0;transform:translateY(12%);transition:opacity 1.2s var(--ease),transform 1.6s var(--ease);transition-delay:calc(var(--i) * 90ms)}
.mosaic.in .mcol{opacity:1;transform:none}
.mtrack{display:flex;flex-direction:column;gap:10px;animation:mUp var(--d) linear infinite}
.mcol:nth-child(even) .mtrack{animation-direction:reverse}
.mosaic .mtrack img{transform:none!important;width:100%;aspect-ratio:2/3;object-fit:cover;border-radius:6px;display:block}
@keyframes mUp{from{transform:translateY(0)}to{transform:translateY(calc(-50% - 5px))}}
@media (max-width:700px){.mosaic{grid-template-columns:repeat(4,1fr)}.mcol:nth-child(n+5){display:none}}
@media (prefers-reduced-motion:reduce){.mtrack{animation:none}.mcol{opacity:1;transform:none}}

/* logo wall: logos ripple in diagonally as the wall scrolls into view */
.js .lw-cell>a{display:flex;align-items:center;justify-content:center;width:100%;height:100%;opacity:0;transform:translateY(26px) scale(.9);filter:blur(8px);
  transition:opacity .9s var(--ease),transform 1.1s var(--ease),filter .9s var(--ease);transition-delay:var(--d,0ms)}
.js .logowall.in .lw-cell>a{opacity:1;transform:none;filter:blur(0)}
.js .lw-cell::before{content:"";position:absolute;inset:0;background:rgba(255,255,255,.07);opacity:0;pointer-events:none}
.js .logowall.in .lw-cell::before{animation:lwGlow 1.2s ease-out both;animation-delay:var(--d,0ms)}
@keyframes lwGlow{0%{opacity:0}30%{opacity:1}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.js .lw-cell>a{opacity:1!important;transform:none!important;filter:none!important}}


/* ═════════════ v26 ═════════════ */
/* opening v3 — letters and light only: outlines, a strobe hit per letter (accelerating), one big flash, hand-off */
.il.hit{color:#fff;-webkit-text-stroke-color:#fff;animation:ilHit .55s ease-out}
@keyframes ilHit{0%{text-shadow:0 0 30px #fff,0 0 80px rgba(255,255,255,.9),0 0 160px rgba(255,255,255,.5);transform:scale(1.07)}100%{text-shadow:0 0 0 rgba(255,255,255,0);transform:none}}
.intro-pop{background:radial-gradient(22% 38% at var(--px,50%) var(--py,50%),rgba(255,255,255,.42),rgba(255,255,255,0) 72%)}
.intro.lock .il{color:#fff;-webkit-text-stroke-color:#fff}
.intro.snap .intro-word{animation:wordSnap .7s var(--ease)}
@keyframes wordSnap{0%{transform:scale(1.035);text-shadow:0 0 60px rgba(255,255,255,.8)}100%{transform:none}}

/* team styles: four rotating panels, pinned, scrolled sideways by scrolling down */
.hs{position:relative;margin-top:clamp(40px,5vw,72px)}
.hs-pin{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;overflow:hidden}
.hs-track{display:flex;gap:clamp(12px,1.6vw,24px);padding:0 var(--gut);--h:min(66vh,50vw);will-change:transform}
.hp{position:relative;flex:none;height:var(--h);aspect-ratio:var(--ar);margin:0;overflow:hidden;background:#141416}
.hp img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.05);transition:opacity .6s ease,transform 3s linear}
.hp img.on{opacity:1;transform:scale(1)}
.hp-char img{object-position:50% 24%}
.hs-track{backface-visibility:hidden}
.hs:not(.pinned) .hs-pin{position:static;height:auto;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:8px 0}
.hs:not(.pinned) .hp{scroll-snap-align:center}
@media (max-width:760px){.hs-track{gap:12px}.hp{height:auto;width:88vw}}

/* mobile covers: big word overlaps the photo, headline sits on the picture below it */
@media (max-width:900px){
  .cover.pt .cover-media img{transform-origin:50% 0;scale:1.2}
  .cover-wordbox{order:1;margin-top:auto}
  .cover-bot{order:2;margin-top:clamp(10px,2.4vh,20px)}
  .cover-word{margin-top:0}
  .cover::after,.cover.pt::after,.hv::after{background:linear-gradient(180deg,rgba(0,0,0,.4) 0%,rgba(0,0,0,0) 15%,rgba(0,0,0,0) 62%,rgba(0,0,0,.42) 100%)}
}

/* v27: "Teams of thousands / One brand" pinned above the sliding styles; slogans travel between the panels */
.hs-pin{flex-direction:column;justify-content:center;align-items:stretch;gap:clamp(24px,4vh,48px)}
.hs-head{margin:0;padding:0 var(--gut);font:800 clamp(40px,6.4vw,112px)/.9 var(--f-wide);font-stretch:125%;letter-spacing:-.035em;text-transform:uppercase}
.hs-track{--h:min(54vh,46vw);align-items:center}
.hs-slogan{flex:none;width:max-content;min-width:clamp(260px,30vw,480px);box-sizing:border-box;padding:0 clamp(8px,2vw,40px);display:flex;flex-direction:column;justify-content:center}
.hs-sw{margin:0;white-space:nowrap;font:800 clamp(40px,5.2vw,92px)/.9 var(--f-wide);font-stretch:125%;letter-spacing:-.035em;text-transform:uppercase}
.hs-sl{margin:16px 0 0;max-width:22em;font:400 clamp(15px,1.25vw,19px)/1.45 var(--f-sans);color:#a9a9ae}
@media (max-width:760px){.hs-slogan{width:max-content;min-width:78vw;padding:0 4vw}.hs-sw{font-size:clamp(34px,10.4vw,56px)}.hs-head{font-size:clamp(34px,10.4vw,56px)}}

/* v28: gallery phones on the same pinned sideways scroll; caption beside each phone */
.hs-g{margin-top:clamp(24px,3vw,40px)}
.hs-g .hs-track{gap:clamp(40px,6vw,110px);--gh:min(76vh,64vw)}
.hs-g .gp{flex:none;display:flex;align-items:center;gap:clamp(20px,2.4vw,40px);animation:none!important;translate:none!important}
.hs-g .gp img{height:var(--gh);width:auto;max-width:none;border-radius:clamp(18px,2vw,30px)}
.hs-g .gp figcaption{width:clamp(200px,20vw,300px);padding-top:0}
.hs-g .gp h3{font-size:clamp(20px,1.8vw,28px)}
@media (max-width:760px){
  .hs-g .hs-track{gap:28px;--gh:62svh}
  .hs-g .gp{flex-direction:column;align-items:flex-start;gap:14px}
  .hs-g .gp figcaption{width:auto;max-width:calc(var(--gh) * .462 + 40px)}
}

/* v31: iOS Safari — overflow-x:hidden on body stops position:sticky; clip hides sideways overflow without breaking it */
@supports (overflow:clip){body{overflow-x:clip}html{overflow-x:clip}}

/* v32: New York / Miami switch (city.js) */
.city-toggle{display:inline-grid;margin:0 0 clamp(20px,3vw,32px)}
.city-toggle[data-city="mia"] .loc-thumb{transform:translateX(100%)}
.city-toggle .loc-opt{min-width:clamp(128px,14vw,168px)}
.loc-opt[aria-selected="true"] .loc-sub{color:#55555a}
.city-toggle-s{margin-right:12px;vertical-align:top}
html[data-city="mia"] #teams .team-head .tg-col:nth-of-type(2),
html[data-city="mia"] #teams .tg-row>a:nth-of-type(2),
html[data-city="mia"] #teams .dr-head .dr-c:last-child,
html[data-city="mia"] #locToggle .loc-opt[data-mode="office"]{display:none}
html[data-city="mia"] #teams .team-head,html[data-city="mia"] #teams .tg-row{grid-template-columns:minmax(96px,1fr) 4fr}
html[data-city="mia"] #locToggle{grid-template-columns:1fr}
html[data-city="mia"] #locToggle .loc-thumb{width:calc(100% - 8px)}

/* v33: Trusted by — pinned; logo wall wipes in sideways over the title and holds */
.trust{padding:0;height:280vh;height:280svh;position:relative}
.trust .tr-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.trust .tr-text{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center}
.trust .tr-wall{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;background:#141416;transform:translate3d(calc((1 - var(--wp,0)) * 100%),0,0);will-change:transform;box-shadow:-40px 0 80px rgba(0,0,0,.45)}
.trust .tr-wall .logowall{width:100%;margin-top:0}
.trust .tr-text{transform:translate3d(calc(var(--wp,0) * -18%),0,0);opacity:calc(1 - var(--wp,0) * .6)}
@media (prefers-reduced-motion:reduce){.trust{height:auto}.trust .tr-pin{position:static;height:auto;overflow:visible}.trust .tr-text,.trust .tr-wall{position:static;transform:none;opacity:1;box-shadow:none;padding:clamp(56px,8vw,110px) 0}}

/* v35: admin portal broken into pieces, pinned sideways scroll (same .hs engine as team styles) */
.eff.eff-solo{grid-template-columns:minmax(0,1fr);max-width:44rem}
.hs-admin .hs-track{align-items:stretch;--h:auto}
.hs-admin .ap{flex:none;width:clamp(300px,32vw,460px);margin:0;display:flex;flex-direction:column;gap:18px}
.hs-admin .ap-card{flex:1;min-height:clamp(240px,40vh,380px);display:flex;align-items:center;border:1px solid rgba(255,255,255,.08)}
.hs-admin .ap-card::after{display:none}
.hs-admin .ap-card .pcMain{width:100%;padding:clamp(22px,2.4vw,36px)}
.hs-admin .ap-card .where{margin-bottom:0}
.hs-admin .ap-card .meter{margin-bottom:0}
.hs-admin .ap-card .rows{margin:0}
.hs-admin .ap figcaption{display:flex;flex-direction:column;gap:6px}
.hs-admin .ap figcaption .ap-n{color:var(--grey);font-size:11px;letter-spacing:.1em}
.hs-admin .ap figcaption b{font:500 clamp(20px,1.8vw,28px)/1.1 var(--f-sans);letter-spacing:-.02em}
.hs-admin .ap figcaption span:last-child{color:#a9a9ae;font-size:15px;line-height:1.45}
@media (max-width:760px){.hs-admin .ap{width:84vw}.hs-admin .ap-card .who .e{display:none}}
.hs-admin .ap:nth-child(4){width:clamp(340px,42vw,600px)}
@media (max-width:760px){.hs-admin .ap:nth-child(4){width:88vw}}

/* v36: "Just for you" sits under the big BOOK on every screen size (phones already did) */
#individual .cover-wordbox{order:1;margin-top:auto}
#individual .cover-bot{order:2;margin-top:clamp(10px,2.4vh,24px)}
#individual .cover-word{margin-top:0}

/* v34: city switch — big, centred, cities in the display face */
.city-toggle{display:grid;grid-template-columns:1fr 1fr;width:min(100%,1040px);margin:clamp(12px,2vw,28px) auto clamp(44px,6vw,88px);padding:6px;border-radius:999px;background:#17171a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.city-toggle .loc-thumb{top:6px;bottom:6px;left:6px;width:calc(50% - 6px);transition:transform .7s cubic-bezier(.7,0,.2,1.12)}
.city-toggle[data-city="mia"] .loc-thumb{transform:translateX(100%)}
.city-toggle .loc-opt{min-width:0;padding:clamp(16px,2vw,30px) clamp(12px,3vw,52px);text-align:center;color:#6e6e73;transition:color .45s}
.city-toggle .loc-opt:not([aria-selected="true"]):hover{color:#fff}
.city-toggle .loc-opt[aria-selected="true"]{color:var(--ink)}
.city-toggle .loc-main{display:block;font:800 clamp(22px,5.4vw,82px)/.88 var(--f-wide);font-stretch:125%;letter-spacing:-.035em;text-transform:uppercase;white-space:nowrap}
.city-toggle .loc-sub{display:block;margin-top:clamp(6px,.9vw,14px);font:500 clamp(9px,.85vw,12px)/1.3 var(--f-mono);letter-spacing:.14em;text-transform:uppercase;opacity:.75}
.city-toggle .loc-opt[aria-selected="true"] .loc-sub{color:#55555a;opacity:1}
.city-toggle .loc-opt:active .loc-main{transform:scale(.97)}
.city-toggle-s{margin-right:auto}
#sessions #locToggle{display:grid;width:max-content;max-width:100%;margin:0 auto clamp(36px,5vw,64px)}
@media (max-width:560px){.city-toggle .loc-opt{padding:16px 8px}.city-toggle .loc-main{font-size:clamp(20px,6.6vw,30px)}}
/* c38: city names sized to the switch itself (container units): NEW YORK in Archivo 125/800 is ~6.85em wide, half the switch minus padding is ~44cqi → 6cqi always fits */
.city-toggle{container-type:inline-size}
.city-toggle .loc-opt{padding:clamp(14px,3.2cqi,30px) 3cqi}
.city-toggle .loc-main{font-size:min(6cqi,64px)}
@media (max-width:560px){.city-toggle .loc-opt{padding:16px 3cqi}.city-toggle .loc-main{font-size:6cqi}}

/* Rotating cover photos (r2) — rot.js fades each next photo in on top of the current one every 2.5s.
   Revert: remove the rot.js <script> tag on /headshots/ (extras have no src without it, first photo shows as before). */
.cover-media.rot .rot-i,.cover-media.rot .rot-base{position:absolute;inset:0;opacity:0;transition:opacity .4s ease}
.cover-media.rot .rot-i.on,.cover-media.rot .rot-base.on{opacity:1}
/* light-backdrop photos (r5): left side of the cover takes the photo's backdrop tone, ramping gently
   from a deeper shade under the text to the photo's own tone where they meet. Text keeps a soft shadow. */
.cover.pt .lite-bg{position:absolute;inset:0;z-index:-3;opacity:0;transition:opacity .4s ease;
  background:linear-gradient(90deg,color-mix(in srgb,var(--lite,#888) 62%,#000) 0%,var(--lite,#888) 46%)}
.cover.pt.lite .lite-bg{opacity:1}
.cover.pt .cover-head,.cover.pt .cover-meta,.cover.pt .cover-word{transition:text-shadow .4s ease}
.cover.pt.lite .cover-head,.cover.pt.lite .cover-meta,.cover.pt.lite .cover-word{text-shadow:0 1px 2px rgba(0,0,0,.25),0 2px 24px rgba(0,0,0,.35)}
@media (max-width:900px){.cover.pt .lite-bg{display:none}}
/* phones: horizontal originals (rot-i.w) are never cropped from the bottom — no 1.2 zoom, anchored to the bottom edge */
@media (max-width:900px){
  .cover.pt .cover-media img.rot-i.w{scale:1;object-position:50% 100%;transform-origin:50% 100%}
}
/* r7: Book on desktop — BOOK takes the left half, the photo moves right, so faces sit beside the word, not behind it */
@media (min-width:901px){
  #individual .cover-wordbox{width:50%}
  #individual.cover.pt .cover-media{left:46%}
}
/* r7: clean slide changes — the left fade is applied ONCE to the photo frame, not to each photo,
   so an incoming photo fully covers the outgoing one (no ghost of the previous face in the fade band) */
.cover.pt .cover-media{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%);mask-image:linear-gradient(90deg,transparent 0,#000 30%)}
.cover.pt .cover-media img{-webkit-mask-image:none;mask-image:none}
@media (max-width:900px){.cover.pt .cover-media{-webkit-mask-image:none;mask-image:none}}
/* r7: the left-side backdrop tone cross-fades in step with the photo (registered colour = animatable) */
@property --lite{syntax:'<color>';inherits:true;initial-value:#888888}
.cover.pt .lite-bg{transition:opacity .4s ease,--lite .4s ease}
/* r10: pinned "Teams of thousands" / admin portal — content starts below the fixed nav and the headline scales with screen height, so nothing is cut at the top on shorter desktop screens */
@media (min-width:761px){
  .hs-pin{box-sizing:border-box;padding-top:clamp(84px,11vh,120px);padding-bottom:clamp(16px,3vh,40px);justify-content:center}
  .hs-head{font-size:clamp(40px,min(6.4vw,9.5vh),112px)}
  .hs-track{--h:min(50vh,44vw)}
}
/* r12: Fast Flow booking — four places, hours picked inside the booking widget */
.ff-book{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px);margin-top:clamp(40px,5vw,72px)}
.ff-city{display:grid;gap:10px}
.ff-city>.mono{color:var(--grey);font-size:12px;letter-spacing:.12em;text-transform:uppercase}
.ff-note{grid-column:1/-1;color:var(--grey);font-size:12px;letter-spacing:.06em;margin:0}
@media (max-width:700px){.ff-book{grid-template-columns:1fr}}
/* r13: Fast Flow banner — two booking buttons (New York, Miami), on location only; the old 4-button block is gone */
.ff-ctas{display:flex;flex-wrap:wrap;gap:8px}
.ff-ctas .cover-cta{margin-left:0}