@font-face{font-family:Onest;font-style:normal;font-weight:300 800;font-display:swap;src:url(../fonts/onest-cyrillic.woff2) format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:Onest;font-style:normal;font-weight:300 800;font-display:swap;src:url(../fonts/onest-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/*
  Theme: locked dark (cinematic campaign film, photography-led). One accent: gold.
  Shape system: media + cards 22px, interactive elements full pill.
  Z-index scale: scenes 0-2, sticky path year 5, nav 40, menu 50, skip link 100.
*/
:root{
  /* Concept B: Graphite / Ivory / Copper. Copper is a signature, not a surface: lines, marks, numbering, large type. */
  --bg:#242426;--bg-2:#2b2b2e;--bg-3:#333337;--ink:#F5F1E8;--ink-rgb:245,241,232;--muted:#AAA49B;--line:rgba(245,241,232,.14);
  --accent:#A66B47;--accent-rgb:166,107,71;--accent-ink:#C8875E;--shade:30,30,32;
  --radius:22px;--ease:cubic-bezier(.16,1,.3,1);--gutter:clamp(16px,4.2vw,56px);--max:1380px;--nav:68px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--bg)}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Onest,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:1.0625rem;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img{display:block;max-width:100%}
h1,h2,h3,p,ol,ul,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:6px}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.h2{font-size:clamp(2.3rem,5.6vw,4.8rem);font-weight:600;letter-spacing:-.04em;line-height:1.02;text-wrap:balance}
.lead{color:var(--muted);font-size:clamp(1.05rem,1.4vw,1.22rem);max-width:46ch;text-wrap:pretty}
.cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:12px;z-index:100;background:var(--ink);color:var(--bg);padding:10px 16px;border-radius:999px}
.mark{display:inline-grid;place-items:center;width:1.9em;height:1.9em;border:2px solid currentColor;font-weight:700;line-height:1;font-variant-numeric:tabular-nums}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 1.65em;border-radius:999px;font:inherit;font-weight:600;font-size:1rem;text-decoration:none;white-space:nowrap;cursor:pointer;border:1px solid transparent;transition:background-color .3s,color .3s,border-color .3s,box-shadow .4s}
.btn:active{transform:scale(.97)}
.btn-primary{background:var(--ink);color:var(--bg);box-shadow:0 10px 30px -16px rgba(0,0,0,.6)}
.btn-primary:hover{background:#fffaf0;box-shadow:0 0 0 1px var(--accent),0 10px 30px -16px rgba(0,0,0,.6)}
.btn-ghost{border-color:rgba(var(--ink-rgb),.32);color:var(--ink);background:rgba(var(--shade),.25);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.btn-ghost:hover{border-color:var(--ink)}

/* Nav */
.nav{position:fixed;inset:0 0 auto;z-index:40;border-bottom:1px solid transparent;transition:background-color .4s,border-color .4s}
.nav.is-solid{background:rgba(var(--shade),.72);-webkit-backdrop-filter:saturate(170%) blur(20px);backdrop-filter:saturate(170%) blur(20px);border-color:var(--line)}
.nav-in{height:var(--nav);display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font-weight:600;letter-spacing:-.01em}
.brand .mark{font-size:.78rem;color:var(--accent)}
.nav-links{display:none;gap:30px;font-size:.95rem}
.nav-links a{text-decoration:none;color:rgba(var(--ink-rgb),.72);transition:color .2s}
.nav-links a:hover{color:var(--ink)}
.nav-right{display:flex;align-items:center;gap:8px}
.nav .btn{min-height:42px;padding:0 1.15em;font-size:.92rem}
.menu-btn{min-height:42px;padding:0 1em;border-radius:999px;border:1px solid var(--line);background:rgba(var(--shade),.35);color:var(--ink);font:inherit;font-size:.92rem;font-weight:600;cursor:pointer}
.menu{position:fixed;inset:0;z-index:50;background:rgba(var(--shade),.96);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);display:flex;flex-direction:column;justify-content:center;padding:var(--nav) var(--gutter) 40px}
.menu[hidden]{display:none}
.menu a{display:block;text-decoration:none;font-size:clamp(2.2rem,11vw,3.4rem);font-weight:600;letter-spacing:-.04em;line-height:1.25}
.menu a:hover{color:var(--accent)}
.menu-close{position:absolute;top:13px;right:var(--gutter)}
@media (min-width:900px){.nav-links{display:flex}.menu-btn{display:none}}

/* 1. Hero: golden-hour drone loop over Sofia, framed portrait over it, campaign lockup (honorific, name, rule, role, boxed 9) */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:clip;isolation:isolate;background:var(--bg-3)}
.hero-slides{position:absolute;inset:0;z-index:-2;background:var(--bg-3)}
.hero-slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-slides img+img{opacity:0}
@media (prefers-reduced-motion:no-preference){
  /* Three civic scenes, 7s each: slow push-in, soft crossfade. Pure CSS on the compositor, so it never stutters. */
  .hero-slides img{opacity:0;animation:slide 21s linear infinite;animation-delay:calc(var(--i) * 7s - 21s)}
}
@keyframes slide{
  0%{opacity:1;transform:scale(1.1)}
  26%{opacity:1}
  33%{opacity:0;transform:scale(1.02)}
  93%{opacity:0;transform:scale(1.12)}
  100%{opacity:1;transform:scale(1.1)}
}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(var(--shade),.45) 0%,rgba(var(--shade),.08) 22%,rgba(var(--shade),.2) 42%,rgba(var(--shade),.82) 66%,var(--bg) 100%)}
.hero-in{width:100%;display:grid;gap:18px;padding-top:calc(var(--nav) + 10px);padding-bottom:clamp(24px,5svh,56px)}
.hero-portrait{position:relative;justify-self:end;width:min(74vw,360px);aspect-ratio:4/5}
.hero-portrait::before{content:"";position:absolute;inset:14px -12px -12px 14px;border:1px solid rgba(var(--accent-rgb),.6);border-radius:var(--radius);pointer-events:none}
.hero-portrait .frame{position:absolute;inset:0;border-radius:var(--radius);overflow:hidden;background:var(--bg-3);box-shadow:0 40px 80px -30px rgba(0,0,0,.65)}
.hero-portrait .par{position:absolute;inset:-6% 0}
.hero-portrait img{width:100%;height:100%;object-fit:cover;object-position:60% 18%}
.ballot{position:absolute;left:-26px;bottom:26px;z-index:2;width:76px;color:var(--accent)}
.ballot svg{display:block;width:100%;height:auto;overflow:visible}
.ballot rect{fill:var(--bg)}
.hero .hon{display:block;font-size:clamp(1.05rem,1.4vw,1.3rem);font-weight:500;letter-spacing:.01em;word-spacing:.08em;line-height:1.3;white-space:nowrap;text-shadow:none;color:rgba(var(--ink-rgb),.88);margin-bottom:10px}
.hero h1{font-size:clamp(3.1rem,14vw,8.4rem);font-weight:650;letter-spacing:-.045em;line-height:.92;text-shadow:0 2px 40px rgba(0,0,0,.25)}
.hero h1 .row{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.hero h1 .row>span{display:block}
.rule{height:2px;background:rgba(var(--ink-rgb),.2);margin:22px 0 14px;max-width:520px;overflow:hidden}
.rule i{display:block;height:100%;background:var(--accent);transform-origin:0 50%}
.role{font-size:clamp(1.2rem,2vw,1.6rem);font-weight:650;letter-spacing:-.015em;color:var(--accent)}
.hero .lead{margin-top:14px;color:rgba(var(--ink-rgb),.86);max-width:36ch}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
@media (min-width:900px){
  .hero::before{background:linear-gradient(90deg,rgba(var(--shade),.84) 0%,rgba(var(--shade),.55) 36%,rgba(var(--shade),.08) 68%,rgba(var(--shade),0) 100%),linear-gradient(0deg,var(--bg) 0%,rgba(var(--shade),0) 26%),linear-gradient(180deg,rgba(var(--shade),.4) 0%,rgba(var(--shade),0) 16%)}
  .hero-in{grid-template-columns:minmax(0,6fr) minmax(0,6fr);align-items:end;gap:clamp(40px,5vw,96px);padding-top:calc(var(--nav) + 4svh);padding-bottom:7svh}
  .hero-portrait{order:2;width:100%;max-width:620px;max-height:calc(100svh - var(--nav) - 11svh);justify-self:end}
  .ballot{left:-52px;bottom:48px;width:112px}
}
@media (prefers-reduced-motion:no-preference){
  .hero-portrait .frame{animation:unveil 1.6s var(--ease) .2s both}
  .hero-portrait img{animation:settle 2.6s var(--ease) .2s both}
  .hero-portrait::before{animation:fade 1.2s var(--ease) 1s both}
  .hero .hon,.fade{animation:fade 1s var(--ease) both;animation-delay:calc(.5s + var(--i,0) * .12s)}
  .hero h1 .row>span{animation:rise 1.2s var(--ease) both;animation-delay:calc(.3s + var(--i) * .12s)}
  .rule i{animation:draw 1.3s var(--ease) .75s both}
  .ballot rect{stroke-dasharray:1;animation:trace 1.4s var(--ease) 1s both}
  .ballot text{animation:fade .8s var(--ease) 1.8s both}
}
@keyframes unveil{from{clip-path:inset(100% 0 0 0 round var(--radius))}to{clip-path:inset(0 0 0 0 round var(--radius))}}
@keyframes settle{from{transform:scale(1.16)}to{transform:scale(1)}}
@keyframes rise{from{transform:translate3d(0,110%,0)}to{transform:none}}
@keyframes fade{from{opacity:0;transform:translate3d(0,16px,0)}to{opacity:1;transform:none}}
@keyframes draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes trace{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}

/* 2. Manifesto: four-beat career sequence (Инженер, Учен, Кмет, Президент) with a photo per beat */
.manifesto{position:relative}
.manifesto-stage{position:relative;overflow:hidden;isolation:isolate;padding-block:clamp(100px,16vh,170px)}
.m-bg{position:absolute;inset:0;z-index:-2;background:var(--bg-3)}
.m-bg img{opacity:0}
.m-bg img.on{opacity:1}
.manifesto-stage::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,var(--bg) 0%,var(--bg) 4%,rgba(var(--shade),.82) 14%,rgba(var(--shade),.5) 26%,rgba(var(--shade),.2) 40%,rgba(var(--shade),.14) 50%,rgba(var(--shade),.62) 80%,var(--bg) 100%),linear-gradient(90deg,rgba(var(--shade),.5) 0%,rgba(var(--shade),0) 62%)}
.m-steps li{padding-block:10px}
.m-mask{display:block}
.m-big{display:block;font-size:clamp(3.3rem,14.5vw,10rem);font-weight:650;letter-spacing:-.05em;line-height:.95;text-shadow:0 4px 40px rgba(0,0,0,.3)}
.m-sub{display:block;max-width:24ch;margin-top:.35em;font-size:clamp(1.25rem,2.6vw,2.1rem);font-weight:500;letter-spacing:-.015em;color:rgba(var(--ink-rgb),.92);text-shadow:0 2px 24px rgba(0,0,0,.35)}
.m-final .m-big{color:var(--accent)}
.m-index,.m-cap{display:none}
/* Sequence mode: only when GSAP runs and motion is welcome */
.anim .manifesto{height:420svh}
.anim .manifesto-stage{position:sticky;top:0;height:100svh;padding:0 0 13svh;display:flex;align-items:flex-end}
.anim .m-bg img{transform:scale(1.08);transition:opacity 1.2s var(--ease),transform 8s cubic-bezier(.2,.6,.2,1)}
.anim .m-bg img.on{transform:scale(1)}
.anim .m-steps{display:grid}
.anim .m-steps li{grid-area:1/1;padding:0}
.anim .m-mask{overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.anim .m-mask>span{transform:translate3d(0,108%,0);transition:transform 1s var(--ease)}
.anim .m-steps li.past .m-mask>span{transform:translate3d(0,-108%,0);transition-duration:.7s}
.anim .m-steps li.on .m-mask>span{transform:none}
.anim .m-steps li.on .m-mask+.m-mask>span{transition-delay:.1s}
.anim .m-steps li{align-self:end}
.anim .m-layout{display:grid;gap:22px}
.anim .m-side{order:-1}
.anim .m-index{display:flex;gap:18px;font-size:.95rem;font-weight:600;color:rgba(var(--ink-rgb),.6)}
.anim .m-index li{transition:color .6s var(--ease)}
.anim .m-index li.on{color:var(--accent)}
@media (min-width:900px){
  .anim .m-layout{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:clamp(40px,6vw,120px)}
  .anim .m-side{order:0}
  .anim .m-index{flex-direction:column;gap:14px;font-size:1.05rem;padding-bottom:.6em}
  .anim .m-index li{display:flex;align-items:center;gap:14px}
  .anim .m-index li::before{content:"";width:48px;height:2px;background:currentColor;transform:scaleX(.45);transform-origin:0 50%;transition:transform .7s var(--ease)}
  .anim .m-index li.on::before{transform:none}
  .anim .m-cap{display:grid;margin-top:10px;font-size:.88rem;color:rgba(var(--ink-rgb),.72);max-width:26ch}
  .anim .m-cap span{grid-area:1/1;opacity:0;transition:opacity .6s var(--ease)}
  .anim .m-cap span.on{opacity:1}
}

/* 3. Zoom (sticky scene) */
.zoom{position:relative;height:220svh}
.zoom-stage{position:sticky;top:0;height:100svh;overflow:hidden;background:var(--bg)}
.zoom-frame{position:absolute;inset:0;overflow:hidden;background:var(--bg)}
.zoom-frame img{object-position:52% 9%;transform-origin:55% 18%}
.zoom-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--bg) 0%,rgba(var(--shade),0) 9%,rgba(var(--shade),0) 42%,rgba(var(--shade),.72) 82%,var(--bg) 100%)}
.zoom-copy{position:absolute;left:0;right:0;bottom:clamp(30px,9vh,96px)}
.zoom-copy .h2{font-size:clamp(2.8rem,8vw,7rem);max-width:11ch}
.zoom-copy p{margin-top:16px;color:rgba(var(--ink-rgb),.84);max-width:38ch;font-size:clamp(1.05rem,1.4vw,1.22rem)}

/* 4. Record */
.record{position:relative;min-height:100svh;display:flex;align-items:center;overflow:clip;isolation:isolate;padding-block:clamp(90px,14vh,150px)}
.record-photo{position:relative;height:62svh;margin:0 var(--gutter) -18svh;border-radius:var(--radius);overflow:hidden;z-index:-1}
.record-photo img{object-position:50% 18%}
.record-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--shade),0) 40%,var(--bg) 100%)}
.record-in{width:100%}
.big-num{font-size:clamp(5.4rem,22vw,15rem);font-weight:650;letter-spacing:-.065em;line-height:.85;color:var(--accent);font-variant-numeric:tabular-nums;margin-top:28px}
.big-cap{margin-top:18px;color:rgba(var(--ink-rgb),.8);max-width:30ch;font-size:1.1rem}
.stats{display:grid;gap:0;margin-top:clamp(40px,7vh,72px)}
.stats li{display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:18px;padding-block:20px;border-top:1px solid var(--line)}
.stats b{font-size:clamp(2.4rem,4.4vw,3.6rem);font-weight:600;letter-spacing:-.04em;line-height:1;min-width:2.4ch;font-variant-numeric:tabular-nums}
.stats span{color:var(--muted)}
.record-wrap{display:flex;flex-direction:column;width:100%}
@media (min-width:900px){
  .record-wrap{display:block}
  .record-photo{position:absolute;top:0;right:0;bottom:0;width:min(50vw,820px);height:auto;margin:0;border-radius:0}
  .record-photo::after{background:linear-gradient(90deg,var(--bg) 0%,rgba(var(--shade),.2) 45%,rgba(var(--shade),0) 100%),linear-gradient(0deg,var(--bg) 0%,rgba(var(--shade),0) 30%),linear-gradient(180deg,var(--bg) 0%,rgba(var(--shade),0) 22%)}
  .record-in .h2,.big-cap{max-width:12ch}
  .big-cap{max-width:30ch}
  .stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;max-width:min(100%,960px)}
  .stats li{grid-template-columns:1fr;gap:10px}
}

/* 5. Path: sticky photo that follows the milestones (desktop), inline photos (mobile) */
.path{background:linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 18%,var(--bg-2) 82%,var(--bg) 100%);padding-block:clamp(100px,15vh,170px);position:relative}
.path-grid{display:grid;gap:36px;margin-top:clamp(36px,6vh,64px)}
.path-media{display:none}
.path-fig{position:relative;aspect-ratio:16/10;border-radius:16px;overflow:hidden;background:var(--bg-3);margin-bottom:20px}
.path-list li{padding:32px 0 36px;border-top:1px solid var(--line)}
.path-list .yr{display:block;font-size:clamp(2.6rem,4vw,3.4rem);font-weight:650;letter-spacing:-.05em;color:var(--accent);line-height:1;margin-bottom:12px;font-variant-numeric:tabular-nums}
.path-list h3{font-size:clamp(1.35rem,2.4vw,2rem);font-weight:600;letter-spacing:-.025em;line-height:1.15}
.path-list p{margin-top:8px;color:var(--muted);max-width:44ch}
@media (min-width:900px){
  .path-grid{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(40px,6vw,110px);align-items:start}
  .path-media{display:block;position:sticky;top:calc(var(--nav) + 5svh);height:calc(90svh - var(--nav));border-radius:var(--radius);overflow:hidden;background:var(--bg-3)}
  .path-media img{opacity:0;transform:scale(1.06);transition:opacity .9s var(--ease),transform 1.6s var(--ease)}
  .path-media img.on{opacity:1;transform:none}
  .path-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--shade),0) 55%,rgba(var(--shade),.75) 100%)}
  .path-media-year{position:absolute;left:32px;bottom:24px;z-index:1;color:var(--accent);font-size:clamp(4rem,7vw,6.5rem);font-weight:650;letter-spacing:-.06em;line-height:1;font-variant-numeric:tabular-nums}
  .path-fig{display:none}
  .path-list li{padding:10svh 0;min-height:44svh;display:flex;flex-direction:column;justify-content:center}
  .path-list li:first-child{border-top:0;padding-top:4svh}
  .path-list li:last-child{min-height:60svh}
  .js-path .path-list li{opacity:.3;transition:opacity .6s var(--ease)}
  .js-path .path-list li.on{opacity:1}
}

/* 7. Values: typographic declaration, one inline photo per line, no cards */
.values{padding-block:clamp(100px,15vh,170px)}
.values .lead{margin-top:16px}
.principles{margin-top:clamp(40px,7vh,80px);border-bottom:1px solid var(--line)}
.pr{border-top:1px solid var(--line);padding-block:clamp(26px,4.5vh,48px);display:grid;gap:14px}
.pr h3{font-size:clamp(2.3rem,8.4vw,6.6rem);font-weight:600;letter-spacing:-.045em;line-height:1.02;text-wrap:balance}
.pr .m{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.06em;margin-bottom:-.06em}
.pr .m>span{display:inline-block}
.pill{display:inline-block;position:relative;width:1.9em;height:.78em;margin-inline:.08em;border-radius:.39em;overflow:hidden;vertical-align:-.02em;background:var(--bg-3)}
.pill img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pr p{color:var(--muted);font-size:clamp(1.02rem,1.3vw,1.15rem);max-width:34ch}
.pr p::before{content:"";display:block;width:40px;height:2px;background:var(--accent);margin-bottom:12px}
@media (min-width:900px){
  .pr{grid-template-columns:minmax(0,8fr) minmax(0,3fr);align-items:end;gap:clamp(32px,4vw,72px)}
  .pr p{padding-bottom:.9em}
  .pill{transition:width .8s var(--ease)}
  .pr:hover .pill{width:2.6em}
}

/* 8. Ticket: the presidential pair, two official portraits */
.ticket{padding-block:clamp(110px,16vh,180px) clamp(80px,12vh,140px);position:relative}
.ticket .lead{margin-top:16px}
.pair{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,2vw,28px);margin-top:clamp(36px,6vh,64px)}
.person{display:block;text-decoration:none;color:inherit}
.person-media{position:relative;aspect-ratio:3/4;border-radius:var(--radius);overflow:hidden;background:var(--bg-3)}
.person-media img{width:100%;height:100%;object-fit:cover;object-position:50% 18%;transition:transform 1.2s var(--ease)}
.person:hover .person-media img{transform:scale(1.04)}
.person-name{margin-top:18px;border-top:1px solid var(--line);padding-top:14px}
.person-name small{display:block;color:var(--muted);font-size:.9rem}
.person-name strong{display:block;font-size:clamp(1.15rem,2.6vw,2.2rem);font-weight:600;letter-spacing:-.025em;line-height:1.15;margin:4px 0}
.person-name .role-s{color:var(--accent);font-weight:600;font-size:.95rem}
.person-name .go{display:inline-block;margin-top:10px;font-weight:600;font-size:.95rem;border-bottom:1px solid var(--accent);padding-bottom:2px}
.ticket-cta{margin-top:clamp(32px,5vh,56px)}

/* 10. Vote */
.vote{position:relative;min-height:100svh;display:flex;align-items:center;text-align:center;overflow:clip;isolation:isolate;padding-block:clamp(100px,14vh,150px)}
.vote-bg{position:absolute;inset:-8% 0;z-index:-2}
.vote-bg img{object-position:38% 32%}
.vote::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(90% 70% at 50% 45%,rgba(var(--shade),.5),rgba(var(--shade),.85)),linear-gradient(180deg,var(--bg) 0%,rgba(var(--shade),0) 26%),linear-gradient(0deg,var(--bg) 0%,rgba(var(--shade),0) 18%)}
.vote .wrap{width:100%}
.vote-box{width:clamp(130px,22vw,220px);margin:0 auto 36px;color:var(--accent)}
.vote .h2 em{font-style:normal;color:var(--accent)}
.count b{color:var(--accent)}
.vote-box svg{width:100%;height:auto;overflow:visible}
.vote .h2{font-size:clamp(2.8rem,7.6vw,6.6rem)}
.vote .lead{margin:20px auto 0;color:rgba(var(--ink-rgb),.8)}
.count{display:flex;justify-content:center;gap:clamp(22px,6vw,64px);margin-top:44px}
.count b{display:block;font-size:clamp(2.6rem,6.4vw,4.8rem);font-weight:650;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.count span{color:var(--muted);font-size:.9rem}
.vote-cta{display:flex;justify-content:center;margin-top:44px}
.share-msg{min-height:1.6em;margin-top:14px;color:var(--muted);font-size:.95rem}

/* Footer */
.foot{padding-block:44px calc(44px + env(safe-area-inset-bottom));font-size:.92rem;color:var(--muted)}
.foot-in{display:grid;gap:22px}
.foot .legal{color:var(--ink);font-weight:600;font-size:1rem}
.foot summary{cursor:pointer;color:var(--ink);width:fit-content}
.foot details ul{margin-top:12px;display:grid;gap:4px;font-size:.84rem;columns:1}
.foot details a{color:var(--muted)}
@media (min-width:900px){.foot-top{display:flex;justify-content:space-between;align-items:center;gap:24px}.foot details ul{display:block;columns:2;column-gap:40px}.foot details li{margin-bottom:4px;break-inside:avoid}}

/* JS-driven initial states: only when GSAP runs (see main.js) */
.anim [data-reveal]{opacity:0;transform:translate3d(0,44px,0)}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}*{transition:none!important}
  .manifesto,.zoom{height:auto}.manifesto-stage,.zoom-stage{position:relative}
}

/* ================= Shared components for all pages ================= */
.nav-links a[aria-current="page"]{color:var(--ink)}
.nav-links a[aria-current="page"]::after{content:"";display:block;height:2px;background:var(--accent);margin-top:4px}
.menu a[aria-current="page"]{color:var(--accent)}
.btn-link{display:inline-flex;align-items:center;gap:.5em;font-weight:600;text-decoration:none;border-bottom:1px solid var(--accent);padding-bottom:3px}
.btn-link:hover{color:var(--accent)}

/* Program teaser (home) */
.prog{padding-block:clamp(100px,15vh,170px);position:relative}
.prog-top{display:grid;gap:22px}
.prog-num{font-size:clamp(4.4rem,16vw,12rem);font-weight:650;letter-spacing:-.06em;line-height:.88;color:var(--accent)}
.prog-num span{color:var(--ink)}
.prog .lead{max-width:52ch}
.prog-quote{margin-top:8px;font-size:clamp(1.2rem,2vw,1.6rem);font-weight:500;letter-spacing:-.015em;line-height:1.35;max-width:36ch}
.prog-quote cite{display:block;margin-top:10px;font-style:normal;color:var(--muted);font-size:.95rem}
.themes{display:grid;gap:0 clamp(32px,5vw,80px);margin-top:clamp(40px,7vh,72px)}
.themes a{display:grid;grid-template-columns:3.2em 1fr;gap:12px;align-items:baseline;padding-block:18px;border-top:1px solid var(--line);text-decoration:none;transition:color .3s}
.themes a:hover{color:var(--accent)}
.themes b{color:var(--accent);font-weight:650;font-variant-numeric:tabular-nums}
.themes span{font-size:clamp(1.02rem,1.3vw,1.18rem);font-weight:500;line-height:1.35}
@media (min-width:900px){.prog-top{grid-template-columns:minmax(0,5fr) minmax(0,6fr);align-items:end;gap:clamp(40px,6vw,110px)}.themes{grid-template-columns:1fr 1fr}}

/* Motto band (every page) */
.motto{position:relative;padding-block:clamp(90px,14vh,150px);text-align:center;overflow:clip}
.motto::before{content:"";position:absolute;left:50%;top:0;width:min(560px,70vw);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--accent),transparent)}
.motto p{font-size:clamp(2rem,5.4vw,4.6rem);font-weight:600;letter-spacing:-.04em;line-height:1.08;text-wrap:balance}
.motto p span{display:block}
.motto p span+span{color:var(--accent)}
.motto .btn{margin-top:40px}

/* Sub-page hero */
.phero{position:relative;padding-top:calc(var(--nav) + clamp(28px,6svh,72px));padding-bottom:clamp(40px,8svh,96px);overflow:clip}
.phero-in{display:grid;gap:clamp(28px,4vw,72px);align-items:end}
.phero .eyebrow{display:block;font-size:.8rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:18px}
.phero h1{font-size:clamp(3.1rem,11vw,8rem);font-weight:650;letter-spacing:-.045em;line-height:.92}
.phero h1 .row{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.phero h1 .row>span{display:block}
.phero .rule{margin:24px 0 16px}
.phero .lead{color:rgba(var(--ink-rgb),.84);max-width:44ch}
.phero-media{position:relative;border-radius:var(--radius);overflow:hidden;background:var(--bg-3);aspect-ratio:4/5}
.phero-media img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.phero.solo .phero-in{grid-template-columns:1fr}
@media (min-width:900px){
  .phero{min-height:88svh;display:flex;align-items:flex-end}
  .phero .wrap{width:100%}
  .phero-in{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
  .phero-media{aspect-ratio:auto;height:min(76svh,820px)}
  .phero.solo{min-height:auto}
}
@media (prefers-reduced-motion:no-preference){
  .phero-media{animation:unveil 1.6s var(--ease) .15s both}
  .phero-media img{animation:settle 2.6s var(--ease) .15s both}
  .phero h1 .row>span{animation:rise 1.2s var(--ease) both;animation-delay:calc(.2s + var(--i,0) * .12s)}
  .phero .eyebrow,.phero .lead,.phero .pfade{animation:fade 1s var(--ease) both;animation-delay:calc(.45s + var(--i,0) * .12s)}
  .phero .rule i{animation:draw 1.3s var(--ease) .6s both}
}

/* Long-form story chapters */
.story{padding-block:clamp(40px,8vh,90px) clamp(60px,10vh,120px)}
.chapter{display:grid;gap:26px;padding-block:clamp(48px,9vh,110px);border-top:1px solid var(--line)}
.chapter:first-child{border-top:0}
.chapter-head{font-size:clamp(1.9rem,4.4vw,3.6rem);font-weight:600;letter-spacing:-.035em;line-height:1.1;text-wrap:balance;max-width:22ch}
.chapter-head.q{color:var(--ink)}
.chapter-head.q::before{content:"";display:block;width:56px;height:2px;background:var(--accent);margin-bottom:24px}
.chapter-head.t{font-size:clamp(1.6rem,3.2vw,2.6rem)}
.prose{max-width:64ch}
.prose p{color:rgba(var(--ink-rgb),.84);font-size:clamp(1.05rem,1.2vw,1.14rem);line-height:1.75}
.prose p+p{margin-top:1.1em}
.prose .said{margin-block:1.6em;padding-left:22px;border-left:2px solid var(--accent);color:var(--ink);font-size:clamp(1.2rem,1.8vw,1.5rem);font-weight:500;line-height:1.45}
.prose .beat{color:var(--ink);font-weight:600;font-size:clamp(1.15rem,1.6vw,1.35rem)}
@media (min-width:900px){.chapter{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,110px);align-items:start}.chapter-head{position:sticky;top:calc(var(--nav) + 6svh)}}

/* Full-bleed image break inside long pages */
.break{position:relative;height:min(86svh,900px);overflow:hidden;margin-block:clamp(20px,4vh,40px)}
.break img{width:100%;height:100%;object-fit:cover;object-position:50% 22%}
.break::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--bg) 0%,rgba(var(--shade),0) 18%,rgba(var(--shade),0) 70%,var(--bg) 100%)}
.break figcaption{position:absolute;left:0;right:0;bottom:clamp(24px,6vh,64px);z-index:1}
.break figcaption p{font-size:clamp(1.8rem,4.6vw,3.8rem);font-weight:600;letter-spacing:-.035em;line-height:1.1;max-width:18ch;text-wrap:balance}

/* Figures band (Kosyo) */
.figures{display:grid;grid-template-columns:1fr 1fr;gap:0 clamp(24px,4vw,64px);padding-block:clamp(40px,7vh,80px)}
.figures li{padding-block:22px;border-top:1px solid var(--line)}
.figures b{display:block;font-size:clamp(2.6rem,6vw,4.8rem);font-weight:650;letter-spacing:-.05em;line-height:1;color:var(--accent);font-variant-numeric:tabular-nums}
.figures span{display:block;margin-top:10px;color:var(--muted);max-width:26ch}
@media (min-width:900px){.figures{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* Cross-links to the other pages */
.next{padding-block:clamp(60px,10vh,120px);border-top:1px solid var(--line)}
.next-grid{display:grid;gap:14px;margin-top:28px}
.next a{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:clamp(1.5rem,3.6vw,2.8rem);font-weight:600;letter-spacing:-.035em;transition:color .3s,padding .6s var(--ease)}
.next a:hover{color:var(--accent);padding-left:12px}
.next a small{font-size:.9rem;font-weight:500;letter-spacing:0;color:var(--muted)}

/* Program page */
.prog-page{padding-block:clamp(40px,8vh,90px) clamp(60px,10vh,120px)}
.prog-grid{display:grid;gap:40px}
.toc{display:none}
.theme{padding-block:clamp(40px,7vh,80px);border-top:1px solid var(--line);scroll-margin-top:calc(var(--nav) + 20px)}
.theme-no{display:block;font-size:clamp(3rem,7vw,5.6rem);font-weight:650;letter-spacing:-.05em;line-height:1;color:var(--accent)}
.theme h2{margin-top:10px;font-size:clamp(1.6rem,3.4vw,2.8rem);font-weight:600;letter-spacing:-.03em;line-height:1.12;max-width:26ch;text-wrap:balance}
.qa{margin-top:26px;border-bottom:1px solid var(--line)}
.qa details{border-top:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:1fr auto;gap:20px;align-items:start;padding:22px 0;font-size:clamp(1.08rem,1.5vw,1.28rem);font-weight:600;line-height:1.4}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";font-size:1.6rem;line-height:1;font-weight:400;color:var(--accent);transition:transform .5s var(--ease)}
.qa details[open] summary::after{transform:rotate(45deg)}
.qa summary:hover{color:var(--accent)}
.qa .ans{padding:0 0 28px;max-width:66ch}
.qa .ans p{color:rgba(var(--ink-rgb),.84);line-height:1.75}
.qa .ans p+p{margin-top:1em}
@media (min-width:1000px){
  .prog-grid{grid-template-columns:minmax(0,3fr) minmax(0,8fr);gap:clamp(40px,5vw,96px);align-items:start}
  .toc{display:block;position:sticky;top:calc(var(--nav) + 32px)}
  .toc a{display:grid;grid-template-columns:2.6em 1fr;gap:8px;padding:9px 0;text-decoration:none;color:var(--muted);font-size:.92rem;line-height:1.35;transition:color .3s}
  .toc a b{font-weight:650}
  .toc a:hover,.toc a.on{color:var(--ink)}
  .toc a.on b{color:var(--accent)}
}

/* Empty / coming-soon states, socials, plain prose */
.soon{padding-block:clamp(40px,8vh,90px) clamp(80px,12vh,140px)}
.soon-box{display:grid;gap:18px;padding-block:clamp(40px,7vh,72px);border-block:1px solid var(--line);max-width:760px}
.soon-box .tag{justify-self:start;padding:6px 14px;border:1px solid var(--accent);border-radius:999px;color:var(--accent);font-size:.85rem;font-weight:600}
.soon-box h2{font-size:clamp(1.8rem,4vw,3rem);font-weight:600;letter-spacing:-.035em;line-height:1.1}
.soon-box p{color:var(--muted);max-width:52ch}
.socials{display:grid;gap:0;margin-top:clamp(28px,5vh,48px);border-bottom:1px solid var(--line)}
.social{display:grid;grid-template-columns:48px 1fr;gap:20px;align-items:start;padding-block:28px;border-top:1px solid var(--line)}
.social svg{width:30px;height:30px;color:var(--accent);margin-top:4px}
.social h2{font-size:clamp(1.4rem,2.6vw,2rem);font-weight:600;letter-spacing:-.03em;line-height:1.15}
.social p{margin-top:6px;color:var(--muted);max-width:52ch}
.social .state{display:inline-block;margin-top:12px;font-size:.88rem;font-weight:600;color:var(--accent)}
@media (min-width:900px){.socials{grid-template-columns:1fr 1fr;column-gap:clamp(40px,6vw,96px)}}
.plain{padding-block:clamp(40px,8vh,90px) clamp(80px,12vh,140px)}
.plain h2{font-size:clamp(1.5rem,2.8vw,2.2rem);font-weight:600;letter-spacing:-.03em;margin-top:clamp(36px,6vh,56px)}
.plain p{margin-top:14px;color:rgba(var(--ink-rgb),.84);max-width:64ch;line-height:1.75}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 24px}
.foot-links a{display:inline-flex;align-items:center;min-height:44px;color:var(--muted);text-decoration:none}
.foot-links a:hover{color:var(--ink)}

/* Video appearances: poster first, YouTube (privacy mode) loads only on play */
.clips{padding-block:clamp(90px,14vh,160px)}
.clips .lead{margin-top:16px}
.clips-grid{display:grid;gap:clamp(22px,3vw,32px) clamp(14px,2vw,28px);margin-top:clamp(32px,6vh,56px);align-items:start}
.clip{margin:0}
.clip-frame{position:relative;aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;background:var(--bg-3)}
.clip-frame img,.clip-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.clip-play{position:absolute;inset:0;display:block;width:100%;padding:0;border:0;background:none;cursor:pointer;color:inherit}
.clip-play img{transition:transform 1.2s var(--ease)}
.clip-play:hover img{transform:scale(1.04)}
.clip-play::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--shade),0) 55%,rgba(var(--shade),.55) 100%)}
.clip-btn{position:absolute;left:clamp(12px,2vw,22px);bottom:clamp(12px,2vw,22px);z-index:1;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 18px 0 16px;border-radius:999px;background:var(--accent);color:var(--on-accent);font-weight:600;font-size:.95rem;transition:transform .5s var(--ease)}
.clip-play:hover .clip-btn{transform:translateY(-2px)}
.clip-btn i{width:0;height:0;border-left:11px solid currentColor;border-top:7px solid transparent;border-bottom:7px solid transparent}
.clip figcaption{margin-top:14px}
.clip figcaption small{display:block;color:var(--accent);font-size:.85rem;font-weight:600}
.clip figcaption span{display:block;margin-top:4px;font-size:clamp(1rem,1.3vw,1.12rem);font-weight:600;line-height:1.4;max-width:48ch}
.clip-main figcaption span{font-size:clamp(1.15rem,1.8vw,1.5rem);letter-spacing:-.015em}
@media (min-width:900px){.clips-grid{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr)}.clip-main{grid-row:span 2}}

/* Display titles never overflow: each h1 carries --fit, the widest size at which its longest word fits the column (measured at build time) */
.hero-copy,.phero-in>div:first-child{container-type:inline-size;min-width:0}
@media (min-width:1600px){.hero h1{font-size:7.6rem}}
@supports (width:1cqi){
  .hero h1{font-size:min(clamp(3.1rem,14vw,8.4rem),var(--fit,100cqi))}
  .phero h1{font-size:min(clamp(3.1rem,11vw,8rem),var(--fit,100cqi))}
  @media (min-width:900px){.hero h1{font-size:min(clamp(4.2rem,7.4vw,8.8rem),var(--fit,100cqi))}}
}

/* ================= Brief 2026: Concept B additions ================= */
/* Small copper text uses the accessible tint of the brand copper */
.eyebrow,.phero .eyebrow,.themes b,.clip figcaption small,.soon-box .tag,.social .state,.person-name .role-s,.toc a.on b,.anim .m-index li.on,.menu a:hover,.menu a[aria-current="page"],.kicker,.pos-no,.doc-type,.item-meta b{color:var(--accent-ink)}
.soon-box .tag{border-color:var(--accent)}

/* Wordmark */
.brand{gap:12px}
.brand .wm{font-weight:700;font-size:.92rem;letter-spacing:.12em;text-transform:uppercase;line-height:1}
.brand .mark{color:var(--accent)}
.nav-links a{font-size:.8rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.nav-links{gap:clamp(16px,1.8vw,30px)}
@media (min-width:900px){.nav-links{display:none}.menu-btn{display:inline-flex;align-items:center}}
@media (min-width:1200px){.nav-links{display:flex}.menu-btn{display:none}}

/* Hero name as the main typographic element */
.hero h1 .row{text-transform:uppercase;letter-spacing:-.03em}
.kicker{display:block;font-size:.8rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;margin-bottom:18px}

/* Ivaylo: strong close-up on graphite, facts, motivation */
.face{position:relative;overflow:clip;isolation:isolate;padding-block:clamp(90px,14vh,150px) 0}
.face-grid{display:grid;gap:clamp(24px,4vw,64px);align-items:end}
.face-photo{position:relative;margin-inline:calc(var(--gutter) * -1);aspect-ratio:1/1;max-height:78svh}
.face-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:40% 100%}
.face-photo::after{content:"";position:absolute;left:0;right:0;bottom:0;height:22%;background:linear-gradient(0deg,var(--bg),rgba(var(--shade),0))}
.face-copy{padding-bottom:clamp(60px,10vh,120px)}
.face-copy h2{font-size:clamp(2.6rem,6.4vw,5.6rem);font-weight:650;letter-spacing:-.04em;line-height:.98;text-transform:uppercase}
.face-copy .lead{margin-top:18px}
.facts{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin-top:clamp(28px,5vh,44px)}
.facts li{padding-block:16px;border-top:1px solid var(--line)}
.facts b{display:block;font-size:1.05rem;font-weight:650;letter-spacing:-.01em}
.facts span{display:block;margin-top:4px;color:var(--muted);font-size:.95rem;line-height:1.45}
.quote{margin-top:clamp(28px,5vh,44px);font-size:clamp(1.25rem,2vw,1.6rem);font-weight:500;line-height:1.4;letter-spacing:-.015em;max-width:30ch;padding-left:20px;border-left:2px solid var(--accent)}
.face-copy .btn-link,.kosyo .btn-link{margin-top:28px}
@media (min-width:900px){.face-grid{grid-template-columns:minmax(0,6fr) minmax(0,5fr)}.face-photo{margin-inline:calc(var(--gutter) * -1) 0}}

/* Kosyo: mirrored, portrait right */
.kosyo{padding-block:clamp(100px,15vh,170px)}
.kosyo-grid{display:grid;gap:clamp(28px,4vw,72px);align-items:center}
.kosyo-photo{position:relative;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/5;background:var(--bg-3)}
.kosyo-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 16%}
.kosyo h2{font-size:clamp(2.6rem,6.4vw,5.6rem);font-weight:650;letter-spacing:-.04em;line-height:.98;text-transform:uppercase}
.kosyo .role{margin-top:14px}
.kosyo .lead{margin-top:16px}
.expertise{margin-top:28px;display:grid;gap:0}
.expertise li{padding-block:13px;border-top:1px solid var(--line);font-weight:500}
@media (min-width:900px){.kosyo-grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}.kosyo-photo{order:2;aspect-ratio:auto;height:min(82svh,860px)}}

/* The two of them: one big joint photograph, minimal text */
.duo{position:relative;min-height:88svh;display:flex;align-items:flex-end;overflow:clip;isolation:isolate}
.duo-bg{position:absolute;inset:0;z-index:-2}
.duo-bg img{width:100%;height:100%;object-fit:cover;object-position:62% 30%}
.duo::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,var(--bg) 0%,rgba(var(--shade),0) 16%,rgba(var(--shade),0) 50%,rgba(var(--shade),.82) 82%,var(--bg) 100%)}
.duo-copy{padding-bottom:clamp(36px,8vh,90px)}
.duo h2{font-size:clamp(2.4rem,6vw,5.2rem);font-weight:650;letter-spacing:-.04em;line-height:1.02;max-width:14ch}
.duo p{margin-top:16px;max-width:44ch;font-size:clamp(1.1rem,1.6vw,1.35rem);font-weight:500;line-height:1.45}
.duo cite{display:block;margin-top:8px;font-style:normal;color:var(--muted);font-size:.95rem}

/* Why: phrase block */
.why{padding-block:clamp(110px,18vh,200px)}
.why h2{font-size:clamp(3rem,9vw,8rem);font-weight:650;letter-spacing:-.05em;line-height:.95}
.why h2 span{color:var(--accent)}
.why-lines{margin-top:clamp(32px,6vh,64px);display:grid;gap:clamp(18px,3vh,28px);max-width:46ch}
.why-lines p{font-size:clamp(1.3rem,2.4vw,2rem);font-weight:500;letter-spacing:-.02em;line-height:1.3}
.why-lines p:last-child{color:var(--ink);font-weight:650}
.why-lines p:not(:last-child){color:rgba(var(--ink-rgb),.78)}
@media (min-width:900px){.why .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(40px,6vw,110px);align-items:end}.why-lines{margin-top:0}}

/* Positions: large visual blocks (images alternate with typographic tiles) */
.positions{padding-block:clamp(100px,15vh,170px)}
.positions .lead{margin-top:16px}
.pos-grid{display:grid;gap:14px;margin-top:clamp(36px,6vh,64px)}
.pos{position:relative;display:flex;flex-direction:column;justify-content:flex-end;gap:12px;min-height:clamp(300px,46svh,440px);padding:clamp(22px,2.6vw,36px);border-radius:var(--radius);overflow:hidden;isolation:isolate;text-decoration:none;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line)}
.pos img{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.pos.has-img::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(var(--shade),.05) 25%,rgba(var(--shade),.86) 100%)}
.pos:hover img{transform:scale(1.04)}
.pos-no{font-size:.85rem;font-weight:650;letter-spacing:.1em}
.pos h3{font-size:clamp(1.6rem,2.6vw,2.4rem);font-weight:650;letter-spacing:-.03em;line-height:1.08;max-width:18ch}
.pos p{color:rgba(var(--ink-rgb),.84);max-width:46ch;line-height:1.5}
.pos .go{align-self:flex-start;margin-top:6px;font-weight:600;font-size:.95rem;border-bottom:1px solid var(--accent);padding-bottom:2px}
.pos:not(.has-img) h3{font-size:clamp(1.8rem,3vw,2.8rem)}
.pos:not(.has-img) p{font-size:clamp(1.05rem,1.4vw,1.25rem);color:var(--ink);font-weight:500}
@media (min-width:900px){.pos-grid{grid-template-columns:repeat(12,minmax(0,1fr))}.pos{grid-column:span var(--span,6)}}

/* Media / publications item rows */
.items{display:grid;gap:0;margin-top:clamp(28px,5vh,48px);border-bottom:1px solid var(--line)}
.item{display:grid;gap:18px;padding-block:clamp(24px,4vh,40px);border-top:1px solid var(--line)}
.item-media{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:var(--bg-3)}
.item-media img,.item-media iframe{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.item-meta{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:.88rem;color:var(--muted)}
.item-meta b{font-weight:650}
.item h3{margin-top:8px;font-size:clamp(1.3rem,2.2vw,1.9rem);font-weight:600;letter-spacing:-.025em;line-height:1.2;max-width:34ch}
.item p{margin-top:10px;color:rgba(var(--ink-rgb),.8);max-width:58ch}
.item .btn-link{margin-top:16px}
@media (min-width:900px){.item{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4vw,64px);align-items:center}}

/* Campaign life */
.live{padding-block:clamp(100px,15vh,170px)}
.live-grid{display:grid;gap:clamp(24px,4vw,64px);align-items:center}
.live-photo{border-radius:var(--radius);overflow:hidden;aspect-ratio:4/5;background:var(--bg-3)}
.live-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
@media (min-width:900px){.live-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}.live-photo{aspect-ratio:3/4}}

/* Contacts + form */
.contact{padding-block:clamp(100px,15vh,170px)}
.contact-grid{display:grid;gap:clamp(36px,5vw,96px);margin-top:clamp(32px,6vh,56px)}
.channels{display:grid;gap:0}
.channel{padding-block:20px;border-top:1px solid var(--line)}
.channel small{display:block;color:var(--muted);font-size:.85rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase}
.channel p{margin-top:6px;font-size:1.1rem;font-weight:500}
.channel .soon{color:var(--muted);font-weight:400;font-size:1rem}
.soc-row{display:flex;gap:10px;margin-top:12px}
.soc{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:999px;border:1px solid var(--line);color:var(--muted)}
.soc svg{width:20px;height:20px}
/* Contact form: editorial fields in one quiet panel. Label above, text on a hairline, copper on focus. */
.form{padding:clamp(24px,3.4vw,48px);border-radius:var(--radius);background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line)}
.form fieldset{border:0;padding:0;margin:0;min-width:0;display:grid;gap:clamp(24px,3.4vh,34px)}
.form-row{display:grid;gap:clamp(24px,3.4vh,34px)}
.field{display:grid;gap:10px;min-width:0}
.field label,.field .label{font-size:.8rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.field input,.field textarea{width:100%;min-height:48px;padding:6px 0 12px;border:0;border-bottom:1px solid rgba(var(--ink-rgb),.24);border-radius:0;background:transparent;color:var(--ink);font:inherit;font-size:clamp(1.1rem,1.4vw,1.25rem);transition:border-color .3s}
.field textarea{min-height:110px;resize:vertical;line-height:1.5}
.field input::placeholder,.field textarea::placeholder{color:rgba(var(--ink-rgb),.36)}
.field input:focus,.field textarea:focus{outline:none;border-bottom-color:var(--accent-ink);box-shadow:0 1px 0 var(--accent-ink)}
.field input:focus-visible,.field textarea:focus-visible{outline:none}
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;inset:0;margin:0}
.chip span{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;border:1px solid rgba(var(--ink-rgb),.24);font-size:.95rem;font-weight:500;transition:background-color .3s,border-color .3s,color .3s}
.chip input:checked+span{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.chip input:focus-visible+span{outline:2px solid var(--accent-ink);outline-offset:3px}
.check{position:relative;display:grid;grid-template-columns:22px 1fr;gap:14px;align-items:start;font-size:.92rem;line-height:1.55;color:rgba(var(--ink-rgb),.78)}
.check input{position:absolute;opacity:0;width:22px;height:22px;margin:0}
.check .box{width:22px;height:22px;margin-top:1px;border-radius:6px;border:1px solid rgba(var(--ink-rgb),.36);display:grid;place-items:center;transition:background-color .3s,border-color .3s}
.check .box::after{content:"";width:10px;height:5px;margin-top:-3px;border-left:2px solid var(--bg);border-bottom:2px solid var(--bg);transform:rotate(-45deg) scale(0);transition:transform .3s var(--ease)}
.check input:checked+.box{background:var(--accent);border-color:var(--accent)}
.check input:checked+.box::after{transform:rotate(-45deg) scale(1)}
.check input:focus-visible+.box{outline:2px solid var(--accent-ink);outline-offset:3px}
.check a{color:var(--ink)}
.form-foot{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;padding-top:6px}
.form-status{font-size:.92rem;color:var(--muted)}
/* "Coming soon": fields stay crisp, only interaction is off */
.form fieldset[disabled] input,.form fieldset[disabled] textarea,.form fieldset[disabled] .chip span,.form fieldset[disabled] .check{cursor:not-allowed}
.form fieldset[disabled] .btn{opacity:.55;cursor:not-allowed}
@media (min-width:700px){.form-row{grid-template-columns:1fr 1fr;gap:32px}}
@media (min-width:900px){.contact-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}}

/* Documents */
.docs{padding-block:clamp(30px,6vh,70px) clamp(80px,12vh,140px)}
.doc-group{padding-block:clamp(28px,5vh,48px);border-top:1px solid var(--line)}
.doc-group h2{font-size:clamp(1.4rem,2.6vw,2rem);font-weight:600;letter-spacing:-.03em}
.doc{display:grid;gap:10px;margin-top:22px;padding:clamp(22px,3vw,36px);border-radius:var(--radius);background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line);text-decoration:none}
.doc-type{font-size:.85rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase}
.doc h3{font-size:clamp(1.5rem,3vw,2.4rem);font-weight:650;letter-spacing:-.03em;line-height:1.1}
.doc p{color:rgba(var(--ink-rgb),.8);max-width:62ch}
.doc .go{justify-self:start;margin-top:6px;font-weight:600;border-bottom:1px solid var(--accent);padding-bottom:2px}
.doc-empty{margin-top:14px;color:var(--muted)}

/* Position / document pages */
.theses{margin-top:clamp(24px,4vh,40px);display:grid;gap:0;max-width:72ch;counter-reset:t}
.theses li{position:relative;padding:16px 0 16px 48px;border-top:1px solid var(--line);font-size:clamp(1.05rem,1.4vw,1.2rem);font-weight:500;line-height:1.45;counter-increment:t}
.theses li::before{content:counter(t,decimal-leading-zero);position:absolute;left:0;top:18px;color:var(--accent-ink);font-weight:650;font-size:.9rem;letter-spacing:.06em}
.fulltext{padding-block:clamp(30px,6vh,70px) clamp(60px,10vh,120px)}
.fulltext h2.qh{font-size:clamp(1.35rem,2.4vw,1.9rem);font-weight:600;letter-spacing:-.025em;line-height:1.25;max-width:40ch;margin-top:clamp(40px,7vh,72px)}
.fulltext .prose{margin-top:16px}
.src{margin-top:clamp(36px,6vh,56px);color:var(--muted)}
.pdf-note{margin-top:22px;color:var(--muted);font-size:.95rem}
.section-link{margin-top:clamp(28px,5vh,44px)}

/* Footer */
.foot-grid{display:grid;gap:28px}
.foot-mark .wm{display:block;font-weight:700;font-size:1.5rem;letter-spacing:.1em;text-transform:uppercase;line-height:1.1;color:var(--ink)}
.foot-mark small{display:block;margin-top:8px;color:var(--muted)}
.foot-col h2{font-size:.8rem;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:var(--ink);margin-bottom:10px}
.foot-col p,.foot-col a{display:block;color:var(--muted);text-decoration:none;line-height:1.9}
.foot-col a:hover{color:var(--ink)}
.foot-legal{display:grid;gap:6px;padding-top:24px;border-top:1px solid var(--line)}
@media (min-width:900px){.foot-grid{grid-template-columns:minmax(0,4fr) repeat(3,minmax(0,2fr));align-items:start}}

/* Long titles (positions, publications): a calmer display size, still capped by --fit */
.phero.long h1{font-size:clamp(2.2rem,5.4vw,4.8rem);letter-spacing:-.035em;line-height:1.02;text-wrap:balance}
@supports (width:1cqi){.phero.long h1{font-size:min(clamp(2.2rem,5.4vw,4.8rem),var(--fit,100cqi))}}
.phero.long .lead{font-size:clamp(1.1rem,1.6vw,1.35rem);color:var(--ink);max-width:48ch}

section[id],details[id],h2[id]{scroll-margin-top:calc(var(--nav) + 16px)}