:root{
  --bg:#0f172a;
  --panel:#111827;
  --muted:#94a3b8;
  --text:#e5e7eb;
  --acc:#22c55e;
  --acc-2:#06b6d4;
  --danger:#ef4444;
  --card:#0b1021;
  --shadow:0 10px 30px rgba(0,0,0,.35);
  --radius:16px;
  --radius-sm:10px;
  --max:1200px;
  --narrow:760px;
  --gap:24px;
  --trans:.25s ease;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:linear-gradient(180deg,#0b122b,#0a0f1f);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(--acc-2);text-decoration:none}
a:hover{text-decoration:underline}
.topbar{position:sticky;top:0;z-index:50;background:rgba(10,14,30,.8);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,255,255,.06)}
.topbar .brand{display:flex;align-items:center;gap:12px;padding:14px 20px}
.logo{display:flex;align-items:center;gap:10px;color:#fff;font-weight:700;letter-spacing:.3px}
.logo img{border-radius:10px}
.mainnav{display:flex;gap:8px;flex-wrap:wrap;padding:0 20px 14px 20px}
.navlink{display:inline-flex;align-items:center;gap:8px;color:#cbd5e1;padding:10px 12px;border-radius:10px;transition:var(--trans);background:transparent}
.navlink:hover{background:rgba(255,255,255,.06);color:#fff}
.navlink.active{background:linear-gradient(135deg,#1e293b,#0b132a);color:#fff;border:1px solid rgba(255,255,255,.08)}
.post-ribbon{background:radial-gradient(80% 100% at 50% 0,rgba(34,197,94,.12),transparent),rgba(255,255,255,.02);border-bottom:1px solid rgba(255,255,255,.06)}
.ribbon-inner{max-width:var(--max);margin:0 auto;display:flex;overflow:auto;gap:14px;padding:10px 20px}
.ribbon-item{white-space:nowrap;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.06);color:#e5e7eb}
.ribbon-item:hover{background:rgba(34,197,94,.25);color:#fff}
.ribbon-item.active{background:linear-gradient(135deg,#22c55e,#06b6d4);color:#041021}
.hero{position:relative}
.hero-img{width:100%;height:auto;object-fit:cover;box-shadow:var(--shadow)}
.hero-content{position:relative;max-width:780px;margin:-140px auto 0 auto;padding:24px;border-radius:20px;background:linear-gradient(180deg,rgba(16,24,40,.8),rgba(8,12,24,.9));border:1px solid rgba(255,255,255,.08);backdrop-filter:blur(12px)}
.hero h1{margin:0 0 6px 0;font-size:36px;line-height:1.2}
.hero p{color:var(--muted);margin:0 0 14px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;border-radius:12px;border:1px solid rgba(255,255,255,.12);color:#fff;background:rgba(255,255,255,.04);transition:var(--trans);box-shadow:var(--shadow)}
.btn:hover{transform:translateY(-1px);text-decoration:none}
.btn.primary{background:linear-gradient(135deg,#22c55e,#06b6d4);color:#041021;border:none}
.btn.ghost{background:transparent;color:#cbd5e1}
.btn.danger{background:transparent;border:1px solid rgba(239,68,68,.6);color:#fecaca}
.btn.small{padding:8px 12px;border-radius:10px}
.link{color:#a5b4fc}
.grid.two{max-width:var(--max);margin:40px auto;padding:0 20px;display:grid;grid-template-columns:1fr 1fr;gap:var(--gap)}
.card{background:linear-gradient(180deg,#0b1021,#080c19);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
.card.small{padding:0;overflow:hidden}
.card.small img{border-radius:0}
.features{max-width:var(--max);margin:30px auto;padding:0 20px;display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.feature{background:linear-gradient(180deg,#0b1021,#0a0f1f);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:16px}
.feature h3{margin:10px 0}
.contact-strip{max-width:var(--max);margin:50px auto;padding:20px;display:grid;grid-template-columns:2fr 1fr;gap:var(--gap);align-items:center;background:linear-gradient(135deg,rgba(34,197,94,.08),rgba(6,182,212,.08));border:1px solid rgba(255,255,255,.06);border-radius:var(--radius)}
.socials{display:flex;gap:12px}
.social{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.06);color:#fff;transition:var(--trans)}
.social:hover{background:linear-gradient(135deg,#22c55e,#06b6d4);color:#041021}
.container{max-width:var(--max);margin:0 auto;padding:24px 20px}
.container.narrow{max-width:var(--narrow)}
.post{background:linear-gradient(180deg,#0b1021,#0a0f1f);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.post-header h1{margin-top:0}
.post-cover{margin:12px 0;border-radius:14px}
.meta{color:var(--muted);font-size:14px}
.more-reading{margin:30px auto;max-width:var(--max)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap)}
.card.small h3{padding:12px}
.site-footer{margin-top:40px;padding:24px 20px;background:#0c1225;border-top:1px solid rgba(255,255,255,.06);text-align:center}
.site-footer .footer-links{display:flex;gap:16px;justify-content:center;margin-bottom:10px}
.site-footer .footer-links a{padding:8px 12px;border-radius:10px;background:rgba(255,255,255,.05)}
.facts{margin:0;padding-left:18px}
.form .field{margin-bottom:14px}
.form input,.form textarea{width:100%;padding:12px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:#0a1022;color:#fff}
.form input:focus,.form textarea:focus{outline:2px solid rgba(34,197,94,.6);border-color:transparent}
.cookie-banner{position:fixed;left:0;right:0;bottom:0;background:rgba(6,10,24,.95);border-top:1px solid rgba(255,255,255,.1);padding:14px;display:block}
.cookie-content{max-width:var(--max);margin:0 auto;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.cookie-actions{display:flex;gap:10px;align-items:center}
.cookie-modal{display:none;position:fixed;inset:0;place-items:center;background:rgba(0,0,0,.6);z-index:60}
.cookie-modal-inner{width:min(560px,92vw);background:#0c1225;border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:18px;box-shadow:var(--shadow)}
.toggle{display:flex;gap:10px;align-items:center;margin:8px 0}
.about-hero{max-width:var(--narrow);margin:20px auto;text-align:center}
.team-grid{max-width:var(--max);margin:20px auto;padding:0 20px;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.team-card{background:linear-gradient(180deg,#0b1021,#0a0f1f);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:10px;text-align:center}
.team-card img{object-fit:cover;border-radius:12px}
.contact-hero{text-align:center}
.post-cta{margin-top:16px;text-align:center}
@media (max-width:1080px){
  .features{grid-template-columns:1fr 1fr}
  .team-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:720px){
  .grid.two{grid-template-columns:1fr}
  .features{grid-template-columns:1fr}
  .cards{grid-template-columns:1fr}
  .team-grid{grid-template-columns:repeat(2,1fr)}
  .hero-content{margin:-80px 20px 0}
}