/* Version C — sleek. Loaded after styles.css on index-c.html only. */
.c{font-size:17px}
.c .lbl{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:10px}
.c .lbl::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--zobo)}
.c .dark .lbl{color:var(--muted-dark)}
.c .h-light{font:400 clamp(36px,4.6vw,76px)/1.04 var(--display);letter-spacing:-.035em;text-wrap:balance}
.c .h-body{font:400 clamp(24px,2.6vw,42px)/1.25 var(--display);letter-spacing:-.025em;text-wrap:pretty}
.c .tlink{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:15px;border-bottom:1px solid currentColor;padding-bottom:4px;transition:gap .3s var(--ease),color .2s}
.c .tlink:hover{gap:16px;color:var(--zobo)}
.c .tlink svg{width:16px;height:16px}
.c .hair{border-top:1px solid var(--line)}
.c .dark .hair{border-color:var(--line-dark)}
.c .nav .btn-main{background:transparent;color:inherit;box-shadow:inset 0 0 0 1px currentColor;height:40px;padding:0 18px;font-size:14px}
.c .nav .btn-main:hover{background:var(--zobo);color:#fff;box-shadow:none}

/* hero */
.ch{position:relative;height:100vh;height:100svh;min-height:640px;overflow:hidden;background:var(--ink);color:#fff}
.ch-img{position:absolute;inset:0}
.ch-img img{width:100%;height:100%;object-fit:cover;object-position:50% 40%;will-change:transform}
.ch::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,14,18,.35) 0%,rgba(13,14,18,0) 30%,rgba(13,14,18,.15) 55%,rgba(13,14,18,.78) 100%)}
.ch-meta{position:absolute;z-index:2;top:96px;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.85}
.ch-copy{position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);bottom:clamp(36px,7vh,72px);display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.7fr);gap:40px;align-items:end}
.ch h1{font:400 clamp(48px,7.4vw,124px)/.98 var(--display);letter-spacing:-.045em}
.ch h1 span{display:inline-block;will-change:transform}
.ch-img{will-change:clip-path}
.ch p{font-size:16px;line-height:1.55;color:rgba(255,255,255,.85);max-width:34ch;margin-bottom:18px}
@media (max-width:800px){.ch-copy{grid-template-columns:1fr}}

/* intro */
.ci{display:grid;grid-template-columns:minmax(0,.35fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);padding:clamp(100px,14vw,200px) var(--gutter) clamp(70px,9vw,120px)}
.ci .h-body em{color:var(--zobo)}
@media (max-width:800px){.ci{grid-template-columns:1fr}}

/* next outreach line */
.cn{margin:0 var(--gutter);display:grid;grid-template-columns:1fr 1.1fr 1.1fr .8fr auto auto;gap:24px;align-items:center;padding:26px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:15px}
.cn b{font-weight:600}
.cn .countdown{gap:14px}
.cn .countdown span{display:flex;align-items:baseline;gap:4px;font-size:12px;color:var(--muted)}
.cn .countdown b{font:400 28px/1 var(--display);letter-spacing:-.03em;color:var(--ink)}
@media (max-width:1000px){.cn{grid-template-columns:1fr 1fr}}

/* image pair */
.cp{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,.75fr);gap:clamp(16px,2vw,28px);padding:clamp(80px,10vw,150px) var(--gutter);align-items:end}
.cp figure{margin:0;display:grid;gap:12px}
.cp .big{aspect-ratio:16/11;overflow:hidden;border-radius:4px}
.cp .small{aspect-ratio:4/5;overflow:hidden;border-radius:4px}
.cp img{width:100%;height:100%;object-fit:cover;will-change:transform}
.cp figcaption{font-size:13px;color:var(--muted);display:flex;justify-content:space-between}
@media (max-width:800px){.cp{grid-template-columns:1fr}}

/* numbers */
.cnum{display:grid;grid-template-columns:repeat(4,1fr);margin:0 var(--gutter)}
.cnum div{padding:26px 24px 34px 0;border-top:1px solid var(--line)}
.cnum div+div{padding-left:24px;border-left:1px solid var(--line)}
.cnum b{display:block;font:400 clamp(48px,5.6vw,92px)/1 var(--display);letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.cnum span{display:block;margin-top:12px;font-size:13px;color:var(--muted)}
@media (max-width:800px){.cnum{grid-template-columns:1fr 1fr}.cnum div:nth-child(3){padding-left:0;border-left:0}}

/* story */
.cs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin-top:clamp(100px,14vw,200px)}
.cs-img{min-height:100vh;overflow:hidden}
.cs-img img{width:100%;height:115%;object-fit:cover;filter:grayscale(1);will-change:transform}
.cs-copy{padding:clamp(60px,8vw,140px) var(--gutter);display:grid;align-content:center;gap:28px}
.cs-copy p{color:#B4B5BA;max-width:44ch;line-height:1.65}
@media (max-width:900px){.cs{grid-template-columns:1fr}.cs-img{min-height:70vh}}

/* outreach index list */
.co{padding:clamp(100px,14vw,200px) var(--gutter) clamp(60px,8vw,110px);position:relative}
.co-head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:56px}
.co-row{display:grid;grid-template-columns:60px 1.4fr 1fr .8fr 30px;gap:20px;align-items:center;padding:28px 0;border-top:1px solid var(--line);transition:padding .4s var(--ease),color .2s}
.co-row:last-of-type{border-bottom:1px solid var(--line)}
.co-row .no{font-size:13px;color:var(--muted)}
.co-row h3{font:400 clamp(30px,3.4vw,56px)/1 var(--display);letter-spacing:-.04em}
.co-row span{color:var(--muted);font-size:15px}
.co-row svg{width:22px;height:22px;transition:transform .4s var(--ease)}
.co-row:hover{padding-left:14px;color:var(--zobo)}
.co-row:hover svg{transform:rotate(-45deg)}
.co-float{position:fixed;top:0;left:0;width:300px;aspect-ratio:4/5;border-radius:6px;overflow:hidden;pointer-events:none;z-index:40;opacity:0;transform:scale(.8);transition:opacity .3s,transform .4s var(--ease)}
.co-float.on{opacity:1;transform:scale(1)}
.co-float img{width:100%;height:100%;object-fit:cover}
@media (max-width:800px){.co-row{grid-template-columns:40px 1fr 30px}.co-row span{display:none}.co-float{display:none}}

/* a day */
.cd{padding:clamp(80px,10vw,150px) var(--gutter)}
.cd ol{list-style:none;padding:0;margin:56px 0 0;display:grid;grid-template-columns:repeat(5,1fr)}
.cd li{padding:22px 22px 0 0;border-top:1px solid var(--line);position:relative}
.cd li::before{content:"";position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:var(--zobo)}
.cd li b{display:block;font:400 34px/1 var(--display);letter-spacing:-.04em;margin-bottom:14px}
.cd li h3{font-size:16px;font-weight:600;margin-bottom:6px}
.cd li p{font-size:15px;color:var(--muted)}
@media (max-width:1000px){.cd ol{grid-template-columns:1fr 1fr;gap:28px 0}}

/* voices */
.cv{padding:clamp(100px,14vw,200px) var(--gutter);text-align:center;display:grid;justify-items:center;gap:36px}
.cv-stage{position:relative;max-width:1000px;min-height:clamp(220px,22vw,300px);width:100%}
.cv-q{position:absolute;inset:0;margin:0;opacity:0;transform:translateY(16px);transition:opacity .8s,transform .9s var(--ease)}
.cv-q.on{opacity:1;transform:none}
.cv-q blockquote{margin:0;font:400 clamp(28px,3.4vw,54px)/1.18 var(--display);letter-spacing:-.035em}
.cv-q figcaption{margin-top:26px;font-size:14px;color:var(--muted-dark)}
.cv-q figcaption b{color:var(--paper);font-weight:600;margin-right:8px}
.cv-dots{display:flex;gap:10px}
.cv-dots button{width:34px;height:3px;border-radius:2px;background:var(--ink-3)}
.cv-dots button.on{background:var(--zobo-2)}

/* places */
.cw{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(30px,6vw,110px);padding:clamp(100px,14vw,200px) var(--gutter) clamp(80px,10vw,150px)}
.cw ul{list-style:none;padding:0;margin:0}
.cw li{display:flex;justify-content:space-between;align-items:baseline;padding:20px 0;border-top:1px solid var(--line)}
.cw li:last-child{border-bottom:1px solid var(--line)}
.cw li b{font:400 clamp(24px,2.4vw,36px)/1 var(--display);letter-spacing:-.03em}
.cw li span{font-size:13px;color:var(--muted)}
@media (max-width:900px){.cw{grid-template-columns:1fr}}

/* evie */
.ce{padding:clamp(80px,10vw,150px) var(--gutter);display:grid;justify-items:center;text-align:center;gap:28px}
.ce .h-body{max-width:30ch}
.ce .sign{font:600 48px/1 "Caveat",cursive;color:var(--zobo)}
.ce .who{font-size:13px;color:var(--muted);margin-top:-14px}

/* closing */
.cc{position:relative;height:100vh;height:100svh;min-height:600px;overflow:hidden;color:#fff;display:grid;align-items:end}
.cc img{position:absolute;inset:0;width:100%;height:115%;object-fit:cover;will-change:transform}
.cc::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,14,18,.1),rgba(13,14,18,.75))}
.cc .in{position:relative;z-index:2;padding:0 var(--gutter) clamp(50px,9vh,100px);display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.7fr);gap:40px;align-items:end}
.cc h2{font:400 clamp(60px,10vw,170px)/.92 var(--display);letter-spacing:-.05em}
.cc p{color:rgba(255,255,255,.85);margin-bottom:18px;max-width:30ch}
@media (max-width:800px){.cc .in{grid-template-columns:1fr}}

.c .hero-row .display{font-weight:500}

/* ---------- hero: photos inside the sentence ---------- */
.hx{position:relative;background:var(--paper)}
.hx-stage{position:relative;height:100vh;height:100svh;min-height:640px;overflow:hidden;display:flex;flex-direction:column;justify-content:center;padding:110px var(--gutter) 40px}
.hx-meta{position:absolute;top:96px;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.hx-title{font:500 clamp(52px,9.4vw,168px)/1.02 var(--display);letter-spacing:-.05em;margin:0}
.hx-title .row{display:block;white-space:nowrap}
.hx-title .w{display:inline-block}
.pill{display:inline-block;position:relative;width:1.7em;height:.8em;border-radius:999px;overflow:hidden;vertical-align:-.04em;background:var(--surface-2)}
.pill img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:opacity 1s}
.p2 img+img{opacity:0}
.hx-foot{position:absolute;left:var(--gutter);right:var(--gutter);bottom:clamp(28px,5vh,52px);display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap}
.hx-foot p{max-width:36ch;color:#45464B;font-size:16px}
.hx-full{position:absolute;inset:0;z-index:4;opacity:0;pointer-events:none;will-change:clip-path}
.hx-full img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.hx-full::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(13,14,18,0) 35%,rgba(13,14,18,.78))}
.hx-full .copy{position:absolute;z-index:2;left:var(--gutter);right:var(--gutter);bottom:clamp(40px,8vh,90px);color:#fff;display:flex;justify-content:space-between;align-items:end;gap:30px;flex-wrap:wrap}
.hx-full h2{font:400 clamp(40px,5.6vw,96px)/1 var(--display);letter-spacing:-.045em}
.hx-full p{max-width:30ch;color:rgba(255,255,255,.85)}
@media (max-width:700px){.hx-title .row{white-space:normal}.pill{width:1.4em}}
