*{box-sizing:border-box}
body{margin:0;background:#FCFCFB;color:#111112;font-family:'Instrument Sans',"Helvetica Neue",Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
::selection{background:#111112;color:#fff}
.mono{font-family:ui-monospace,Menlo,monospace;letter-spacing:.08em}
.wrap{max-width:1280px;margin:0 auto;padding:0 clamp(16px,4.5vw,40px)}
nav{position:sticky;top:0;z-index:50;background:rgba(252,252,251,.9);backdrop-filter:blur(10px);border-bottom:1px solid #E3E3E0}
nav .wrap{height:58px;display:flex;align-items:center;gap:clamp(14px,3vw,40px)}
nav .brand{display:flex;align-items:baseline;gap:8px;flex:none}
nav .links{display:flex;gap:clamp(14px,2.5vw,28px);font-size:13.5px;color:#44444A;white-space:nowrap}
nav .links a:hover{color:#111112}
nav .cta{margin-left:auto;background:#111112;color:#fff;font-size:13.5px;font-weight:500;padding:8px 15px;border-radius:6px}
nav .cta:hover{background:#333338}
@media (max-width:760px){nav .links{display:none}}

.hero{position:relative;background:#101012;overflow:hidden;container-type:inline-size}
.hero .media{position:relative;aspect-ratio:16/9;max-height:78vh}
.hero .media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.overlay{position:absolute;inset:0;pointer-events:none;color:#fff;font-weight:600;letter-spacing:-.05em;line-height:.9;text-shadow:0 2px 24px rgba(0,0,0,.35)}
.overlay .tl{position:absolute;left:4.5%;top:5%;font-size:clamp(36px,9cqw,180px)}
.overlay .br{position:absolute;right:4.5%;bottom:4%;font-size:clamp(36px,9cqw,180px)}

.article{max-width:720px;margin:0 auto;padding:clamp(36px,5vw,64px) clamp(16px,4.5vw,40px) clamp(64px,9vw,120px)}
.eyebrow{display:flex;gap:14px;font-size:13px;color:#88888E}
.eyebrow b{font-weight:500;color:#111112}
h1{margin:14px 0 0;font-weight:600;letter-spacing:-.035em;line-height:1.06;font-size:clamp(30px,4.6vw,52px)}
.lede{margin:22px 0 0;font-size:clamp(17px,2vw,20px);line-height:1.55;color:#33333A}
.byline{margin-top:26px;padding-top:18px;border-top:1px solid #E3E3E0;display:flex;align-items:center;gap:12px;font-size:13.5px;color:#55555C}
.byline .who{font-weight:500;color:#111112}
.body{margin-top:clamp(28px,4vw,40px);font-size:clamp(16px,1.9vw,18px);line-height:1.7;color:#22222A}
.body p{margin:0 0 1.35em}
.body h2{margin:2.2em 0 .7em;font-weight:600;letter-spacing:-.025em;line-height:1.15;font-size:clamp(22px,2.8vw,30px);color:#111112}
.body h3{margin:1.8em 0 .5em;font-weight:600;letter-spacing:-.015em;line-height:1.25;font-size:clamp(18px,2.1vw,21px);color:#111112}
.body ul,.body ol{margin:0 0 1.35em;padding-left:1.25em}
.body li{margin:.35em 0}
.body blockquote{margin:1.6em 0;padding:4px 0 4px 20px;border-left:2px solid #111112;color:#33333A;font-size:1.05em}
.body strong{font-weight:600;color:#111112}
.body .kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:0 28px;margin:1.6em 0;border-top:1px solid #E3E3E0}
.body .kv div{padding:18px 0;border-bottom:1px solid #EDEDEA}
.body .kv .v{font-weight:600;font-size:clamp(26px,3vw,36px);letter-spacing:-.03em;line-height:1.1}
.body .kv .l{margin-top:6px;font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.08em;color:#88888E}
.body .thread{margin:1.6em 0;border:1px solid #E3E3E0;background:#fff;padding:18px 20px;display:flex;flex-direction:column;gap:8px}
.body .thread .in{align-self:flex-start;background:#E9E9EB;font-size:14px;line-height:1.4;padding:8px 13px;border-radius:15px 15px 15px 4px;max-width:85%}
.body .thread .out{align-self:flex-end;background:#0A84FF;color:#fff;font-size:14px;line-height:1.4;padding:8px 13px;border-radius:15px 15px 4px 15px;max-width:85%}
.body .thread .tag{align-self:flex-start;font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.06em;color:#2E7D4F;border:1px solid rgba(46,125,79,.35);padding:4px 10px;margin-top:6px}
.endcta{margin-top:clamp(40px,6vw,64px);padding:clamp(24px,3.5vw,32px);background:#101012;color:#F2F2F0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px}
.endcta .t{font-weight:600;font-size:clamp(18px,2.4vw,24px);letter-spacing:-.02em;line-height:1.2;max-width:520px}
.endcta a{background:#fff;color:#111112;font-size:14.5px;font-weight:500;padding:12px 20px;border-radius:7px;white-space:nowrap}
.endcta a:hover{background:#D9D9D6}
.more{max-width:1280px;margin:0 auto;padding:0 clamp(16px,4.5vw,40px) clamp(56px,8vw,96px)}
.more .h{font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.1em;color:#B4B4B8;padding-top:26px;border-top:1px solid #E3E3E0}
.more .row{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(20px,3vw,32px);margin-top:20px}
.more .card .media{position:relative;overflow:hidden;background:#101012;aspect-ratio:16/9;border-radius:6px}
.more .card .media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.more .card h3{margin:14px 0 0;font-weight:600;letter-spacing:-.02em;line-height:1.2;font-size:17px}
.more .card .meta{margin-top:6px;font-size:13px;color:#88888E}
footer{background:#101012;color:#F2F2F0;border-top:1px solid rgba(255,255,255,.1)}
footer .wrap{padding:clamp(36px,6vw,52px) clamp(16px,4.5vw,40px);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px}
footer .links{display:flex;flex-wrap:wrap;gap:24px;font-size:13px}
footer .links a{color:rgba(255,255,255,.6)}footer .links a:hover{color:#fff}
