/* Shared styles for Eleventy-rendered pages (blog, 404, future pages). Matches the hand-built pages. */
:root{--bg:#0B0C0E;--bg2:#111215;--card:#15171B;--card2:#1A1C20;--line:#26282D;--line2:#3E4148;--ink:#F2F1EC;--ink2:#C9CBD0;--mute:#A3A6AD;--dim:#7C8088;--g:#3ec340;--g2:#6fdc70;--gd:#1E3A1F;
--sans:'Inter Tight',Inter,system-ui,-apple-system,sans-serif;--serif:'Instrument Serif',Georgia,serif;--mono:'JetBrains Mono',ui-monospace,Menlo,monospace}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}
a{color:var(--g)}a:hover{color:var(--g2)}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px}
.wrap.narrow{max-width:760px}
.grid-bg{background-image:linear-gradient(#15171B 1px,transparent 1px),linear-gradient(90deg,#15171B 1px,transparent 1px);background-size:64px 64px}
.serif{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--g)}
.muted{color:var(--mute)}
.kicker{font-family:var(--mono);font-size:12px;letter-spacing:.07em;text-transform:uppercase;color:var(--g);margin:0 0 14px;display:block}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 22px;border-radius:999px;font:600 15px/1 var(--sans);text-decoration:none;transition:transform .2s,background .2s,border-color .2s}
.btn:hover{transform:translateY(-1px)}
.btn-g{background:var(--g);color:#0B0C0E}.btn-g:hover{background:var(--g2);color:#0B0C0E}
.btn-w{background:var(--ink);color:#0B0C0E}.btn-w:hover{background:#fff;color:#0B0C0E}
.btn-o{border:1px solid var(--line2);color:var(--ink)}.btn-o:hover{border-color:var(--ink);color:var(--ink)}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}

/* blog index */
.blog-hero{padding:96px 0 72px;border-bottom:1px solid var(--line)}
.blog-hero h1{font-size:clamp(44px,7vw,92px);line-height:.95;letter-spacing:-.05em;margin:0 0 22px}
.lede{font-size:19px;line-height:1.55;color:var(--ink2);max-width:640px;margin:0 0 28px}
.blog-list{padding:64px 32px 110px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.card{display:flex;flex-direction:column;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:20px;padding:24px;text-decoration:none;color:var(--ink);transition:border-color .2s,transform .2s}
.card:hover{border-color:var(--line2);transform:translateY(-2px);color:var(--ink)}
.card strong{font-size:20px;line-height:1.25;letter-spacing:-.02em}
.card .kicker{margin:0}
.cards.big .card{padding:28px;min-height:260px}
.cards.big .card strong{font-size:24px}
.excerpt{color:var(--ink2);font-size:15px;line-height:1.55;flex:1}
.empty{font-size:18px;color:var(--ink2)}
.nf{min-height:60vh;display:flex;align-items:center}

/* post */
.post{padding:56px 0 110px}
.crumbs{display:flex;gap:8px;font-size:14px;color:var(--dim);margin-bottom:36px}
.crumbs a{color:var(--mute);text-decoration:none}.crumbs a:hover{color:var(--ink)}
.post h1{font-size:clamp(36px,5.4vw,60px);line-height:1.02;letter-spacing:-.045em;margin:0 0 18px}
.dek{font-size:20px;line-height:1.5;color:var(--ink2);margin:0 0 22px}
.meta{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;color:var(--mute);padding-bottom:28px;border-bottom:1px solid var(--line);margin-bottom:36px}
.prose{font-size:18px;line-height:1.75;color:#DCDDD8}
.prose h2{font-size:30px;line-height:1.15;letter-spacing:-.03em;color:var(--ink);margin:52px 0 16px}
.prose h3{font-size:22px;letter-spacing:-.02em;color:var(--ink);margin:36px 0 10px}
.prose p{margin:0 0 20px}
.prose ul,.prose ol{padding-left:22px;margin:0 0 22px}
.prose li{margin:0 0 8px}
.prose strong{color:var(--ink)}
.prose blockquote{margin:28px 0;padding:6px 0 6px 22px;border-left:3px solid var(--g);font-family:var(--serif);font-style:italic;font-size:24px;line-height:1.4;color:var(--ink)}
.prose img{max-width:100%;height:auto;border-radius:14px}
.prose table{width:100%;border-collapse:collapse;margin:0 0 24px;font-size:16px}
.prose th,.prose td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left}
.prose code{font-family:var(--mono);font-size:.88em;background:var(--card2);padding:2px 6px;border-radius:6px}
.faq{margin-top:56px}
.faq h2{font-size:28px;letter-spacing:-.03em;margin:0 0 12px}
.faq details{border-top:1px solid var(--line);padding:4px 0}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;padding:18px 0;font-weight:600;font-size:18px}
.faq p{margin:0 0 20px;color:var(--ink2);line-height:1.65}
.cta-box{margin-top:56px;padding:32px;border-radius:22px;border:1px solid #2B5A2D;background:linear-gradient(180deg,#132015,#0F1410)}
.cta-box h2{font-size:28px;letter-spacing:-.03em;margin:0 0 10px}
.cta-box p{color:var(--ink2);line-height:1.6;margin:0 0 20px}
.author{display:flex;gap:18px;align-items:flex-start;margin-top:40px;padding-top:32px;border-top:1px solid var(--line)}
.author strong{display:block;font-size:17px}
.author span{display:block;color:var(--mute);font-size:14px;margin-top:2px}
.author p{margin:10px 0 0;color:var(--ink2);line-height:1.6;font-size:15px}
.related{margin-top:56px}
.related h2{font-size:24px;letter-spacing:-.02em;margin:0 0 16px}
.related .cards{grid-template-columns:1fr}

@media (max-width:900px){.cards{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.wrap{padding:0 20px}.blog-list{padding:44px 20px 80px}.cards{grid-template-columns:1fr}.blog-hero{padding:64px 0 48px}.prose{font-size:17px}.cta-box{padding:24px}}
.logo{width:52px;height:52px;border-radius:14px;background:var(--g);color:#0B0C0E;display:inline-grid;place-items:center;font-weight:800;font-size:16px;letter-spacing:-.05em;flex:none}
.author .logo{display:inline-grid;font-size:16px;color:#0B0C0E;margin:0}