/* =====================================================================
   SIGNIFICANT SPORTS — Documentary Archive design system
   ===================================================================== */
:root{
  --black:#050505; --charcoal:#0B0B0B; --char2:#121212;
  --paper:#F2F0EA; --paper2:#E8E5DE; --grey:#8A8A8A;
  --red:#D71920; --red-deep:#8E0D12;
  --line:rgba(242,240,234,.12); --line-2:rgba(242,240,234,.22);
  --display:'Barlow Condensed','Arial Narrow',sans-serif;
  --body:'Inter',system-ui,-apple-system,sans-serif;
  --serif:'DM Serif Display',Georgia,serif;
  --gutter:clamp(16px,4vw,64px);
  --max:1520px;
  --ease:cubic-bezier(.2,.7,.1,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{background:var(--black);color:var(--paper);font-family:var(--body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ol,ul{list-style:none}
::selection{background:var(--red);color:var(--paper)}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.skip-link{position:fixed;left:12px;top:-60px;z-index:300;background:var(--paper);color:var(--black);padding:10px 14px;font-weight:600}
.skip-link:focus{top:12px}

/* film grain — subtle, static-ish */
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:200;opacity:.055;mix-blend-mode:screen;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- primitives ---------- */
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.wrap-x{padding-left:var(--gutter);padding-right:var(--gutter)}
.meta{font-family:var(--body);font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;line-height:1.5}
.label{font-family:var(--body);font-size:11.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--grey);margin-bottom:28px}
.label b{color:var(--red);font-weight:600}
.red{color:var(--red)}
.dim{color:rgba(242,240,234,.38)}
.note{color:var(--grey);margin-top:22px;max-width:760px;letter-spacing:.12em}
.statement{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:clamp(46px,7.4vw,132px);line-height:.88;letter-spacing:-.01em}
.h2{font-family:var(--display);font-weight:700;text-transform:uppercase;font-size:clamp(40px,5vw,84px);line-height:.9}
.sec{padding:clamp(96px,13vw,200px) 0}

/* reveals */
.reveal{opacity:0;transform:translateY(28px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal-text{clip-path:inset(0 0 100% 0);transform:translateY(24px);transition:clip-path 1.2s var(--ease),transform 1.2s var(--ease)}
.reveal-text.in{clip-path:inset(0 0 -10% 0);transform:none}

/* ---------- image treatment ---------- */
.mono-img, .hero-media img, .mframe img, .case-hero img, .case-still img, .hp-img img, .wall-item img, .tl-bg img{filter:grayscale(1) contrast(1.15) brightness(.85)}
[data-cursor="view"]{overflow:hidden}
[data-cursor="view"] img{transition:transform 1.4s var(--ease),filter .8s}
[data-cursor="view"]:hover img{transform:scale(1.04)}

/* placeholder frame — CLIENT ASSET REQUIRED */
.ph-frame, .ph{position:relative;background:
  repeating-linear-gradient(135deg,rgba(242,240,234,.025) 0 1px,transparent 1px 12px),var(--charcoal);border:1px solid var(--line)}
.ph-frame::before, .ph::before{content:"[CLIENT IMAGE REQUIRED]";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font:600 10px/1.4 var(--body);letter-spacing:.2em;color:rgba(242,240,234,.35);white-space:nowrap}
.ph-frame::after, .ph::after{content:attr(data-slot);position:absolute;left:50%;top:calc(50% + 18px);transform:translateX(-50%);font:500 10px/1.4 var(--body);letter-spacing:.14em;text-transform:uppercase;color:rgba(242,240,234,.22);white-space:nowrap}
.corners{position:absolute;inset:10px;pointer-events:none}
.corners::before,.corners::after{content:"";position:absolute;width:14px;height:14px;border:solid rgba(242,240,234,.4)}
.corners::before{top:0;left:0;border-width:1px 0 0 1px}
.corners::after{bottom:0;right:0;border-width:0 1px 1px 0}

/* ---------- loader ---------- */
.loader{position:fixed;inset:0;z-index:500;background:var(--black);display:grid;place-items:center;transition:opacity .7s ease,visibility .7s}
.loader.done{opacity:0;visibility:hidden}
.loader-inner{text-align:center;display:grid;gap:10px;justify-items:center}
.loader-mark{width:64px;margin-bottom:12px}
.loader-no{color:var(--grey)}
.loader-no span{color:var(--red)}
.loader-flash{position:absolute;inset:0;background:url(../public/images/hero/ekana-bowl.jpg) center/cover;filter:grayscale(1) contrast(1.3);opacity:0;pointer-events:none}
.loader.flash .loader-flash{animation:flash .5s steps(2) 1}
@keyframes flash{0%{opacity:.0}30%{opacity:.55}60%{opacity:.1}100%{opacity:0}}

/* ---------- chrome ---------- */
.progress{position:fixed;right:0;top:0;bottom:0;width:2px;background:rgba(242,240,234,.06);z-index:120}
.progress i{display:block;width:100%;height:0;background:var(--red)}
.chapter-marker{position:fixed;left:var(--gutter);bottom:22px;z-index:110;color:var(--grey);opacity:0;transform:translateY(8px);transition:.5s var(--ease);mix-blend-mode:difference}
.chapter-marker.on{opacity:1;transform:none}
.chapter-marker b{color:var(--red);font-weight:600}
.cursor{position:fixed;left:0;top:0;width:0;height:0;z-index:260;pointer-events:none;will-change:transform}
.cursor span{position:absolute;left:-37px;top:-37px;width:74px;height:74px;border-radius:50%;border:1px solid var(--paper);display:grid;place-items:center;background:rgba(5,5,5,.25);font:600 10px var(--body);letter-spacing:.22em;text-transform:uppercase;opacity:0;transform:scale(.4);transition:opacity .25s ease,transform .35s var(--ease)}
.cursor.on span{opacity:1;transform:scale(1)}
@media (hover:none),(pointer:coarse){.cursor{display:none}}

/* ---------- nav ---------- */
.nav{position:fixed;left:0;right:0;top:0;z-index:150;display:flex;align-items:center;gap:32px;padding:20px var(--gutter);transition:background .4s,padding .4s,border-color .4s;border-bottom:1px solid transparent}
.nav.solid{background:rgba(5,5,5,.86);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);padding-top:14px;padding-bottom:14px;border-color:var(--line)}
.nav-brand{display:flex;align-items:center;gap:12px;margin-right:auto}
.nav-mono{height:30px;width:auto}
.nav-word{height:17px;width:auto}
.nav-links{display:flex;gap:26px}
.nav-links a{font:600 11px var(--body);letter-spacing:.18em;text-transform:uppercase;color:rgba(242,240,234,.7);position:relative;padding:6px 0;transition:color .2s}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:var(--red);transition:right .35s var(--ease)}
.nav-links a:hover,.nav-links a.on{color:var(--paper)}
.nav-links a.on::after,.nav-links a:hover::after{right:0}
.nav-est{color:var(--grey)} .nav-est b{color:var(--red);font-weight:600}
.menu-btn{display:none;border:1px solid var(--line-2);padding:10px 14px}
.menu{position:fixed;inset:0;z-index:140;background:var(--black);padding:110px var(--gutter) 32px;display:flex;flex-direction:column;justify-content:space-between}
.menu[hidden]{display:none}
.menu-links a{display:flex;align-items:baseline;gap:18px;font:700 clamp(44px,12vw,72px)/1 var(--display);text-transform:uppercase;padding:10px 0;border-bottom:1px solid var(--line)}
.menu-links span{font:600 11px var(--body);letter-spacing:.2em;color:var(--red)}
.menu-foot{display:flex;justify-content:space-between;color:var(--grey);gap:12px;flex-wrap:wrap}
@media (max-width:1100px){.nav-links,.nav-est{display:none}.menu-btn{display:block}}

/* ---------- HERO ---------- */
.hero{position:relative;height:100svh;min-height:620px;overflow:hidden;display:grid;place-items:center;background:var(--black)}
.hero-media{position:absolute;inset:0}
.hero-media img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.2) brightness(.52);transform:scale(1.08);animation:drift 30s ease-in-out infinite alternate}
@keyframes drift{to{transform:scale(1.18) translate(-1.5%,-1%)}}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,5,5,.55) 0%,rgba(5,5,5,0) 30%,rgba(5,5,5,0) 55%,rgba(5,5,5,.9) 100%)}
.hero-caption{position:absolute;top:88px;left:var(--gutter);color:rgba(242,240,234,.6);z-index:2}
.hero-center{position:relative;z-index:2;text-align:center}
.hero-word{font-family:var(--display);font-weight:800;text-transform:uppercase;line-height:.84;letter-spacing:-.005em;font-size:clamp(76px,15.5vw,270px)}
.hero-word .line{display:block;overflow:hidden}
.hero-word .line > span{display:block;transform:translateY(105%);transition:transform 1.3s var(--ease)}
.hero-word .line:nth-child(2) > span{letter-spacing:.2em;margin-right:-.2em;transition-delay:.12s}
.ready .hero-word .line > span{transform:none}
.hero-sub{margin-top:22px;color:rgba(242,240,234,.75);letter-spacing:.42em}
.hero-foot{position:absolute;left:0;right:0;bottom:0;z-index:2;display:grid;grid-template-columns:1fr 2fr 1fr;align-items:end;gap:24px;padding:0 var(--gutter) 34px}
.hero-statement{text-align:center;font:700 clamp(20px,2vw,30px)/1.05 var(--display);text-transform:uppercase;letter-spacing:.02em}
.hero-geo{text-align:right}
.hero-geo i{color:var(--red);font-style:normal}
.scroll-cue{position:absolute;z-index:2;right:var(--gutter);top:50%;transform:translateY(-50%) rotate(90deg);transform-origin:right center;display:flex;align-items:center;gap:12px;color:var(--grey)}
.scroll-cue span{display:block;width:56px;height:1px;background:var(--line-2);position:relative;overflow:hidden}
.scroll-cue span::after{content:"";position:absolute;inset:0;background:var(--red);transform:translateX(-100%);animation:cue 2.2s var(--ease) infinite}
@keyframes cue{60%,100%{transform:translateX(100%)}}
@media (max-width:760px){
  .hero-foot{grid-template-columns:1fr 1fr;padding-bottom:26px}
  .hero-statement{grid-column:1/-1;grid-row:1;text-align:left;font-size:24px;margin-bottom:10px}
  .hero-caption{top:78px}
  .scroll-cue{display:none}
  .hero-sub{letter-spacing:.3em}
}

/* ---------- MANIFESTO (horizontal words) ---------- */
.manifesto{height:320vh;position:relative}
.manifesto-pin{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
.manifesto-track{display:flex;align-items:center;gap:clamp(24px,3vw,56px);padding-left:var(--gutter);will-change:transform;width:max-content}
.mword{font:800 clamp(120px,24vw,420px)/.8 var(--display);text-transform:uppercase;letter-spacing:-.015em;white-space:nowrap}
.mframe{position:relative;width:clamp(200px,24vw,380px);aspect-ratio:3/4;flex:none;background:var(--charcoal)}
.mframe img{width:100%;height:100%;object-fit:cover}
.mframe figcaption{position:absolute;left:12px;bottom:10px;color:rgba(242,240,234,.8)}
.manifesto-note{position:absolute;left:var(--gutter);bottom:34px;max-width:460px;color:rgba(242,240,234,.6);font-size:15px}
.rm .manifesto{height:auto}
.rm .manifesto-pin{position:relative;height:auto;padding:120px 0}
.rm .manifesto-track{flex-wrap:wrap;width:auto;padding-right:var(--gutter)}
.rm .mword{font-size:18vw}

/* ---------- COMPANY ---------- */
.company-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(40px,7vw,120px);margin-top:clamp(56px,7vw,100px);align-items:start}
.company-copy p{color:rgba(242,240,234,.72);max-width:680px}
.company-copy p+p{margin-top:18px}
.company-copy .lead{font-size:clamp(20px,1.8vw,26px);line-height:1.4;color:var(--paper);font-weight:500;letter-spacing:-.01em}
.pull{margin-top:48px;padding-top:28px;border-top:1px solid var(--line);font:400 clamp(24px,2.4vw,36px)/1.2 var(--serif);max-width:680px}
.pull cite{display:block;margin-top:14px;font-style:normal;color:var(--red)}
.factsheet{border-top:1px solid var(--line-2)}
.factsheet > div{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:20px 0;border-bottom:1px solid var(--line);align-items:baseline}
.factsheet dt{color:var(--grey)}
.factsheet dd{font-weight:500}
.factsheet .big{font:700 clamp(40px,4vw,64px)/.9 var(--display);text-transform:uppercase}
.factsheet .geo{display:grid;gap:2px;font:700 28px/1.1 var(--display);text-transform:uppercase}
.factsheet .geo span:first-child{color:var(--red)}
@media (max-width:900px){.company-grid{grid-template-columns:1fr}}

/* ---------- ECOSYSTEM ---------- */
.eco{border-top:1px solid var(--line)}
.eco-head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:40px}
.eco-readout{color:rgba(242,240,234,.72);max-width:440px;justify-self:end;min-height:4.8em}
.eco-readout .meta{color:var(--red)}
.eco-diagram svg{width:100%;height:auto;display:block;overflow:visible}
.eco-diagram .ln{stroke:var(--line-2);stroke-width:1;fill:none;stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 1.6s var(--ease),stroke .3s}
.eco-diagram.in .ln{stroke-dashoffset:0}
.eco-diagram .ring{fill:none;stroke:var(--line);stroke-dasharray:2 6}
.eco-node{cursor:pointer;outline:none}
.eco-node rect{fill:var(--black);stroke:var(--line-2);transition:.3s}
.eco-node text{fill:var(--paper);font:700 22px var(--display);letter-spacing:.06em;text-transform:uppercase}
.eco-node .no{fill:var(--grey);font:600 10px var(--body);letter-spacing:.2em}
.eco-node:hover rect,.eco-node:focus rect,.eco-node.on rect{stroke:var(--red);fill:#140506}
.eco-node.on .no,.eco-node:hover .no{fill:var(--red)}
.ln.on{stroke:var(--red)}
.eco-core circle{fill:var(--paper)}
.eco-core text{fill:var(--black);font:800 30px var(--display);text-transform:uppercase;letter-spacing:.02em}
.eco-core .pulse{fill:none;stroke:var(--red);stroke-width:1;transform-origin:center;animation:pulse 3s ease-out infinite}
@keyframes pulse{from{r:92;opacity:.8}to{r:150;opacity:0}}
.eco-list{display:none}
@media (max-width:860px){
  .eco-head{grid-template-columns:1fr}.eco-readout{justify-self:start;display:none}
  .eco-diagram{display:none}
  .eco-list{display:block;border-left:1px solid var(--red);margin-left:6px;counter-reset:e}
  .eco-list li{position:relative;padding:16px 0 16px 26px;border-bottom:1px solid var(--line)}
  .eco-list li::before{content:"";position:absolute;left:-5px;top:24px;width:9px;height:9px;background:var(--black);border:1px solid var(--red)}
  .eco-list b{display:block;font:700 30px/1 var(--display);text-transform:uppercase}
  .eco-list span{color:var(--grey);font-size:14px}
}

/* ---------- PEOPLE ---------- */
.people-head{display:grid;grid-template-columns:1.5fr 1fr;gap:48px;align-items:end;margin-bottom:clamp(48px,6vw,80px)}
.people-intro{color:rgba(242,240,234,.72);max-width:440px}
.sheet{display:grid;grid-template-columns:repeat(4,1fr);gap:0;padding:0 var(--gutter);max-width:var(--max);margin:0 auto}
.frame{position:relative;border:1px solid var(--line);margin-left:-1px;background:var(--charcoal);transition:border-color .3s}
.frame:hover{border-color:var(--red);z-index:1}
.sprockets{height:22px;display:flex;justify-content:space-around;align-items:center;background:#000;padding:0 8px}
.sprockets i{width:10px;height:7px;background:var(--char2);border-radius:1px}
.frame .shot{aspect-ratio:4/5;position:relative;border:0;border-block:1px solid var(--line)}
.frame .shot img{width:100%;height:100%;object-fit:cover}
.frame .cap{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:16px 16px 18px;align-items:end}
.frame h3{font:700 clamp(28px,2.6vw,42px)/.9 var(--display);text-transform:uppercase}
.frame .sport{color:var(--grey);grid-column:1}
.frame .no{grid-row:1/3;grid-column:2;font:700 44px/1 var(--display);color:transparent;-webkit-text-stroke:1px rgba(242,240,234,.4);align-self:end}
.frame:hover .no{-webkit-text-stroke-color:var(--red)}
.frame .fno{position:absolute;right:10px;top:30px;z-index:2;color:rgba(242,240,234,.45)}
.archive-toggle{width:100%;display:grid;grid-template-columns:1fr auto auto;gap:24px;align-items:center;margin-top:40px;padding:22px 0;border-block:1px solid var(--line-2);text-align:left}
.archive-toggle b{font:700 28px var(--display);text-transform:uppercase}
.archive-toggle i{font:400 30px var(--display);font-style:normal;color:var(--red);transition:transform .3s}
.archive-toggle[aria-expanded="true"] i{transform:rotate(45deg)}
.full-archive{padding-top:28px}
.filters{display:flex;flex-wrap:wrap;gap:6px}
.filters button{font:600 11px var(--body);letter-spacing:.18em;text-transform:uppercase;padding:9px 14px;border:1px solid var(--line);color:rgba(242,240,234,.7);transition:.2s}
.filters button:hover{border-color:var(--line-2);color:var(--paper)}
.filters button[aria-pressed="true"]{border-color:var(--red);color:var(--paper);background:rgba(215,25,32,.12)}
.strip{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(170px,15vw,220px);overflow-x:auto;margin-top:22px;padding-bottom:14px;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--red) transparent}
.strip .frame{scroll-snap-align:start}
.strip .frame h3{font-size:24px}
.strip .frame .no{font-size:30px}
.strip .frame[hidden]{display:none}
@media (max-width:900px){
  .people-head{grid-template-columns:1fr}
  .sheet{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:74vw;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px}
  .sheet .frame{scroll-snap-align:start}
  .archive-toggle{grid-template-columns:1fr auto}.archive-toggle .meta{display:none}
}

/* ---------- PEOPLE · PRODUCT · PROFIT ---------- */
.ppp{height:330vh;position:relative;border-top:1px solid var(--line)}
.ppp-pin{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding-top:70px;padding-bottom:70px}
.ppp-words{display:flex;flex-direction:column;padding:0 var(--gutter)}
.ppp-word{font:800 clamp(90px,17vw,300px)/.8 var(--display);text-transform:uppercase;letter-spacing:-.01em;color:transparent;-webkit-text-stroke:1px rgba(242,240,234,.18);transition:color .6s var(--ease),-webkit-text-stroke-color .6s,transform .8s var(--ease);cursor:pointer;text-align:left;width:max-content}
.ppp-word:nth-child(2){margin-left:18vw}
.ppp-word:nth-child(3){margin-left:36vw}
.ppp-word.on{color:var(--paper);-webkit-text-stroke-color:transparent}
.ppp-word.on::first-letter{color:var(--red)}
.ppp-rail{position:relative;height:1px;background:var(--line);margin:34px var(--gutter) 0;display:flex;justify-content:space-between}
.ppp-rail span{width:9px;height:9px;margin-top:-4px;background:var(--black);border:1px solid var(--line-2)}
.ppp-rail i{position:absolute;left:0;top:-1px;height:3px;background:var(--red);width:0;transition:width .6s var(--ease)}
.ppp-copy{display:grid;grid-template-columns:60px 1fr 1fr;gap:24px;margin-top:26px;min-height:60px;align-items:start}
.ppp-copy p{font-size:clamp(17px,1.4vw,21px);max-width:480px}
@media (max-width:760px){
  .ppp-word{font-size:25vw}
  .ppp-word:nth-child(2){margin-left:8vw}.ppp-word:nth-child(3){margin-left:16vw}
  .ppp-copy{grid-template-columns:40px 1fr}.ppp-copy .dim{grid-column:2}
}

/* ---------- THE WORK ---------- */
.machine{margin-top:40px;color:var(--grey);line-height:2.2;border-left:2px solid var(--red);padding-left:18px}
.machine i{font-style:normal;color:var(--red);margin:0 8px}
.work-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(32px,5vw,80px);margin-top:clamp(56px,7vw,96px);align-items:start}
.cap-list{border-top:1px solid var(--line-2)}
.cap-item{border-bottom:1px solid var(--line)}
.cap-btn{width:100%;display:grid;grid-template-columns:64px 1fr 24px;align-items:center;gap:16px;padding:18px 0;text-align:left;transition:padding .35s var(--ease)}
.cap-btn .n{font:600 11px var(--body);letter-spacing:.2em;color:var(--grey)}
.cap-btn h3{font:700 clamp(28px,3vw,50px)/.92 var(--display);text-transform:uppercase;color:rgba(242,240,234,.4);transition:color .3s}
.cap-btn .ar{color:var(--red);opacity:0;transition:opacity .3s,transform .3s;transform:translateX(-6px)}
.cap-item.on .cap-btn{padding-left:14px}
.cap-item.on .cap-btn h3,.cap-btn:hover h3{color:var(--paper)}
.cap-item.on .cap-btn .n{color:var(--red)}
.cap-item.on .cap-btn .ar{opacity:1;transform:none}
.cap-inline{display:none}
.cap-panel{position:sticky;top:110px;border:1px solid var(--line);background:var(--charcoal);padding:clamp(24px,3vw,40px);min-height:460px}
.cap-panel .big{display:block;font:800 clamp(90px,10vw,160px)/.8 var(--display);color:transparent;-webkit-text-stroke:1.5px var(--red)}
.cap-panel h4{font:700 clamp(34px,3.4vw,54px)/.92 var(--display);text-transform:uppercase;margin:18px 0 14px}
.cap-panel p{color:rgba(242,240,234,.72);max-width:460px}
.cap-panel ul{margin-top:22px;border-top:1px solid var(--line)}
.cap-panel li{padding:11px 0;border-bottom:1px solid var(--line);font-weight:500;display:flex;gap:12px}
.cap-panel li::before{content:"—";color:var(--red)}
.cap-panel .go{display:inline-flex;gap:10px;margin-top:26px;border-bottom:1px solid var(--red);padding-bottom:4px}
.cap-panel.swap > *{animation:swapIn .5s var(--ease)}
@keyframes swapIn{from{opacity:0;transform:translateY(10px)}}
@media (max-width:900px){
  .work-grid{grid-template-columns:1fr}
  .cap-panel{display:none}
  .cap-btn .ar{opacity:1;transform:none;transition:transform .3s}
  .cap-item.on .cap-btn .ar{transform:rotate(90deg)}
  .cap-item.on .cap-btn{padding-left:0}
  .cap-inline{display:block;overflow:hidden;max-height:0;transition:max-height .5s var(--ease)}
  .cap-item.on .cap-inline{max-height:520px}
  .cap-inline > div{padding:0 0 22px 80px;color:rgba(242,240,234,.72)}
  .cap-inline ul{margin-top:10px}.cap-inline li{padding:5px 0;font-size:14px}.cap-inline li::before{content:"— ";color:var(--red)}
  .cap-inline a{display:inline-block;margin-top:10px;border-bottom:1px solid var(--red)}
}
@media (max-width:520px){.cap-btn{grid-template-columns:42px 1fr 20px}.cap-inline > div{padding-left:58px}}

/* ---------- VENUES ---------- */
.case-hero{position:relative;height:110svh;min-height:640px;overflow:hidden}
.case-hero img{width:100%;height:100%;object-fit:cover}
.case-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(5,5,5,.2),rgba(5,5,5,.1) 40%,rgba(5,5,5,.92))}
.case-hero-text{position:absolute;left:var(--gutter);right:var(--gutter);bottom:clamp(40px,6vw,80px);z-index:2}
.case-title{font:800 clamp(72px,13vw,230px)/.82 var(--display);text-transform:uppercase;letter-spacing:-.01em;margin:6px 0 18px}
.case-title span{display:block}
.case-chapters{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,80px);padding-top:clamp(64px,8vw,120px);padding-bottom:clamp(64px,8vw,120px)}
.case-lede{font-size:clamp(20px,1.8vw,26px);line-height:1.4;font-weight:500;grid-column:1/-1;max-width:980px}
.chapters{border-top:1px solid var(--line-2)}
.chapters li{display:grid;grid-template-columns:90px 1fr;gap:4px 18px;padding:24px 0;border-bottom:1px solid var(--line)}
.ch-no{grid-row:1/3;font:800 64px/.8 var(--display);color:var(--red)}
.chapters h3{font:700 32px/1 var(--display);text-transform:uppercase}
.chapters p{color:rgba(242,240,234,.65)}
.case-still{position:relative;align-self:stretch;min-height:420px}
.case-still img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.case-still figcaption{position:absolute;left:12px;bottom:10px;z-index:2}
@media (max-width:900px){.case-chapters{grid-template-columns:1fr}.case-still{min-height:280px}.case-hero{height:86svh}}

.hscroll{position:relative;height:var(--hs-h,420vh)}
.hscroll-pin{position:sticky;top:0;height:100svh;overflow:hidden;display:flex;align-items:center;border-top:1px solid var(--line)}
.hscroll-track{display:flex;height:100%;will-change:transform;width:max-content}
.hpanel{height:100%;flex:none;display:flex;flex-direction:column;justify-content:center;padding:90px var(--gutter) 60px;border-right:1px solid var(--line)}
.hp-title{width:min(62vw,860px)}
.hp-img{width:min(78vw,1100px);gap:28px}
.hp-img figure{position:relative;flex:1;min-height:0;background:var(--charcoal)}
.hp-img figure img,.hp-img figure svg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hp-img figcaption{position:absolute;left:12px;bottom:10px;z-index:2;background:rgba(5,5,5,.7);padding:4px 8px}
.hp-word{font:800 clamp(52px,6.5vw,110px)/.86 var(--display);text-transform:uppercase}
.hp-to{width:36vw;align-items:center}
.hp-to span{font:400 italic clamp(120px,18vw,300px)/1 var(--serif);color:var(--red)}
.hp-result{width:min(60vw,760px)}
.changes{border-top:1px solid var(--line-2);margin-top:6px}
.changes li{display:grid;grid-template-columns:50px 1fr;padding:18px 0;border-bottom:1px solid var(--line);font:700 clamp(28px,2.8vw,42px)/1 var(--display);text-transform:uppercase}
.changes span{color:var(--red)}
.result{margin-top:28px;font:400 clamp(24px,2.2vw,34px)/1.2 var(--serif)}
.result b{font-weight:400;color:var(--red)}
@media (prefers-reduced-motion:reduce){
  .hscroll{height:auto!important}
  .hscroll-pin{position:relative;height:auto;display:block}
  .hscroll-track{flex-direction:column;width:auto;height:auto;transform:none!important}
  .hpanel{width:auto!important;height:auto;border-right:0;border-bottom:1px solid var(--line);padding:56px var(--gutter)}
  .hp-img figure{flex:none;aspect-ratio:4/3}
  .hp-to{padding:24px var(--gutter)}
}

/* ---------- ARCHIVE / TIMELINE ---------- */
.archive{border-top:1px solid var(--line);padding-bottom:0}
.archive-head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:48px}
.archive-head .meta{color:var(--grey)}
.tl-stage{position:relative;min-height:560px;border-block:1px solid var(--line);overflow:hidden}
.tl-bg{position:absolute;inset:0}
.tl-bg img{position:absolute;right:0;top:0;width:56%;height:100%;object-fit:cover;opacity:.55;transition:opacity .6s}
.tl-bg .ph{position:absolute;right:0;top:0;width:56%;height:100%;border:0;border-left:1px solid var(--line)}
.tl-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--black) 38%,rgba(5,5,5,.55) 70%,rgba(5,5,5,.2))}
.tl-bg .cap{position:absolute;right:16px;bottom:14px;z-index:2;color:rgba(242,240,234,.6)}
.tl-inner{position:relative;z-index:2;display:grid;grid-template-columns:auto 1fr;gap:clamp(32px,5vw,80px);align-items:center;min-height:560px;padding-top:48px;padding-bottom:48px}
.tl-year{font:800 clamp(130px,18vw,300px)/.8 var(--display);letter-spacing:-.02em;color:var(--paper);font-variant-numeric:tabular-nums}
.tl-year.flip{animation:yflip .45s var(--ease)}
@keyframes yflip{from{opacity:0;transform:translateY(20px)}}
.tl-items{max-width:560px}
.tl-items li{display:grid;grid-template-columns:96px 1fr;gap:4px 16px;padding:14px 0;border-bottom:1px solid var(--line);animation:swapIn .5s var(--ease) both}
.tl-items li:nth-child(2){animation-delay:.05s}.tl-items li:nth-child(3){animation-delay:.1s}.tl-items li:nth-child(4){animation-delay:.15s}.tl-items li:nth-child(5){animation-delay:.2s}
.tl-items .cat{color:var(--grey);padding-top:6px}
.tl-items .cat.c-sports,.tl-items .cat.c-company{color:var(--red)}
.tl-items b{font:700 clamp(26px,2.4vw,38px)/1 var(--display);text-transform:uppercase}
.tl-items small{grid-column:2;color:var(--grey);font-size:13px}
.tl-track{position:relative;height:84px;margin-top:10px;cursor:grab;touch-action:none;user-select:none}
.tl-track:active{cursor:grabbing}
.tl-line{position:absolute;left:0;right:0;top:40px;height:1px;background:var(--line-2)}
.tl-ticks{position:absolute;inset:0}
.tl-tick{position:absolute;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--grey);font:600 11px var(--body);letter-spacing:.14em;padding:6px 4px}
.tl-tick::after{content:"";order:2;width:1px;height:14px;background:var(--line-2);margin-top:10px}
.tl-tick.on{color:var(--paper)}
.tl-tick.gap{color:rgba(242,240,234,.25)}
.tl-handle{position:absolute;top:31px;left:0;width:18px;height:18px;margin-left:-9px;background:var(--red);transition:left .35s var(--ease);pointer-events:none}
.tl-handle span{position:absolute;left:50%;top:-31px;bottom:-40px;width:1px;background:var(--red);transform:translateX(-50%);opacity:.5}
.tl-mobile{display:none}
@media (max-width:760px){
  .tl-mobile{display:none;border-left:1px solid var(--line-2);margin-left:var(--gutter);padding-left:22px!important;padding-bottom:40px}
  .tl-mobile > li{position:relative;padding:22px 0;border-bottom:1px solid var(--line)}
  .tl-mobile > li::before{content:"";position:absolute;left:-27px;top:34px;width:9px;height:9px;background:var(--red)}
  .tl-mobile .y{font:800 64px/.9 var(--display)}
  .tl-mobile li li{display:flex;justify-content:space-between;gap:12px;padding:6px 0;font-weight:500}
  .tl-mobile li li span{color:var(--grey)}
}

/* ---------- TRACK RECORD ---------- */
.record{padding-top:clamp(80px,10vw,140px)}
.score{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line-2)}
.score-cell{position:relative;padding:clamp(24px,3vw,40px);border-right:1px solid var(--line)}
.score-cell:last-child{border-right:0}
.score-cell b{display:block;font:800 clamp(120px,15vw,240px)/.8 var(--display);font-variant-numeric:tabular-nums}
.score-cell .meta{display:block;margin-top:18px;color:var(--grey)}
.score-cell i{position:absolute;left:0;bottom:0;height:3px;background:var(--red);width:0;transition:width 1.6s var(--ease)}
.score.in .score-cell i{width:var(--w)}
@media (max-width:700px){.score{grid-template-columns:1fr}.score-cell{border-right:0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:end}.score-cell b{font-size:120px}}

/* ---------- PROJECT ARCHIVE (paper) ---------- */
.projects{background:var(--paper);color:var(--black)}
.projects .label{color:#5e5c57}
.projects-head{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;margin-bottom:34px}
.projects-head .label{margin:0}
.projects .filters button{border-color:rgba(5,5,5,.2);color:#3a3935}
.projects .filters button:hover{border-color:var(--black);color:var(--black)}
.projects .filters button[aria-pressed="true"]{background:var(--black);color:var(--paper);border-color:var(--black)}
.proj-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid rgba(5,5,5,.25);border-left:1px solid rgba(5,5,5,.25)}
.proj{position:relative;min-height:190px;padding:16px 16px 18px;border-right:1px solid rgba(5,5,5,.25);border-bottom:1px solid rgba(5,5,5,.25);display:flex;flex-direction:column;justify-content:space-between;background:var(--paper);transition:background .25s}
.proj:hover{background:var(--paper2)}
.proj .top{display:flex;justify-content:space-between;color:#5e5c57}
.proj .top b{color:var(--red);font-weight:600}
.proj h3{font:700 clamp(26px,2.2vw,34px)/.95 var(--display);text-transform:uppercase;margin-top:28px}
.proj .bot{display:flex;justify-content:space-between;gap:12px;margin-top:14px;font-size:13px;color:#3a3935}
.proj .bot .yr{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.proj[hidden]{display:none}
@media (max-width:1100px){.proj-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){.proj-grid{grid-template-columns:1fr 1fr}.proj{min-height:150px}}
@media (max-width:420px){.proj h3{font-size:24px}}

/* ---------- IP ---------- */
.ip-controls{display:flex;justify-content:space-between;align-items:center;margin:clamp(40px,5vw,72px) 0 20px}
.ip-controls .meta{color:var(--grey)}
.arrow{width:52px;height:52px;border:1px solid var(--line-2);font-size:20px;margin-left:6px;transition:.2s}
.arrow:hover{border-color:var(--red);color:var(--red)}
.ip-rail{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(280px,30vw,440px);gap:0;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--gutter) 18px;scroll-padding:0 var(--gutter);scrollbar-width:none}
.ip-rail::-webkit-scrollbar{display:none}
.ipc{scroll-snap-align:start;position:relative;aspect-ratio:3/4.3;border:1px solid var(--line);margin-left:-1px;padding:22px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.ipc .top{display:flex;justify-content:space-between}
.ipc .n{font:800 88px/.8 var(--display);color:transparent;-webkit-text-stroke:1px currentColor;opacity:.5}
.ipc h3{font:800 clamp(46px,4.4vw,72px)/.84 var(--display);text-transform:uppercase;letter-spacing:-.005em}
.ipc .tag{display:inline-block;margin-top:14px;padding:6px 10px;border:1px solid currentColor}
.ipc p{font-size:14px;line-height:1.5;margin-top:16px;opacity:.8;max-width:34ch}
.ipc .art{position:absolute;right:14px;top:60px;font:600 9px var(--body);letter-spacing:.18em;text-transform:uppercase;opacity:.35;writing-mode:vertical-rl}
.t-black{background:var(--charcoal)}
.t-red{background:var(--red)}
.t-deep{background:var(--red-deep)}
.t-paper{background:var(--paper);color:var(--black)}
.gen{margin-top:clamp(96px,12vw,180px);border-top:1px solid var(--line);padding-top:48px}
.gen-eq{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;font:700 clamp(30px,4vw,64px)/1 var(--display);text-transform:uppercase}
.gen-eq span{color:rgba(242,240,234,.2);transition:color .5s}
.gen-eq i{font-style:normal;color:var(--grey);font-weight:500}
.gen-eq .eq{color:var(--red)}
.gen-eq .gen-out{border:1px solid var(--line-2);padding:4px 14px 6px;transition:all .6s}
.gen.in .gen-eq span{color:var(--paper)}
.gen.in .gen-eq span:nth-child(1){transition-delay:.1s}.gen.in .gen-eq span:nth-of-type(2){transition-delay:.35s}.gen.in .gen-eq span:nth-of-type(3){transition-delay:.6s}.gen.in .gen-eq span:nth-of-type(4){transition-delay:.85s}.gen.in .gen-eq span:nth-of-type(5){transition-delay:1.1s}
.gen.in .gen-eq .gen-out{background:var(--red);border-color:var(--red);transition-delay:1.5s}
.gen-title{font:800 clamp(56px,9vw,160px)/.85 var(--display);text-transform:uppercase;margin-top:40px}
.gen-scope{margin-top:28px;color:var(--grey);line-height:2}

/* ---------- FOOTPRINT ---------- */
.footprint{border-top:1px solid var(--line)}
.fp-grid{display:grid;grid-template-columns:1.7fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.fp-map{position:relative}
.fp-dots{width:100%;opacity:.22}
.fp-pins{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.pin circle.dot{fill:var(--red)}
.pin circle.halo{fill:none;stroke:var(--red);animation:halo 2.6s ease-out infinite}
.pin:nth-child(2) .halo{animation-delay:.6s}.pin:nth-child(3) .halo{animation-delay:1.2s}.pin:nth-child(4) .halo{animation-delay:1.8s}
@keyframes halo{from{r:5;opacity:.9}to{r:26;opacity:0}}
.pin text{fill:var(--paper);font:700 22px var(--display);letter-spacing:.08em;text-transform:uppercase}
.pin line{stroke:rgba(242,240,234,.4)}
.pin.on text{fill:var(--red)}
.fp-list li{display:grid;grid-template-columns:1fr auto;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--line);cursor:default}
.fp-list li:first-child{border-top:1px solid var(--line-2)}
.fp-list b{font:700 clamp(40px,3.8vw,60px)/.9 var(--display);text-transform:uppercase;transition:color .25s}
.fp-list li:hover b,.fp-list li.on b{color:var(--red)}
.fp-list span{color:var(--grey)}
.note-sm{margin-top:22px;color:var(--grey);font-size:14px;max-width:380px}
@media (max-width:900px){.fp-grid{grid-template-columns:1fr}.pin text{display:none}.fp-list b{font-size:40px}}

/* ---------- ARCHIVE WALL ---------- */
.wall{padding:clamp(80px,10vw,140px) 0 0;border-top:1px solid var(--line)}
.wall-head{display:flex;justify-content:space-between;align-items:baseline}
.wall-head .meta{color:var(--grey)}
.wall-grid{columns:4 260px;column-gap:6px;padding:0 6px}
.wall-item{position:relative;break-inside:avoid;margin-bottom:6px;aspect-ratio:4/3;background:var(--charcoal)}
.wall-item.tall{aspect-ratio:3/4}
.wall-item.red{outline:2px solid var(--red);outline-offset:-2px}
.wall-item img{width:100%;height:100%;object-fit:cover}
.wall-item .md{position:absolute;left:12px;bottom:10px;right:12px;z-index:2;display:flex;gap:10px;flex-wrap:wrap;opacity:.0;transform:translateY(6px);transition:.4s var(--ease)}
.wall-item .md span{background:rgba(5,5,5,.8);padding:3px 7px}
.wall-item .md span:first-child{color:var(--red)}
.wall-item:hover .md,.wall-item:focus-within .md{opacity:1;transform:none}
.wall-item.ph .md{opacity:.9;transform:none}
@media (hover:none){.wall-item .md{opacity:1;transform:none}}
@media (max-width:760px){.wall-grid{columns:unset;display:grid;grid-auto-flow:column;grid-auto-columns:78vw;overflow-x:auto;scroll-snap-type:x mandatory;gap:6px}.wall-item{margin:0;scroll-snap-align:start;aspect-ratio:3/4}}

/* ---------- FINAL ---------- */
.final{background:var(--black);padding-top:clamp(140px,18vw,260px);border-top:1px solid var(--line)}
.final-line{font:800 clamp(52px,8.4vw,150px)/.86 var(--display);text-transform:uppercase;letter-spacing:-.01em;max-width:15ch}
.final-brand{margin-top:clamp(96px,12vw,180px);display:grid;justify-items:start;gap:14px}
.final-word{width:min(520px,80vw);margin-left:-3.2%}
.final-tag{font:400 italic clamp(24px,2.4vw,36px)/1.2 var(--serif);margin-top:8px}
.final-brand .meta{color:var(--grey)}
.contact{display:grid;grid-template-columns:1fr 1.2fr;gap:40px;margin-top:clamp(72px,9vw,120px);padding-top:40px;border-top:1px solid var(--line-2)}
.c-name{font:700 clamp(38px,3.6vw,56px)/.95 var(--display);text-transform:uppercase;margin-bottom:8px}
.contact > div .meta{color:var(--grey)}
.c-list > div{display:grid;grid-template-columns:170px 1fr;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);align-items:baseline}
.c-list dt{color:var(--grey)}
.c-list dd{font-size:clamp(17px,1.4vw,21px);font-weight:500;word-break:break-word}
.c-list a{background:linear-gradient(var(--red),var(--red)) 0 100%/0 1px no-repeat;transition:background-size .35s var(--ease)}
.c-list a:hover{background-size:100% 1px}
.foot{display:flex;flex-wrap:wrap;gap:12px 32px;justify-content:space-between;margin-top:clamp(96px,10vw,140px);padding-top:24px;padding-bottom:36px;border-top:1px solid var(--line);color:var(--grey)}
.credits{flex-basis:100%;font-size:11.5px;color:rgba(138,138,138,.7)}
@media (max-width:760px){.contact{grid-template-columns:1fr}.c-list > div{grid-template-columns:1fr;gap:2px}}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01s!important}
  .reveal,.reveal-text{opacity:1;transform:none;clip-path:none}
  .hero-word .line > span{transform:none}
}

/* ---------- capture mode (?still) ---------- */
.still .hero,.still .ppp-pin,.still .manifesto-pin,.still .hscroll-pin{height:900px!important;min-height:0}
.still .case-hero{height:900px}
.still .manifesto,.still .ppp{height:auto}
.still .manifesto-pin,.still .ppp-pin{position:relative}
.still body::after{display:none}
.still .hscroll{height:auto!important}
.still .hscroll-pin{position:relative;height:auto!important;display:block}
.still .hscroll-track{flex-direction:column;width:auto;height:auto;transform:none!important}
.still .hpanel{width:auto!important;height:auto;border-right:0;border-bottom:1px solid var(--line);padding:64px var(--gutter)}
.still .hp-img figure{flex:none;aspect-ratio:16/8}
.still .tl-stage,.still .tl-inner{min-height:560px}

.projects .proj-note{color:#5e5c57}

/* =====================================================================
   v2.2 — CORPORATE PROFILE POLISH
   Presentation only: type, spacing, hierarchy, fewer boxes/chips.
   No behaviour depends on anything below.
   ===================================================================== */
:root{--read:rgba(242,240,234,.78)}
.sec{padding:clamp(112px,13vw,200px) 0}
.statement{font-size:clamp(44px,6.2vw,108px);line-height:.92}
.h2{font-size:clamp(36px,4.2vw,68px);line-height:.94}
.label{margin-bottom:30px}
.note-sm{margin-top:24px;color:var(--grey);font-size:13.5px;line-height:1.6;max-width:640px}

/* hero: the company descriptor answers who / what / since / where */
.hero-foot{grid-template-columns:1fr 2.2fr 1fr}
.hero-statement{font:inherit;text-transform:none;letter-spacing:0;text-align:center;justify-self:center;max-width:640px}
.hero-line{font:400 italic clamp(17px,1.4vw,21px)/1.3 var(--serif);color:rgba(242,240,234,.7);margin-bottom:10px}
.hero-desc{font:500 clamp(15px,1.15vw,17.5px)/1.55 var(--body);color:var(--paper)}
@media (max-width:760px){.hero-statement{text-align:left;justify-self:start}.hero-line{font-size:18px}.hero-desc{font-size:15px}}

/* 01 company — profile spread: statement + editorial copy + quiet facts */
.company-grid{grid-template-columns:1.5fr 1fr;gap:clamp(48px,8vw,140px);margin-top:clamp(64px,7vw,104px)}
.co-name{font:700 clamp(28px,2.4vw,38px)/1 var(--display);text-transform:uppercase;letter-spacing:.01em}
.co-founded{margin:10px 0 34px;color:var(--grey)!important;font-size:15px!important}
.company-copy p{font-size:17px;line-height:1.75;color:var(--read);max-width:640px}
.company-copy p+p{margin-top:20px}
.company-side{display:grid;gap:18px;align-content:start}
.co-portrait{aspect-ratio:4/5;margin:0}
.co-caption b{display:block;font:700 22px/1 var(--display);text-transform:uppercase}
.co-caption span{display:block;margin-top:6px;color:var(--grey);font-size:13.5px}
.company-side .factsheet{margin-top:10px;border-top:1px solid var(--line)}
.company-side .factsheet > div{grid-template-columns:110px 1fr;padding:14px 0}
.company-side .factsheet dd{font-size:14.5px;font-weight:500}
.vm{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px);margin-top:clamp(80px,9vw,140px);padding-top:32px;border-top:1px solid var(--line-2)}
.vm .meta{color:var(--red);margin-bottom:16px}
.vm-text{font:400 clamp(21px,1.9vw,28px)/1.3 var(--serif);color:rgba(242,240,234,.9)}
@media (max-width:900px){.vm{grid-template-columns:1fr}.co-portrait{max-width:320px}}

/* ecosystem — areas of expertise, quieter frame */
.eco-head{align-items:end;gap:56px}
.eco-readout{font-size:15.5px;line-height:1.6;max-width:430px;min-height:6.6em}
.eco-node rect{stroke:rgba(242,240,234,.14)}
.eco-core .pulse{display:none}
.eco-list b{font-size:26px}

/* 02 people — introduction as copy, athletes as credentials */
.people .statement{margin-bottom:clamp(56px,6vw,88px)}
.people-head{grid-template-columns:1fr 1.6fr;align-items:start;gap:clamp(32px,6vw,96px);margin-bottom:clamp(56px,6vw,80px)}
.sub-h{font:700 clamp(28px,2.4vw,38px)/1 var(--display);text-transform:uppercase}
.people-intro{max-width:660px}
.people-intro p{font-size:17px;line-height:1.75;color:var(--read)}
.people-intro p+p{margin-top:18px}
.archive-label{color:var(--grey);margin-bottom:18px;padding-top:22px;border-top:1px solid var(--line)}
.archive-toggle b{font-size:22px}
.filters{gap:22px}
.filters button{border:0;padding:6px 0;background:none;color:rgba(242,240,234,.5);border-bottom:1px solid transparent}
.filters button:hover{color:var(--paper);border-color:transparent}
.filters button[aria-pressed="true"]{background:none;color:var(--paper);border-bottom-color:var(--red)}

/* philosophy */
.ppp-copy p{font-size:clamp(16px,1.3vw,19px)}
.ppp-copy .dim{color:rgba(242,240,234,.5)}

/* 03 the work — capabilities, not modules */
.work-intro{margin-top:40px;max-width:640px;font-size:17px;line-height:1.75;color:var(--read)}
.cap-panel{border:0;border-left:1px solid var(--line-2);background:none;padding:6px 0 0 clamp(28px,3.4vw,48px)}
.cap-panel p{font-size:16px;line-height:1.7}
.cap-panel ul{border-top:0;margin-top:24px}
.cap-panel li{border-bottom:0;padding:6px 0;font-size:15px}
.cap-btn h3{color:rgba(242,240,234,.42)}

/* selected projects — formal credentials */
.case-facts{display:flex;flex-wrap:wrap;gap:12px 48px;margin-top:4px}
.case-facts dt{font:600 10.5px var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--grey)}
.case-facts dd{font:500 15px/1.5 var(--body);margin-top:4px}
.case-lede{font-size:clamp(19px,1.6vw,24px);line-height:1.5;font-weight:400;color:rgba(242,240,234,.9)}
.chapters li{padding:24px 0}
.chapters h3{font-size:28px}
.chapters p{font-size:16px;line-height:1.7;color:var(--read);margin-top:4px}
.hp-body{font-size:17px;line-height:1.75;color:var(--read);max-width:560px;margin-bottom:28px}
.changes{border-top:1px solid var(--line-2)}
.changes > div{display:grid;grid-template-columns:minmax(160px,1fr) 1.4fr;gap:20px;padding:16px 0;border-bottom:1px solid var(--line);align-items:baseline}
.changes dt{font:700 clamp(24px,2.2vw,32px)/1 var(--display);text-transform:uppercase}
.changes dd{color:var(--read);font-size:16px}
.result{margin-top:30px;font:400 clamp(22px,2vw,30px)/1.3 var(--serif)}
.result .meta{display:block;color:var(--red);margin-bottom:10px;font-family:var(--body)}

/* 04 archive — company history, quiet interface */
.archive-head{display:grid;grid-template-columns:1.6fr 1fr;align-items:end;gap:40px;margin-bottom:28px}
.archive-intro{font-size:16.5px;line-height:1.7;color:var(--read);max-width:420px}
.tl-hint{color:rgba(138,138,138,.7);margin-bottom:28px}
.tl-stage{border:0}
.tl-items .cat,.tl-items .cat.c-sports{color:var(--grey)}
.tl-items .cat.c-company{color:var(--red)}
.tl-items li{border-bottom:0;padding:10px 0}
.tl-items li+li{border-top:1px solid var(--line)}
.tl-items b{font-size:clamp(24px,2.1vw,34px)}
@media (max-width:900px){.archive-head{grid-template-columns:1fr}}

/* 04 selected experience — credentials, not KPIs */
.record .h2{margin-bottom:clamp(48px,5vw,72px)}
.score{border:0;border-top:1px solid var(--line-2);gap:clamp(24px,4vw,64px)}
.score-cell{border:0;padding:28px 0 0}
.score-cell:last-child{border:0}
.score-cell h3{font:700 clamp(26px,2.2vw,34px)/1 var(--display);text-transform:uppercase;margin-bottom:16px}
.score-cell .cred{font-size:16px;line-height:1.85;color:var(--read)}
.score-cell .meta{display:block;margin-top:18px;color:var(--grey)}
.score-cell .meta b{display:inline;font:inherit;color:var(--paper)}
.score-cell i{top:-1px;bottom:auto;height:2px}
@media (max-width:700px){.score{grid-template-columns:1fr}.score-cell{display:block;border-bottom:0}.score-cell b{font-size:inherit}}

/* 04 project register — formal listing on paper */
.projects-head{align-items:baseline;margin-bottom:28px}
.projects .filters button{color:#6a6760;border:0;border-bottom:1px solid transparent;background:none}
.projects .filters button:hover{color:var(--black)}
.projects .filters button[aria-pressed="true"]{color:var(--black);background:none;border-bottom-color:var(--red)}
.reg-head,.proj{display:grid;grid-template-columns:56px 150px 2.2fr 1fr 1fr 1.6fr;gap:20px;align-items:baseline}
.reg-head{color:#6a6760;padding-bottom:12px;border-bottom:1px solid rgba(5,5,5,.5)}
.proj-grid{display:block;border:0}
.proj{min-height:0;padding:14px 0;border:0;border-bottom:1px solid rgba(5,5,5,.14);background:none;transition:background .2s}
.proj:hover{background:rgba(5,5,5,.035)}
.proj h3{margin:0;font:700 clamp(20px,1.7vw,26px)/1.05 var(--display)}
.proj .r-no{font:600 11px var(--body);letter-spacing:.14em;color:var(--red)}
.proj .r-yr{font:500 14px var(--body);font-variant-numeric:tabular-nums}
.proj .r-cat,.proj .r-loc{font-size:14px;color:#3a3935}
.proj .r-note{font-size:13.5px;color:#6a6760}
.projects .proj-note{color:#6a6760}
@media (max-width:900px){
  .reg-head{display:none}
  .proj{grid-template-columns:44px 1fr auto;gap:2px 14px}
  .proj .r-no{grid-row:1/3}.proj h3{grid-column:2}.proj .r-yr{grid-column:3;grid-row:1}
  .proj .r-cat,.proj .r-loc,.proj .r-note{grid-column:2/4;font-size:12.5px}
  .proj .r-loc:empty,.proj .r-note:empty{display:none}
}

/* 05 IP — intellectual properties, editorial */
.ip-intro{display:grid;grid-template-columns:1.2fr 1fr;gap:clamp(40px,6vw,100px);margin-top:clamp(48px,5vw,72px);align-items:start}
.lead-p{font-size:clamp(18px,1.5vw,21px);line-height:1.6;color:rgba(242,240,234,.88);max-width:600px}
.ip-index{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.ip-index .meta{color:var(--red);margin-bottom:12px}
.ip-index li{font:700 20px/1.1 var(--display);text-transform:uppercase;padding:7px 0;border-top:1px solid var(--line)}
.ipc .tag{border:0;padding:0;opacity:.75}
.ipc{margin-left:0;border-color:rgba(242,240,234,.06)}
@media (max-width:900px){.ip-intro{grid-template-columns:1fr}}

/* 05 IP development */
.gen{border-top:1px solid var(--line-2);padding-top:40px}
.gen-title{margin-top:0;font-size:clamp(44px,6.4vw,110px)}
.gen-copy{margin-top:28px;max-width:640px;font-size:17px;line-height:1.75;color:var(--read)}
.gen-eq{margin-top:48px;font-size:clamp(22px,2.6vw,40px);gap:8px 14px}
.gen-eq i{color:rgba(138,138,138,.6)}
.gen-eq .gen-out{border:0;padding:0}
.gen.in .gen-eq .gen-out{background:none;color:var(--red)}

/* footprint + wall + close */
.fp-list b{font-size:clamp(34px,3.2vw,52px)}
.dim-meta{color:var(--grey)}
.wall-item .md span{background:rgba(5,5,5,.72)}
.c-co{font:600 11.5px var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--grey);margin-bottom:18px}
.contact .c-list dd{font-size:clamp(16px,1.3vw,19px)}

/* timeline placeholder label sits in the image corner, clear of the entries */
.tl-bg .ph::before,.tl-bg .ph::after{left:auto;right:24px;transform:none}
.tl-bg .ph::before{top:auto;bottom:40px}.tl-bg .ph::after{top:auto;bottom:22px}

/* v2.2 mobile: single column for the profile spreads */
@media (max-width:900px){
  .company-grid,.people-head{grid-template-columns:1fr}
  .company-side{grid-template-columns:minmax(0,200px) 1fr;column-gap:20px;align-items:start}
  .company-side .co-portrait{grid-row:1/3}
  .company-side .factsheet{grid-column:1/-1}
}
@media (max-width:520px){
  .company-side{grid-template-columns:1fr}.company-side .co-portrait{grid-row:auto;max-width:240px}
  .changes > div{grid-template-columns:1fr;gap:4px}
}


/* =====================================================================
   v2.3 — MOBILE MATCHES DESKTOP MOTION
   ===================================================================== */
@media (max-width:860px){
  /* Balewadi pinned horizontal sequence */
  .hpanel{padding:84px 22px 44px}
  .hp-title{width:88vw}
  .hp-title .case-title{font-size:clamp(64px,19vw,110px)}
  .hp-img{width:88vw;gap:18px}
  .hp-img figure{flex:none;height:46svh}
  .hp-word{font-size:clamp(40px,12vw,64px)}
  .hp-to{width:44vw}
  .hp-to span{font-size:clamp(96px,30vw,160px)}
  .hp-result{width:94vw;justify-content:center}
  .hp-body{font-size:15px;margin-bottom:18px}
  .changes > div{grid-template-columns:1fr 1.2fr;padding:10px 0}
  .changes dt{font-size:22px}.changes dd{font-size:14px}
  .result{font-size:20px;margin-top:18px}

  /* Ecosystem: the red line draws as you scroll, areas arrive one by one */
  .eco-list{border-left:0;position:relative}
  .eco-list::after{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--red);transform:scaleY(var(--p,0));transform-origin:top}
  html:not(.rm) .eco-list li{opacity:.12;transform:translateX(16px);transition:opacity .6s var(--ease),transform .8s var(--ease)}
  html:not(.rm) .eco-list li.in{opacity:1;transform:none}
  .eco-list li::before{transition:background .4s}
  .eco-list li.in::before{background:var(--red)}
}
@media (max-width:760px){
  /* hero footer: one clean line of facts */
  .hero-foot{grid-template-columns:auto 1fr}
  .hero-geo{white-space:nowrap;font-size:9.5px;letter-spacing:.14em}
  /* chapter marker sits on its own band instead of over copy */
  .chapter-marker{left:0;right:0;bottom:0;padding:26px var(--gutter) 12px;mix-blend-mode:normal;background:linear-gradient(180deg,rgba(5,5,5,0),rgba(5,5,5,.94) 60%)}
  /* interactive timeline, mobile composition */
  .tl-stage,.tl-inner{min-height:0}
  .tl-inner{grid-template-columns:1fr;gap:14px;align-items:start;padding-top:26px;padding-bottom:22px}
  .tl-year{font-size:clamp(88px,28vw,120px)}
  .tl-items{min-height:292px}
  .tl-items li{grid-template-columns:72px 1fr;padding:8px 0}
  .tl-items b{font-size:22px}
  .tl-bg img,.tl-bg .ph{width:100%;opacity:.3}
  .tl-bg::after{background:linear-gradient(180deg,rgba(5,5,5,.55),var(--black) 80%)}
  .tl-track{height:70px}
  .tl-tick{font-size:0;padding:6px 0}
  .tl-tick::after{margin-top:24px}
  .tl-tick.on,.tl-tick[data-i="0"],.tl-tick[data-i="9"]{font-size:10px}
  .tl-tick.on::after,.tl-tick[data-i="0"]::after,.tl-tick[data-i="9"]::after{margin-top:10px}
  .tl-tick.gap{display:none}
  .tl-hint{margin-bottom:18px}
}
/* touch: the frame in view gets the desktop hover treatment */
@media (hover:none){
  .frame.act{border-color:var(--red);z-index:1}
  .frame.act .no{-webkit-text-stroke-color:var(--red)}
  [data-cursor="view"].act img{transform:scale(1.04)}
  .ipc.act{outline:1px solid rgba(242,240,234,.35);outline-offset:-1px}
}