:root{--cream:#fff8ea;--paper:#fffdf7;--sky:#79c9ea;--coral:#f58668;--yellow:#ffd15b;--navy:#123f62;--green:#9edb7d;--ink:#174b6c;--white:#fff;--shadow:0 20px 55px rgba(20,63,98,.12);--radius:42px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);color:var(--navy);font-family:'DM Sans',sans-serif;overflow-x:hidden}a{text-decoration:none;color:inherit}button,input{font:inherit}.noise{position:fixed;inset:0;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");z-index:50}.progress{position:fixed;top:0;left:0;width:100%;height:5px;z-index:100;background:transparent}.progress span{display:block;width:0;height:100%;background:var(--coral)}.nav{height:78px;position:fixed;z-index:90;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:0 5.5%;background:rgba(255,253,247,.9);backdrop-filter:blur(16px);border-bottom:1px solid rgba(18,63,98,.08)}.logo{display:flex;align-items:center;gap:10px;color:var(--navy)}.logo-mark{width:36px;height:36px;border-radius:50%;background:var(--sky);display:grid;place-items:center;color:white;font-size:20px}.logo b{display:block;font:800 19px/1 'Baloo 2',sans-serif;letter-spacing:.08em}.logo small{display:block;font:700 7px/1.4 'DM Sans';letter-spacing:.16em}.desktop-nav{display:flex;align-items:center;gap:32px;font-size:13px;font-weight:800}.desktop-nav>a:not(.nav-cta){position:relative}.desktop-nav>a:not(.nav-cta):after{content:'';position:absolute;left:0;right:100%;bottom:-7px;height:2px;background:var(--coral);transition:.3s}.desktop-nav>a:not(.nav-cta):hover:after{right:0}.nav-cta,.button{display:inline-flex;align-items:center;justify-content:center;gap:14px;border-radius:999px;padding:15px 22px;font-weight:900;letter-spacing:.04em}.nav-cta{background:var(--coral);color:white;box-shadow:0 10px 24px rgba(245,134,104,.25)}.nav-cta i,.button b{font-style:normal}.menu{display:none;border:0;background:none;width:44px;height:44px}.mobile-menu{display:none}.section-wrap{position:relative;margin:0 1.2vw;min-height:720px;overflow:hidden;border-radius:0 0 var(--radius) var(--radius)}.hero{min-height:100svh;background:linear-gradient(180deg,#73c7e8 0%,#8fd4eb 65%,#fff8ea 100%);display:flex;align-items:center;justify-content:center;padding:110px 7% 60px}.hero-copy{text-align:center;position:relative;z-index:12;max-width:1000px}.eyebrow{font-size:10px;font-weight:900;letter-spacing:.25em;text-transform:uppercase}.hero .eyebrow{color:white;margin-bottom:10px}.dance-title{margin:0;display:flex;flex-direction:column;align-items:center;font-family:'Baloo 2',sans-serif;font-weight:800;line-height:.84;letter-spacing:-.025em}.dance-title > span{display:block;white-space:nowrap}.title-line{font-size:clamp(52px,6.8vw,100px);text-shadow:0 5px 0 rgba(255,255,255,.75);animation:titleFloat 4.5s ease-in-out infinite}.title-small{font-size:clamp(18px,2.1vw,30px);letter-spacing:.22em;line-height:1;margin:10px 0;color:white;text-shadow:0 3px 0 rgba(18,63,98,.1)}.coral{color:var(--coral)}.navy{color:var(--navy)}.yellow{color:var(--yellow)}.hero-lede{font-size:17px;line-height:1.4;font-weight:700;color:var(--navy);margin:22px 0 18px}.hero-lede strong{color:var(--coral);font-size:21px}.hero-actions{display:flex;justify-content:center;gap:12px}.button{font-size:12px}.button.primary{background:var(--coral);color:white;box-shadow:0 13px 25px rgba(245,134,104,.3);transition:.25s}.button.primary:hover{transform:translateY(-5px) rotate(-1deg)}.button.light{background:rgba(255,255,255,.68);color:var(--navy);border:1px solid rgba(18,63,98,.1)}.hero-char{position:absolute;z-index:10;bottom:22px;left:50%;transform:translateX(-50%);height:315px;width:220px;pointer-events:none}.hero-char img{height:100%;width:100%;object-fit:contain;position:relative;z-index:2;animation:charBob 4s ease-in-out infinite;filter:drop-shadow(0 22px 18px rgba(18,63,98,.18))}.char-glow{position:absolute;width:230px;height:230px;border-radius:50%;left:50%;top:90px;transform:translateX(-50%);background:rgba(255,255,255,.28);box-shadow:0 0 0 24px rgba(255,255,255,.08),0 0 90px rgba(255,255,255,.3)}.hero-cloud{position:absolute;background:white;opacity:.7;border-radius:100px}.hero-cloud:before,.hero-cloud:after{content:'';position:absolute;background:inherit;border-radius:50%}.hero-cloud.c1{width:180px;height:52px;left:4%;top:15%}.hero-cloud.c1:before{width:80px;height:80px;left:25px;top:-42px}.hero-cloud.c1:after{width:60px;height:60px;right:20px;top:-28px}.hero-cloud.c2{width:150px;height:44px;right:3%;top:20%}.hero-cloud.c2:before{width:62px;height:62px;left:25px;top:-34px}.hero-cloud.c2:after{width:50px;height:50px;right:18px;top:-25px}.hero-sun{position:absolute;right:12%;top:12%;width:90px;height:90px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 20px rgba(255,209,91,.16)}.hero-star{position:absolute;font-size:36px;color:white}.s1{left:17%;top:30%}.s2{right:21%;top:33%}.float-widget{position:absolute;z-index:20;border-radius:999px;display:flex;align-items:center;gap:8px;font-weight:900;box-shadow:var(--shadow);animation:floatWidget 4s ease-in-out infinite}.w1{left:10%;bottom:24%;background:var(--coral);color:white;padding:14px 18px;transform:rotate(-8deg)}.w1 i{font-style:normal}.w2{right:9%;bottom:30%;background:var(--yellow);padding:13px 18px;color:var(--navy);transform:rotate(7deg);animation-delay:1s}.w3{right:12%;bottom:20%;background:white;padding:11px 17px;color:var(--coral);transform:rotate(-4deg);animation-delay:2s}.w3 i{font-size:9px;letter-spacing:.08em}.bubble{position:absolute;border:2px solid rgba(255,255,255,.55);border-radius:50%;animation:bubbleUp 7s linear infinite}.b1{width:18px;height:18px;left:18%;bottom:20%}.b2{width:30px;height:30px;right:23%;bottom:15%;animation-delay:2s}.b3{width:12px;height:12px;left:26%;bottom:28%;animation-delay:4s}.b4{width:24px;height:24px;right:16%;top:44%;animation-delay:1s}.sticker{position:absolute;z-index:22;border-radius:20px;padding:12px 16px;background:white;color:var(--coral);font-size:10px;font-weight:900;line-height:1.1;box-shadow:var(--shadow);transform:rotate(-7deg);animation:stickerFloat 3.8s ease-in-out infinite}.sticker strong{font-size:14px}.sticker-a{left:27%;bottom:31%}.sticker-b{right:28%;bottom:33%;background:var(--yellow);color:var(--navy);transform:rotate(6deg);animation-delay:1.3s}.hero-bottom{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);font-size:9px;font-weight:900;letter-spacing:.2em;color:var(--navy);display:flex;gap:10px;align-items:center}.scroll-arrow{font-size:17px;animation:nudge 1.2s infinite}.ticker{height:72px;background:var(--navy);color:white;overflow:hidden;display:flex;align-items:center;transform:rotate(-1deg) scale(1.02);margin:8px 0 30px}.ticker-track{display:flex;gap:28px;white-space:nowrap;font:800 25px 'Baloo 2';letter-spacing:.06em;animation:marquee 22s linear infinite}.ticker-track b{color:var(--yellow)}.story{background:var(--paper);display:grid;grid-template-columns:.78fr 1.22fr;gap:4%;align-items:center;padding:90px 7%;border-radius:var(--radius);box-shadow:0 15px 60px rgba(18,63,98,.06)}.story-heading{position:relative;z-index:5}.coral-text{color:var(--coral)}h2{font:800 clamp(38px,5.2vw,70px)/.86 'Baloo 2';letter-spacing:-.045em;margin:14px 0 20px}h2 em{font-style:normal;color:var(--coral)}.story-heading p,.grownup-head p,.book-copy p,.lisa-copy p{max-width:500px;color:#53758b;line-height:1.75;font-size:16px}.mini-note{font-weight:900;color:var(--navy);margin-top:22px}.story-scene{height:470px;position:relative;border-radius:46px;overflow:hidden;background:#8ed4ea;box-shadow:var(--shadow);transform:rotate(1.2deg)}.scene-sky{position:absolute;inset:0}.scene-sun{position:absolute;width:88px;height:88px;border-radius:50%;background:var(--yellow);right:12%;top:12%;box-shadow:0 0 0 16px rgba(255,209,91,.18)}.scene-cloud{position:absolute;width:130px;height:35px;background:white;border-radius:100px;opacity:.75}.sc1{left:10%;top:16%}.sc2{right:27%;top:30%;transform:scale(.7)}.scene-spark{position:absolute;left:28%;top:30%;color:white;font-size:30px}.scene-ground{position:absolute;bottom:-35px;width:70%;height:230px;border-radius:50% 50% 0 0}.g1{left:-10%;background:#b4df82}.g2{right:-15%;background:#72c85e}.school{position:absolute;width:200px;height:170px;bottom:150px;left:12%;background:#fff1d8;border-radius:20px 20px 0 0;box-shadow:0 10px 0 rgba(18,63,98,.08)}.school:before{content:'';position:absolute;left:-18px;top:-40px;border-left:118px solid transparent;border-right:118px solid transparent;border-bottom:55px solid var(--coral)}.school-sign{position:absolute;top:25px;left:50%;transform:translateX(-50%);background:var(--yellow);padding:7px 13px;border-radius:999px;font-size:9px;font-weight:900}.school-door{position:absolute;bottom:0;left:78px;width:46px;height:80px;background:var(--navy);border-radius:12px 12px 0 0}.window{position:absolute;bottom:48px;width:34px;height:34px;background:#7cc9e5;border:5px solid white;border-radius:8px}.w-a{left:25px}.w-b{right:25px}.scene-character{position:absolute;height:300px;width:170px;bottom:30px;left:54%;z-index:5}.scene-character img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 12px rgba(18,63,98,.18));animation:charBob 4s ease-in-out infinite}.sound-bubble,.safe-badge{position:absolute;z-index:8;background:white;padding:11px 15px;border-radius:999px;font-size:10px;font-weight:900;box-shadow:var(--shadow)}.sb1{left:47%;top:25%;color:var(--coral);transform:rotate(-7deg);animation:popIn 3s infinite}.sb2{right:10%;top:37%;color:var(--navy);transform:rotate(5deg);animation:popIn 3s 1s infinite}.safe-badge{right:7%;bottom:20px;background:var(--yellow);color:var(--navy);text-align:center;line-height:1.1}.safe-badge strong{font-size:13px}.float-word{position:absolute;font:800 38px 'Baloo 2';opacity:.12;pointer-events:none}.fw1{right:8%;top:17%;transform:rotate(10deg)}.fw2{left:4%;bottom:10%;transform:rotate(-9deg)}.orbit{position:absolute;border:2px solid rgba(245,134,104,.16);border-radius:50%;pointer-events:none}.o1{width:230px;height:230px;right:-100px;top:10%}.o2{width:100px;height:100px;left:-30px;bottom:20%}.manifesto{background:var(--yellow);min-height:640px;display:grid;place-items:center;text-align:center;border-radius:var(--radius);margin-top:28px}.manifesto-inner{position:relative;z-index:3}.manifesto h2{font-size:clamp(44px,6.4vw,92px);line-height:.76;display:flex;flex-direction:column;margin:18px 0}.manifesto h2 span{animation:danceWords 4s ease-in-out infinite}.manifesto h2 span:nth-child(2){animation-delay:.25s}.manifesto h2 span:nth-child(3){animation-delay:.5s}.manifesto h2 span:nth-child(4){animation-delay:.75s}.outline{color:transparent!important;-webkit-text-stroke:2px var(--navy)}.outline.coral{-webkit-text-stroke-color:var(--coral)}.manifesto p{font-size:17px;font-weight:700;color:var(--navy)}.burst{position:absolute;font-size:130px;color:rgba(255,255,255,.35);top:10%;right:12%;animation:spinSlow 12s linear infinite}.floating-pill{position:absolute;padding:14px 20px;border-radius:999px;background:white;font-size:10px;font-weight:900;box-shadow:var(--shadow);animation:floatWidget 4s infinite}.fp1{left:10%;top:22%;transform:rotate(-8deg)}.fp2{right:8%;bottom:20%;background:var(--coral);color:white;transform:rotate(6deg);animation-delay:1.4s}.friends{padding:85px 6%;background:var(--paper);margin-top:28px;border-radius:var(--radius)}.friends-top{display:flex;justify-content:space-between;align-items:end}.friends-top h2{margin-bottom:0}.friends-top p{text-align:right;font-weight:800;color:#53758b}.friends-cloud{height:65px;display:flex;align-items:center;gap:50px;overflow:hidden;white-space:nowrap;font:800 28px 'Baloo 2';color:rgba(18,63,98,.12);letter-spacing:.05em}.friend-stage{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.friend-card{height:450px;border-radius:32px;padding:18px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:0 15px 35px rgba(18,63,98,.09);transition:.4s}.friend-card:hover{transform:translateY(-12px) rotate(var(--r));box-shadow:0 25px 45px rgba(18,63,98,.15)}.friend-card.blue{background:#bfe7f3;--r:-1deg}.friend-card.coral{background:#ffd0c3;--r:1deg}.friend-card.yellow{background:#ffe7a0;--r:-1deg}.friend-card.green{background:#d0ebbd;--r:1deg}.card-no,.role{position:absolute;top:18px;font-size:9px;font-weight:900;letter-spacing:.12em}.card-no{left:18px}.role{right:18px;color:var(--coral)}.friend-image{height:315px;display:grid;place-items:end center}.friend-image img{height:100%;max-width:95%;object-fit:contain;filter:drop-shadow(0 12px 8px rgba(18,63,98,.12));transition:.4s}.friend-card:hover .friend-image img{transform:translateY(-10px) scale(1.04)}.friend-card h3{font:800 38px 'Baloo 2';margin:0;letter-spacing:-.02em}.friend-card p{font-size:11px;color:#53758b;margin:0}.card-arrow{position:absolute;right:18px;bottom:22px;font-size:22px}.book{margin-top:28px;background:#8fd4e8;border-radius:var(--radius);display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:6%;padding:90px 9%;min-height:690px}.book-art{position:relative;display:flex;justify-content:center;z-index:3}.book-art img{width:min(390px,90%);max-height:540px;object-fit:contain;filter:drop-shadow(18px 24px 18px rgba(18,63,98,.2));transform:rotate(-5deg);transition:.5s}.book-art:hover img{transform:rotate(0) scale(1.04)}.book-shadow{position:absolute;width:310px;height:65px;background:rgba(18,63,98,.15);filter:blur(25px);bottom:5%;border-radius:50%}.book-copy h2{max-width:700px}.book-chips{display:flex;flex-wrap:wrap;gap:8px;margin:24px 0}.book-chips span{background:white;padding:9px 13px;border-radius:999px;font-size:9px;font-weight:900}.book-doodle{position:absolute;font-weight:900}.bd1{right:7%;top:13%;background:var(--yellow);padding:14px 18px;border-radius:20px;transform:rotate(8deg);box-shadow:var(--shadow);animation:floatWidget 4s infinite}.bd2{left:8%;top:18%;font-size:55px;color:white}.grownups{background:var(--navy);color:white;border-radius:var(--radius);padding:90px 7%;display:grid;grid-template-columns:.8fr 1.2fr;gap:7%;align-items:center;margin-top:28px}.grownup-head p{color:#b9d4e2}.grownup-head h2 em{color:var(--yellow)}.resource-cloud{position:relative;height:470px}.resource-pop{position:absolute;width:230px;height:170px;border-radius:40px;display:flex;flex-direction:column;justify-content:center;padding:24px;box-shadow:0 22px 50px rgba(0,0,0,.18);transition:.4s}.resource-pop:hover{transform:translateY(-12px) rotate(0)!important}.resource-pop small{font-size:9px;font-weight:900;opacity:.6}.resource-pop strong{font:800 25px/.9 'Baloo 2';margin:8px 0}.resource-pop span{font-size:10px;font-weight:900}.r1{background:#bfe7f3;color:var(--navy);left:3%;top:3%;transform:rotate(-4deg)}.r2{background:var(--coral);right:4%;top:12%;transform:rotate(5deg)}.r3{background:var(--yellow);color:var(--navy);left:15%;bottom:2%;transform:rotate(3deg)}.r4{background:#9edb7d;color:var(--navy);right:0;bottom:10%;transform:rotate(-5deg)}.lisa{background:#ffd0c3;display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;padding:80px 8%;border-radius:var(--radius);margin-top:28px;min-height:650px}.giant-l{font:800 46vw/.6 'Baloo 2';color:rgba(255,255,255,.48);align-self:end;line-height:.6}.lisa-copy{position:relative;z-index:4}.lisa-copy h2 em{color:var(--navy)}.lisa-copy .big{font-size:21px;line-height:1.55;color:var(--navy)}.text-link{font-weight:900;font-size:12px;display:inline-flex;gap:14px;align-items:center;border-bottom:2px solid var(--navy);padding-bottom:6px}.author-bubble{position:absolute;background:white;padding:15px 19px;border-radius:22px;font-size:10px;font-weight:900;box-shadow:var(--shadow);animation:floatWidget 4s infinite}.ab1{left:25%;top:20%;transform:rotate(-8deg)}.ab2{left:8%;bottom:20%;background:var(--yellow);transform:rotate(7deg);animation-delay:1s}.join{margin-top:28px;background:var(--sky);display:grid;place-items:center;text-align:center;min-height:590px;border-radius:var(--radius)}.join-inner{position:relative;z-index:4}.join h2 em{color:white}.join p{font-size:16px;color:var(--navy);font-weight:600}.join form{display:flex;max-width:580px;background:white;padding:7px;border-radius:999px;margin:25px auto 0;box-shadow:var(--shadow)}.join input{border:0;outline:0;background:transparent;padding:13px 18px;flex:1;min-width:0;color:var(--navy)}.join button{border:0;background:var(--coral);color:white;padding:13px 20px;border-radius:999px;font-size:10px;font-weight:900;cursor:pointer}.join-pop{position:absolute;font:800 70px 'Baloo 2';color:rgba(255,255,255,.65);animation:floatWidget 4s infinite}.jp1{left:12%;top:22%;transform:rotate(-15deg)}.jp2{right:15%;top:18%;font-size:50px;animation-delay:1s}.jp3{right:10%;bottom:22%;background:var(--yellow);color:var(--navy);font-size:24px;padding:12px 20px;border-radius:999px;transform:rotate(7deg);box-shadow:var(--shadow);animation-delay:2s}footer{background:var(--navy);color:white;margin-top:28px;padding:55px 6%}.footer-inner{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center}.footer-links{display:flex;gap:25px;font-size:12px;font-weight:800}.footer-inner p{grid-column:1/-1;color:#b9d4e2;font-size:11px;margin:0}.footer .logo{color:white}.footer-inner .logo-mark{background:var(--coral)}.reveal{opacity:0;transform:translateY(45px) scale(.98);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}.reveal.in{opacity:1;transform:none}.cursor-pop{position:fixed;width:18px;height:18px;border:2px solid var(--coral);border-radius:50%;pointer-events:none;z-index:200;transform:translate(-50%,-50%);mix-blend-mode:multiply;transition:width .2s,height .2s}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
@keyframes titleFloat{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-7px) rotate(1deg)}}@keyframes charBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-13px)}}@keyframes floatWidget{0%,100%{translate:0 0}50%{translate:0 -14px}}@keyframes stickerFloat{0%,100%{translate:0 0}50%{translate:5px -10px}}@keyframes bubbleUp{0%{transform:translateY(0) scale(.7);opacity:0}20%{opacity:.8}100%{transform:translateY(-250px) scale(1.15);opacity:0}}@keyframes nudge{50%{transform:translateY(5px)}}@keyframes marquee{to{transform:translateX(-50%)}}@keyframes danceWords{0%,100%{transform:translateX(0) rotate(0)}25%{transform:translateX(-5px) rotate(-1deg)}75%{transform:translateX(5px) rotate(1deg)}}@keyframes spinSlow{to{transform:rotate(360deg)}}@keyframes popIn{0%,100%{scale:1}50%{scale:1.08}}@media(max-width:1050px){.friend-stage{grid-template-columns:repeat(2,1fr)}.story,.book,.grownups,.lisa{grid-template-columns:1fr}.story-scene{height:420px}.grownups{padding:75px 7%}.resource-cloud{height:500px}.giant-l{display:none}.lisa{min-height:560px}.desktop-nav{gap:18px}}@media(max-width:700px){.nav{height:68px;padding:0 18px}.desktop-nav{display:none}.menu{display:block}.menu span{display:block;width:23px;height:2px;background:var(--navy);margin:6px auto}.mobile-menu{position:fixed;z-index:80;top:68px;left:12px;right:12px;background:white;border-radius:0 0 25px 25px;display:flex;flex-direction:column;padding:12px;transform:translateY(-130%);transition:.35s;box-shadow:var(--shadow)}.mobile-menu.open{transform:none}.mobile-menu a{padding:15px;border-radius:15px;font-weight:800}.mobile-menu a:hover{background:var(--cream)}.section-wrap{margin:0 8px;border-radius:28px}.hero{padding:95px 16px 55px;min-height:780px}.title-line{font-size:clamp(58px,16vw,105px);letter-spacing:-.06em}.title-small{font-size:22px}.hero-char{height:260px;width:185px;bottom:50px}.hero-lede{font-size:15px}.hero-actions{flex-direction:column;width:210px;margin:auto}.float-widget{scale:.8}.w1{left:3%;bottom:31%}.w2{right:2%;bottom:38%}.w3{right:3%;bottom:25%}.sticker-a{left:4%;bottom:43%}.sticker-b{right:4%;bottom:45%}.hero-cloud.c1{left:-5%}.hero-cloud.c2{right:-8%}.hero-sun{right:8%;top:13%;width:60px;height:60px}.ticker{height:58px}.ticker-track{font-size:20px}.story{padding:60px 25px;gap:35px}.story-heading h2{font-size:42px}.story-scene{height:360px}.school{scale:.7;left:2%;bottom:110px}.scene-character{height:250px;width:140px;left:48%;bottom:25px}.safe-badge{right:4%;bottom:10px}.manifesto{min-height:560px;padding:50px 20px}.manifesto h2{font-size:clamp(38px,11vw,64px)}.floating-pill{scale:.8}.friends{padding:60px 18px}.friends-top{display:block}.friends-top p{text-align:left;margin-top:12px}.friend-stage{grid-template-columns:1fr 1fr;gap:9px}.friend-card{height:335px;border-radius:25px;padding:13px}.friend-image{height:225px}.friend-card h3{font-size:31px}.role,.card-no{top:13px}.role{right:13px}.card-no{left:13px}.card-arrow{right:13px;bottom:14px}.friends-cloud{gap:28px;font-size:21px}.book{padding:55px 24px;min-height:720px}.book-art img{width:270px}.book-copy h2{font-size:42px}.grownups{padding:60px 22px}.grownup-head h2{font-size:42px}.resource-cloud{height:500px}.resource-pop{width:180px;height:145px;border-radius:28px;padding:17px}.resource-pop strong{font-size:20px}.r1{left:0}.r2{right:0}.r3{left:5%;bottom:3%}.r4{right:0;bottom:0}.lisa{padding:60px 25px;min-height:560px}.lisa-copy h2{font-size:44px}.author-bubble{scale:.8}.ab1{left:10%;top:9%}.join{min-height:550px;padding:40px 20px}.join h2{font-size:46px}.join form{flex-direction:column;border-radius:25px;background:rgba(255,255,255,.8)}.join button{width:100%}.footer-inner{grid-template-columns:1fr}.footer-links{flex-wrap:wrap}.footer-inner p{grid-column:auto}}

/* HERO FIX — keep the headline horizontal, readable and separated from Charlie */
.hero-copy{width:min(94vw,980px)}
.dance-title{position:relative;z-index:13}
.dance-title > span{display:block !important;white-space:nowrap}
.dance-title .letter{display:inline-block !important;white-space:pre}
.hero-lede,.hero-actions{position:relative;z-index:14}
.hero-char{z-index:9}
.hero-sticker,.float-widget{z-index:16}
@media (min-width:701px){
  .hero{padding-top:96px;padding-bottom:54px}
  .hero-copy{transform:translateY(-22px)}
  .hero-char{bottom:12px;height:285px;width:200px}
  .hero-lede{margin-top:18px}
}
@media (max-width:700px){
  .dance-title{line-height:.88;letter-spacing:-.02em}
  .title-line{font-size:clamp(42px,12.5vw,74px);letter-spacing:-.025em}
  .title-small{font-size:16px;letter-spacing:.16em;margin:8px 0}
  .hero-copy{transform:none}
  .hero-char{height:245px;width:175px;bottom:36px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal{transition:none}.dance-title span,.ticker-track,.hero-char img,.float-widget,.bubble,.sticker,.manifesto h2 span,.join-pop,.resource-pop,.book-art img{animation:none!important}.cursor-pop{display:none}}


/* NAV LOAD TRANSFORMATION — full-width header settles into a compact rounded pill */
.nav{
  width:calc(100% - 32px);
  max-width:1180px;
  left:50%;
  right:auto;
  transform:translateX(-50%) translateY(-120%);
  top:16px;
  border-radius:999px;
  padding:12px 16px 12px 20px;
  box-shadow:0 12px 38px rgba(18,63,98,.12);
  border:1px solid rgba(255,255,255,.75);
  animation:navSettle .95s cubic-bezier(.16,1,.3,1) .15s forwards;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
@keyframes navSettle{
  0%{transform:translateX(-50%) translateY(-120%) scale(.98);opacity:0}
  55%{transform:translateX(-50%) translateY(7px) scale(1.015);opacity:1}
  78%{transform:translateX(-50%) translateY(-2px) scale(.995)}
  100%{transform:translateX(-50%) translateY(0) scale(1);opacity:1}
}
.nav .logo{transition:transform .35s ease}.nav .logo:hover{transform:translateY(-1px) scale(1.02)}
.nav .desktop-nav{gap:6px}.nav .desktop-nav>a:not(.nav-cta){padding:9px 12px;border-radius:999px;transition:background .25s ease,transform .25s ease}.nav .desktop-nav>a:not(.nav-cta):hover{background:rgba(121,201,234,.16);transform:translateY(-1px)}
.nav .nav-cta{border-radius:999px;padding:11px 18px}
@media(max-width:760px){
 .nav{width:calc(100% - 20px);top:10px;padding:10px 12px 10px 15px}
 .nav .logo small{letter-spacing:.08em}
}
@media(prefers-reduced-motion:reduce){.nav{animation:none;transform:translateX(-50%);opacity:1}}

/* SCROLL MOTION — layered, soft section entrances */
.reveal{
  opacity:0;
  transform:translate3d(0,70px,0) scale(.97) rotateX(3deg);
  transform-origin:center bottom;
  filter:blur(3px);
  transition:
    opacity .85s cubic-bezier(.16,1,.3,1),
    transform 1s cubic-bezier(.16,1,.3,1),
    filter .85s ease;
  transition-delay:var(--reveal-delay,0ms);
  will-change:opacity,transform,filter;
}
.reveal.in{opacity:1;transform:none;filter:none}

/* Give each major section a subtle lift as it enters the viewport. */
.section-wrap{
  view-timeline-name:--section-view;
  view-timeline-axis:block;
}
.story-heading.reveal{--reveal-delay:80ms}
.story-scene.reveal{--reveal-delay:180ms}
.friends-top.reveal{--reveal-delay:60ms}
.friend-card.reveal:nth-child(1){--reveal-delay:80ms}
.friend-card.reveal:nth-child(2){--reveal-delay:150ms}
.friend-card.reveal:nth-child(3){--reveal-delay:220ms}
.friend-card.reveal:nth-child(4){--reveal-delay:290ms}
.book-art.reveal{--reveal-delay:70ms}
.book-copy.reveal{--reveal-delay:190ms}
.grownup-head.reveal{--reveal-delay:80ms}
.lisa-copy.reveal{--reveal-delay:120ms}
.join-inner.reveal{--reveal-delay:100ms}

/* Card motion continues after reveal, keeping the page playful rather than static. */
.friend-card.in{animation:cardSettle .9s cubic-bezier(.16,1,.3,1) both}
.friend-card.in:nth-child(2){animation-delay:.06s}
.friend-card.in:nth-child(3){animation-delay:.12s}
.friend-card.in:nth-child(4){animation-delay:.18s}
@keyframes cardSettle{
  0%{opacity:0;transform:translateY(55px) rotate(2deg) scale(.94)}
  65%{opacity:1;transform:translateY(-6px) rotate(-.5deg) scale(1.01)}
  100%{opacity:1;transform:none}
}

.manifesto-inner h2 span{
  opacity:0;
  transform:translateX(-35px) scale(.96);
  transition:opacity .7s ease,transform .8s cubic-bezier(.16,1,.3,1);
}
.manifesto-inner.in h2 span{opacity:1;transform:none}
.manifesto-inner.in h2 span:nth-child(1){transition-delay:.05s}
.manifesto-inner.in h2 span:nth-child(2){transition-delay:.13s}
.manifesto-inner.in h2 span:nth-child(3){transition-delay:.21s}
.manifesto-inner.in h2 span:nth-child(4){transition-delay:.29s}

.book-art img{transition:transform 1s cubic-bezier(.16,1,.3,1);}
.book-art.in img{transform:rotate(-2deg) translateY(-8px) scale(1.035)}
.resource-pop.reveal.in:nth-child(odd){transform:translateY(-4px) rotate(-1deg)}
.resource-pop.reveal.in:nth-child(even){transform:translateY(-4px) rotate(1deg)}

/* Small ambient movement tied to scroll position. */
[data-scroll-float]{--scroll-y:0px;transform:translate3d(0,var(--scroll-y),0)}

@media(max-width:700px){
  .reveal{transform:translate3d(0,48px,0) scale(.985);filter:blur(2px)}
}
@media(prefers-reduced-motion:reduce){
  .reveal,.manifesto-inner h2 span{opacity:1;transform:none;filter:none;transition:none!important}
  .friend-card.in{animation:none!important}
}

/* STACKED SECTION SCROLL — clean layered cards */
/* Each major section occupies real document space. As the next section reaches
   the sticky top, it naturally slides over the previous section instead of
   crushing the content into a thin overlapping strip. */
@media (min-width:701px){
  .section-wrap{
    position:sticky;
    top:18px;
    margin-bottom:28px;
    isolation:isolate;
    box-shadow:0 22px 70px rgba(18,63,98,.10);
    min-height:calc(100svh - 36px);
    overflow:hidden;
  }
  .hero{z-index:1}
  .story{z-index:2}
  .manifesto{z-index:3}
  .friends{z-index:4}
  .book{z-index:5}
  .bookshelf{z-index:6}
  .grownups{z-index:7}
  .lisa{z-index:8}
  .join{z-index:9}
  .ticker{position:relative;z-index:20}
}
@media (max-width:700px){
  .section-wrap{
    position:sticky;
    top:10px;
    margin-bottom:18px;
    isolation:isolate;
    box-shadow:0 18px 55px rgba(18,63,98,.10);
    min-height:calc(100svh - 20px);
    overflow:hidden;
  }
  .hero{z-index:1}
  .story{z-index:2}
  .manifesto{z-index:3}
  .friends{z-index:4}
  .book{z-index:5}
  .bookshelf{z-index:6}
  .grownups{z-index:7}
  .lisa{z-index:8}
  .join{z-index:9}
  .ticker{position:relative;z-index:20}
}

/* Subtle depth while cards are being covered. No abrupt jumps. */
.section-wrap{
  transform:translateZ(0);
  backface-visibility:hidden;
  will-change:transform;
}
.section-wrap:not(.hero){
  scroll-margin-top:18px;
}
@media(prefers-reduced-motion:reduce){
  .section-wrap{will-change:auto}
}

/* The transform is intentionally tiny; it preserves the clean pile instead of
   making the incoming card jump or squash the one underneath it. */
.section-wrap{
  transform:translate3d(0,var(--stack-y,0px),0) scale(var(--stack-scale,1));
}

/* ONE-SECTION-AT-A-TIME SCROLL — desktop wheel navigation */
@media (min-width: 701px){
  html.section-step-scroll{scroll-behavior:smooth}
}
@media (prefers-reduced-motion: reduce){
  html.section-step-scroll{scroll-behavior:auto}
}

/* Lisa Daisy Field logo update */
.logo-image{
  display:flex;
  align-items:center;
  width:auto;
  height:64px;
  padding:4px 0;
}
.logo-image img{
  display:block;
  width:auto;
  height:56px;
  max-width:220px;
  object-fit:contain;
}
@media (max-width:700px){
  .logo-image{height:52px}
  .logo-image img{height:46px;max-width:175px}
}


/* Lisa Daisy Field logo in footer */
.footer-logo-image{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:0 0 18px;
}
.footer-logo-image img{
  display:block;
  width:auto;
  height:72px;
  max-width:240px;
  object-fit:contain;
}
@media (max-width:700px){
  .footer-logo-image img{
    height:58px;
    max-width:200px;
  }
}

/* FINAL logo sizing guard — prevents any global img rules from enlarging the brand logo */
header.nav .logo.logo-image{
  display:flex!important;
  width:180px!important;
  height:58px!important;
  max-width:180px!important;
  max-height:58px!important;
  overflow:hidden!important;
  flex:0 0 auto!important;
}
header.nav .logo.logo-image img{
  display:block!important;
  width:180px!important;
  height:58px!important;
  max-width:180px!important;
  max-height:58px!important;
  min-width:0!important;
  min-height:0!important;
  object-fit:contain!important;
}
footer .footer-logo-image{
  display:inline-flex!important;
  width:220px!important;
  height:72px!important;
  max-width:220px!important;
  max-height:72px!important;
  overflow:hidden!important;
}
footer .footer-logo-image img{
  display:block!important;
  width:220px!important;
  height:72px!important;
  max-width:220px!important;
  max-height:72px!important;
  min-width:0!important;
  min-height:0!important;
  object-fit:contain!important;
}
@media (max-width:700px){
  header.nav .logo.logo-image{
    width:145px!important;height:48px!important;max-width:145px!important;max-height:48px!important;
  }
  header.nav .logo.logo-image img{
    width:145px!important;height:48px!important;max-width:145px!important;max-height:48px!important;
  }
  footer .footer-logo-image,
  footer .footer-logo-image img{
    width:180px!important;height:58px!important;max-width:180px!important;max-height:58px!important;
  }
}

/* Meet Lisa biography and linked shop section */
.lisa{grid-template-columns:.72fr 1.28fr;gap:4%;padding:76px 7%;min-height:unset;}
.lisa-copy{max-width:790px;}
.lisa-copy p{max-width:100%;font-size:15px;line-height:1.78;margin:0 0 16px;color:#254f66;}
.lisa-copy .big{font-size:18px;font-weight:700;line-height:1.6;}
.lisa-copy blockquote{position:relative;margin:22px 0;padding:20px 24px 20px 28px;border-left:5px solid var(--coral);border-radius:0 18px 18px 0;background:rgba(255,253,247,.7);color:var(--navy);font:700 clamp(18px,2vw,25px)/1.45 'Baloo 2',sans-serif;}
.lisa-copy blockquote:before{content:'“';position:absolute;left:9px;top:-8px;color:var(--coral);font-size:42px;opacity:.45;}
.shop{margin-top:28px;padding:78px 7%;border-radius:var(--radius);background:linear-gradient(135deg,#fff4d5 0%,#f8e4d7 48%,#e3f1df 100%);min-height:unset;overflow:visible;}
.shop-heading{text-align:center;max-width:680px;margin:0 auto 34px;}
.shop-heading h2{font-size:clamp(44px,5.5vw,72px);}
.shop-heading p{color:#53758b;line-height:1.7;font-size:16px;max-width:560px;margin:0 auto;}
.shop-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;}
.shop-card{position:relative;min-width:0;overflow:hidden;display:flex;flex-direction:column;border:1px solid rgba(54,66,55,.1);border-radius:23px;background:#fffdf7;box-shadow:0 12px 28px rgba(45,58,49,.09);transition:transform .28s ease,box-shadow .28s ease;}
.shop-card:hover{transform:translateY(-7px) rotate(-.4deg);box-shadow:0 20px 36px rgba(45,58,49,.15);}
.shop-product-image{position:relative;display:grid;place-items:center;height:220px;overflow:hidden;background:#fff;}
.shop-product-image img{width:100%;height:100%;object-fit:contain;padding:15px;transition:transform .35s ease;}
.shop-card:hover .shop-product-image img{transform:scale(1.055) rotate(1deg);}
.shop-art{width:100%;height:100%;display:grid;place-items:center;font-size:76px;color:var(--navy);text-shadow:3px 3px rgba(255,255,255,.55);}
.art-one{background:#ffe1a0;color:#ee735b;}.art-two{background:#c5eaf3;color:#3988ba;}.art-three{background:#f8cfc4;color:#e36c54;}.art-four{background:#dcebcf;color:#669c68;}
.shop-badge{position:absolute;left:12px;top:12px;padding:7px 10px;border-radius:99px;background:var(--yellow);color:var(--navy);font-size:9px;line-height:1;font-weight:900;letter-spacing:.08em;}
.shop-card-copy{display:flex;flex:1;flex-direction:column;align-items:flex-start;padding:16px 17px 18px;}
.shop-card h3{margin:0 0 10px;color:var(--navy);font:800 19px/1.25 'Baloo 2',sans-serif;}
.shop-price{margin:0 0 14px;color:var(--coral);font-size:17px;font-weight:900;}
.shop-description{margin:0 0 14px;color:#638092;font-size:13px;line-height:1.5;}
.shop-buy{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;margin-top:auto;padding:12px 15px;border-radius:99px;background:var(--coral);color:#fff;font-size:10px;font-weight:900;letter-spacing:.06em;transition:background .2s ease,transform .2s ease;}
.shop-buy:hover{background:#dc4e42;color:#fff;transform:translateY(-2px);}
.shop-buy span{font-size:16px;}
.shop-bottom{display:flex;justify-content:center;margin-top:30px;}
.shop-bottom .button{font-size:11px;}
.nav .desktop-nav{gap:clamp(10px,1.5vw,24px);}
@media(max-width:1050px){.shop-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.lisa{grid-template-columns:1fr;}.lisa .giant-l{display:none;}}
@media(max-width:700px){.lisa{padding:55px 23px;}.lisa-copy p{font-size:14px;}.lisa-copy .big{font-size:16px;}.lisa-copy blockquote{padding:17px 17px 17px 24px;font-size:20px;}.shop{padding:55px 17px;}.shop-grid{gap:12px;}.shop-product-image{height:155px;}.shop-card{border-radius:17px;}.shop-card-copy{padding:12px 11px 13px;}.shop-card h3{font-size:16px;}.shop-buy{font-size:9px;padding:11px 10px;}.shop-art{font-size:58px;}.shop-badge{font-size:8px;left:8px;top:8px;padding:6px 8px;}.shop-heading p{font-size:14px;}}


/* FIX: natural document flow prevents sticky sections from overlapping and clipping. */
@media (min-width:701px) {
  .section-wrap { position:relative; top:auto; margin-bottom:28px; min-height:0; transform:none; will-change:auto; }
}
@media (max-width:700px) {
  .section-wrap { position:relative; top:auto; margin-bottom:18px; min-height:0; transform:none; will-change:auto; }
}
.section-wrap:not(.hero) { scroll-margin-top:90px; }
.hero { min-height:100svh; }
.friends, .story, .manifesto, .book, .bookshelf, .grownups, .lisa, .join { overflow:visible; }
@media (max-width:700px) {
  .friends, .story, .manifesto, .book, .grownups, .lisa, .join { overflow:hidden; }
}


/* FIX: keep character names visible and restore controlled section-pile motion. */
@media (min-width:701px){
  .section-wrap{position:sticky;top:12px;margin-bottom:24px;min-height:calc(100svh - 24px);height:auto;transform:none;will-change:auto;isolation:isolate;}
  .hero{z-index:1}.story{z-index:2}.manifesto{z-index:3}.friends{z-index:4}.book{z-index:5}.bookshelf{z-index:6}.grownups{z-index:7}.lisa{z-index:8}.join{z-index:9}
  .friends{padding-top:36px;padding-bottom:26px;}
  .friend-card{height:390px;}
  .friend-image{height:245px;flex:0 0 245px;}
  .friend-card h3{font-size:34px;line-height:1.05;margin-top:4px;}
  .friend-card p{font-size:12px;line-height:1.4;margin-top:4px;}
}
@media (max-width:700px){
  .section-wrap{position:relative;top:auto;margin-bottom:18px;min-height:0;height:auto;transform:none;will-change:auto;}
  .friends{padding-bottom:34px;}
  .friend-card{height:335px;}
  .friend-image{height:205px;flex:0 0 205px;}
  .friend-card h3{font-size:27px;line-height:1.05;}
  .friend-card p{font-size:10px;line-height:1.35;}
}


/* FINAL FIX: keep character artwork inside its own area and names fully visible. */
@media (min-width:701px) {
  .friend-card {
    height: 300px !important;
    min-height: 300px;
    padding: 14px !important;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 8px;
    overflow: hidden;
  }
  .friend-card .friend-image {
    order: 0;
    flex: 1 1 auto !important;
    height: auto !important;
    min-height: 0;
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    overflow: hidden;
  }
  .friend-card .friend-image img {
    display: block;
    height: 100%;
    width: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center bottom;
    transform: none !important;
  }
  .friend-card > div:not(.friend-image) {
    position: relative;
    z-index: 3;
    flex: 0 0 auto;
    width: 100%;
    min-width: 0;
    overflow: visible;
  }
  .friend-card h3 {
    display: block;
    position: relative;
    z-index: 3;
    margin: 0 0 3px !important;
    font-size: clamp(19px, 1.8vw, 26px) !important;
    line-height: 1.12 !important;
    overflow-wrap: anywhere;
    white-space: normal;
  }
  .friend-card p {
    position: relative;
    z-index: 3;
    margin: 0 !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    overflow-wrap: anywhere;
  }
}
@media (max-width:700px) {
  .friend-card {
    height: 355px !important;
    min-height: 355px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    overflow: hidden;
  }
  .friend-card .friend-image {
    flex: 1 1 auto !important;
    height: auto !important;
    min-height: 0;
    overflow: hidden;
  }
  .friend-card .friend-image img {
    height: 100%;
    width: auto;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    object-position: center bottom;
    transform: none !important;
  }
  .friend-card > div:not(.friend-image) {
    position: relative;
    z-index: 3;
    flex: 0 0 auto;
    width: 100%;
    overflow: visible;
  }
  .friend-card h3 {
    font-size: clamp(22px, 6vw, 27px) !important;
    line-height: 1.12 !important;
    overflow-wrap: anywhere;
  }
  .friend-card p {
    font-size: 10px !important;
    line-height: 1.35 !important;
    overflow-wrap: anywhere;
  }
}

/* Image replacements requested: full school illustration and Lisa's author portrait */
.story-scene .scene-illustration{position:absolute;inset:0;left:0;bottom:0;width:100%;height:100%;z-index:5;display:flex;align-items:flex-end;justify-content:center;pointer-events:none;}
.story-scene .scene-illustration img{display:block;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 14px 16px rgba(28,62,86,.12));}
.story-scene:has(.scene-illustration) .school,.story-scene:has(.scene-illustration) .scene-sky,.story-scene:has(.scene-illustration) .scene-ground,.story-scene:has(.scene-illustration) .sound-bubble,.story-scene:has(.scene-illustration) .safe-badge{display:none!important;}
.lisa{grid-template-columns:minmax(280px,.78fr) minmax(0,1.22fr);gap:clamp(30px,5vw,76px);}
.author-portrait{position:relative;z-index:2;align-self:center;min-height:0;width:100%;display:flex;align-items:center;justify-content:center;overflow:visible;}
.author-portrait:before{content:"";position:absolute;inset:2% 7% 2% 3%;background:#fff8ed;border:10px solid rgba(255,253,247,.95);border-radius:48% 48% 42% 42% / 35% 35% 50% 50%;transform:rotate(-3deg);box-shadow:0 20px 55px rgba(34,68,86,.12);}
.author-portrait img{position:relative;z-index:1;display:block;width:min(100%,470px);height:auto;max-height:none;object-fit:contain;object-position:center;border-radius:28px;box-shadow:0 18px 40px rgba(30,66,89,.15);}
.lisa .ab1{left:4%;top:10%;z-index:3}.lisa .ab2{left:auto;right:48%;bottom:8%;z-index:3}
@media(max-width:1050px){.lisa{grid-template-columns:1fr;}.author-portrait{min-height:0}.author-portrait img{height:auto;width:min(100%,440px);max-height:none;}.lisa .ab1{left:6%;top:3%}.lisa .ab2{right:3%;bottom:1%}}
@media(max-width:700px){.story-scene .scene-illustration img{object-fit:contain;object-position:center bottom}.author-portrait{min-height:0}.author-portrait img{height:auto;width:min(100%,340px);max-height:none;}.lisa .ab2{right:0;bottom:0}}

/* FINAL AUTHOR PHOTO POSITIONING FIX: keep Lisa fully visible and centered */
.lisa .author-portrait {
  width: min(100%, 500px) !important;
  height: min(74vh, 780px) !important;
  min-height: 520px !important;
  margin-inline: auto !important;
  align-self: center !important;
  justify-self: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: visible !important;
}
.lisa .author-portrait img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  margin: 0 auto !important;
}
@media (max-width: 1050px) {
  .lisa .author-portrait {
    width: min(100%, 440px) !important;
    height: min(68vh, 700px) !important;
    min-height: 480px !important;
  }
}
@media (max-width: 700px) {
  .lisa .author-portrait {
    width: min(100%, 350px) !important;
    height: min(65vh, 590px) !important;
    min-height: 400px !important;
  }
}

.author-portrait.reveal.in {
    margin-top: -276px;
}

/* BOOKS MEGA MENU */
.nav-books{position:relative}
.nav-books-trigger{background:none;border:0;cursor:pointer;font:inherit;font-size:13px;font-weight:800;color:inherit;display:inline-flex;align-items:center;gap:5px;padding:9px 12px;border-radius:999px;transition:background .25s ease,transform .25s ease}
.nav-books-trigger:hover{background:rgba(121,201,234,.16);transform:translateY(-1px)}
.nav-books-trigger i{font-style:normal;font-size:9px;transition:transform .25s ease}
.nav-books:hover .nav-books-trigger i,.nav-books.open .nav-books-trigger i{transform:rotate(180deg)}
.mega-panel{position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%) translateY(8px);width:min(620px,86vw);background:var(--paper);border-radius:28px;padding:24px;box-shadow:0 30px 60px rgba(18,63,98,.22);border:1px solid rgba(18,63,98,.08);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease,transform .25s ease,visibility .25s;z-index:120}
.nav-books:hover .mega-panel,.nav-books.open .mega-panel,.nav-books:focus-within .mega-panel{opacity:1;visibility:visible;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.mega-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.mega-book{display:flex;flex-direction:column;gap:8px;text-align:left;padding:10px;border-radius:18px;transition:background .25s ease,transform .25s ease}
.mega-book:hover{background:rgba(121,201,234,.14);transform:translateY(-3px)}
.mega-cover{position:relative;display:block;width:100%;aspect-ratio:3/4.2;border-radius:8px 12px 12px 8px;overflow:hidden;box-shadow:0 10px 18px rgba(18,63,98,.18)}
.mega-cover img{width:100%;height:100%;object-fit:cover;display:block}
.mega-cover.placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:10px;gap:6px}
.mega-cover .cover-mark{font-size:18px;color:var(--navy)}
.mega-cover .cover-title{font:800 11px/1.2 'Baloo 2',sans-serif;color:var(--navy)}
.mega-tag{position:absolute;top:6px;right:6px;font-size:7px;font-weight:900;letter-spacing:.06em;padding:4px 7px;border-radius:999px;background:white;color:var(--navy);box-shadow:0 4px 10px rgba(18,63,98,.18)}
.mega-tag.soon{background:var(--navy);color:white}
.mega-tag.out{background:var(--coral);color:white}
.mega-book-title{font:800 12px/1.25 'Baloo 2',sans-serif;color:var(--navy)}
.mega-book-sub{font-size:9px;color:#53758b;font-weight:700}
.mega-all{display:block;margin-top:16px;text-align:center;font-size:11px;font-weight:900;color:var(--coral)}
.mobile-menu-label{padding:14px 15px 4px;font-size:9px;font-weight:900;letter-spacing:.16em;color:#8aa3b3;text-transform:uppercase}
@media(max-width:1050px){.mega-panel{left:auto;right:0;transform:translateY(8px)}.nav-books:hover .mega-panel,.nav-books.open .mega-panel,.nav-books:focus-within .mega-panel{transform:translateY(0)}}

/* Hero -> latest release connector card */
.hero-latest-link{display:inline-flex;align-items:center;gap:12px;margin-top:18px;padding:8px 18px 8px 8px;background:rgba(255,255,255,.75);border-radius:999px;position:relative;z-index:14;transition:background .25s ease,transform .25s ease}
.hero-latest-link:hover{background:rgba(255,255,255,.92);transform:translateY(-2px)}
.hero-latest-thumb{width:40px;height:52px;border-radius:5px 8px 8px 5px;overflow:hidden;box-shadow:0 6px 12px rgba(18,63,98,.22);flex:0 0 auto}
.hero-latest-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.hero-latest-copy{display:flex;flex-direction:column;gap:2px;text-align:left;font-size:12px;font-weight:800;color:var(--navy)}
.hero-latest-copy b{font-size:8px;font-weight:900;letter-spacing:.12em;color:var(--coral)}
.hero-latest-link>i{font-style:normal;color:var(--navy);font-size:16px}
@media(max-width:700px){.hero-latest-link{margin:14px auto 0;max-width:300px}.hero-latest-copy{font-size:11px}}

/* BOOKSHELF SECTION */
.bookshelf{background:var(--paper);padding:36px 6% 26px;border-radius:var(--radius);margin-top:28px}
.bookshelf-head{text-align:center;max-width:620px;margin:0 auto 18px}
.bookshelf-head p{color:#53758b;font-size:16px;line-height:1.7}
.shelf{position:relative;padding-bottom:16px}
.shelf-row{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:end;position:relative;z-index:2}
.shelf-book{max-width:160px;margin:0 auto;width:100%}
.shelf-plank{position:absolute;left:-1.5%;right:-1.5%;bottom:0;height:26px;background:linear-gradient(180deg,#c98a52,#a86a37);border-radius:10px;box-shadow:0 18px 30px rgba(18,63,98,.18),inset 0 3px 0 rgba(255,255,255,.25);z-index:1}
.shelf-plank:before{content:'';position:absolute;inset:0;background-image:repeating-linear-gradient(90deg,rgba(0,0,0,.08) 0 2px,transparent 2px 30px);border-radius:inherit}
.shelf-book{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;transition:transform .4s cubic-bezier(.2,.8,.2,1)}
.shelf-book:hover{transform:translateY(-14px) rotate(-1.5deg)}
.book-cover{position:relative;display:block;width:100%;aspect-ratio:3/3.5;border-radius:10px 16px 16px 10px;overflow:hidden;box-shadow:8px 14px 0 rgba(18,63,98,.08),0 20px 30px rgba(18,63,98,.18)}
.book-cover:before{content:'';position:absolute;left:0;top:0;bottom:0;width:10px;background:rgba(0,0,0,.14);z-index:2}
.book-cover img{width:100%;height:100%;object-fit:cover;display:block}
.book-cover.placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:18px;gap:10px}
.book-cover.placeholder .cover-mark{font-size:28px;color:var(--navy)}
.book-cover.placeholder .cover-title{font:800 19px/1.15 'Baloo 2',sans-serif;color:var(--navy)}
.cover-yellow{background:linear-gradient(160deg,#ffe08a,#ffd15b)}
.cover-green{background:linear-gradient(160deg,#c6ecab,#9edb7d)}
.cover-blue{background:linear-gradient(160deg,#bfe7f3,#79c9ea)}
.cover-outline{background:var(--paper);border:2.5px dashed rgba(18,63,98,.28)}
.cover-outline .cover-mark{font-size:34px;color:rgba(18,63,98,.4)}
.cover-outline .cover-title{color:rgba(18,63,98,.55)}
.shelf-tag{position:absolute;top:10px;right:10px;z-index:3;font-size:8px;font-weight:900;letter-spacing:.08em;padding:6px 10px;border-radius:999px;background:white;color:var(--navy);box-shadow:var(--shadow)}
.shelf-tag.soon{background:var(--navy);color:white}
.shelf-tag.out{background:var(--coral);color:white}
.shelf-book h3{font:800 15px/1.15 'Baloo 2',sans-serif;margin:10px 0 4px;color:var(--navy)}
.shelf-book p{font-size:10px;line-height:1.4;color:#53758b;margin:0 0 4px;max-width:190px}
.shelf-meta{font-size:8px;font-weight:900;letter-spacing:.06em;color:var(--coral);text-transform:uppercase}
.shelf-cta{margin-top:6px;font-size:9px;font-weight:900;color:var(--navy)}
.shelf-book-next .book-cover{box-shadow:none}
@media(max-width:1050px){.shelf-row{grid-template-columns:repeat(2,1fr);gap:24px 20px}.shelf-plank{display:none}}
@media(max-width:700px){.bookshelf{padding:60px 20px 40px}.bookshelf-head p{font-size:14px}.shelf-row{grid-template-columns:repeat(2,1fr);gap:20px 14px}.shelf-book h3{font-size:16px}.shelf-book p{font-size:11px}}

/* PILE FIT — sections already auto-grow past the viewport-height floor to
   fit their content (min-height + height:auto + overflow:visible), so
   nothing is clipped by the sticky pile; this just trims the bio text a
   touch to match the smaller headings above. */
@media (min-width:701px){
  .lisa-copy .big{font-size:18px;}
  .lisa-copy p{font-size:14px;line-height:1.7;}
}

/* Lisa's bio is long-form text that a short screen can't show in one pinned
   card without gutting it. It keeps a higher z-index so it still visually
   slides up and covers Grown-Ups like every other card, but it's taken out
   of the sticky pin itself so the whole biography scrolls and stays
   readable; Join still piles over it normally afterwards. */
@media (min-width:701px){
  .lisa{position:relative;top:auto;z-index:8;}
}

/* ===== MULTI-PAGE SITE ADDITIONS ===== */
.nav .desktop-nav>a.active{background:rgba(121,201,234,.28)}
.mobile-menu a.active{background:var(--cream)}
.coral-bg{background:var(--coral)}
.cover-coral{background:linear-gradient(160deg,#ffc3b3,#f58668)}

/* Home: simplified hero + new sections keep their place in the pile */
.hero .hero-copy{transform:none}
.story-link{margin-top:22px}
.explore{z-index:4;background:var(--paper);padding:80px 6%;border-radius:var(--radius);margin-top:28px}
.shop{z-index:5}
.explore-head{margin-bottom:26px}
.explore-head h2{margin-bottom:0}
.explore-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.explore-card{position:relative;display:flex;flex-direction:column;min-height:360px;padding:18px;border-radius:28px;overflow:hidden;transition:transform .35s ease,box-shadow .35s ease}
.explore-card:hover{transform:translateY(-8px);box-shadow:0 22px 40px rgba(18,63,98,.14)}
.explore-card.blue{background:#bfe7f3}.explore-card.yellow{background:#ffe7a0}.explore-card.green{background:#d0ebbd}.explore-card.coral{background:#ffd0c3}
.explore-img{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;height:170px;margin-bottom:12px}
.explore-img img{max-height:100%;max-width:100%;object-fit:contain}
.explore-img img.round{height:150px;width:150px;object-fit:cover;object-position:center top;border-radius:50%;border:6px solid #fffdf7}
.explore-mark{font-size:84px;color:var(--coral)}
.explore-card h3{font:800 26px/1.05 'Baloo 2',sans-serif;margin:0 0 6px}
.explore-card p{margin:0 0 14px;font-size:13px;line-height:1.5;color:#3f6479}
.explore-go{margin-top:auto;font-size:11px;font-weight:900;letter-spacing:.05em}

/* Inner pages: normal flow, no sticky pile */
body.inner .section-wrap{position:relative!important;top:auto!important;min-height:0!important;margin-bottom:24px;overflow:hidden}
body.inner .section-wrap:not(.page-hero){margin-top:0}
body.inner main{padding-top:0}
.page-hero{padding:150px 7% 80px;text-align:center;border-radius:0 0 var(--radius) var(--radius);display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,#73c7e8 0%,#a9dcef 70%,#fff8ea 100%)}
.page-hero.ph-yellow{background:linear-gradient(180deg,#ffd15b 0%,#ffe08a 70%,#fff8ea 100%)}
.page-hero.ph-green{background:linear-gradient(180deg,#9edb7d 0%,#c6ecab 70%,#fff8ea 100%)}
.page-hero.ph-coral{background:linear-gradient(180deg,#f58668 0%,#ffc3b3 70%,#fff8ea 100%)}
.page-hero-inner{position:relative;z-index:3;max-width:860px}
.page-hero .eyebrow{color:var(--navy);opacity:.75}
.page-title{font:800 clamp(46px,7vw,96px)/.9 'Baloo 2',sans-serif;letter-spacing:-.035em;margin:12px 0 18px;color:var(--navy)}
.page-title em{font-style:normal;color:var(--coral)}
.ph-coral .page-title em{color:#fff}
.page-lede{font-size:18px;line-height:1.55;font-weight:700;color:var(--navy);margin:0}

/* What makes Charlie */
.makes{background:var(--paper);display:grid;grid-template-columns:.8fr 1.2fr;gap:5%;align-items:center;padding:70px 7%;border-radius:var(--radius)}
.makes-art{position:relative;display:flex;justify-content:center;align-items:flex-end;min-height:420px}
.makes-blob{position:absolute;inset:6% 6% 0;background:#bfe7f3;border-radius:46% 54% 48% 52%/52% 46% 54% 48%}
.makes-art img{position:relative;height:430px;max-width:100%;object-fit:contain;filter:drop-shadow(0 18px 14px rgba(18,63,98,.16))}
.makes-copy p{max-width:560px;color:#53758b;line-height:1.75;font-size:16px}
.trait-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px;max-width:620px}
.trait{padding:16px 18px;border-radius:20px;background:#fff8ea;border:1px solid rgba(18,63,98,.08)}
.trait b{display:block;font:800 22px/1 'Baloo 2',sans-serif;color:var(--coral);margin-bottom:6px}
.trait span{font-size:13px;line-height:1.5;color:#3f6479}

/* Crew cards on their own page can be taller */
@media (min-width:701px){
  body.inner .friend-card{height:430px!important;min-height:430px}
  body.inner .friend-card h3{font-size:clamp(24px,2.4vw,32px)!important}
}
@media (max-width:700px){body.inner .friend-card{height:380px!important;min-height:380px}}

/* Books page: five covers */
body.inner .shelf-row{grid-template-columns:repeat(5,1fr);gap:22px}
body.inner .shelf-book{max-width:210px}
body.inner .shelf-book h3{font-size:17px}
body.inner .shelf-book p{font-size:12px}
body.inner .shelf-meta{font-size:9px}
body.inner .bookshelf{padding:60px 5% 40px}
.book-chips span:last-child{background:var(--navy);color:#fff}
body.inner .book{min-height:0;padding:70px 9%}

/* About page */
body.inner .author-portrait.reveal.in{margin-top:0}
body.inner .lisa{padding:70px 7%}
body.inner .lisa .author-portrait{height:auto!important;min-height:0!important}
body.inner .lisa .author-portrait img{height:auto!important}

/* Grown-ups page */
body.inner .grownups{padding:70px 7%}

@media (max-width:1050px){
  .explore-grid{grid-template-columns:repeat(2,1fr)}
  .makes{grid-template-columns:1fr}
  body.inner .shelf-row{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:700px){
  .page-hero{padding:120px 20px 56px}
  .page-lede{font-size:16px}
  .explore{padding:56px 18px}
  .explore-grid{gap:10px}
  .explore-card{min-height:300px;padding:14px;border-radius:22px}
  .explore-card h3{font-size:21px}
  .explore-card p{font-size:12px}
  .makes{padding:50px 22px}
  .makes-art img{height:340px}
  .makes-art{min-height:340px}
  .trait-list{grid-template-columns:1fr}
  body.inner .shelf-row{grid-template-columns:repeat(2,1fr);gap:20px 14px}
  body.inner .bookshelf{padding:50px 18px 36px}
}
.explore-img{flex:0 0 190px!important;height:190px!important;overflow:hidden}
.explore-img img{height:100%;width:auto;max-width:100%}
.explore-img img.round{height:150px;width:150px}
.explore-card{min-height:0}

/* ===== CONTENT UPDATE (website content PDF) ===== */
/* Home hero: longer headline + sub copy */
.hero .title-line{font-size:clamp(34px,6vw,86px)}
.hero-sub{max-width:640px;margin:0 auto 22px;font-size:15px;line-height:1.65;color:#2d5873;position:relative;z-index:14}
.hero-lede{margin-bottom:12px}
@media (max-width:700px){.hero .title-line{font-size:clamp(26px,8.2vw,48px)}.hero-sub{font-size:14px}}
.story-heading p+p{margin-top:0}
.story-heading .mini-note{line-height:1.6}
.cta-band{z-index:6;background:var(--navy);color:#fff;text-align:center;border-radius:var(--radius);margin-top:28px;display:grid;place-items:center;padding:80px 7%}
.cta-band .eyebrow{color:var(--yellow)}
.cta-band h2 em{color:var(--yellow)}
.cta-band p{max-width:620px;margin:0 auto 14px;color:#cfe3ee;line-height:1.7;font-size:16px}
.cta-band .hero-actions{margin-top:26px}
.cta-band .button.light{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.3)}
.join-inner p{max-width:560px;margin-left:auto;margin-right:auto}

/* Charlie page */
.makes-copy p.pull{font:700 22px/1.35 'Baloo 2',sans-serif;color:var(--navy);padding-left:16px;border-left:4px solid var(--coral)}
.toolkit{background:var(--navy);color:#fff;border-radius:var(--radius);padding:72px 7%}
.toolkit-head{max-width:700px}
.toolkit-head h2 em{color:var(--yellow)}
.toolkit-head .eyebrow{color:var(--yellow)}
.toolkit-head p{color:#cfe3ee;line-height:1.75;font-size:16px;max-width:620px}
.toolkit-title{font:800 26px 'Baloo 2',sans-serif;margin:30px 0 14px;color:var(--yellow)}
.toolkit-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.tool{padding:20px 18px;border-radius:22px;color:var(--navy);display:flex;flex-direction:column;gap:8px}
.tool.blue{background:#bfe7f3}.tool.yellow{background:#ffe7a0}.tool.coral{background:#ffd0c3}.tool.green{background:#d0ebbd}
.tool b{font:800 20px/1.1 'Baloo 2',sans-serif}
.tool span{font-size:13px;line-height:1.55;color:#2d5873}
.cast{background:var(--paper);border-radius:var(--radius);padding:72px 6%}
.cast-head{margin-bottom:26px}
.cast-head h2{margin-bottom:0}
.cast-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.profile{display:flex;gap:18px;padding:22px;border-radius:26px}
.profile.blue{background:#e3f3f9}.profile.coral{background:#ffe6de}.profile.yellow{background:#fff0c4}.profile.green{background:#e4f3d8}
.avatar{flex:0 0 84px;width:84px;height:84px;border-radius:50%;overflow:hidden;background:#fffdf7;display:grid;place-items:center;border:4px solid #fffdf7;box-shadow:0 6px 14px rgba(18,63,98,.12)}
.avatar img{width:100%;height:100%;object-fit:cover;object-position:center 8%}
.avatar span{font:800 38px 'Baloo 2',sans-serif;color:var(--coral)}
.profile-body{min-width:0}
.profile-role{font-size:10px;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:var(--coral)}
.profile h3{font:800 28px/1.05 'Baloo 2',sans-serif;margin:4px 0 6px}
.profile-traits{display:inline-block;font-size:11px;font-weight:900;letter-spacing:.04em;background:#fffdf7;padding:5px 10px;border-radius:99px;margin-bottom:10px}
.profile p{font-size:14px;line-height:1.65;color:#3a6076;margin:0 0 10px}

/* Books page extras */
.book-copy p em{font-style:italic;color:var(--navy);font-weight:600}
.book-copy p{max-width:560px}
.stories{background:var(--paper);border-radius:var(--radius);padding:70px 6%}
.stories-head{margin-bottom:24px}
.stories-head h2{margin-bottom:0}
.stories-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.story-card{background:#fff8ea;border-radius:26px;padding:24px;border:1px solid rgba(18,63,98,.08)}
.story-card:nth-child(1){background:#ffe7a0}.story-card:nth-child(2){background:#d0ebbd}.story-card:nth-child(3){background:#bfe7f3}
.story-no{font-size:10px;font-weight:900;letter-spacing:.14em;color:var(--coral)}
.story-card h3{font:800 26px/1.05 'Baloo 2',sans-serif;margin:6px 0 12px}
.story-card p{font-size:14px;line-height:1.65;color:#2d5873;margin:0 0 10px}
.future{background:var(--sky);border-radius:var(--radius);padding:70px 7%}
.future-head{max-width:680px}
.future-head h2 em{color:#fff}
.future-head p{color:var(--navy);font-weight:600;line-height:1.7;font-size:16px}
.future-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:24px}
.future-card{background:#fffdf7;border-radius:22px;padding:20px}
.future-card h3{font:800 20px/1.1 'Baloo 2',sans-serif;margin:0 0 8px}
.future-card p{font-size:13px;line-height:1.55;color:#53758b;margin:0}
.future-foot{margin:24px 0 0;font:700 20px 'Baloo 2',sans-serif;color:var(--navy)}

/* Grown-ups page */
.gu{background:var(--navy);color:#fff;border-radius:var(--radius);padding:72px 7%}
.gu .eyebrow{color:var(--yellow)}
.gu h2 em{color:var(--yellow)}
.gu-top{display:grid;grid-template-columns:.8fr 1.2fr;gap:6%;align-items:center}
.gu-topics{display:flex;flex-wrap:wrap;gap:10px}
.gu-topics span{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);padding:10px 16px;border-radius:99px;font-size:13px;font-weight:800}
.gu-goal{max-width:700px;margin:30px 0;font-size:18px;line-height:1.65;color:#cfe3ee}
.gu-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.gu-card{border-radius:28px;padding:28px;color:var(--navy)}
.gu-card.parents{background:#bfe7f3}.gu-card.educators{background:#ffe7a0}
.gu-card .eyebrow{color:var(--coral)}
.gu-card h3{font:800 30px/1.05 'Baloo 2',sans-serif;margin:8px 0 12px}
.gu-card p{font-size:15px;line-height:1.65;color:#2d5873}
.gu-card ul{margin:0;padding-left:20px;display:grid;gap:10px;font:700 18px/1.35 'Baloo 2',sans-serif}
.gu-line{font:800 22px/1.3 'Baloo 2',sans-serif!important;color:var(--navy)!important;margin-top:18px}

/* About page */
body.inner .lisa-copy p.big{font-size:19px}
.why{background:#ffe7a0;border-radius:var(--radius);padding:76px 8%;text-align:center}
.why-inner{max-width:760px;margin:0 auto}
.why p{font-size:16px;line-height:1.75;color:#2d5873;margin:0 auto 14px}
.why-list{display:grid;gap:10px;margin:22px 0}
.why-list span{background:#fffdf7;padding:14px 18px;border-radius:99px;font:700 19px 'Baloo 2',sans-serif;color:var(--navy)}

@media (max-width:1050px){
  .toolkit-grid{grid-template-columns:repeat(2,1fr)}
  .stories-grid{grid-template-columns:1fr}
  .future-grid{grid-template-columns:repeat(2,1fr)}
  .gu-top,.gu-cols{grid-template-columns:1fr}
  .cast-grid{grid-template-columns:1fr}
}
@media (max-width:700px){
  .toolkit,.cast,.stories,.future,.gu,.why,.cta-band{padding:52px 20px}
  .toolkit-grid,.future-grid{grid-template-columns:1fr}
  .profile{flex-direction:column;gap:12px}
  .gu-card ul{font-size:16px}
}

/* Character pop-up */
.friend-card[data-person]{cursor:pointer}
.friend-card[data-person] .card-arrow{position:absolute;right:14px;bottom:14px;width:30px;height:30px;border-radius:50%;background:#fffdf7;color:var(--navy);display:grid;place-items:center;font:800 20px/1 'DM Sans',sans-serif;z-index:4;box-shadow:0 4px 10px rgba(18,63,98,.15);transition:transform .25s ease,background .25s ease,color .25s ease}
.friend-card[data-person]:hover .card-arrow,.friend-card[data-person]:focus-visible .card-arrow{transform:rotate(90deg);background:var(--coral);color:#fff}
.friend-card[data-person]:focus-visible{outline:3px solid var(--coral);outline-offset:3px}
html.modal-open{overflow:hidden}
.char-modal{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:18px;opacity:0;transition:opacity .22s ease}
.char-modal[hidden]{display:none}
.char-modal.show{opacity:1}
.char-backdrop{position:absolute;inset:0;background:rgba(18,63,98,.55);backdrop-filter:blur(4px)}
.char-dialog{position:relative;display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;width:min(860px,100%);max-height:calc(100vh - 36px);overflow:auto;padding:34px;border-radius:32px;background:#e3f3f9;box-shadow:0 30px 80px rgba(18,63,98,.35);transform:translateY(24px) scale(.95);transition:transform .35s cubic-bezier(.2,1.2,.35,1)}
.char-modal.show .char-dialog{transform:none}
.char-dialog.blue{background:#d4eef8}.char-dialog.coral{background:#ffe0d6}.char-dialog.yellow{background:#fff0c4}.char-dialog.green{background:#dcf0cd}
.char-pic{display:flex;align-items:flex-end;justify-content:center;min-height:300px}
.char-pic img{max-height:min(460px,60vh);max-width:100%;object-fit:contain;filter:drop-shadow(0 14px 10px rgba(18,63,98,.18))}
.char-text{align-self:center}
.char-text h3{font:800 clamp(34px,5vw,52px)/1 'Baloo 2',sans-serif;margin:4px 0 10px;color:var(--navy)}
.char-text p{font-size:15px;line-height:1.7;color:#2d5873;margin:0 0 12px}
.char-close{position:absolute;right:14px;top:14px;width:40px;height:40px;border:0;border-radius:50%;background:#fffdf7;color:var(--navy);font:600 26px/1 'DM Sans',sans-serif;cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 10px rgba(18,63,98,.15);z-index:2;transition:background .2s,color .2s}
.char-close:hover{background:var(--coral);color:#fff}
@media (max-width:700px){
  .char-dialog{grid-template-columns:1fr;gap:10px;padding:56px 22px 26px;border-radius:26px}
  .char-pic{min-height:0}
  .char-pic img{max-height:220px}
}
@media (prefers-reduced-motion:reduce){.char-modal,.char-dialog{transition:none}}

/* Stories: five cards */
.stories-grid{grid-template-columns:repeat(3,1fr)}
.story-card:nth-child(1){background:#bfe7f3}.story-card:nth-child(2){background:#ffe7a0}.story-card:nth-child(3){background:#d0ebbd}.story-card:nth-child(4){background:#ffd0c3}.story-card:nth-child(5){background:#e6e1f2;background:#eee9dc}

/* Shop page carousel */
.shop-page{background:linear-gradient(135deg,#fff4d5 0%,#f8e4d7 48%,#e3f1df 100%);border-radius:var(--radius);padding:56px 0 64px}
.car{position:relative}
.car-bar{display:flex;justify-content:space-between;align-items:center;padding:0 6% 18px}
.car-arrows{display:flex;gap:10px}
.car-arrows button{width:46px;height:46px;border-radius:50%;border:0;background:var(--navy);color:#fff;font-size:20px;cursor:pointer;transition:background .2s,transform .2s,opacity .2s}
.car-arrows button:hover:not(:disabled){background:var(--coral);transform:translateY(-2px)}
.car-arrows button:disabled{opacity:.25;cursor:default}
.car-track{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 6%;padding:6px 6% 22px;scrollbar-width:none;outline:none}
.car-track::-webkit-scrollbar{display:none}
.car-card{flex:0 0 calc((100% - 12% - 40px) / 3);scroll-snap-align:start;background:#fffdf7;border-radius:26px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 14px 30px rgba(45,58,49,.1);border:1px solid rgba(54,66,55,.08)}
.car-img{position:relative;aspect-ratio:1/1;background:#fff;display:grid;place-items:center}
.car-img img{width:100%;height:100%;object-fit:contain;padding:14px}
.car-thumbs{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:7px}
.car-thumbs button{width:9px;height:9px;padding:0;border-radius:50%;border:0;background:rgba(18,63,98,.22);cursor:pointer;transition:background .2s,transform .2s}
.car-thumbs button.on{background:var(--coral);transform:scale(1.35)}
.car-body{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:18px 20px 22px;flex:1}
.car-no{font-size:10px;font-weight:900;letter-spacing:.14em;color:var(--coral)}
.car-body h3{font:800 21px/1.2 'Baloo 2',sans-serif;margin:0;color:var(--navy);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.car-price{margin:0;font-size:20px;font-weight:900;color:var(--coral)}
.car-desc{margin:0 0 6px;font-size:13px;line-height:1.6;color:#53758b;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.car-body .shop-buy{margin-top:auto}
.car-dots{display:flex;justify-content:center;gap:8px;padding-top:6px}
.car-dots button{width:10px;height:10px;padding:0;border-radius:50%;border:0;background:rgba(18,63,98,.2);cursor:pointer;transition:all .25s}
.car-dots button.on{background:var(--coral);width:26px;border-radius:99px}
.shop-loading,.shop-error{margin:30px auto;font-weight:700;color:var(--navy);text-align:center;width:100%}
.shop-error a{color:var(--coral);text-decoration:underline}
body.inner .shop-bottom{margin-top:28px}
@media (max-width:1050px){.car-card{flex-basis:calc((100% - 12% - 20px) / 2)}.stories-grid{grid-template-columns:1fr}}
@media (max-width:700px){
  .shop-page{padding:44px 0 50px}
  .car-bar{padding:0 18px 14px}
  .car-track{padding:6px 18px 18px;scroll-padding:0 18px;gap:14px}
  .car-card{flex-basis:84%}
}

/* Home: sections pile up again. Sections taller than the screen pin by their bottom edge
   (top is set from script.js) so all of their content is seen before the next one covers them. */
body.home .section-wrap{overflow:hidden}
body.home .hero{min-height:100svh}
body.home .story{padding:100px 7%}
body.home .shop{padding:90px 7% 70px}

/* Home book showcase, new story image, crew + grown-ups card images */
.showcase{z-index:4;background:var(--paper);border-radius:var(--radius);padding:70px 6% 60px;margin-top:28px}
.explore{z-index:5}.shop{z-index:6}.cta-band{z-index:7}
.showcase-head{text-align:center;max-width:640px;margin:0 auto 26px}
.showcase-head h2{margin-bottom:10px}
.showcase-head p{color:#53758b;line-height:1.7;font-size:16px}
.showcase .shelf-row{grid-template-columns:repeat(5,1fr);gap:22px}
.showcase .shelf-book{max-width:210px}
.showcase .shelf-book h3{font-size:17px}
.showcase .shelf-book p{font-size:12px}
.showcase-foot{display:flex;justify-content:center;margin-top:28px}
.story-scene{background:#fff!important}
.explore-crew{display:flex;align-items:flex-end;justify-content:center;gap:2px}
.explore-crew img{height:100%;width:auto;max-width:25%;object-fit:contain;object-position:bottom}
.explore-crew img:nth-child(odd){height:96%}
.explore-art img{width:100%;height:100%;object-fit:contain;border-radius:14px}
@media (max-width:1050px){.showcase .shelf-row{grid-template-columns:repeat(3,1fr)}}
@media (max-width:700px){.showcase{padding:50px 18px 40px}.showcase .shelf-row{grid-template-columns:repeat(2,1fr);gap:20px 14px}}

/* The .coral/.yellow helper classes colour text; cards that reuse those names must keep navy text */
.explore-card.blue,.explore-card.yellow,.explore-card.green,.explore-card.coral,
.friend-card.blue,.friend-card.yellow,.friend-card.green,.friend-card.coral,
.profile.blue,.profile.yellow,.profile.green,.profile.coral,
.tool.blue,.tool.yellow,.tool.green,.tool.coral,
.char-dialog.blue,.char-dialog.yellow,.char-dialog.green,.char-dialog.coral{color:var(--navy)}
.showcase .shelf{padding-bottom:40px}.showcase .shelf-book{padding-bottom:6px}

/* Scroll smoothness: no scroll-anchoring jumps when content above resizes (images/products loading),
   no blur filters animating on reveal, cursor ring moved by transform only. */
html{overflow-anchor:none}
.reveal{filter:none!important}
.cursor-pop{left:0!important;top:0!important;transform:translate(-50%,-50%)}
.hero-star,.hero-sun,.hero-cloud{will-change:translate}
.shelf{padding-bottom:44px}.shelf-book{padding-bottom:8px}

/* Books mega menu: five covers */
.mega-panel{width:min(900px,92vw)}
.mega-grid{grid-template-columns:repeat(5,1fr)}
.mega-cover{aspect-ratio:1/1;box-shadow:none;border-radius:8px;background:transparent}
.mega-cover img{object-fit:contain}
.nav-books-trigger.active{background:rgba(121,201,234,.28)}
@media (max-width:700px){.nav-books{display:none}}
.nav-books{position:static}
.mega-panel,.nav-books:hover .mega-panel,.nav-books.open .mega-panel,.nav-books:focus-within .mega-panel{left:auto;right:0;transform:translateY(8px)}
.nav-books:hover .mega-panel,.nav-books.open .mega-panel,.nav-books:focus-within .mega-panel{transform:translateY(0)}
.mega-panel{width:min(900px,100%)}

/* Mega menu: landscape row of covers */
.mega-panel{width:max-content;max-width:calc(100vw - 32px);padding:20px 24px}
.mega-grid{display:flex;gap:16px;overflow-x:auto}
.mega-book{flex:0 0 150px;width:150px}
.mega-cover{aspect-ratio:1/1}
.mega-book-title{font-size:12px}
.mega-all{margin-top:12px}

/* Books page: related books row, author portrait crop */
.shelf-row.four{grid-template-columns:repeat(4,1fr)}
@media (max-width:1050px){.shelf-row.four{grid-template-columns:repeat(2,1fr)}}
.explore-img img.round{height:176px;width:140px;object-position:center 15%}
.author-portrait img{object-fit:cover;object-position:center top;border-radius:28px}

/* Shop page: category dropdown */
.car-filter{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.car-filter select{appearance:none;-webkit-appearance:none;border:2px solid var(--navy);background:#fffdf7 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23123f62' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 16px center;color:var(--navy);font:800 14px 'DM Sans',sans-serif;padding:12px 44px 12px 18px;border-radius:99px;cursor:pointer;min-width:220px}
.car-filter select:focus{outline:3px solid var(--coral);outline-offset:2px}
.car-count{font-size:13px;font-weight:700;color:#53758b}
@media (max-width:700px){.car-bar{flex-direction:column;align-items:stretch;gap:12px}.car-arrows{justify-content:flex-end}.car-filter select{flex:1;min-width:0}}

/* Shop menu: categories linked to the shop */
.nav-shop{position:relative}
.nav-shop-trigger{display:inline-flex;align-items:center;gap:5px;padding:9px 12px;border-radius:99px;font-size:13px;font-weight:800;transition:background .25s ease}
.nav-shop-trigger:hover{background:rgba(121,201,234,.16)}
.nav-shop-trigger i{font-style:normal;font-size:9px;transition:transform .25s ease}
.nav-shop:hover .nav-shop-trigger i{transform:rotate(180deg)}
.shop-menu{position:absolute;top:calc(100% + 14px);right:0;width:max-content;min-width:200px;display:grid;grid-template-columns:repeat(2,minmax(130px,1fr));gap:2px;padding:12px;background:var(--paper);border:1px solid rgba(18,63,98,.08);border-radius:22px;box-shadow:0 30px 60px rgba(18,63,98,.22);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(8px);transition:opacity .25s ease,transform .25s ease,visibility .25s;z-index:120}
.nav-shop:hover .shop-menu,.nav-shop:focus-within .shop-menu{opacity:1;visibility:visible;pointer-events:auto;transform:none}
.shop-menu::before{content:'';position:absolute;left:0;right:0;top:-16px;height:16px}
.shop-menu a{padding:9px 14px;border-radius:12px;font-size:13px;font-weight:700;color:var(--navy);transition:background .2s}
.shop-menu a:hover{background:rgba(121,201,234,.2)}
.shop-menu .shop-menu-all{grid-column:1/-1;background:var(--coral);color:#fff;text-align:center;font-weight:800;margin-bottom:6px}
.shop-menu .shop-menu-all:hover{background:#dc4e42}
@media (max-width:700px){.nav-shop{display:none}}

/* Buy box (book page) */
.buy-box{margin-top:22px;padding:18px 20px;background:#fff;border:1px solid rgba(18,63,98,.1);border-radius:22px;max-width:460px}
.buy-label{display:block;font-size:11px;font-weight:800;letter-spacing:.12em;color:var(--coral);margin-bottom:10px}
.buy-formats{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.buy-format{flex:1 1 130px;padding:12px 14px;border:2px solid rgba(18,63,98,.15);border-radius:16px;background:#fff;color:var(--navy);font:inherit;cursor:pointer;text-align:left;transition:border-color .2s,background .2s}
.buy-format b{display:block;font-size:15px}.buy-format small{font-size:13px;opacity:.75}
.buy-format.on{border-color:var(--coral);background:rgba(241,95,80,.08)}
.buy-format:focus-visible{outline:3px solid var(--sky,#79c9ea);outline-offset:2px}
.buy-go{display:inline-flex}
.buy-note{margin:10px 0 0;font-size:12.5px;opacity:.7}
.buy-details{display:grid;grid-template-columns:repeat(3,auto);gap:6px 18px;margin:14px 0 0;padding-top:12px;border-top:1px solid rgba(18,63,98,.1)}
.buy-details dt{font-size:11px;font-weight:800;letter-spacing:.08em;opacity:.6}.buy-details dd{margin:0;font-size:14px;font-weight:700}
.shelf-tag:not(.soon){background:var(--coral);color:#fff}