
:root {
  --bg: #f6fbff;
  --bg-soft: #eef6ff;
  --paper: rgba(255, 255, 255, 0.86);
  --paper-strong: #ffffff;
  --ink: #102235;
  --text: #102235;
  --muted: #516476;
  --muted-2: #748596;
  --line: rgba(20, 50, 74, 0.13);
  --cyan: #18c9e7;
  --blue: #5d79ff;
  --violet: #9e6cff;
  --mint: #43e5b6;
  --lime: #8ce86b;
  --orange: #ffad4d;
  --rose: #ff6fa8;
  --shadow: 0 24px 70px rgba(20, 45, 85, 0.12);
  --shadow-soft: 0 16px 44px rgba(20, 45, 85, 0.09);
  --radius-lg: 32px;
  --radius-md: 22px;
  --radius-sm: 15px;
  --max: 1180px;
  --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--font);
  color: var(--text);
  background:
    radial-gradient(circle at 18% -10%, rgba(24,201,231,.30), transparent 32rem),
    radial-gradient(circle at 85% 2%, rgba(158,108,255,.25), transparent 32rem),
    linear-gradient(180deg, #f8fdff 0%, #f6fbff 48%, #f8f5ff 100%);
  min-height: 100vh;
  line-height: 1.6;
  overflow-x: hidden;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: -2;
  background-image:
    linear-gradient(rgba(18, 54, 84, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(18, 54, 84, 0.04) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.78), transparent 72%);
}
body.nav-open { overflow: hidden; }
.ambient { position: fixed; pointer-events: none; border-radius: 999px; filter: blur(30px); opacity: .35; z-index: -1; }
.ambient-a { width: 360px; height: 360px; left: -110px; top: 24%; background: linear-gradient(135deg, var(--cyan), var(--mint)); }
.ambient-b { width: 420px; height: 420px; right: -150px; top: 52%; background: linear-gradient(135deg, var(--violet), var(--rose)); }

a { color: inherit; text-decoration: none; }
a:hover { color: #0a93b5; }
img, svg { max-width: 100%; display: block; }
.container { width: min(var(--max), calc(100% - 40px)); margin-inline: auto; }
.skip-link {
  position: absolute; left: 20px; top: -80px; background: var(--ink); color: #fff;
  padding: 10px 14px; border-radius: 12px; z-index: 200; font-weight: 850;
}
.skip-link:focus { top: 16px; }

.site-header {
  position: sticky; top: 0; z-index: 100;
  backdrop-filter: blur(20px);
  background: rgba(255,255,255,.72);
  border-bottom: 1px solid var(--line);
}
.nav-shell { height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: inline-flex; align-items: center; gap: 12px; font-weight: 950; letter-spacing: -0.03em; }
.brand img { border-radius: 15px; box-shadow: 0 12px 32px rgba(24,201,231,.22); }
.brand small { display: block; color: var(--muted); font-weight: 750; font-size: 12px; letter-spacing: .07em; text-transform: uppercase; margin-top: -4px; }
.nav-links { display: flex; align-items: center; gap: 4px; }
.nav-links a { color: var(--muted); padding: 10px 11px; border-radius: 999px; font-weight: 800; font-size: 14px; transition: .18s ease; }
.nav-links a.active, .nav-links a:hover { color: var(--ink); background: rgba(24,201,231,.10); }
.nav-actions { display: flex; align-items: center; gap: 10px; }
.menu-toggle { display:none; width:44px; height:44px; border:1px solid var(--line); border-radius:15px; background:rgba(255,255,255,.70); color:var(--ink); cursor:pointer; }
.menu-toggle span,.menu-toggle::before,.menu-toggle::after{content:"";display:block;width:18px;height:2px;border-radius:999px;background:currentColor;margin:4px auto;transition:.2s ease;}
body.nav-open .menu-toggle::before{transform:translateY(6px) rotate(45deg)} body.nav-open .menu-toggle span{opacity:0} body.nav-open .menu-toggle::after{transform:translateY(-6px) rotate(-45deg)}

.btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; border:1px solid var(--line); border-radius:999px; padding:12px 18px; font-weight:900; letter-spacing:-.01em; transition:transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease; cursor:pointer; min-height:46px; }
.btn svg { width: 19px; height: 19px; }
.btn:hover { transform: translateY(-2px); color: inherit; }
.btn-primary { background: linear-gradient(135deg, var(--cyan), var(--blue)); color: #061523; border-color: transparent; box-shadow: 0 18px 44px rgba(24,201,231,.22); }
.btn-primary:hover { box-shadow: 0 22px 60px rgba(24,201,231,.31); color:#061523; }
.btn-soft { background: rgba(255,255,255,.78); color:var(--ink); box-shadow: var(--shadow-soft); }
.btn-ghost { background: transparent; color: var(--ink); }
.btn-small { min-height:38px; padding:8px 14px; font-size:14px; }

main { overflow: hidden; }
.section { padding: 90px 0; position: relative; }
.section-tight { padding: 58px 0; }
.section-soft {
  background:
    linear-gradient(135deg, rgba(255,255,255,.62), rgba(238,246,255,.62)),
    url("../img/wave-divider.svg") top center / 1200px 220px no-repeat;
  border-block: 1px solid rgba(20,50,74,.08);
}
.hero { padding: 86px 0 56px; }
.hero-grid { display:grid; grid-template-columns: .96fr 1.04fr; gap: 54px; align-items:center; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; color:#087e98; background: rgba(24,201,231,.12); border:1px solid rgba(24,201,231,.22); border-radius:999px; padding:8px 12px; font-weight:900; font-size:13px; letter-spacing:.07em; text-transform:uppercase; margin-bottom:18px; }
.dot { width:8px; height:8px; border-radius:999px; background: var(--mint); box-shadow: 0 0 0 6px rgba(67,229,182,.15); }
h1,h2,h3,h4{margin:0;line-height:1.05;letter-spacing:-.055em;color:var(--ink);}
h1{font-size:clamp(47px,7.7vw,90px);max-width:880px;}
h2{font-size:clamp(33px,4.8vw,58px);}
h3{font-size:24px;letter-spacing:-.04em;}
h4{font-size:18px;letter-spacing:-.025em;}
p{color:var(--muted);margin:0;}
.lede{font-size:clamp(18px,2.1vw,23px);color:#31495e;max-width:780px;margin-top:24px;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px;}
.centered{justify-content:center;}
.trust-row{margin-top:30px;display:flex;flex-wrap:wrap;gap:10px;}
.pill{border:1px solid var(--line);background:rgba(255,255,255,.70);color:#405469;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:800;box-shadow:0 8px 20px rgba(20,45,85,.05);}
.gradient-text{background:linear-gradient(120deg,#102235,#166e9a 34%,#5d62d8 69%,#102235);-webkit-background-clip:text;background-clip:text;color:transparent;}

.hero-cover, .image-card { position:relative; border:1px solid var(--line); border-radius: var(--radius-lg); padding: 12px; background: rgba(255,255,255,.72); box-shadow: var(--shadow); overflow:hidden; }
.hero-cover::before, .image-card::before, .card::before, .panel::before {
  content:""; position:absolute; inset:-1px; border-radius:inherit; pointer-events:none;
  background: linear-gradient(135deg, rgba(24,201,231,.35), transparent 30%, rgba(158,108,255,.24));
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  padding:1px; mask-composite: exclude; -webkit-mask-composite: xor;
}
.hero-cover img, .image-card img { width:100%; border-radius: 24px; aspect-ratio: 16/10; object-fit: cover; }
.hero-cover figcaption { position:absolute; left:26px; right:26px; bottom:26px; background: rgba(255,255,255,.86); backdrop-filter: blur(14px); color:#2b4053; border:1px solid rgba(255,255,255,.55); border-radius:20px; padding:14px 16px; font-weight:800; box-shadow: 0 18px 50px rgba(16,35,60,.15); }
.image-badge { position:absolute; left:28px; top:28px; border-radius:999px; background:rgba(255,255,255,.86); color:#0f4355; padding:9px 13px; font-weight:900; box-shadow:var(--shadow-soft); }

.band { border-block:1px solid var(--line); background:linear-gradient(90deg,rgba(24,201,231,.12),rgba(158,108,255,.12)); padding:26px 0; }
.band-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
.metric strong{display:block;font-size:32px;line-height:1;letter-spacing:-.045em;color:var(--ink);}
.metric span{color:var(--muted);font-size:14px;font-weight:800;}

.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:34px;}
.section-head p{max-width:590px;font-size:18px;}
.section-head.compact{margin-bottom:18px;}
.center{text-align:center}.center p{margin-inline:auto;}
.grid{display:grid;gap:18px}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}
.card, .panel { position:relative; border:1px solid var(--line); border-radius:var(--radius-md); background:var(--paper); box-shadow:var(--shadow-soft); overflow:hidden; }
.card{padding:24px;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;}
.card:hover{transform:translateY(-4px);border-color:rgba(24,201,231,.30);box-shadow:var(--shadow);}
.card::after{content:"";position:absolute;inset:auto -28% -54% -28%;height:140px;background:radial-gradient(ellipse at center,rgba(24,201,231,.16),transparent 70%);opacity:0;transition:.18s ease;}
.card:hover::after{opacity:1;}
.icon{width:50px;height:50px;display:grid;place-items:center;border-radius:17px;background:linear-gradient(135deg,rgba(24,201,231,.15),rgba(158,108,255,.13));border:1px solid rgba(24,201,231,.22);color:#0aa9c4;margin-bottom:18px;}
.icon svg{width:25px;height:25px}.card h3{margin-bottom:10px}.card p + .mini-list{margin-top:16px}
.panel{padding:30px;}
.feature{display:grid;grid-template-columns:.96fr 1.04fr;gap:34px;align-items:center;}
.feature.reverse{grid-template-columns:1.04fr .96fr;}
.timeline{display:grid;gap:16px;margin-top:26px;}
.step{display:grid;grid-template-columns:54px 1fr;gap:16px;align-items:start;}
.step-num{width:46px;height:46px;border-radius:16px;display:grid;place-items:center;font-weight:950;color:#061523;background:linear-gradient(135deg,var(--cyan),var(--violet));box-shadow:0 10px 26px rgba(24,201,231,.20);}
.step h3{font-size:21px;margin-bottom:6px;}

.page-hero{padding:74px 0 34px;}
.page-hero h1{font-size:clamp(42px,6vw,72px);}
.visual-hero{padding-bottom:52px;}
.page-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:38px;align-items:center;}
.breadcrumb{color:var(--muted-2);font-weight:800;margin-bottom:18px}.breadcrumb a{color:var(--muted);}
.module-grid{display:grid;gap:20px;}
.module{display:grid;grid-template-columns:78px 1fr;gap:20px;align-items:start;border:1px solid var(--line);border-radius:var(--radius-lg);padding:28px;background:rgba(255,255,255,.78);box-shadow:var(--shadow-soft);position:relative;overflow:hidden;}
.module::after{content:"";position:absolute;right:-40px;top:-40px;width:170px;height:170px;border-radius:999px;background:linear-gradient(135deg,rgba(24,201,231,.12),rgba(158,108,255,.10));}
.module-number{width:64px;height:64px;border-radius:22px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(24,201,231,.15),rgba(158,108,255,.14));border:1px solid rgba(24,201,231,.24);color:#0a8da9;font-weight:950;font-size:22px;}
.module h2{font-size:clamp(27px,4vw,42px);margin-bottom:10px}.module p{max-width:940px;}
.outcomes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px;}
.outcomes span{border:1px solid var(--line);background:rgba(255,255,255,.72);border-radius:15px;padding:12px;color:#405469;font-weight:800;font-size:14px;}

.split-cta{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;border:1px solid var(--line);border-radius:var(--radius-lg);padding:34px;background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(238,246,255,.78));box-shadow:var(--shadow);}
.notice{border:1px solid rgba(67,229,182,.30);background:rgba(67,229,182,.10);border-radius:var(--radius-md);padding:24px}.notice strong{color:#148a6f;font-size:19px}.notice p{margin-top:8px}
.mini-list{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:10px}.mini-list li{display:flex;gap:10px;color:var(--muted)}.mini-list li::before{content:"✓";color:#10a981;font-weight:950;}
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px;}
.tab-btn{border:1px solid var(--line);background:rgba(255,255,255,.78);color:var(--muted);border-radius:999px;padding:10px 14px;font-weight:900;cursor:pointer;}
.tab-btn[aria-selected="true"]{color:#061523;background:linear-gradient(135deg,var(--cyan),#89edff);border-color:transparent;}
.tab-panel{display:none}.tab-panel.active{display:block}.tab-panel h3{margin-bottom:8px}

.accordion{display:grid;gap:12px}.accordion-item{border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.70);overflow:hidden;}
.accordion-trigger{width:100%;border:0;background:transparent;color:var(--ink);padding:18px 20px;display:flex;justify-content:space-between;align-items:center;gap:20px;text-align:left;font-weight:950;font-size:17px;cursor:pointer;}
.accordion-trigger span:last-child{color:#0aa9c4;font-size:22px}.accordion-content{max-height:0;overflow:hidden;transition:max-height .25s ease}.accordion-content p{padding:0 20px 18px}.accordion-item.open .accordion-content{max-height:240px;}
.resource-list{display:grid;gap:14px}.resource-link{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.74);padding:18px;transition:.18s ease;box-shadow:0 10px 26px rgba(20,45,85,.05);}
.resource-link:hover{background:white;color:inherit;transform:translateY(-2px);box-shadow:var(--shadow-soft)}.resource-link strong{display:block;margin-bottom:4px;color:var(--ink)}.resource-link span{color:var(--muted)}.resource-link em{color:#0a93b5;font-style:normal;font-weight:950;}
.age-cards{display:grid;gap:12px;margin-top:26px}.age-cards div{display:grid;grid-template-columns:90px 1fr;gap:12px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.74);padding:16px}.age-cards strong{font-size:22px;color:#0a8da9}.age-cards span{color:var(--muted);font-weight:750;}
.profile-card{display:grid;grid-template-columns:180px 1fr;gap:28px;align-items:center;}
.avatar-art{width:180px;aspect-ratio:1;border-radius:34px;border:1px solid rgba(20,50,74,.12);background:linear-gradient(135deg,rgba(24,201,231,.14),rgba(158,108,255,.16)),rgba(255,255,255,.80);display:grid;place-items:center;overflow:hidden;box-shadow:var(--shadow-soft)}.avatar-art img{width:118px}
.contact-layout{display:grid;grid-template-columns:.86fr 1.14fr;gap:24px;align-items:start}.contact-mini{display:grid;gap:10px;margin-top:24px}.form-grid{display:grid;gap:14px;}
.hidden{display:none!important}label{display:grid;gap:8px;color:var(--muted);font-weight:850;}input,select,textarea{width:100%;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.82);color:var(--ink);padding:13px 14px;font:inherit;outline:none;}input:focus,select:focus,textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 4px rgba(24,201,231,.13)}textarea{min-height:150px;resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-note{font-size:13px;color:var(--muted-2)}
.footer{border-top:1px solid var(--line);padding:42px 0;background:rgba(255,255,255,.55)}.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:28px}.footer p{margin-top:16px;max-width:500px}.footer a{color:var(--muted);display:block;margin:6px 0}.footer a:hover{color:#0a93b5}.footer small{color:var(--muted-2)}.footer-brand{display:inline-flex!important}
.reveal{opacity:0;transform:translateY(22px);transition:opacity .55s ease,transform .55s ease}.reveal.visible{opacity:1;transform:translateY(0)}

@media (max-width: 1020px){
  .hero-grid,.feature,.feature.reverse,.contact-layout,.profile-card,.page-hero-grid{grid-template-columns:1fr}.grid-3,.grid-4,.band-grid,.outcomes{grid-template-columns:repeat(2,1fr)}.section-head{display:block}.section-head p{margin-top:16px}.split-cta{grid-template-columns:1fr}.hero-cover{max-width:760px}
}
@media (max-width: 790px){
  .container{width:min(var(--max),calc(100% - 28px))}.nav-links{position:fixed;inset:78px 14px auto 14px;display:none;flex-direction:column;align-items:stretch;padding:16px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.96);box-shadow:var(--shadow)}body.nav-open .nav-links{display:flex}.nav-links a{border-radius:14px;padding:13px 14px}.nav-actions .btn{display:none}.menu-toggle{display:block}.hero{padding-top:58px}.section{padding:68px 0}.grid-2,.grid-3,.grid-4,.band-grid,.outcomes{grid-template-columns:1fr}.hero-cover figcaption{position:static;margin-top:12px}.module{grid-template-columns:1fr}.form-row{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.age-cards div{grid-template-columns:1fr}.page-hero{padding-top:54px}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}
}
