@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@500;600;700;800&display=swap');

:root {
  font-family: "DM Sans", system-ui, sans-serif;
  color: #17233d;
  background: #f8fbff;
  font-synthesis: none;
  --navy: #153b72;
  --blue: #2d72d9;
  --sky: #eaf4ff;
  --cyan: #4ab9e8;
  --text: #17233d;
  --muted: #64718a;
  --line: #dfe8f2;
  --white: #fff;
  --soft: #f3f7fc;
  --shadow: 0 22px 70px rgba(26, 58, 100, .12);
}

/* ===== Keyframe Animations ===== */
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-14px); }
}
@keyframes float-soft {
  0%, 100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-9px) rotate(1deg); }
}
@keyframes gradient-shift {
  0% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}
@keyframes pulse-ring {
  0% { transform: scale(.85); opacity: .9; }
  70% { transform: scale(1.15); opacity: 0; }
  100% { transform: scale(1.15); opacity: 0; }
}
@keyframes orbit-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
@keyframes orbit-spin-reverse {
  from { transform: rotate(360deg); }
  to { transform: rotate(0deg); }
}
@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}
@keyframes glow-pulse {
  0%, 100% { opacity: .6; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.08); }
}
@keyframes bar-grow {
  from { height: 3px; opacity: 0.5; }
  to { height: auto; opacity: 1; }
}
@keyframes wiggle {
  0%, 100% { transform: rotate(0deg); }
  25% { transform: rotate(-4deg); }
  75% { transform: rotate(4deg); }
}
@keyframes shine {
  0% { transform: translateX(-150%) skewX(-20deg); }
  60%, 100% { transform: translateX(250%) skewX(-20deg); }
}
@keyframes pop-in {
  0% { transform: scale(.6); opacity: 0; }
  70% { transform: scale(1.05); }
  100% { transform: scale(1); opacity: 1; }
}
@keyframes fade-slide-up {
  from { opacity: 0; transform: translateY(28px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes typing-caret {
  from, to { border-right-color: transparent; }
  50% { border-right-color: var(--blue); }
}
@keyframes ticker-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
@keyframes blob-move {
  0%, 100% { border-radius: 60% 40% 30% 70%/60% 30% 70% 40%; }
  50% { border-radius: 30% 60% 70% 40%/50% 60% 30% 60%; }
}

/* ===== Olliver Wave ===== */
@keyframes olliver-wave {
  0%, 100% { transform: rotate(0deg); }
  10% { transform: rotate(-8deg); }
  20% { transform: rotate(8deg); }
  30% { transform: rotate(-10deg); }
  40% { transform: rotate(10deg); }
  50% { transform: rotate(-6deg); }
  60% { transform: rotate(6deg); }
  70%, 100% { transform: rotate(0deg); }
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: #f8fbff; }
button, input { font: inherit; }
button { cursor: pointer; }
.app { overflow: hidden; }
.container { width: min(1160px, calc(100% - 40px)); margin: 0 auto; }

.nav-wrap { position: sticky; top: 0; z-index: 50; background: rgba(248,251,255,.88); backdrop-filter: blur(18px); border-bottom: 1px solid rgba(223,232,242,.75); }
.nav { height: 78px; display: flex; align-items: center; justify-content: space-between; }
.brand { border: 0; background: transparent; display: flex; align-items: center; gap: 10px; color: var(--navy); font-family: Manrope,sans-serif; font-weight: 800; font-size: 22px; padding: 0; }
.brand > span:last-child span { color: var(--blue); }
.brand-mark { display: grid; place-items: center; width: 35px; height: 35px; border-radius: 11px; color: white; background: linear-gradient(135deg,#153b72,#4ab9e8); background-size: 200% 200%; animation: gradient-shift 6s ease-in-out infinite; box-shadow: 0 8px 20px rgba(45,114,217,.2); font-size: 17px; }
.nav-links { display: flex; align-items: center; gap: 24px; }
.nav-links button:not(.btn) { border: 0; background: transparent; color: #53627a; font-size: 14px; font-weight: 600; position: relative; transition: color .2s; }
.nav-links button:not(.btn)::after { content:""; position:absolute; left:0; bottom:-6px; width:100%; height:2px; background:var(--blue); border-radius:2px; transform:scaleX(0); transform-origin:left; transition:transform .25s ease; }
.nav-links button:not(.btn):hover { color: var(--navy); }
.nav-links button:not(.btn):hover::after { transform:scaleX(1); }
.nav-login { margin-left: 8px; }
.btn { border: 0; border-radius: 12px; padding: 12px 18px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; font-weight: 700; transition: .2s ease; position: relative; overflow: hidden; }
.btn::after { content:""; position:absolute; top:0; left:0; width:50%; height:100%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent); transform:translateX(-150%) skewX(-20deg); }
.btn:hover::after { animation:shine .9s ease; }
.btn-primary { color: white; background: var(--navy); box-shadow: 0 10px 22px rgba(21,59,114,.18); }
.btn-primary:hover { transform: translateY(-2px) scale(1.02); background: #0f315f; box-shadow: 0 14px 30px rgba(21,59,114,.28); }
.btn-secondary { color: var(--navy); background: white; border: 1px solid var(--line); }
.btn-secondary:hover { border-color: #b9cee6; transform: translateY(-2px) scale(1.02); }
.btn-light { color: var(--navy); background: white; }
.btn-large { padding: 14px 21px; }
.menu-btn { display: none; border: 0; background: transparent; color: var(--navy); }

.hero { position: relative; padding: 92px 0 70px; background: radial-gradient(circle at 82% 22%, #e9f6ff 0, rgba(233,246,255,.7) 18%, transparent 45%), linear-gradient(180deg,#f8fbff,#eef7ff); }
.hero-glow { position: absolute; border-radius: 50%; filter: blur(2px); pointer-events: none; }
.glow-one { width: 300px; height: 300px; background: rgba(74,185,232,.12); left: -130px; top: 180px; animation: glow-pulse 6s ease-in-out infinite, blob-move 12s ease-in-out infinite; }
.glow-two { width: 280px; height: 280px; background: rgba(45,114,217,.09); right: -100px; bottom: -80px; animation: glow-pulse 8s ease-in-out infinite .5s; }
.hero-anim-1 { animation: fade-slide-up .7s ease .1s both; }
.hero-anim-2 { animation: fade-slide-up .7s ease .25s both; }
.hero-anim-3 { animation: fade-slide-up .7s ease .4s both; }
.hero-anim-4 { animation: fade-slide-up .7s ease .55s both; }
.hero-anim-5 { animation: fade-slide-up .7s ease .7s both; }
.hero-anim-visual { animation: fade-slide-up .9s ease .45s both; }
.hero-grid { display: grid; grid-template-columns: .88fr 1.12fr; align-items: center; gap: 55px; position: relative; z-index: 2; }
.eyebrow { display: inline-flex; align-items: center; gap: 7px; color: #2b72c9; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hero h1, h2, h3 { font-family: Manrope,sans-serif; }
.hero h1 { font-size: clamp(43px,5vw,68px); line-height: 1.02; letter-spacing: -.045em; margin: 19px 0; color: #10264a; }
.hero h1 span, h2 span { color: var(--blue); }
.hero-text { font-size: 18px; line-height: 1.7; color: var(--muted); max-width: 590px; }
.hero-actions { display: flex; gap: 12px; margin-top: 29px; flex-wrap: wrap; }
.hero-proof { display: flex; gap: 17px; flex-wrap: wrap; margin-top: 27px; color: #64718a; font-size: 12px; font-weight: 600; }
.hero-proof span { display: flex; align-items: center; gap: 5px; }
.hero-proof svg { color: #28a477; }

.hero-visual { position: relative; min-height: 500px; display: grid; place-items: center; }
.dashboard-window { width: min(100%, 620px); background: white; border-radius: 18px; box-shadow: var(--shadow); border: 1px solid #e1eaf4; overflow: hidden; transform: rotate(1deg); }
.window-bar { height: 45px; padding: 0 15px; display: flex; align-items: center; justify-content: space-between; color: #8794a8; font-size: 10px; border-bottom: 1px solid #e9eef5; }
.dots { display: flex; gap: 5px; }.dots i { width: 7px;height:7px;border-radius:50%;background:#d7e0eb; }
.live { display: flex; gap: 5px; align-items: center; }.live b { width:6px;height:6px;border-radius:50%;background:#2bb587;position:relative }.live b:after{content:"";position:absolute;inset:-3px;border-radius:50%;background:rgba(43,181,135,.5);animation:pulse-ring 2s ease-out infinite}
.dashboard-body { display: flex; min-height: 365px; }
.mini-sidebar { width: 52px; background: #f7faff; border-right: 1px solid #edf2f7; display:flex;align-items:center;flex-direction:column;gap:22px;padding:17px 0;color:#9aa8ba; }
.mini-logo { width:26px;height:26px;border-radius:8px;background:#153b72;color:white;display:grid;place-items:center;font-size:12px;font-weight:800;margin-bottom:7px; }.mini-active { color:#2d72d9; }
.dash-content { flex:1; padding: 20px; background:#fbfdff; }
.dash-top { display:flex;justify-content:space-between;align-items:center; }.dash-top small,.chart-card small { color:#9aa7b8;font-size:9px; }.dash-top h3 { font-size:17px;margin:3px 0;color:#20385d; }.avatar { width:31px;height:31px;border-radius:50%;background:#dfefff;color:#2866aa;display:grid;place-items:center;font-size:9px;font-weight:800; }
.stat-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px; }.stat-card { background:white;border:1px solid #e9eff6;border-radius:11px;padding:12px; }.stat-card span,.stat-card em { display:block;font-size:8px;color:#8b99aa;font-style:normal; }.stat-card strong { display:block;font:700 18px Manrope;color:#213b60;margin:5px 0; }.stat-card em { color:#2ba47d; }
.chart-card { margin-top:11px;background:white;border:1px solid #e9eff6;border-radius:11px;padding:13px; }.chart-heading {display:flex;justify-content:space-between}.chart-heading strong {display:block;font:700 12px Manrope;color:#304a6d;margin-top:2px}.chart-heading>span{font-size:8px;color:#8998ab}.chart {height:160px;display:flex;flex-direction:column;justify-content:end;margin-top:10px}.bars{height:130px;display:flex;align-items:end;justify-content:space-around;gap:13px;padding:0 10px;border-bottom:1px solid #e9eef5;background:repeating-linear-gradient(to bottom,transparent 0,transparent 31px,#f0f4f8 32px)}.bars i{display:block;width:17px;border-radius:5px 5px 0 0;background:linear-gradient(180deg,#4ab9e8,#2d72d9);animation:bar-grow 1s cubic-bezier(.4,0,.2,1) both;transform-origin:bottom;height:var(--bar-h,52%)}.bars i:nth-child(1){--bar-h:52%;animation-delay:.2s}.bars i:nth-child(2){--bar-h:68%;animation-delay:.3s}.bars i:nth-child(3){--bar-h:61%;animation-delay:.4s}.bars i:nth-child(4){--bar-h:78%;animation-delay:.5s}.bars i:nth-child(5){--bar-h:72%;animation-delay:.6s}.bars i:nth-child(6){--bar-h:88%;animation-delay:.7s}.bars i:nth-child(7){--bar-h:82%;animation-delay:.8s}.days{display:flex;justify-content:space-around;padding:6px 5px 0;font-size:8px;color:#98a5b5}
.floating-card { position:absolute; background:white; border:1px solid #e4ecf5; border-radius:14px; box-shadow:0 17px 40px rgba(32,69,110,.13); display:flex;align-items:center;gap:9px;padding:10px 13px;animation:float 5s ease-in-out infinite }.floating-card b{display:block;font:700 14px Manrope;color:#213a5f}.floating-card small{display:block;color:#8290a4;font-size:9px;margin-top:2px}.float-icon{width:30px;height:30px;border-radius:9px;background:#eaf7f2;color:#23946d;display:grid;place-items:center}.attendance{left:5px;bottom:65px;animation:float 5.5s ease-in-out .5s infinite}.olliver-float{right:-10px;top:60px;padding:8px 12px 8px 7px;animation:float 4.5s ease-in-out 1s infinite}.olliver-float img{width:46px;height:62px;object-fit:contain;align-self:flex-end}.olliver-float b{color:#153b72}

.trust-strip{background:white;border-top:1px solid #e4edf6;border-bottom:1px solid #e4edf6}.trust-inner{min-height:75px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#8290a4;font-size:13px}.trust-inner>div{display:flex;gap:28px;color:#55708f;font-size:12px}

.section { padding: 105px 0; }
.section-heading { margin-bottom: 52px; }.section-heading.center{text-align:center;max-width:760px;margin-left:auto;margin-right:auto}.section-heading h2{font-size:clamp(33px,4vw,49px);line-height:1.1;letter-spacing:-.035em;margin:12px 0 16px;color:#122a4e}.section-heading p{color:var(--muted);line-height:1.7;margin:0 auto;max-width:690px}.section-heading.split{display:grid;grid-template-columns:1fr .65fr;align-items:end;gap:60px}.section-heading.split p{margin:0}
.product-section{background:white}.ecosystem{height:530px;position:relative;display:grid;place-items:center}.eco-center{width:340px;height:340px;position:relative;display:grid;place-items:center}.eco-ring{position:absolute;border:1px dashed #cfe1f4;border-radius:50%;}.ring-1{width:280px;height:280px;animation:orbit-spin 40s linear infinite}.ring-2{width:420px;height:420px;animation:orbit-spin-reverse 60s linear infinite}.eco-core{width:130px;height:130px;border-radius:39px;background:linear-gradient(145deg,#153b72,#2d72d9);color:white;display:grid;place-items:center;box-shadow:0 20px 40px rgba(21,59,114,.22);font:800 21px Manrope;z-index:2}.eco-core span{margin-right:-1px}.eco-owl{position:absolute;z-index:3;bottom:-35px;right:-20px;filter:drop-shadow(0 12px 12px rgba(32,65,100,.15));animation:wiggle 4s ease-in-out infinite}.eco-owl img{width:75px;height:98px;object-fit:contain}.eco-card{position:absolute;background:white;border:1px solid #dfebf6;border-radius:16px;box-shadow:0 14px 35px rgba(36,74,112,.09);padding:16px 19px;min-width:170px}.eco-card svg{color:#2d72d9;margin-bottom:7px}.eco-card b{display:block;font:700 13px Manrope;color:#244263}.eco-card span{display:block;color:#8795a8;font-size:10px;margin-top:4px}.eco-admin{top:20px;left:50%;transform:translateX(-50%)}.eco-teacher{right:35px;top:190px}.eco-parent{left:35px;top:190px}.eco-student{bottom:25px;left:50%;transform:translateX(-50%)}

.features-section{background:#f3f8fd}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.feature-card{background:white;border:1px solid #e1eaf3;border-radius:16px;padding:23px;transition:.3s cubic-bezier(.25,.8,.35,1)}.feature-card:hover{transform:translateY(-6px) scale(1.02);box-shadow:0 18px 40px rgba(38,76,115,.13);border-color:#bfd8f0}.feature-icon{width:42px;height:42px;border-radius:12px;background:#edf6ff;color:#2d72d9;display:grid;place-items:center;margin-bottom:19px;transition:.3s}.feature-card:hover .feature-icon{background:linear-gradient(135deg,#2d72d9,#4ab9e8);color:white;transform:translateY(-3px) rotate(-6deg);box-shadow:0 8px 18px rgba(45,114,217,.3)}.feature-card h3{font-size:16px;margin:0 0 8px;color:#213b5e}.feature-card p{font-size:12px;line-height:1.65;color:#7a899d;min-height:60px}.feature-card button,.people-card button{border:0;background:transparent;color:#2b70c7;padding:0;font-size:11px;font-weight:800;display:flex;align-items:center;gap:6px;transition:.2s}.feature-card button svg,.people-card button svg{transition:.25s}.feature-card:hover button svg,.people-card:hover button svg{transform:translateX(4px)}

.pricing-section{background:#f3f8fd}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;align-items:stretch}.pricing-card{background:white;border:1px solid #e1eaf3;border-radius:20px;padding:30px;display:flex;flex-direction:column;position:relative;transition:.3s cubic-bezier(.25,.8,.35,1)}.pricing-card:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(38,76,115,.13)}.pricing-card.featured{border:2px solid var(--blue);box-shadow:0 22px 50px rgba(45,114,217,.13)}.pricing-card .tag{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);background:var(--blue);color:white;font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:6px 13px;border-radius:999px}.pricing-head h3{font-size:20px;color:#1d3a5f;margin:0}.pricing-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.plan-owl{width:52px;height:52px;border-radius:14px;background:#edf6ff;display:grid;place-items:center;margin:0}.plan-owl img{width:42px;height:48px;object-fit:contain;transform-origin:bottom center;animation:olliver-wave 4s ease-in-out 1s infinite}.pricing-head>p{font-size:12px;color:#7a899d;line-height:1.6;min-height:40px;margin:8px 0 18px}.price{display:flex;align-items:baseline;gap:2px;font:800 30px Manrope;color:#153b72;min-height:44px}.price span{font-size:30px}.base-price{font-size:11px;color:#64718a;margin-bottom:8px}.pricing-card>.btn{margin:6px 0 20px}.pricing-card ul{list-style:none;padding:0;margin:0;display:grid;gap:11px;border-top:1px solid #edf2f7;padding-top:20px}.pricing-card li{font-size:12px;color:#4e627c;display:flex;align-items:center;gap:9px}.pricing-card li svg{width:16px;height:16px;padding:3px;border-radius:50%;background:#d8f3e9;color:#1c966e;flex-shrink:0}.pricing-card li svg.off{background:#fdecec;color:#d94545}

.people-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.people-card{border:1px solid #dfebf5;border-radius:18px;padding:25px;min-height:275px;transition:.3s cubic-bezier(.25,.8,.35,1)}.people-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(38,76,115,.11);border-color:#c3d9ef}.people-icon{width:46px;height:46px;border-radius:13px;background:#edf6ff;color:#2d72d9;display:grid;place-items:center;margin-bottom:20px;transition:.3s}.people-icon svg{width:21px;transition:.3s}.people-card:hover .people-icon{background:linear-gradient(135deg,#2d72d9,#4ab9e8);color:white;transform:translateY(-3px) rotate(-6deg);box-shadow:0 8px 20px rgba(45,114,217,.3)}.card-label{font-size:10px;color:#2d72d9;text-transform:uppercase;letter-spacing:.1em;font-weight:800}.people-card h3{font-size:19px;margin:8px 0;color:#203a5d}.people-card p{font-size:12px;line-height:1.7;color:#7a899d;min-height:64px}

.olliver-section{background:#102c53;color:white;position:relative}.olliver-grid{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:80px}.olliver-art{height:470px;position:relative;display:grid;place-items:center}.owl-backdrop{position:absolute;width:310px;height:310px;border-radius:50%;background:radial-gradient(circle,#397db8 0,#1c4e83 45%,transparent 70%)}.olliver-art img{position:relative;width:210px;height:275px;object-fit:contain;z-index:2;filter:drop-shadow(0 24px 20px rgba(0,0,0,.22));transform-origin:bottom center;animation:olliver-wave 5s ease-in-out 1.5s infinite}.ai-orbit{position:absolute;border:1px dashed rgba(127,203,239,.38);border-radius:50%;}.orbit-a{width:390px;height:210px;transform:rotate(-18deg)}.orbit-b{width:260px;height:390px;transform:rotate(26deg)}.ai-chip{position:absolute;z-index:3;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);backdrop-filter:blur(12px);border-radius:10px;padding:9px 11px;font-size:10px;display:flex;align-items:center;gap:6px}.chip-one{right:10px;top:75px;animation:float-soft 5s ease-in-out infinite}.chip-two{left:10px;bottom:80px;animation:float-soft 6s ease-in-out .8s infinite}.olliver-copy .eyebrow{color:#71c9ef}.olliver-copy h2{font-size:clamp(37px,4vw,54px);line-height:1.08;letter-spacing:-.04em;margin:14px 0;color:white}.olliver-copy h2 span{color:#70c9ee}.olliver-copy>p{color:#b9c9dd;line-height:1.75;max-width:570px}.ai-points{margin:28px 0 30px}.ai-points>div{display:flex;gap:15px;padding:13px 0;border-top:1px solid rgba(255,255,255,.12)}.ai-points span{color:#66c4ec;font:800 11px Manrope}.ai-points b{display:block;font-size:13px}.ai-points small{display:block;color:#9eb1c8;margin-top:4px;font-size:11px}

.parent-section{background:#eef7ff}.parent-grid{display:grid;grid-template-columns:1fr .85fr;align-items:center;gap:90px}.parent-grid h2{font-size:clamp(37px,4vw,52px);line-height:1.08;letter-spacing:-.04em;color:#15365f}.parent-grid>div>p{color:#6d7d93;line-height:1.75;max-width:560px}.check-list{list-style:none;padding:0;margin:26px 0 29px;display:grid;gap:11px}.check-list li{font-size:12px;font-weight:600;color:#4e627c;display:flex;align-items:center;gap:9px}.check-list svg{width:17px;height:17px;padding:3px;border-radius:50%;background:#d8f3e9;color:#1c966e}.parent-phone-wrap{display:grid;place-items:center}.phone{width:295px;height:530px;background:#102c53;border-radius:38px;padding:9px;box-shadow:0 30px 60px rgba(34,77,120,.22);transform:rotate(3deg);animation:float-soft 7s ease-in-out infinite}.phone-top{height:29px;color:white;font-size:8px;display:flex;justify-content:space-between;padding:3px 13px;opacity:.85}.phone-content{height:474px;border-radius:28px;background:#f8fbff;padding:24px 18px;overflow:hidden}.phone-content>small{font-size:9px;color:#8a99ab}.phone-content h3{font-size:17px;color:#1b3559;margin:6px 0 17px}.child-card{background:white;border:1px solid #e4edf5;border-radius:13px;padding:10px;display:flex;align-items:center;gap:9px}.child-avatar{width:34px;height:34px;border-radius:10px;background:#e0efff;color:#2c70bb;display:grid;place-items:center;font-size:9px;font-weight:800}.child-card b{display:block;font-size:10px;color:#2a4364}.child-card span{display:block;font-size:8px;color:#8b99aa;margin-top:3px}.child-card svg{margin-left:auto;color:#93a2b3}.phone-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:10px 0}.phone-stats div{background:white;border:1px solid #e4edf5;border-radius:11px;padding:9px 5px;text-align:center}.phone-stats b{display:block;font:800 14px Manrope;color:#1e4b7d}.phone-stats span{font-size:7px;color:#8b99aa}.phone-box{background:white;border:1px solid #e4edf5;border-radius:12px;padding:11px;display:flex;align-items:center;justify-content:space-between;margin-top:7px}.phone-box b{display:block;font-size:9px;color:#2b4667}.phone-box span{display:block;font-size:8px;color:#8b99aa;margin-top:4px}.phone-box svg{color:#2d72d9}

.security-section{background:white}.security-banner{background:#f3f7fc;border:1px solid #e0eaf4;border-radius:24px;padding:48px;display:grid;grid-template-columns:.9fr 1.1fr;gap:50px}.security-copy h2{font-size:42px;line-height:1.1;letter-spacing:-.035em;color:#18365d;margin:13px 0}.security-copy p{color:#718096;line-height:1.75}.security-items{display:grid;grid-template-columns:1fr 1fr;gap:13px}.security-items>div{background:white;border:1px solid #e1eaf3;border-radius:14px;padding:17px}.security-items svg{width:19px;color:#2d72d9;margin-bottom:10px}.security-items b{display:block;font-size:12px;color:#294563}.security-items span{display:block;font-size:10px;color:#8391a3;margin-top:4px;line-height:1.4}

.cta-section{padding:30px 0 80px;background:white}.cta-box{position:relative;overflow:hidden;border-radius:24px;background:linear-gradient(120deg,#153b72,#2465aa,#153b72);background-size:200% 200%;animation:gradient-shift 14s ease-in-out infinite;padding:47px 50px;display:grid;grid-template-columns:110px 1fr auto;align-items:center;gap:25px;color:white}.cta-box:after{content:"";position:absolute;width:340px;height:340px;border-radius:50%;background:rgba(74,185,232,.16);right:-110px;top:-180px}.cta-box img{width:100px;height:120px;object-fit:contain;align-self:end;z-index:1;transform-origin:bottom center;animation:olliver-wave 4s ease-in-out 2s infinite}.cta-box .eyebrow{color:#74c9ed}.cta-box h2{font-size:31px;margin:8px 0}.cta-box p{color:#bcd0e5;margin:0;font-size:13px}.cta-box .btn{z-index:1}

.footer{background:#0c2545;color:white}.footer-top{padding:58px 0 45px;display:flex;justify-content:space-between;gap:50px}.footer-brand p{color:#91a7c0;font-size:11px;margin-top:15px}.footer-links{display:flex;gap:90px}.footer-links>div{display:grid;gap:9px}.footer-links b{font-size:11px;color:#eaf2fb;margin-bottom:5px}.footer-links button{background:transparent;border:0;padding:0;text-align:left;color:#8fa6bf;font-size:10px}.footer-links button:hover{color:white}.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:19px 0;display:flex;justify-content:space-between;color:#7289a3;font-size:9px}

.modal-backdrop{position:fixed;inset:0;z-index:100;background:rgba(8,28,51,.65);backdrop-filter:blur(8px);display:none;place-items:center;padding:20px}.modal-backdrop.open{display:grid}.modal{width:min(470px,100%);background:white;border-radius:20px;padding:30px;position:relative;box-shadow:0 30px 80px rgba(0,0,0,.22)}.modal-backdrop.open .modal{animation:pop-in .35s cubic-bezier(.2,.8,.3,1.1)}.modal-close{position:absolute;right:16px;top:16px;border:0;background:#f1f5f9;border-radius:9px;width:34px;height:34px;display:grid;place-items:center;color:#64748b}.modal h2{font-size:29px;color:#15365f;margin:10px 0}.modal>p{color:#748196;font-size:12px;line-height:1.6}.modal form{display:grid;gap:14px;margin-top:20px}.modal label{font-size:11px;font-weight:700;color:#405570}.modal input{display:block;width:100%;margin-top:6px;border:1px solid #dce6f0;border-radius:10px;padding:11px 12px;outline:none;color:#203b5e}.modal input:focus{border-color:#6ca8e3;box-shadow:0 0 0 3px rgba(45,114,217,.09)}

/* ===== Feature tags + wide cards ===== */
.feature-tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}.feature-tags span{font-size:9px;font-weight:700;color:#2b6fc9;background:#eaf4ff;border:1px solid #dcedfb;border-radius:999px;padding:4px 10px}.feature-card p{min-height:44px}
.feature-card.wide{display:grid;grid-template-columns:auto 1fr;column-gap:22px;align-items:start;grid-column:span 2;padding:26px}.feature-card.wide .feature-icon{margin-bottom:0;width:48px;height:48px}.feature-card.wide h3{font-size:18px}.feature-card.wide p{margin-bottom:14px}

/* ===== School Analytics ===== */
.analytics-section{background:#f3f8fd}.analytics-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:70px}.analytics-grid h2{font-size:clamp(37px,4vw,52px);line-height:1.08;letter-spacing:-.04em;color:#15365f;margin:12px 0 16px}.analytics-grid h2 span{color:var(--blue)}.analytics-grid>div:first-child>p{color:#6d7d93;line-height:1.75;max-width:540px}.analytics-visual{position:relative;display:grid;place-items:center}.analytics-window{width:min(100%,560px);background:#fff;border-radius:18px;box-shadow:var(--shadow);border:1px solid #e1eaf4;overflow:hidden}.analytics-body{padding:20px;background:#fbfdff}.ana-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px}.ana-kpi>div{background:#fff;border:1px solid #eef3f9;border-radius:12px;padding:13px 12px}.ana-kpi span{display:block;font-size:9px;color:#8b99aa;font-weight:600}.ana-kpi strong{display:block;font:800 21px Manrope;color:#213b60;margin:5px 0 3px}.ana-kpi em{font-style:normal;font-size:9px;color:#2ba47d;font-weight:700}.ana-main{display:grid;grid-template-columns:1fr 1fr;gap:10px}.ana-card{background:#fff;border:1px solid #eef3f9;border-radius:12px;padding:14px}.ana-card>b{display:block;font:700 11px Manrope;color:#304a6d;margin-bottom:12px}.donut{width:96px;height:96px;border-radius:50%;margin:0 auto;background:conic-gradient(#2d72d9 0 var(--a),#4ab9e8 var(--a) var(--b),#e4ecf5 var(--b) 360deg);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 13px),#fff 0);mask:radial-gradient(farthest-side,transparent calc(100% - 13px),#fff 0)}.donut-legend{display:grid;gap:6px;margin-top:14px}.donut-legend span{display:flex;align-items:center;gap:7px;font-size:8px;color:#7c8aa0;font-weight:600}.donut-legend i{width:8px;height:8px;border-radius:50%;background:#2d72d9}.ana-bars{display:flex;align-items:end;gap:8px;height:72px;border-bottom:1px solid #eef3f9;background:repeating-linear-gradient(to bottom,transparent 0,transparent 17px,#f0f4f8 18px)}.ana-bars i{flex:1;border-radius:4px 4px 0 0;background:linear-gradient(180deg,#4ab9e8,#2d72d9);animation:bar-grow 1s cubic-bezier(.4,0,.2,1) both;transform-origin:bottom;height:var(--bar-h,72%)}.ana-bars i:nth-child(1){--bar-h:75%;animation-delay:.2s}.ana-bars i:nth-child(2){--bar-h:88%;animation-delay:.3s}.ana-bars i:nth-child(3){--bar-h:64%;animation-delay:.4s}.ana-bars i:nth-child(4){--bar-h:92%;animation-delay:.5s}.ana-bars i:nth-child(5){--bar-h:80%;animation-delay:.6s}.ana-bars i:nth-child(6){--bar-h:70%;animation-delay:.7s}.ana-labels{display:flex;justify-content:space-around;margin-top:6px}.ana-labels span{font-size:8px;color:#98a5b5}.ana-float{bottom:45px;right:-10px;animation:float 5s ease-in-out .7s infinite}

/* ===== School Administration ===== */
.admin-section{background:#fff}.admin-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.admin-card{background:#f8fbff;border:1px solid #e1eaf3;border-radius:18px;padding:27px 23px;text-align:center;transition:.3s cubic-bezier(.25,.8,.35,1)}.admin-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(38,76,115,.12);border-color:#c3d9ef}.admin-icon{width:46px;height:46px;border-radius:13px;background:#eaf4ff;color:#2d72d9;display:grid;place-items:center;margin:0 auto 17px;transition:.3s}.admin-card:hover .admin-icon{background:linear-gradient(135deg,#2d72d9,#4ab9e8);color:#fff;transform:translateY(-3px) rotate(-6deg);box-shadow:0 8px 20px rgba(45,114,217,.3)}.admin-icon svg{width:21px;height:21px}.admin-card h3{font-size:16px;margin:0 0 8px;color:#213b5e}.admin-card p{font-size:12px;line-height:1.65;color:#7a899d;margin:0}

/* ===== Communication ===== */
.comm-section{background:#eef7ff}.comm-grid{display:grid;grid-template-columns:.92fr 1.08fr;align-items:center;gap:70px}.comm-grid h2{font-size:clamp(37px,4vw,52px);line-height:1.08;letter-spacing:-.04em;color:#15365f;margin:12px 0 16px}.comm-grid h2 span{color:var(--blue)}.comm-grid>div:last-child>p{color:#6d7d93;line-height:1.75;max-width:560px}.comm-visual-wrap{display:grid;place-items:center;position:relative}.comm-window{width:min(100%,520px);background:#fff;border-radius:18px;box-shadow:var(--shadow);border:1px solid #e1eaf4;overflow:hidden;transform:rotate(-1deg)}.comm-window .window-bar{color:#97a4b7}.comm-feed{background:#fbfdff;padding:14px}.comm-item{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid #edf2f7;border-radius:12px;padding:11px 13px;margin-bottom:9px}.comm-item:last-child{margin-bottom:0}.comm-icon{width:34px;height:34px;border-radius:10px;background:#eaf4ff;color:#2d72d9;display:grid;place-items:center;flex-shrink:0}.comm-item.msg .comm-icon,.comm-item.reply .comm-icon{background:#eaf7f2;color:#23946d}.comm-item.alert .comm-icon{background:#fdecec;color:#d94545}.comm-item.reminder .comm-icon{background:#fdf3e3;color:#d98a2b}.comm-item b{display:block;font:700 10.5px Manrope;color:#2c4566}.comm-item span{display:block;font-size:9px;color:#8694a8;margin-top:2px;line-height:1.4}.comm-item time{margin-left:auto;font-size:8px;color:#9aa7b8;font-weight:700;flex-shrink:0}.comm-item.reply{margin-left:28px;border-color:#d9edf9;background:#f5fbff}

@media (max-width: 980px) {
  .nav-links{gap:14px}.nav-links button:not(.btn){font-size:12px}.hero-grid,.olliver-grid,.parent-grid{grid-template-columns:1fr}.hero-copy{text-align:center}.hero-text{margin:auto}.hero-actions,.hero-proof{justify-content:center}.hero-visual{margin-top:15px}.section-heading.split,.security-banner{grid-template-columns:1fr;gap:25px}.feature-grid,.people-grid{grid-template-columns:repeat(2,1fr)}.pricing-grid{grid-template-columns:1fr}.pricing-card.featured{order:-1}.ecosystem{transform:scale(.9);margin:-20px 0}.olliver-copy{order:-1}.olliver-art{height:390px}.cta-box{grid-template-columns:80px 1fr}.cta-box .btn{grid-column:2;justify-self:start}.parent-grid{gap:45px}.analytics-grid,.comm-grid{grid-template-columns:1fr;gap:45px}.admin-grid{grid-template-columns:repeat(2,1fr)}.analytics-visual{margin-top:15px}.comm-grid>div:first-child{order:2}
}
@media (max-width: 760px) {
  .container{width:min(100% - 28px,1160px)}.nav{height:68px}.menu-btn{display:grid;place-items:center}.nav-links{display:none;position:absolute;left:14px;right:14px;top:74px;background:white;border:1px solid var(--line);border-radius:16px;padding:15px;box-shadow:var(--shadow);flex-direction:column;align-items:stretch}.nav-links.open{display:flex}.nav-links button:not(.btn){padding:10px;text-align:left}.nav-demo{width:100%}.hero{padding:65px 0 55px}.hero h1{font-size:43px}.hero-text{font-size:15px}.dashboard-window{transform:none}.hero-visual{min-height:390px}.floating-card{transform:scale(.86)}.attendance{left:-4px;bottom:25px}.olliver-float{right:-12px;top:20px}.trust-inner{flex-direction:column;justify-content:center;padding:17px 0;text-align:center}.trust-inner>div{gap:12px;flex-wrap:wrap;justify-content:center}.section{padding:75px 0}.feature-grid,.people-grid{grid-template-columns:1fr}.pricing-grid{grid-template-columns:1fr;max-width:440px;margin:0 auto}.pricing-card.featured{order:-1}.ecosystem{height:460px;transform:scale(.72);margin:-65px -50px}.eco-admin{top:20px}.eco-teacher{right:0}.eco-parent{left:0}.security-banner{padding:30px 22px}.security-copy h2{font-size:34px}.security-items{grid-template-columns:1fr}.cta-box{grid-template-columns:1fr;padding:35px 28px;text-align:center}.cta-box img{margin:auto}.cta-box .btn{grid-column:auto;justify-self:center}.footer-top{flex-direction:column}.footer-links{gap:45px}.footer-bottom{flex-direction:column;gap:7px}.modal{padding:25px}.parent-phone-wrap{margin-top:10px}.feature-card.wide{grid-column:span 1;display:block}.feature-card.wide .feature-icon{margin-bottom:19px}.admin-grid{grid-template-columns:1fr}.ana-main{grid-template-columns:1fr}.ana-kpi{grid-template-columns:repeat(3,1fr)}.ana-float{right:0}.comm-item.reply{margin-left:14px}
}

/* Accessibility: respect reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}