:root{
  --bg:#0f1115;
  --card:#151924;
  --muted:#9aa3af;
  --text:#eef2f7;
  --primary:#6c8cff;
  --accent:#ffb703;
  --ghost:#1f2533;
  --border:#232a3a;
  --success:#22c55e;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:Inter,system-ui,Segoe UI,Roboto,Arial,sans-serif;line-height:1.6}
a{color:var(--text);text-decoration:none}
a:hover{opacity:.9}
img{display:block;max-width:100%;border-radius:12px}
.container{width:min(1200px,92%);margin:0 auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(15,17,21,.7);backdrop-filter:blur(8px);border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.logo{display:flex;align-items:center;gap:10px;font-weight:700}
.logo img{border-radius:8px}
.navbar{display:flex;gap:8px;flex-wrap:wrap}
.nav-link{padding:10px 14px;border-radius:10px;color:var(--muted);display:flex;align-items:center;gap:8px}
.nav-link.active,.nav-link:hover{color:var(--text);background:var(--ghost)}
.hero{position:relative;min-height:62vh;display:flex;align-items:center}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.35;filter:grayscale(20%)}
.hero-content{position:relative;padding:80px 0}
.hero h1{font-size:42px;margin:0 0 10px}
.hero p{max-width:700px;color:var(--muted);margin:0 0 18px}
.hero-actions{display:flex;gap:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:10px;padding:12px 18px;cursor:pointer;transition:.2s}
.btn.small{padding:8px 12px;font-size:14px}
.btn.primary{background:var(--primary);color:#fff}
.btn.accent{background:var(--accent);color:#111}
.btn.ghost{background:var(--ghost);color:#fff;border:1px solid var(--border)}
.btn:disabled{opacity:.6;cursor:not-allowed}
.community-bar{background:linear-gradient(90deg,rgba(108,140,255,.12),rgba(255,183,3,.08));border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.community-bar.slim{margin-top:16px}
.community-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.subs{display:flex;align-items:center;gap:12px}
.muted{color:var(--muted)}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:36px auto}
.feature-card{background:var(--card);padding:22px;border:1px solid var(--border);border-radius:14px}
.feat-icon{width:48px;height:48px;border-radius:10px;background:var(--ghost);display:flex;align-items:center;justify-content:center;margin-bottom:10px}
.cta-split{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;margin:40px auto}
.split-text h2{margin:0 0 10px}
.page-hero{position:relative;min-height:38vh;display:flex;align-items:center}
.page-hero .hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28;filter:grayscale(10%)}
.page-hero .hero-content{position:relative;padding:60px 0}
.featured-post{display:grid;grid-template-columns:1.2fr .8fr;gap:20px;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px}
.post-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:24px auto}
.post-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:10px;display:block}
.post-card h3{margin:10px 6px 8px;font-size:16px}
.team-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin:28px auto}
.team-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px;text-align:center}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:30px auto}
.contact-form,.contact-info{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px}
.info-item{display:flex;align-items:center;gap:10px;margin:8px 0}
.form-row{display:flex;flex-direction:column;gap:8px;margin-bottom:12px}
input,textarea,select{background:#0b0e14;border:1px solid var(--border);border-radius:10px;color:var(--text);padding:10px}
.article-hero{display:grid;gap:12px;justify-items:center;padding:16px 0}
.article{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px;margin:14px auto}
.site-footer{border-top:1px solid var(--border);margin-top:40px;background:#0d1017}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:20px;padding:22px 0}
.footer-links{list-style:none;margin:0;padding:0}
.footer-links li{margin:8px 0}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--border);padding:12px 0;color:var(--muted)}
.inline-icon{display:inline-flex;vertical-align:middle;margin-right:6px}
.social a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:10px;background:var(--ghost);margin-right:8px;border:1px solid var(--border)}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);display:flex;align-items:center;justify-content:center;z-index:100}
.modal.hidden{display:none}
.modal-content{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px;max-width:520px;width:92%}
.modal-close{position:absolute;right:12px;top:12px;background:var(--ghost);border:1px solid var(--border);width:32px;height:32px;border-radius:8px;color:#fff;cursor:pointer}
.cookie-bar{position:fixed;left:0;right:0;bottom:0;background:rgba(13,16,23,.98);border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 18px;z-index:90}
.cookie-bar.hidden{display:none}
.cookie-text{color:var(--muted)}
.cookie-actions{display:flex;gap:8px}
.cookie-prefs{position:fixed;bottom:70px;right:16px;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px;z-index:95}
.cookie-prefs.hidden{display:none}
.toggle{display:flex;align-items:center;gap:8px;margin:6px 0}
@media (max-width:1024px){
  .features{grid-template-columns:1fr 1fr}
  .cta-split{grid-template-columns:1fr}
  .featured-post{grid-template-columns:1fr}
  .post-grid{grid-template-columns:1fr 1fr}
  .team-grid{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .features{grid-template-columns:1fr}
  .post-grid{grid-template-columns:1fr}
  .team-grid{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
}