:root{
  --bg:#0b0f1a; /* deep navy */
  --card:#12192a; /* card surface */
  --muted:#a7b0c0;
  --text:#e8ecf3;
  --brand:#7c5cff; /* violet */
  --brand-2:#2dd4bf; /* teal */
  --accent:#f59e0b; /* amber */
  --danger:#ef4444;
  --ring: 0 0 0 3px rgba(124,92,255,.35);
  --container: 1200px;
  --radius: 18px;
  --shadow: 0 10px 30px rgba(0,0,0,.35);
  --shadow-soft: 0 6px 20px rgba(0,0,0,.25);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:linear-gradient(180deg,#0b0f1a 0%,#0a0e18 60%,#0a0f1b 100%);color:var(--text);overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:24px}
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.85rem 1.15rem;border-radius:999px;border:1px solid transparent;background:var(--brand);color:white;font-weight:600;box-shadow:var(--shadow-soft);transition:.2s ease}
.btn:hover{filter:brightness(1.05);transform:translateY(-1px)}
.btn.secondary{background:transparent;border-color:#2a3550}
.btn.ghost{background:transparent;border-color:transparent}
.badge{display:inline-flex;align-items:center;gap:.45rem;padding:.35rem .7rem;border-radius:999px;background:rgba(45,212,191,.12);color:var(--brand-2);border:1px solid rgba(45,212,191,.25);font-size:.8rem}
.grid{display:grid;gap:24px}
.grid-2{grid-template-columns:repeat(2,1fr)}
.grid-3{grid-template-columns:repeat(3,1fr)}
.grid-4{grid-template-columns:repeat(4,1fr)}
@media (max-width: 1024px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr)} }
@media (max-width: 720px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr} }

/* Header */
header{position:sticky;top:0;z-index:50;background:rgba(10,14,24,.75);backdrop-filter: blur(14px);border-bottom:1px solid rgba(255,255,255,.06)}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;align-items:center;gap:12px}
.brand img{width:42px;height:42px;border-radius:10px;box-shadow:0 6px 14px rgba(124,92,255,.35)}
.brand strong{font-size:1.05rem;letter-spacing:0.2px}
.navlinks{display:flex;align-items:center;gap:20px}
.navlinks a{padding:.55rem .75rem;border-radius:10px;color:var(--muted)}
.navlinks a.active, .navlinks a:hover{color:white;background:rgba(255,255,255,.06)}
.nav-cta{display:flex;align-items:center;gap:10px}
.mobile-toggle{display:none}
@media (max-width: 900px){
  .navlinks{display:none}
  .mobile-toggle{display:inline-flex}
}

/* Sections (as pages) */
section.page{display:none;padding:60px 0}
section.page.active{display:block}

/* Hero */
.hero{padding:80px 0 40px}
.hero-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}
.headline{font-size:clamp(2rem,3.5vw,3rem);line-height:1.1;margin:0 0 12px}
.sub{color:var(--muted);font-size:1.05rem}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
.hero-card{background:linear-gradient(180deg,#121a2d 0%,#0d1424 100%);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow)}
.hero-media{position:relative}
.hero-media img{border-radius:16px;border:1px solid rgba(255,255,255,.08)}
.float-card{position:absolute;right:-10px;bottom:-10px;background:var(--card);border:1px solid rgba(255,255,255,.08);padding:14px 16px;border-radius:14px;box-shadow:var(--shadow-soft)}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:22px}
.kpi{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);padding:14px;border-radius:14px;text-align:center}
.kpi b{font-size:1.25rem}
@media (max-width: 900px){.hero-wrap{grid-template-columns:1fr}.kpis{grid-template-columns:repeat(2,1fr)}}

/* Cards */
.card{background:linear-gradient(180deg,#121a2d 0%,#0d1424 100%);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow-soft)}
.card:hover{transform:translateY(-2px);transition:.2s ease}
.card h4{margin:6px 0 8px}
.muted{color:var(--muted)}
.pill{display:inline-block;padding:.25rem .6rem;border-radius:999px;background:rgba(124,92,255,.15);border:1px solid rgba(124,92,255,.35);font-size:.8rem;color:#cabdff}

/* Course grid */
.course-thumb{aspect-ratio: 16/9;overflow:hidden;border-radius:12px;border:1px solid rgba(255,255,255,.08);margin-bottom:10px}
.course-thumb img{width:100%;height:100%;object-fit:cover}
.meta{display:flex;gap:10px;flex-wrap:wrap;color:#cfd6e6;font-size:.85rem}

/* How it works */
.steps{counter-reset: step}
.step{position:relative;padding-left:54px}
.step:before{counter-increment: step;content:counter(step);position:absolute;left:0;top:0;width:38px;height:38px;border-radius:12px;background:rgba(124,92,255,.2);border:1px solid rgba(124,92,255,.45);display:grid;place-items:center;font-weight:700}

/* Testimonials */
.carousel{position:relative}
.carousel-track{display:flex;gap:16px;overflow:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
.carousel-track>.card{min-width:320px;scroll-snap-align:start}

/* Partners */
.logo-row{display:flex;gap:24px;flex-wrap:wrap;align-items:center;justify-content:center;opacity:.9}
.logo-row img{height:36px;filter:grayscale(100%);opacity:.75}

/* Forms */
.field{display:grid;gap:8px}
input,select,textarea{width:100%;padding:12px 14px;border-radius:12px;background:#0a1222;border:1px solid #1f2a44;color:var(--text)}
input:focus,select:focus,textarea:focus{outline:none;box-shadow:var(--ring);border-color:#4b5563}

/* Footer */
footer{margin-top:60px;padding:40px 0;border-top:1px solid rgba(255,255,255,.06);background:rgba(10,14,24,.5)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.2fr;gap:24px}
.footer-col h5{margin:0 0 10px}
.social a{display:inline-flex;width:36px;height:36px;align-items:center;justify-content:center;border-radius:10px;border:1px solid rgba(255,255,255,.08);margin-right:8px}
@media (max-width: 900px){.footer-grid{grid-template-columns:1fr 1fr}.footer-col:nth-child(1){grid-column:1/-1}}
@media (max-width: 600px){.footer-grid{grid-template-columns:1fr}}

/* Utility */
.center{text-align:center}
.spacer-xxl{height:40px}
.spacer-xl{height:28px}
.spacer{height:18px}
.section-title{font-size:1.7rem;margin:0 0 6px}
.section-sub{color:var(--muted);margin:0 0 16px}

/* Mobile menu */
.mobile-panel{position:fixed;inset:0 0 auto auto;background:rgba(10,14,24,.98);padding:18px;border-left:1px solid rgba(255,255,255,.06);width:min(86vw,380px);transform:translateX(100%);transition:.25s ease;z-index:60}
.mobile-panel.open{transform:translateX(0)}
.mobile-panel a{display:block;padding:12px 10px;border-radius:12px;color:var(--muted)}
.mobile-panel a.active,.mobile-panel a:hover{background:rgba(255,255,255,.06);color:white}

/* Banners */
.cta-banner{display:grid;grid-template-columns:1.4fr .6fr;gap:16px;align-items:center;background:linear-gradient(90deg, rgba(124,92,255,.18), rgba(45,212,191,.18));border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:20px}
@media (max-width: 720px){.cta-banner{grid-template-columns:1fr}}

/* Accordions */
details{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);padding:12px 14px;border-radius:12px}
details+details{margin-top:10px}
summary{cursor:pointer;font-weight:600}

/* Table-like list */
.chip{display:inline-flex;align-items:center;gap:.4rem;padding:.35rem .6rem;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);font-size:.8rem}

/* Toast */
.toast{position:fixed;bottom:20px;right:20px;background:#0a1222;border:1px solid #1f2a44;padding:12px 14px;border-radius:12px;opacity:0;transform:translateY(10px);transition:.25s}
.toast.show{opacity:1;transform:translateY(0)}