@import url('https://fonts.googleapis.com/css2?family=Fredoka:wght@400;500;600;700&family=Nunito:wght@400;500;600;700;800;900&display=swap');
:root{--ink:#211b43;--purple:#6332a8;--purple-dark:#462188;--teal:#008a98;--lav:#f4efff;--muted:#625d78;--border:#e7e0f1;--surface:#fff;--shadow:0 16px 42px rgba(45,27,93,.07)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:var(--ink);font:500 16px/1.7 Nunito,system-ui,sans-serif;overflow-wrap:break-word}img{max-width:100%}h1,h2,h3,h4{font-family:Fredoka,Nunito,sans-serif;line-height:1.18;letter-spacing:-.025em}h1{font-size:clamp(2.65rem,5.6vw,5.1rem);font-weight:600;margin:0 0 22px}h2{font-size:clamp(2rem,3.7vw,3.2rem);font-weight:600;margin:10px 0 15px}h3{font-size:1.43rem;font-weight:600;margin:13px 0}p{margin:0 0 17px}a{color:var(--purple)}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #16a8b1;outline-offset:3px}.wrap{width:min(100% - 40px,1160px);margin-inline:auto}
.sitehead{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.97);backdrop-filter:blur(14px);border-bottom:1px solid #eee8f6}.sitehead nav{min-height:90px;display:flex;justify-content:space-between;align-items:center;gap:22px}.sitehead .brand{display:flex;align-items:center;flex:0 0 auto;text-decoration:none;max-width:100%}.sitehead .brand .brand-logo{display:block;width:268px;height:auto;max-height:82px;object-fit:contain;object-position:left center}.navlinks{display:flex;align-items:center;gap:28px}.navlinks a{font-size:.95rem;text-decoration:none;font-weight:900;color:var(--ink);white-space:nowrap}.navlinks a:hover,.navlinks a[aria-current=page]{color:var(--purple)}.menu-toggle{display:none;font:800 15px Nunito,sans-serif;border:1px solid var(--border);background:white;border-radius:12px;padding:9px 13px;color:var(--purple);cursor:pointer}
section{padding:88px 0}.eyebrow{font:900 .77rem/1.4 Nunito,sans-serif;color:var(--purple);letter-spacing:.14em;text-transform:uppercase}.eyebrow-dot{display:inline-block;background:#18b3a5;width:8px;height:8px;border-radius:50%;margin-right:8px}.gradient-text{background:linear-gradient(90deg,#6230b0,#058d9f);-webkit-background-clip:text;background-clip:text;color:transparent}.lead{font-size:1.19rem;line-height:1.85;color:var(--muted);max-width:550px}.hero{padding:85px 0 90px;background:radial-gradient(circle at 82% 38%,#d9f7f3 0,transparent 33%),linear-gradient(125deg,#fbf8ff 15%,#f1ebff 90%);overflow:hidden}.hero-grid{display:grid;grid-template-columns:1.12fr .88fr;align-items:center;gap:35px}.hero h1{margin-top:19px}.hero-content{position:relative;z-index:2}.hero-visual{position:relative;display:flex;align-items:center;justify-content:center;min-height:385px}.hero-visual img{display:block;width:min(100%,400px);height:auto;aspect-ratio:1/1;object-fit:contain;position:relative;z-index:1;filter:drop-shadow(0 24px 22px rgba(64,34,110,.15))}.hero-glow{position:absolute;inset:9% 10%;background:radial-gradient(circle,#dcd2ff 0,transparent 72%);border-radius:50%}.float-pill{position:absolute;z-index:2;background:white;border:1px solid #eee5ff;border-radius:99px;padding:9px 14px;font-size:.83rem;font-weight:900;box-shadow:var(--shadow);white-space:nowrap}.pill-top{top:12%;right:-4%}.pill-bottom{bottom:8%;left:-6%}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:27px 0}.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 23px;background:var(--purple);color:white;text-decoration:none;font:900 .95rem Nunito,sans-serif;border:2px solid var(--purple);border-radius:100px;cursor:pointer;transition:transform .15s,background .15s}.btn:hover{background:var(--purple-dark);transform:translateY(-2px)}.btn.secondary{background:white;color:var(--purple)}.btn.secondary:hover{background:#f4efff}.hero-points{display:flex;gap:19px;flex-wrap:wrap;color:#534c72;font-weight:800;font-size:.81rem;margin-top:28px}.hero-points span{white-space:nowrap}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:32px}.section-heading p{color:var(--muted);margin:0}.text-link{font-weight:900;text-decoration:none;white-space:nowrap}.feature-grid,.lesson-grid,.steps-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.feature-card,.lesson-tile{display:block;text-decoration:none;color:var(--ink);border:1px solid var(--border);background:white;border-radius:25px;padding:30px;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s}.feature-card:hover,.lesson-tile:hover{transform:translateY(-5px);box-shadow:0 22px 45px rgba(45,27,93,.12)}.feature-card p,.lesson-tile p{color:var(--muted);min-height:52px}.feature-icon{display:grid;place-items:center;width:68px;height:68px;border-radius:20px;font-size:2rem;margin-bottom:24px}.lilac{background:#f1e9ff}.mint{background:#dff9f2}.peach{background:#fff0df}.feature-label{font-size:.75rem;color:var(--teal);letter-spacing:.1em;font-weight:900}.card-link{font-weight:900;color:var(--purple);display:inline-block;margin-top:8px}.section-soft{background:#faf8ff}.lesson-chip{font-size:.73rem;font-weight:900;letter-spacing:.09em;color:var(--purple);background:#f2eaff;padding:8px 11px;border-radius:30px}.lesson-illustration{display:grid;place-items:center;font-size:3.2rem;min-height:128px;margin:18px 0;border-radius:18px;background:linear-gradient(130deg,#f5f0ff,#ebfbf9)}.quiz-tile .lesson-illustration{background:linear-gradient(130deg,#fff3de,#f4e9ff)}.watch-grid{display:grid;grid-template-columns:1fr .9fr;align-items:center;gap:70px}.watch-copy>p{color:var(--muted);font-size:1.08rem}.check-list{padding:0;list-style:none;margin:23px 0}.check-list li{padding:5px 0;font-weight:800}.check-list li:before{content:'✓';color:#159b77;margin-right:11px}.video-card{background:linear-gradient(135deg,#f1e8ff,#e4faf7);border-radius:32px;padding:28px;display:flex;justify-content:center;box-shadow:var(--shadow)}.video{width:100%;max-width:280px;aspect-ratio:9/16;height:auto;border:0;border-radius:18px;background:#211b43}.steps-section{background:#fff}.centered{justify-content:center;text-align:center}.steps-grid>div{padding:25px 20px;text-align:center}.step-number{font:600 3rem Fredoka,sans-serif;color:#b8a0e7}.steps-grid p{color:var(--muted)}.cta-section{padding-top:28px}.cta-panel{display:flex;align-items:center;justify-content:space-between;gap:25px;padding:48px 55px;background:linear-gradient(120deg,#512594,#6e42b9);color:white;border-radius:32px}.cta-panel h2{max-width:570px}.cta-panel p{margin:0;color:#eee5ff}.cta-panel .eyebrow{color:#d9fcf5}.btn-white{background:white;color:var(--purple);border-color:white;white-space:nowrap}.btn-white:hover{background:#f5f1ff;color:var(--purple)}
.page-hero{background:linear-gradient(120deg,#f7f2ff,#effbf9);padding:70px 0}.page-hero h1{font-size:clamp(2.5rem,4.6vw,4.3rem);margin:14px 0}.page-hero p{font-size:1.12rem;color:var(--muted)}.learning-note{display:flex;justify-content:space-between;align-items:center;gap:30px}.learning-note p{max-width:700px;color:var(--muted)}.article{width:min(100% - 40px,820px);margin:65px auto;min-height:42vh}.article h1{font-size:clamp(2.3rem,4.5vw,3.7rem)}.article p,.article li{font-size:1.05rem}.article h2{font-size:2rem}.article ul{padding-left:24px}.example{padding:18px 21px;border-radius:14px;margin:15px 0;background:#f7f3ff}.wrong{border-left:5px solid #dc3b54}.right{border-left:5px solid #189e74}.quiz{border:1px solid var(--border);padding:25px;border-radius:20px;background:white;box-shadow:0 8px 25px rgba(45,27,93,.04)}.quiz button{margin:7px 9px 7px 0;padding:13px 17px;border-radius:12px;border:1px solid #cfc2e6;background:white;cursor:pointer;font:800 1rem Nunito,sans-serif;color:var(--ink)}.quiz button:hover{background:var(--lav)}.feedback{font-weight:900;min-height:26px}.card{border:1px solid var(--border);padding:28px;border-radius:23px;background:white;box-shadow:var(--shadow)}.card p{color:var(--muted)}.tag{color:var(--teal);font-weight:900}.formfield{display:block;font-weight:900;margin:18px 0 6px}input,textarea,select{display:block;width:100%;padding:13px 14px;border:1px solid #c8bdda;border-radius:12px;font:inherit;color:var(--ink);background:white}textarea{min-height:155px;resize:vertical}input:focus,textarea:focus,select:focus{outline:3px solid #d7c4fa;outline-offset:2px}.honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}.card form .btn{margin-top:12px}.small{font-size:.91rem;color:var(--muted)}
footer{background:#231a42;color:white;padding:42px 0}footer .wrap{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap}footer a{color:#ded1ff}footer strong{font-family:Fredoka,sans-serif;font-size:1.25rem}
@media(max-width:950px){.navlinks{gap:17px}.sitehead .brand .brand-logo{width:225px}.hero-grid{gap:15px}.float-pill{font-size:.75rem}.watch-grid{gap:30px}}
@media(max-width:700px){.wrap{width:min(100% - 32px,1160px)}.sitehead nav{min-height:74px;flex-wrap:nowrap}.sitehead .brand .brand-logo{width:205px;max-height:70px}.menu-toggle{display:block}.navlinks{display:none;position:absolute;top:100%;left:0;right:0;padding:16px 20px 20px;background:white;border-bottom:1px solid var(--border);box-shadow:0 18px 25px rgba(40,25,75,.1);flex-direction:column;align-items:stretch;gap:4px}.navlinks.open{display:flex}.navlinks a{font-size:1rem;padding:10px 8px}.hero{padding:54px 0 58px}.hero-grid,.watch-grid{grid-template-columns:1fr}.hero-content{text-align:center}.hero h1{font-size:clamp(2.7rem,10vw,4rem)}.hero .lead{margin:auto;font-size:1.03rem}.actions,.hero-points{justify-content:center}.hero-points{gap:10px 18px}.hero-visual{min-height:260px;margin:18px auto 0;width:min(100%,330px)}.hero-visual img{width:min(100%,280px);height:auto}.float-pill{font-size:.7rem;padding:6px 9px}.pill-top{right:-1%;top:7%}.pill-bottom{left:-1%;bottom:2%}section{padding:60px 0}.feature-grid,.lesson-grid,.steps-grid{grid-template-columns:1fr}.feature-card,.lesson-tile{padding:24px}.feature-card p,.lesson-tile p{min-height:0}.section-heading{align-items:start;flex-direction:column}.watch-grid{gap:26px}.video-card{padding:24px}.cta-panel{padding:32px 24px;flex-direction:column;align-items:start}.cta-panel .btn{white-space:normal}.learning-note{flex-direction:column;align-items:start}.page-hero{padding:52px 0}.article{margin:45px auto}.steps-grid>div{padding:12px 20px}}
@media(max-width:370px){.sitehead .brand .brand-logo{width:176px}.menu-toggle{padding:8px 10px}.float-pill{font-size:.64rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Preserve the mascot's native square proportions on all screen sizes. */
.hero-visual img{border-radius:50%;border:7px solid rgba(255,255,255,.94);box-shadow:0 16px 42px rgba(65,38,110,.11)}

/* v3.0: mobile production fixes */
.sitehead nav{display:flex!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:space-between!important;position:relative!important}
.sitehead .brand{display:block!important;flex:0 1 auto!important;min-width:0!important;max-width:calc(100% - 60px)!important}
.sitehead .brand img.brand-logo{display:block!important;width:340px!important;max-width:100%!important;height:auto!important;max-height:none!important;object-fit:contain!important;object-position:left center!important}
.navlinks a,.lesson-tile,.feature-card,.card-link,.text-link{text-decoration:none!important}
.lesson-tile,.feature-card{color:var(--ink)!important}
.lesson-tile h3,.feature-card h3{color:var(--ink)!important;text-decoration:none!important}
.lesson-tile p,.feature-card p{color:var(--muted)!important;text-decoration:none!important}
.lesson-tile .card-link,.feature-card .card-link{color:var(--purple)!important;text-decoration:none!important}
.hero-visual{min-height:0!important;display:flex!important;align-items:center!important;justify-content:center!important}
.hero-visual .hero-glow,.hero-visual .float-pill,.hero-visual img{display:none!important}
.hero-demo{position:relative;width:min(100%,390px);padding:26px;border-radius:26px;background:white;box-shadow:0 20px 65px rgba(64,34,110,.12);border:1px solid #e7def8;text-align:left}
.demo-tag{display:inline-flex;background:#e7fbf5;color:#067e6e;border-radius:30px;font-size:.73rem;font-weight:900;padding:6px 11px;letter-spacing:.06em}
.hero-demo h3{font-size:1.5rem;margin:16px 0}.demo-choice{border:1px solid #e7def8;border-radius:13px;padding:12px 14px;margin:10px 0;font-weight:900;background:#faf8ff}.demo-choice.bad{color:#b13953;text-decoration:line-through}.demo-choice.good{color:#087c5d;background:#e8faf2;border-color:#a7e5cb}.demo-foot{color:#68617d;font-size:.86rem;margin:17px 0 0}
@media(max-width:700px){
.sitehead nav{min-height:92px!important;gap:8px!important;padding:8px 0!important}
.sitehead .brand{max-width:calc(100% - 50px)!important}
.sitehead .brand img.brand-logo{width:330px!important;max-width:100%!important;height:auto!important}
.menu-toggle{display:inline-flex!important;align-items:center;justify-content:center;width:43px;height:43px;padding:0!important;flex:0 0 43px;font-size:0!important;border-radius:12px!important;box-shadow:none!important}
.menu-toggle::after{content:'☰';font-size:23px;line-height:1;color:#6332a8}
.menu-toggle[aria-expanded='true']::after{content:'✕'}
.navlinks{display:none!important;position:absolute!important;top:100%!important;left:-16px!important;right:-16px!important;z-index:50!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;padding:12px 18px 20px!important;background:white!important;box-shadow:0 18px 24px rgba(33,27,67,.15)!important}
.navlinks.open{display:flex!important}
.navlinks a{display:block!important;padding:11px 12px!important;border-radius:10px!important;text-decoration:none!important}
.hero-grid{grid-template-columns:minmax(0,1fr)!important}
.hero-visual{min-height:0!important;margin:35px auto 0!important;width:100%!important}
.hero-demo{max-width:355px}
.hero-points{gap:8px 16px!important}
.feature-grid,.lesson-grid,.steps-grid{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:17px!important}
.feature-card,.lesson-tile{display:block!important;border:1px solid var(--border)!important;border-radius:22px!important;background:white!important;padding:23px!important;box-shadow:0 12px 25px rgba(45,27,93,.06)!important;text-decoration:none!important}
.lesson-tile h3,.feature-card h3{font-size:1.4rem!important;line-height:1.3!important}
.lesson-illustration{min-height:95px!important;font-size:2.6rem!important}
.section-heading{gap:9px!important}
}
@media(max-width:380px){.sitehead .brand img.brand-logo{width:285px!important}}

/* V4 lesson library and accessible quiz components */
.library-card[hidden]{display:none!important}
.lesson-intro{max-width:780px;margin:0 auto 26px}.lesson-intro h1{font-size:clamp(2rem,4vw,3.2rem)}.library-tools{display:flex;gap:12px;flex-wrap:wrap;margin:25px 0}.library-tools input,.library-tools select{font:inherit;padding:13px 16px;border:1px solid #d8cdea;border-radius:14px;background:white;min-width:220px;max-width:100%;flex:1}.library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin:20px 0 50px}.library-card{display:block;background:#fff;border:1px solid #e8dff3;border-radius:20px;padding:24px;text-decoration:none!important;color:#292246!important;box-shadow:0 8px 24px #3420600a;transition:transform .15s,border-color .15s}.library-card:hover,.library-card:focus-visible{transform:translateY(-3px);border-color:#6332a8}.library-card h2{font-size:1.3rem;margin:14px 0 10px;line-height:1.3}.library-card p{font-size:1rem;line-height:1.55;color:#5c5670}.category-pill{display:inline-block;padding:6px 11px;background:#f2eaff;border-radius:30px;color:#6332a8;font-size:.82rem;font-weight:800}.lesson-body{max-width:860px;margin:55px auto 75px;padding:0 20px}.lesson-body h1{font-size:clamp(2.1rem,5vw,3.4rem);line-height:1.12}.lesson-body p,.lesson-body li{font-size:1.08rem;line-height:1.75}.example-box{padding:22px;border-radius:18px;margin:16px 0}.example-box.correct{background:#eaf8f1;border-left:5px solid #16834b}.example-box.incorrect{background:#fff0f1;border-left:5px solid #e53935}.example-box strong{display:block;margin-bottom:5px}.lesson-body h2{margin-top:35px}.lesson-next{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:36px}.quiz-panel{background:white;border:1px solid #e7dff1;border-radius:20px;padding:22px;margin:20px 0}.quiz-panel h3{font-size:1.2rem;margin:0 0 18px}.quiz-options{display:grid;gap:10px}.quiz-options button{font:inherit;text-align:left;cursor:pointer;padding:14px 16px;background:#f8f5fd;color:#292246;border:2px solid #e9e0f4;border-radius:13px;min-height:52px}.quiz-options button:hover,.quiz-options button:focus-visible{border-color:#6332a8}.quiz-options button.correct{background:#eaf8f1;border-color:#16834b}.quiz-options button.wrong{background:#fff0f1;border-color:#e53935}.quiz-feedback{min-height:24px;margin:14px 0 0;font-weight:700}.quiz-score{font-size:1.2rem;font-weight:800;background:#f2eaff;padding:17px 22px;border-radius:15px}.quiz-retry{padding:13px 22px;background:#6332a8;border:0;color:white;border-radius:30px;cursor:pointer;font:inherit;font-weight:700}.empty-library{display:none;padding:25px}.video-embed-responsive{position:relative;max-width:380px;aspect-ratio:9/16;margin:20px auto}.video-embed-responsive iframe{width:100%;height:100%;border:0;border-radius:16px}.small-note{font-size:.95rem!important;color:#6a627a}@media(max-width:850px){.library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:580px){.library-grid{grid-template-columns:1fr}.library-tools{display:grid}.library-tools input,.library-tools select{width:100%;min-width:0}.lesson-body{margin-top:35px}.quiz-panel{padding:16px}}