/* SHARP's toy world: objects frame the content and assemble with the scroll. */
.intro,.together,.partners,.contact,.parents{padding-bottom:190px}
.parents{background:var(--paper);padding-top:150px}
.parents-heading{display:grid;grid-template-columns:1.2fr 1fr;gap:12%;align-items:center}
.parents-heading h2{font-size:clamp(38px,4.4vw,68px);color:var(--blue);margin-bottom:35px}
.parents-heading>p{font-size:17px;line-height:1.8;color:var(--muted);max-width:400px}
.learning-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:35px 0 90px}
.learning-grid article{background:var(--mint);padding:35px 28px 45px;clip-path:var(--frame-cut)}
.learning-grid article:nth-child(2){background:var(--yellow)}
.learning-grid article:nth-child(3){background:var(--peach)}
.learning-number{font-size:10px;letter-spacing:1.5px;font-weight:800}
.learning-grid h3{font-size:clamp(24px,2.4vw,37px);letter-spacing:-1.6px;color:var(--blue);margin:35px 0 20px;font-weight:900}
.learning-grid p{font-size:14px;line-height:1.8;margin:0}
.faq-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:10%;align-items:start}
.faq-layout h3{font-size:clamp(30px,3.2vw,48px);line-height:1.05;letter-spacing:-2px;font-weight:900;color:var(--blue)}
.faq-layout .text-link{font-size:13px;display:inline-block}
.faq-list{border-top:2px solid var(--blue)}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{cursor:pointer;list-style:none;padding:25px 38px 25px 0;position:relative;font-weight:700;line-height:1.5;font-size:15px}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:after{content:'+';position:absolute;right:4px;top:23px;font-size:24px;color:var(--blue)}
.faq-list details[open] summary:after{content:'−'}
.faq-list summary:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
.faq-list details p{font-size:14px;line-height:1.85;color:var(--muted);padding:0 30px 24px 0;margin:0}
.scatter.edge-left{left:-75px;top:40%;width:150px;height:210px}
.scatter.edge-right{right:-85px;top:42%;width:165px;height:215px}
.scatter.bottom-cluster{bottom:12px;left:18%;width:330px;height:170px}
.scatter.top-cluster{top:0;right:8%;width:285px;height:150px}
.together .bottom-cluster,.contact .bottom-cluster{left:auto;right:12%}
.decor-intro,.decor-partners{width:310px;height:170px;top:-8px}
.decor-step{width:235px;height:145px;bottom:0;right:12px}
.step{padding-bottom:165px;min-height:510px}
.journey{padding-bottom:190px}
.journey>.edge-right{top:56%;right:0}
.header nav{gap:24px;font-size:12px}
.menu-kicker,.menu-footer{display:none}
body.menu-open{position:fixed;left:0;right:0;overflow:hidden}
body.menu-open #playful-canvas{visibility:hidden}
@media(min-width:761px) and (max-width:1000px){.header{gap:15px}.header nav{gap:14px}.nav-cta{font-size:11px;padding-left:12px}.nav-cta span{margin-left:4px}.brand{width:85px}}
@media(max-width:760px){
 .intro,.together,.partners,.contact,.parents{padding-bottom:150px}
 .parents{padding-top:125px}
 .parents-heading,.faq-layout{grid-template-columns:1fr;gap:20px}
 .parents-heading h2{margin-bottom:5px}
 .parents-heading>p{font-size:14px;line-height:1.8}
 .learning-grid{grid-template-columns:1fr;gap:16px;margin:20px 0 60px}
 .learning-grid article{padding:28px 30px 32px}
 .learning-grid h3{font-size:32px;margin:18px 0 14px}
 .faq-layout{gap:35px}.faq-layout h3{font-size:36px}
 .faq-list summary{font-size:14px}.faq-list details p{font-size:13px}
 .scatter.edge-left{left:-70px;width:76px;height:115px;top:45%}
 .scatter.edge-right{right:-72px;width:80px;height:120px;top:45%}
 .journey>.edge-right{right:0;width:45px;height:100px;translate:none!important}
 .scatter.bottom-cluster{width:230px;height:120px;bottom:5px;left:8%}
 .scatter.top-cluster{width:195px;height:110px;right:3%;top:0}
 .decor-intro,.decor-partners{width:195px;height:110px;top:0}
 .decor-step{width:190px;height:125px;right:8px;bottom:0}
 .step{padding-bottom:140px;min-height:65svh}
 .journey{padding-bottom:145px}
 .menu-toggle{position:relative;z-index:52;width:48px;height:48px;clip-path:none;background:var(--yellow);padding:0;border:0}
 .menu-toggle span{width:22px;height:2px;background:var(--blue);transition:transform .25s}
 .menu-toggle[aria-expanded=true] span:first-child{transform:translateY(4px) rotate(45deg)}
 .menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-4px) rotate(-45deg)}
 body.menu-open .header{position:fixed;top:0;left:0;right:0;margin:0;padding:0 6%;z-index:51;background:var(--paper)}
 .mobile-nav:not([hidden]){position:fixed;inset:82px 0 0;z-index:50;padding:25px 7% 35px;background:var(--blue);color:var(--white);border:0;border-radius:0;overflow-y:auto;gap:0;overscroll-behavior:contain}
 .mobile-nav>a{display:flex;align-items:center;justify-content:space-between;padding:18px 0;border-bottom:1px solid var(--mint);font-size:clamp(24px,6.7vw,36px);font-weight:900;letter-spacing:-1px;line-height:1.2}
 .mobile-nav>a:after{content:'↗';font-size:24px;color:var(--yellow)}
 .mobile-nav>a:last-of-type{color:var(--yellow)}
 .mobile-nav>a:focus-visible{outline-color:var(--yellow);outline-offset:3px}
 .menu-kicker{display:block;font-size:9px;letter-spacing:1.8px;margin:8px 0 16px;color:var(--yellow)}
 .menu-footer{display:flex;align-items:center;justify-content:space-between;margin:30px 0 0;font-size:12px}
 .menu-footer span{font-size:50px;line-height:1;color:var(--yellow)}
}
@media(prefers-reduced-motion:reduce){.step{min-height:0}}