:root{--bg:#0e0c0a;--bg2:#171310;--ink:#f5efe8;--dim:#a89e93;--orange:#fb8a4e;--orange-hot:#ff6a1f;--line:rgba(251,138,78,.18);--mono:'Space Mono',monospace;--disp:'Unbounded',sans-serif;--body:'Space Grotesk',sans-serif}
*{margin:0;padding:0;box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:var(--orange);text-decoration:none}
a:hover{color:var(--orange-hot)}
::selection{background:var(--orange);color:#0e0c0a}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
.topbar{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding:18px clamp(20px,5vw,60px);background:rgba(14,12,10,.88);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.brand{font-family:var(--disp);font-weight:800;font-size:14px;letter-spacing:.02em;color:var(--ink);text-transform:uppercase}
.brand em{font-style:normal;color:var(--orange)}
.topbar nav{display:flex;gap:22px;align-items:center;font-family:var(--mono);font-size:13px}
.topbar nav a{color:var(--dim)}
.topbar nav a:hover{color:var(--orange)}
.topbar nav a.yt{color:#0e0c0a;background:var(--orange);padding:9px 16px;border-radius:99px;font-weight:700}
.topbar nav a.yt:hover{background:var(--orange-hot);color:#0e0c0a}
.article{max-width:720px;margin:0 auto;padding:clamp(40px,6vw,80px) clamp(20px,5vw,40px) 40px}
.back{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.back:hover{color:var(--orange)}
.tag{display:block;margin-top:34px;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--orange)}
h1{font-family:var(--disp);font-weight:600;font-size:clamp(30px,5vw,50px);line-height:1.08;letter-spacing:-.02em;margin:16px 0 20px;text-wrap:pretty}
.meta{display:flex;gap:18px;font-family:var(--mono);font-size:12px;color:var(--dim);padding-bottom:26px;border-bottom:1px solid var(--line)}
.lead{font-size:clamp(19px,2.2vw,22px);line-height:1.55;color:var(--ink);margin:30px 0 8px;text-wrap:pretty}
.body{display:grid;gap:22px;margin-top:22px}
.body p{color:#d9d1c8;text-wrap:pretty}
.body b{color:var(--ink);font-weight:700}
.cta{margin-top:56px;padding:30px;border:1px solid var(--line);border-radius:18px;background:var(--bg2);display:grid;gap:14px}
.cta h2{font-family:var(--disp);font-weight:600;font-size:20px;line-height:1.3}
.cta p{color:var(--dim);font-size:15px}
.cta .row{display:flex;gap:12px;flex-wrap:wrap;margin-top:4px}
.cta .row a{font-family:var(--mono);font-size:13px;padding:12px 20px;border-radius:99px;border:1px solid var(--line)}
.cta .row a.solid{background:var(--orange);color:#0e0c0a;border-color:var(--orange);font-weight:700}
.cta .row a.solid:hover{background:var(--orange-hot);color:#0e0c0a}
.cta .row a:hover{border-color:var(--orange)}
.prevnext{margin-top:44px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.prevnext a{border:1px solid var(--line);border-radius:16px;padding:20px;display:grid;gap:8px;transition:border-color .2s,transform .2s}
.prevnext a:hover{border-color:var(--orange);transform:translateY(-3px)}
.prevnext span{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim)}
.prevnext b{font-family:var(--disp);font-weight:500;font-size:15px;line-height:1.35;color:var(--ink)}
.prevnext a.next{text-align:right}
footer.site{border-top:1px solid var(--line);padding:30px clamp(20px,5vw,60px);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-family:var(--mono);font-size:12px;color:var(--dim)}
footer.site a{color:var(--dim)}
footer.site a:hover{color:var(--orange)}
@media(max-width:620px){.prevnext{grid-template-columns:1fr}.prevnext a.next{text-align:left}.topbar nav{gap:16px;font-size:12px}}