/* A moving notebook, in the brand's sage, teal and peach. */
body{background:#E9EFE6}
.hero-atmosphere{position:relative;isolation:isolate;background:#DDEADD;overflow:hidden}
.study-background{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background-image:linear-gradient(#146d6309 1px,transparent 1px),linear-gradient(90deg,#146d6309 1px,transparent 1px);background-size:56px 56px}
.orbit{display:block;position:absolute;border:1px solid #146d6320;border-radius:50%;width:660px;height:660px;animation:notebook-orbit 24s ease-in-out infinite alternate}
.orbit-a{left:-440px;top:40px;border-width:50px;border-color:#146d6309}
.orbit-b{right:-290px;top:-410px;width:850px;height:850px;border-width:90px;border-color:#f4a26122;animation-delay:-8s}
.orbit-c{left:35%;bottom:-570px;border-style:dashed;animation-duration:34s}
.floating-note{position:absolute;font-family:var(--serif);font-size:22px;color:#146d6340;animation:note-drift 16s ease-in-out infinite alternate}
.note-a{left:47%;top:24px;rotate:-8deg}.note-b{left:14%;bottom:24px;font-size:16px;rotate:-4deg;animation-delay:-6s}.note-c{right:3%;top:48%;rotate:8deg;animation-delay:-10s}
@keyframes notebook-orbit{from{transform:translate3d(-22px,-18px,0) rotate(-8deg)}to{transform:translate3d(36px,22px,0) rotate(13deg)}}
@keyframes note-drift{from{transform:translate3d(0,-8px,0)}to{transform:translate3d(13px,12px,0)}}
.hero{padding-bottom:28px}
.hero-example{background:#FAF7F2}
.hero-example .speech-bubble{position:relative;inset:auto;font-size:20px;line-height:1.5;font-family:var(--serif);font-weight:600;min-height:154px}
.speech-bubble .type-reserve,.speech-bubble .type-copy{font:inherit;color:var(--ink);line-height:inherit}
.speech-bubble .type-reserve{visibility:hidden;display:block}
.speech-bubble .type-copy{position:absolute;top:0;left:0;right:0}
.type-copy.is-typing:after{content:'';display:inline-block;width:2px;height:.9em;margin-left:3px;background:var(--teal);animation:pen-blink .7s step-end infinite}
@keyframes pen-blink{50%{opacity:0}}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
.motion-controls{display:flex;align-items:center;gap:14px;padding-block:0 15px;justify-content:flex-end;color:var(--muted);font-size:10px}
.motion-controls button{background:transparent;border:1px solid #146d6333;border-radius:7px;color:var(--deep);padding:10px 13px;min-height:44px;font:700 10px var(--font);cursor:pointer}
.motion-controls button:hover{background:#FAF7F280}
.motion-paused *,.motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}
.coming-soon{display:grid;grid-template-columns:1fr auto;align-items:center;gap:50px;padding:42px 0;border-block:1px solid #146d6330}
.coming-soon h2{font-size:clamp(34px,4vw,54px);line-height:1.15;margin-bottom:22px}
.coming-soon p:not(.eyebrow){font-size:16px;line-height:1.8;color:var(--muted);max-width:620px;margin:0}
.launch-stamp{width:235px;min-height:235px;aspect-ratio:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;border:1.5px dashed var(--teal);border-radius:50%;background:#DDEADD;color:var(--deep);transform:rotate(6deg)}
.launch-stamp strong{font:650 38px var(--serif)}
.launch-stamp>span:last-child{font-size:11px}
.stamp-dot{width:10px;height:10px;border-radius:50%;background:var(--peach);outline:4px solid #f4a26140}
.teachers-section{background:#EFE4D3;border-block:1px solid #D8CCBC;padding-block:80px}
.teachers-layout{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:start}
.teachers-intro{padding-top:15px;position:sticky;top:125px}
.teachers-intro h2{font-size:clamp(38px,4vw,55px);line-height:1.15;margin-bottom:25px}
.teachers-intro>p:not(.eyebrow){max-width:440px;line-height:1.85;font-size:16px;color:var(--muted)}
.teacher-note{display:flex;align-items:center;gap:20px;padding-block:28px;margin-block:22px;border-block:1px solid #D8CCBC}
.teacher-note img{width:76px;height:76px;object-fit:contain}
.teacher-note p{font-family:var(--serif);font-weight:600;font-size:23px;line-height:1.5;margin:0}
.teachers-intro .teacher-detail{font-size:13px}
.teacher-form{background:var(--paper);border:1px solid #D8CCBC;border-radius:16px;padding:34px;min-width:0}
.teacher-form h3{font-size:32px;margin:0 0 8px}
.form-intro{font-size:12px;color:var(--muted);margin-bottom:25px}
.teacher-form>label:not(.form-consent){display:block;font-size:13px;font-weight:700;margin:18px 0 8px}
.teacher-form>label>span{font-weight:500;color:var(--muted)}
.teacher-form input:not([type=checkbox]),.teacher-form select,.teacher-form textarea{display:block;width:100%;min-height:48px;border:1px solid #BFC8BE;background:#FFFDF8;color:var(--ink);border-radius:8px;padding:12px;font:400 16px/1.5 var(--font);box-sizing:border-box}
.teacher-form textarea{resize:vertical;min-height:110px}
.teacher-form input:focus,.teacher-form select:focus,.teacher-form textarea:focus{outline:2px solid var(--teal);outline-offset:2px;border-color:var(--teal)}
.teacher-form input::placeholder,.teacher-form textarea::placeholder{color:#69726C;font-size:13px}
.form-consent{display:flex;gap:12px;align-items:start;font-size:12px;line-height:1.7;margin:24px 0;cursor:pointer}
.form-consent input{flex:0 0 19px;width:19px;height:19px;accent-color:var(--teal);margin-top:3px}
.form-consent a{color:var(--teal);text-decoration:underline;text-underline-offset:3px}
.teacher-submit{width:100%;min-height:52px;justify-content:space-between;text-transform:none;letter-spacing:0;font-size:14px}
.teacher-submit:disabled{opacity:.65;cursor:wait;transform:none}
.form-status{font-size:14px;line-height:1.7;margin:20px 0 0;padding:0;color:var(--deep);overflow-wrap:anywhere}
.form-status:empty{display:none}.form-status.is-error{color:#962F20}
.form-status.is-success{padding:14px;border-left:3px solid var(--teal);background:#E4EEE2}
.form-privacy{font-size:11px;line-height:1.6;color:var(--muted);margin-top:20px;margin-bottom:0}
.form-trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
@media(min-width:681px) and (max-width:1050px){.hero-example .speech-bubble{font-size:17px;min-height:150px}.teachers-layout{gap:35px}.teacher-form{padding:25px}.teachers-intro h2{font-size:38px}.coming-soon{gap:30px}.launch-stamp{width:190px;min-height:190px}.launch-stamp strong{font-size:31px}}
@media(max-width:680px){
 .hero{padding-bottom:14px}
 .study-background{background-size:38px 38px}
 .orbit-a{left:-560px;top:50px}.orbit-b{width:450px;height:450px;right:-280px;top:-230px;border-width:50px}.orbit-c{left:35%;bottom:-580px}
 .floating-note{font-size:16px}.note-a{left:auto;right:16px;top:15px}.note-b{left:18px;bottom:10px;font-size:12px}.note-c{display:none}
 .hero-example{top:10px}
 .hero-example .speech-bubble{font-family:var(--font);font-size:12px;line-height:1.6;min-height:94px}
 .hero-example>span{font-size:7px}
 .hero-example .tip-button{min-height:44px}
 .mascot-stage{height:226px}
 .hero-mascot{top:23px;width:162px}
 .motion-controls{justify-content:flex-end;padding-bottom:12px}
 .motion-controls>span{display:none}
 .motion-controls button{font-size:10px;min-height:44px}
 .coming-soon{grid-template-columns:1fr;gap:28px;padding-block:30px}
 .coming-soon h2{font-size:34px}
 .coming-soon p:not(.eyebrow){font-size:15px}
 .launch-stamp{width:100%;aspect-ratio:auto;min-height:95px;border-radius:12px;transform:none;flex-direction:row;gap:12px;flex-wrap:wrap;padding:20px}
 .launch-stamp strong{font-size:31px}.launch-stamp>span:last-child{font-size:11px}
 .teachers-section{padding-block:45px}
 .teachers-layout{grid-template-columns:1fr;gap:27px}
 .teachers-intro{position:static;padding-top:0}
 .teachers-intro h2{font-size:36px;margin-bottom:18px}
 .teachers-intro>p:not(.eyebrow){font-size:15px;line-height:1.75}
 .teacher-note{padding-block:17px;margin-block:20px;gap:16px}
 .teacher-note img{width:60px;height:60px}.teacher-note p{font-size:20px}
 .teacher-form{padding:24px 20px;border-radius:12px}
 .teacher-form h3{font-size:28px}
 .teacher-form>label:not(.form-consent){font-size:13px}
 .form-consent{font-size:12px}
}
@media(max-width:360px){.hero-example .speech-bubble{font-size:11px;min-height:99px}.mascot-stage{height:231px}.hero-mascot{width:143px;top:43px}.teacher-form{padding:22px 16px}.coming-soon h2{font-size:30px}}
@media(prefers-reduced-motion:reduce){.study-background *,.type-copy:after{animation:none!important}}
