*{box-sizing:border-box} :root{--navy:#102a43;--teal:#0d9488;--muted:#6d8292;--line:#e1ebef;--paper:#f7fafb}body{margin:0;background:var(--paper);font-family:ui-rounded,"Trebuchet MS",system-ui,sans-serif;color:var(--navy)}.top{height:78px;padding:0 max(22px,calc((100vw - 1160px)/2));display:flex;align-items:center;justify-content:space-between;background:#ffffffed;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:2;backdrop-filter:blur(14px)}.brand{display:flex;align-items:center;gap:12px;color:var(--navy);text-decoration:none}.logo{width:45px;height:45px;display:grid;place-items:center;background:#d9f7ef;border-radius:15px;color:#07877d;font-size:28px}.brand b,.brand small{display:block}.brand b{font-size:16px}.brand small{font-size:10px;letter-spacing:2px;color:var(--muted);margin-top:4px}.pill{font-size:12px;color:#4b687b;background:#eef6f7;border:1px solid #e0ebee;padding:10px 14px;border-radius:30px}main{max-width:1160px;padding:0 22px;margin:30px auto 65px}.hero{display:grid;grid-template-columns:1fr .85fr;min-height:350px;background:linear-gradient(115deg,#e1faf2,#e9f4ff 65%,#fff1df);border-radius:30px;overflow:hidden;padding:45px 48px;box-shadow:0 18px 55px #102a4310}.copy{position:relative;z-index:1}.eyebrow{font-size:11px;font-weight:900;letter-spacing:1.6px;color:#0b8f83}.hero h1{font-size:clamp(36px,4.5vw,55px);letter-spacing:-1.8px;line-height:1.04;margin:16px 0;color:var(--navy)}.hero h1 em{font-style:normal;color:#0d9d8e}.hero p{max-width:490px;color:#60798a;line-height:1.7;font-size:15px}.button{display:inline-flex;align-items:center;gap:25px;margin-top:15px;padding:14px 19px;border-radius:14px;background:var(--teal);color:#fff;text-decoration:none;font-weight:800;font-size:14px;box-shadow:0 8px 18px #0d948833}.button span{font-size:20px}.art{position:relative;min-height:250px}.floating{position:absolute;display:grid;place-items:center;width:76px;height:76px;border-radius:24px;background:#ffffffc9;box-shadow:0 12px 30px #315a6b1c;font-size:39px;transform:rotate(-8deg)}.f1{top:28px;left:24px}.f2{top:115px;left:110px;transform:rotate(8deg)}.f3{right:35px;top:55px;transform:rotate(7deg)}.f4{right:90px;bottom:25px;transform:rotate(-9deg)}.book{position:absolute;left:40%;top:40%;font-size:85px;filter:drop-shadow(0 8px 10px #18344a20)}.orb{position:absolute;color:#efb73f;font-size:45px}.orb1{right:30px;top:5px}.orb2{left:20px;bottom:5px}.art-label{position:absolute;bottom:0;left:32%;font-size:12px;font-weight:900;color:#57817f}.heading{display:flex;align-items:end;justify-content:space-between;margin:42px 0 18px}.heading h2{font-size:27px;letter-spacing:-.6px;margin:7px 0 0}.heading p{font-size:12px;color:var(--muted)}.modules{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.module{min-height:260px;border-radius:22px;padding:21px;text-decoration:none;color:var(--navy);border:1px solid transparent;display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s}.module:hover{transform:translateY(-3px);box-shadow:0 15px 35px #102a4312}.literacy{background:#def8ef;border-color:#cdeee3}.future{background:#fff;border-color:var(--line)}.emoji{width:56px;height:56px;border-radius:18px;background:#ffffffbd;display:grid;place-items:center;font-size:30px;margin-bottom:15px}.tag{font-size:9px;font-weight:900;letter-spacing:1px;color:#0b8e81}.future .tag{color:#8394a0}.module h3{font-size:17px;margin:9px 0}.module p{font-size:12px;line-height:1.6;color:#657b8b;margin:0 0 18px}.link{margin-top:auto;display:flex;justify-content:space-between;font-size:12px;font-weight:900;color:#0b887e}.future .link{color:#82929d}.bottom{display:flex;align-items:center;gap:16px;margin-top:25px;padding:20px 23px;border-radius:20px;background:var(--navy);color:white}.bottom-icon{font-size:30px}.bottom b{font-size:14px}.bottom p{font-size:12px;color:#c4d7e3;margin:5px 0 0}footer{border-top:1px solid var(--line);padding:25px max(22px,calc((100vw - 1160px)/2));display:flex;justify-content:space-between;gap:15px;color:#81929e;font-size:11px}@media(max-width:900px){.modules{grid-template-columns:repeat(2,1fr)}.hero{padding:35px;grid-template-columns:1fr .7fr}.art{transform:scale(.85)}}@media(max-width:600px){.top{padding:0 15px}.pill{display:none}main{padding:0 13px;margin-top:15px}.hero{display:block;padding:27px;min-height:0}.hero h1{font-size:39px}.art{min-height:175px;transform:scale(.82);transform-origin:center}.heading{display:block}.heading h2{font-size:23px}.heading p{line-height:1.5}.modules{gap:10px}.module{padding:15px;min-height:250px}.module h3{font-size:15px}.module p{font-size:11px}.tag{font-size:8px}.bottom{align-items:flex-start;padding:17px}.bottom p{line-height:1.5}footer{flex-direction:column;padding:22px}}

/* Premium branded opening portal */
.intro-screen{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse at 50% 30%,#1d4c45 0%,#102f35 38%,#071923 100%);color:#fff;transition:opacity .65s ease,transform .65s ease}
.intro-screen:before{content:"";position:absolute;inset:0;opacity:.13;background-image:linear-gradient(#ffffff12 1px,transparent 1px),linear-gradient(90deg,#ffffff12 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,black,transparent 90%)}
.intro-glow{position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}.glow-a{width:460px;height:460px;left:-170px;bottom:-230px;background:#188c73;opacity:.23}.glow-b{width:520px;height:520px;right:-230px;top:-250px;background:#a0c74c;opacity:.13}
.intro-content{position:relative;width:min(560px,calc(100% - 34px));padding:28px 22px 24px;text-align:center;display:flex;align-items:center;flex-direction:column;animation:introRise .9s cubic-bezier(.2,.8,.2,1) both}
.logo-frame{width:clamp(140px,22vh,205px);height:clamp(140px,22vh,205px);display:grid;place-items:center;border-radius:50%;padding:5px;background:linear-gradient(145deg,#ffffff,#b8d2b0);box-shadow:0 0 0 1px #ffffff4a,0 0 0 12px #ffffff0b,0 20px 70px #0005;animation:logoFloat 4s ease-in-out infinite}
.logo-frame img{display:block;width:100%;height:100%;object-fit:contain;border-radius:50%}
.intro-school{font-size:clamp(14px,2.2vw,19px);font-weight:900;letter-spacing:2.1px;margin-top:24px;color:#f8fff8;text-shadow:0 2px 18px #0004}
.intro-school span{color:#b9d76a;padding:0 5px}
.intro-divider{display:flex;align-items:center;gap:12px;width:min(260px,70%);margin:18px auto 15px;color:#c4df78}.intro-divider span{height:1px;flex:1;background:linear-gradient(90deg,transparent,#a9cb6d)}.intro-divider span:last-child{transform:rotate(180deg)}.intro-divider i{font-style:normal;font-size:15px}
.intro-content h1{font-size:clamp(29px,5vw,43px);line-height:1.08;letter-spacing:-1.2px;margin:0;color:#fff;font-weight:850}.intro-content h1 em{font-style:normal;color:#c3e17b}
.intro-subtitle{font-size:12px;letter-spacing:2px;text-transform:uppercase;color:#bfd0d3;margin:14px 0 25px}
.loading-wrap{width:min(330px,90%);margin:0 auto 21px}.loading-track{height:5px;border-radius:10px;background:#ffffff20;overflow:hidden;box-shadow:inset 0 1px 2px #0003}.loading-fill{display:block;width:0;height:100%;border-radius:10px;background:linear-gradient(90deg,#5bc6a4,#d3ed85);box-shadow:0 0 16px #9bdb9b99;transition:width .18s ease}.loading-caption{display:flex;justify-content:space-between;gap:10px;margin-top:9px;font-size:10px;color:#a8bec2;letter-spacing:.3px}.loading-caption b{color:#d8ed9d;font-weight:800}
.intro-enter{border:1px solid #d3ed9c66;border-radius:14px;background:#ffffff0b;color:#fff;padding:14px 20px;min-width:255px;font-weight:800;font-size:13px;letter-spacing:.2px;cursor:pointer;opacity:.45;transition:all .25s}.intro-enter span{margin-left:18px;font-size:19px;vertical-align:-1px}.intro-enter:disabled{cursor:wait}.intro-enter.ready{opacity:1;background:linear-gradient(110deg,#168f79,#4ba77f);border-color:#8de0b5;box-shadow:0 10px 30px #0d9b7a40}.intro-enter.ready:hover{transform:translateY(-2px);box-shadow:0 14px 35px #0d9b7a55}
.intro-foot{font-size:9px;letter-spacing:2.4px;color:#78969a;margin-top:28px}
.intro-leave{opacity:0;transform:scale(1.025);pointer-events:none}.portal-app{opacity:0;transform:translateY(8px);transition:opacity .55s ease,transform .55s ease}.portal-app.portal-ready{opacity:1;transform:none}
body:not(.portal-entered){overflow:hidden}
@keyframes introRise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes logoFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@media(max-height:700px){.intro-content{padding:12px}.logo-frame{width:120px;height:120px}.intro-school{margin-top:15px}.intro-divider{margin:10px auto}.intro-subtitle{margin:9px 0 16px}.loading-wrap{margin-bottom:14px}.intro-foot{margin-top:17px}}
@media(prefers-reduced-motion:reduce){.intro-content,.logo-frame{animation:none}.intro-screen,.portal-app{transition:none}}
