:root{
  --bg:#0e1217;
  --card:#161b22;
  --muted:#8b949e;
  --text:#e6edf3;
  --primary:#2ea043;
  --accent:#1f6feb;
  --border:#30363d;
  --shadow:0 10px 30px rgba(0,0,0,.4);
  --radius:14px
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:linear-gradient(135deg,#0b0f14,#131a22);color:var(--text);font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;line-height:1.6}
img{max-width:100%;display:block;border-radius:12px}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
.container{width:min(1100px,92%);margin:0 auto}
.site-header{position:sticky;top:0;background:rgba(14,18,23,.8);backdrop-filter:blur(10px);border-bottom:1px solid var(--border);z-index:50;display:flex;align-items:center;justify-content:space-between;padding:.6rem 1rem}
.brand{display:flex;align-items:center;gap:.6rem;color:#fff;text-decoration:none}
.logo{width:36px;height:36px;border-radius:50%;object-fit:cover;border:1px solid var(--border)}
.nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:.8rem}
.nav a{color:#dbe5ee;padding:.5rem .7rem;border-radius:10px}
.nav a.active,.nav a:hover{background:rgba(255,255,255,.06);text-decoration:none}
#menuToggle{display:none;background:none;border:0;color:#fff}
#menuToggle span{display:block;width:22px;height:2px;background:#fff;margin:4px 0}
.dropdown{position:relative}
.dropdown-menu{position:absolute;display:none;right:0;top:120%;background:var(--card);border:1px solid var(--border);box-shadow:var(--shadow);border-radius:12px;padding:.5rem;min-width:260px}
.dropdown:hover .dropdown-menu{display:block}
.btn{background:transparent;border:1px solid var(--border);color:#fff;padding:.6rem 1rem;border-radius:12px;cursor:pointer}
.btn.primary{background:var(--primary);border-color:var(--primary);color:#06110a}
.btn.outline{background:transparent;border:1px solid var(--accent);color:#dbe5ee}
.btn.small{padding:.4rem .7rem;font-size:.9rem}
.hero{position:relative;min-height:52vh;display:grid;place-items:center;background-size:cover;background-position:center}
.hero.slim{min-height:36vh}
.hero .overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.6))}
.hero-content{position:relative;text-align:center;z-index:1}
.hero h1{font-size:2.4rem;margin:.2rem 0}
.hero p{color:var(--muted);max-width:780px;margin:0 auto 1rem}
.grid-2{display:grid;grid-template-columns:1.2fr .8fr;gap:1.2rem;margin:2rem auto}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin:2rem auto}
.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:1.1rem;box-shadow:var(--shadow)}
.card.emphasis{border-color:#3fb950;background:linear-gradient(180deg,rgba(46,160,67,.15),rgba(22,27,34,1))}
.list-check{padding-left:1rem}
.list-check li{margin:.3rem 0}
.section{padding:2.2rem 0}
.inline-form{display:flex;gap:.6rem;justify-content:center}
.inline-form input{flex:1;min-width:240px;border:1px solid var(--border);background:#0f141a;color:#fff;border-radius:12px;padding:.7rem}
.site-footer{margin-top:2rem;border-top:1px solid var(--border);background:#0c1116;padding:1.2rem 0}
.footer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;width:min(1100px,92%);margin:0 auto}
.footer-grid h4{margin:.4rem 0}
.legal-links a{color:#c9d1d9}
.legal-links a:hover{color:#fff}
.copy{text-align:center;color:var(--muted)}
.blog-layout{display:grid;grid-template-columns:2fr 1fr;gap:1.2rem;margin:2rem auto}
.post-card.large{display:grid;grid-template-columns:1.1fr 1fr;gap:1rem;align-items:center}
.sidebar .post-list{list-style:none;padding:0;margin:0}
.sidebar .post-list li{margin:.4rem 0}
.fun{margin-top:1rem;background:linear-gradient(180deg,rgba(31,111,235,.1),rgba(22,27,34,1));border-color:#1f6feb}
.team .team-card{text-align:center}
.nav .btn.small{border-color:#3fb950}
.post-body{margin:2rem auto}
.post .post-hero img{max-height:360px;width:100%;object-fit:cover}
.post .post-hero h1{margin:.8rem 0 0}
.post .meta{color:var(--muted)}
.post .post-cta{display:flex;gap:.6rem;margin-top:1rem}
.mini-links a{display:inline-block;margin:.2rem .2rem .2rem 0;padding:.35rem .6rem;border:1px solid var(--border);border-radius:999px}
.cookie-banner{position:fixed;left:0;right:0;bottom:0;background:rgba(22,27,34,.98);border-top:1px solid var(--border);padding:.9rem;display:none;align-items:center;gap:1rem;z-index:100}
.cookie-banner.show{display:flex}
.cookie-text p{margin:.2rem 0;color:var(--muted)}
.cookie-actions{margin-left:auto;display:flex;gap:.5rem}
.cookie-close{background:transparent;border:0;color:#fff;font-size:1.4rem;margin-left:.4rem;cursor:pointer}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:none;align-items:center;justify-content:center;z-index:200}
.modal.show{display:flex}
.modal-content{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:1rem;min-width:320px;box-shadow:var(--shadow);text-align:center}
.social svg{width:22px;height:22px;fill:#c9d1d9}
.nav ul.open{display:flex}
@media (max-width:980px){
  .grid-2{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr 1fr}
  .blog-layout{grid-template-columns:1fr}
  .post-card.large{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:720px){
  #menuToggle{display:block}
  .nav ul{position:absolute;right:1rem;top:64px;background:var(--card);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);padding:.6rem;flex-direction:column;display:none}
  .nav ul.open{display:flex}
  .footer-grid{grid-template-columns:1fr}
}
