:root{--container:960px;--gap:16px;--radius:14px}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:#0b0f13;color:#dfe6ee;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial}
a{color:#9dc1ff;text-decoration:none}
.container{max-width:var(--container);margin:0 auto;padding:0 16px}
header.site{position:sticky;top:0;background:#0b0f13f2;border-bottom:1px solid #161b21;backdrop-filter:blur(8px);z-index:50}
header .row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:.6rem 0}
.nav{display:flex;gap:1rem;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;gap:.35rem;padding:.5rem .9rem;border-radius:12px;border:1px solid #2a3644;background:#101722;color:#dfe6ee}
.btn.primary{background:#f5a524;color:#111;border:none}
.hero{position:relative;margin:.75rem 0 1rem;border-radius:14px;overflow:hidden}
.hero picture, .hero img{display:block;width:100%;height:auto;aspect-ratio:16/5}
.hero .overlay{position:absolute;inset:auto 0 0 0;padding:1rem;background:linear-gradient(180deg,transparent,#0b0f1399)}
.card{background:#0f1318;border:1px solid #1b222b;border-radius:14px;padding:1rem;margin:.9rem 0}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap)}
.col-6{grid-column:span 6}.col-12{grid-column:span 12}
.post-card img{width:100%;height:auto;border-radius:10px;aspect-ratio:16/9;display:block;background:#111}
footer.site{margin-top:1.2rem;border-top:1px solid #161b21;padding:1rem 0}
@media (max-width:860px){.col-6{grid-column:span 12}}