:root{
  --bg:#071226; --panel:rgba(10,26,53,.92); --panel2:#08172f; --text:#e5eefc; --muted:#93a8ca;
  --border:rgba(125,168,255,.22); --primary:#63c8ff; --primary-strong:#279dff; --shadow:rgba(0,0,0,.28);
}
*{box-sizing:border-box}
body{
  margin:0; font-family:'Sora',Arial,Helvetica,sans-serif; color:var(--text);
  background:radial-gradient(circle at top, rgba(39,157,255,.16), transparent 32%), linear-gradient(180deg, #08152b 0%, #071226 100%);
}
a{color:var(--primary); text-decoration:none}
a:hover{text-decoration:underline}
.container{max-width:980px; margin:0 auto; padding:20px 14px 40px}
.topbar,.footer{display:flex; justify-content:space-between; gap:16px; align-items:center; margin:12px 0 22px}
.logo{font-weight:800; letter-spacing:.02em; color:var(--text)}
.nav{display:flex; flex-wrap:wrap; gap:12px}
.card{
  background:var(--panel); border:1px solid var(--border); border-radius:24px; box-shadow:0 20px 50px var(--shadow);
  padding:28px 24px;
}
.hero h1{margin:0 0 10px; font-size:clamp(2rem,3vw,2.7rem)}
.hero p.lead{margin:0 0 18px; color:var(--muted); line-height:1.7; max-width:760px}
.badges{display:flex; flex-wrap:wrap; gap:10px; margin:18px 0 0}
.badge{
  display:inline-flex; align-items:center; padding:8px 12px; border-radius:999px;
  border:1px solid var(--border); background:rgba(8,23,47,.82); color:var(--primary); font-weight:700; font-size:.9rem;
}
.section{margin-top:18px}
.section h2{margin:0 0 10px; font-size:1.35rem}
.section p, .section li{color:var(--text); line-height:1.75}
.section ul{margin:10px 0 0 18px}
.grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:14px}
.tile{
  background:rgba(8,23,47,.72); border:1px solid var(--border); border-radius:18px; padding:18px 16px;
}
.tile h3{margin:0 0 8px; font-size:1.06rem}
.tile p{margin:0 0 10px; color:var(--muted); line-height:1.6}
.cta-row{display:flex; flex-wrap:wrap; gap:12px; margin-top:20px}
.btn{
  display:inline-block; border-radius:12px; padding:12px 16px; font-weight:700;
  background:linear-gradient(135deg,var(--primary-strong),var(--primary)); color:#061120; box-shadow:0 8px 20px rgba(39,157,255,.28);
}
.btn.secondary{background:rgba(8,23,47,.82); border:1px solid var(--border); color:var(--text); box-shadow:none}
.breadcrumbs{display:flex; flex-wrap:wrap; gap:8px; color:var(--muted); margin:0 0 14px; font-size:.92rem}
.breadcrumbs span{opacity:.7}
.small{color:var(--muted); font-size:.95rem}
.footer{margin-top:26px; color:var(--muted); font-size:.92rem}
@media (max-width: 720px){ .grid{grid-template-columns:1fr} .topbar,.footer{flex-direction:column; align-items:flex-start} .cta-row .btn{width:100%; text-align:center} }