:root{--maxw:1100px}

header{background:rgba(11,13,18,.6)}

.hero{padding:80px 0 40px}
.hero .grid{display:grid; gap:28px; grid-template-columns:1.2fr .8fr}
h1{font-size:clamp(28px,4vw,44px); line-height:1.15; margin:0 0 1rem 0}
.tag{display:inline-flex; gap:8px; align-items:center; padding:6px 10px; border-radius:999px; border:1px solid rgba(255,255,255,.12); color:var(--muted); font-size:.9rem; margin-bottom:14px}
.kpis{display:flex; gap:18px; flex-wrap:wrap; margin-top:18px}
.kpi{padding:10px 14px; background:var(--bg-soft); border:1px solid rgba(255,255,255,.08); border-radius:12px; color:var(--muted)}

.hero-card{
  background:radial-gradient(1200px 600px at 10% 0%, rgba(91,176,255,.08), transparent 50%), radial-gradient(1000px 400px at 100% 20%, rgba(77,224,201,.08), transparent 60%), var(--card);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--radius);
  padding:22px;
  box-shadow:var(--shadow);
}

.hero-card h3{margin-top:0}
.btnbar{display:flex; gap:12px; margin-top:18px; flex-wrap:wrap}
.btn{display:inline-flex; align-items:center; gap:8px; padding:.75rem 1rem; border-radius:12px; font-weight:700; color:#0b0d12; background:linear-gradient(135deg,var(--primary),var(--accent)); border:0}
.btn.alt{background:transparent; color:var(--text); border:1px solid rgba(255,255,255,.12)}

section{padding:56px 0}
h2{font-size:clamp(22px,3vw,30px); margin:0 0 16px}
h3{margin:0 0 12px}
p.lead{color:var(--muted); margin:0 0 18px; line-height:1.65}

.cards{display:grid; gap:16px; grid-template-columns:repeat(3,1fr)}
.card{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:var(--radius); padding:18px; box-shadow:var(--shadow)}
.card h3{margin:6px 0 8px; font-size:1.05rem}
.card small{color:var(--muted); font-size:.85rem; margin:4px 0 8px}

.list{margin:0; padding-left:18px; color:var(--muted)}
.list li{margin-bottom:8px}
.refs{display:grid; gap:16px; grid-template-columns:repeat(3,1fr)}
.badge{display:inline-block; font-size:.85rem; color:var(--muted); padding:6px 10px; border:1px solid rgba(255,255,255,.12); border-radius:999px; margin-bottom:8px}

.about{display:grid; gap:22px; grid-template-columns:1fr 1fr}
.about .bio{background:var(--card); border:1px solid rgba(255,255,255,.08); border-radius:var(--radius); padding:18px}

.contact-grid{display:grid; gap:16px; grid-template-columns:2fr 1fr}
form{display:grid; gap:12px}
input, textarea{width:100%; padding:.8rem 1rem; border-radius:12px; background:var(--bg-soft); border:1px solid rgba(255,255,255,.1); color:var(--text)}
textarea{min-height:130px; resize:vertical}

.highlight{color:var(--accent); font-weight:600}
.grid-2{display:grid; gap:16px; grid-template-columns:1fr 1fr}
.eligibility-yes{border-left:4px solid var(--accent)}
.eligibility-no{border-left:4px solid rgba(255,100,100,.5)}

.reading-path{border-left:3px solid var(--accent); padding-left:16px; margin:32px 0; color:var(--muted); font-size:.95rem}

p a{text-decoration:underline; text-underline-offset:2px}

@media (max-width:980px){
  .hero .grid,.cards,.grid-2,.refs,.about,.contact-grid{grid-template-columns:1fr}
}
