:root{
  --bg: #0c0f14;
  --bg-soft: #11151d;
  --card: #171c26;
  --text: #e7ecf3;
  --muted: #a8b2c1;
  --accent: #6ee7f2;
  --accent-2:#b17fff;
  --accent-3:#ffb86b;
  --danger:#ff6b6b;
  --success:#30d158;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
  --radius: 14px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background: radial-gradient(1000px 600px at 10% -10%, #172032, transparent), linear-gradient(180deg, #0b0e13 0%, #0c0f14 100%);color:var(--text);font: 16px/1.6 "Poppins", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;text-align:center}
img{max-width:100%;height:auto;border-radius:12px}
a{color:var(--accent);text-decoration:none}
a:hover{opacity:.9}
.container{width:min(1100px, 92%);margin:0 auto}
.header{
  position:sticky;top:0;z-index:50;
  background: rgba(12,15,20,.7);
  backdrop-filter: blur(10px);
  box-shadow: var(--shadow)
}
.nav{
  display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 0
}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid rgba(255,255,255,.15)}
.brand span{font-weight:700;letter-spacing:.4px}
.navlinks{display:flex;gap:10px;flex-wrap:wrap;justify-content:center}
.navlinks a{padding:10px 16px;border-radius:999px;background:linear-gradient(180deg,#1a2130,#121722);color:var(--text);border:1px solid rgba(255,255,255,.08)}
.navlinks a.active{background:linear-gradient(180deg,#20283a,#151b28);border-color:rgba(255,255,255,.18)}
.postlinks{
  margin:8px auto 16px auto;display:flex;gap:8px;flex-wrap:wrap;justify-content:center
}
.postlinks a{padding:8px 12px;border-radius:999px;background:#171c26;border:1px solid rgba(255,255,255,.06);color:#cfe8ff;font-size:13px}
.hero{padding:42px 0 28px}
.kicker{display:inline-block;padding:6px 12px;border-radius:999px;background:linear-gradient(90deg, rgba(110,231,242,.18), rgba(177,127,255,.18));border:1px solid rgba(255,255,255,.1);color:#c1d7ff;font-size:13px;margin-bottom:14px}
.h1{font-size:44px;line-height:1.12;margin:8px 0 12px}
.sub{color:var(--muted);max-width:800px;margin:0 auto 18px}
.cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:10px auto 0}
.btn{padding:12px 18px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,#1b2230,#131a26);color:var(--text);font-weight:600}
.btn.primary{background:linear-gradient(180deg,#00c6ff,#0072ff);border-color:transparent;color:#04121c}
.btn.ghost{background:transparent}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.card{
  grid-column: span 12;background:linear-gradient(180deg,#141a24,#121722);
  border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px
}
.card .title{font-size:22px;margin:10px 0 6px}
.card .muted{color:var(--muted)}
.split-2>.card{grid-column: span 6}
.split-3>.card{grid-column: span 4}
.badge{display:inline-block;padding:6px 10px;border-radius:10px;background:#121825;border:1px solid rgba(255,255,255,.08);color:#bcd1ff;font-size:12px}
.figure{overflow:hidden;border-radius:12px}
.figure img{width:100%;height:340px;object-fit:cover}
.section{padding:32px 0}
.footer{
  margin-top:36px;padding:26px 0;background:linear-gradient(180deg,#0c0f14,#0a0d12);border-top:1px solid rgba(255,255,255,.08)
}
.footer .links{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin:10px 0}
.footer .legal a{color:#dce9ff;padding:8px 12px;border-radius:10px;background:#121825;border:1px solid rgba(255,255,255,.09)}
.footer small{display:block;color:var(--muted);margin-top:8px}
.social{display:flex;gap:12px;justify-content:center;margin-top:10px}
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:12px;background:#141a24;border:1px solid rgba(255,255,255,.08)}
blockquote{
  margin:12px auto;padding:16px;border-radius:12px;background:linear-gradient(180deg,#151b22,#121722);
  border:1px solid rgba(255,255,255,.08);max-width:900px
}
blockquote .q{font-size:18px}
blockquote .by{color:var(--muted);font-size:14px;margin-top:6px}
.contact-info{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;margin:10px 0}
.info-chip{display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;background:#141a24;border:1px solid rgba(255,255,255,.08)}
.info-chip svg{width:18px;height:18px}
.form{
  width:min(720px,95%);margin:16px auto;text-align:center;background:#141a24;border:1px solid rgba(255,255,255,.08);border-radius:14px;padding:18px
}
.form .row{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.form input,.form textarea{
  width:100%;max-width:680px;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#0f141d;color:var(--text)
}
.form .row.two input{max-width:330px}
.form button{margin-top:10px}
.modal{
  position:fixed;inset:0;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.6);z-index:200
}
.modal .box{background:#141a24;border:1px solid rgba(255,255,255,.1);padding:22px;border-radius:14px;min-width:280px}
.cookie{
  position:fixed;left:0;right:0;bottom:0;padding:14px;background:rgba(13,17,23,.98);
  border-top:1px solid rgba(255,255,255,.12);z-index:120;display:none
}
.cookie .wrap{display:flex;gap:12px;align-items:center;justify-content:center;flex-wrap:wrap}
.cookie .actions{display:flex;gap:8px;flex-wrap:wrap}
.cookie .actions button{padding:10px 14px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#141a24;color:var(--text)}
.cookie .actions .accept{background:linear-gradient(180deg,#00c6ff,#0072ff);border-color:transparent;color:#04121c}
.cookie .actions .decline{background:#20141a;border-color:rgba(255,255,255,.12);color:#ffd6d6}
.cookie .config{display:none;background:#0e141d;padding:12px;border-radius:12px;border:1px solid rgba(255,255,255,.1)}
.cookie .toggle{display:inline-flex;gap:6px;align-items:center;margin:4px 8px;padding:8px 10px;border-radius:10px;background:#131a24;border:1px solid rgba(255,255,255,.08)}
input[type=checkbox]{width:18px;height:18px}
.tagline{color:#bcd1ff}
@media (max-width: 860px){
  .h1{font-size:34px}
  .figure img{height:260px}
  .split-2>.card{grid-column: span 12}
  .split-3>.card{grid-column: span 12}
}