@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Nunito:wght@400;600;700;800&display=swap');

/* The rounded display font keeps the site child-friendly while the body stays easy for parents to scan. */
:root{--font-heading:'Baloo 2',cursive;--font-body:'Nunito',sans-serif}.site-logo,.main-navigation>ul>li>a,.ls3-home h1,.ls3-home h2,.ls3-home h3,.ls3-button,.ls3-parent-link,.ls3-text-link,.ls3-parent-board b,.ls3-play-gallery figcaption,.ls3-cta a{font-family:'Baloo 2',cursive}.ls3-home h1{font-weight:800;letter-spacing:-.04em}.ls3-home h2{font-weight:700;letter-spacing:-.025em}.ls3-home h3{font-weight:700}.ls3-home{font-family:'Nunito',sans-serif}

@keyframes ls3-sticker-bob{0%,100%{transform:rotate(-8deg) translateY(0)}50%{transform:rotate(-5deg) translateY(-10px)}}@keyframes ls3-sun-wiggle{0%,100%{transform:rotate(12deg) scale(1)}50%{transform:rotate(26deg) scale(1.08)}}@keyframes ls3-scribble-wiggle{0%,100%{transform:rotate(-10deg) translateX(0)}50%{transform:rotate(-16deg) translateX(8px)}}@keyframes ls3-board-float{0%,100%{transform:rotate(2deg) translateY(0)}50%{transform:rotate(1deg) translateY(-8px)}}
.ls3-hero-sticker{animation:ls3-sticker-bob 3.5s ease-in-out infinite}.ls3-sun{animation:ls3-sun-wiggle 5s ease-in-out infinite}.ls3-scribble{animation:ls3-scribble-wiggle 3s ease-in-out infinite}.ls3-parent-board{animation:ls3-board-float 5s ease-in-out infinite}

/* Reveals only activate after the script confirms they are supported. */
.ls3-motion-ready .ls3-thing,.ls3-motion-ready .ls3-parent-board,.ls3-motion-ready .ls3-play-gallery figure,.ls3-motion-ready .ls3-facebook-feed,.ls3-motion-ready .ls3-news-list article{opacity:0;transition:opacity .65s ease,transform .65s cubic-bezier(.2,.8,.2,1)}.ls3-motion-ready .ls3-thing{transform:translateY(28px) rotate(-3deg)}.ls3-motion-ready .ls3-thing:nth-child(2){transform:translateY(28px) rotate(3deg)}.ls3-motion-ready .ls3-play-gallery figure:first-child{transform:translateX(-30px) rotate(-4deg)}.ls3-motion-ready .ls3-play-gallery figure:last-child{transform:translateX(30px) rotate(4deg)}.ls3-motion-ready .ls3-parent-board{transform:translateY(25px) rotate(2deg)}.ls3-motion-ready .ls3-facebook-feed{transform:translateX(30px) rotate(2deg)}.ls3-motion-ready .ls3-news-list article{transform:translateY(18px)}.ls3-motion-ready .ls3-in-view{opacity:1}.ls3-motion-ready .ls3-thing.ls3-in-view{transform:rotate(-1.5deg)}.ls3-motion-ready .ls3-thing:nth-child(2).ls3-in-view{transform:rotate(1.5deg)}.ls3-motion-ready .ls3-play-gallery figure:first-child.ls3-in-view{transform:rotate(-1deg)}.ls3-motion-ready .ls3-play-gallery figure:last-child.ls3-in-view{transform:rotate(1deg)}.ls3-motion-ready .ls3-parent-board.ls3-in-view{transform:rotate(2deg)}.ls3-motion-ready .ls3-facebook-feed.ls3-in-view{transform:rotate(1deg)}.ls3-motion-ready .ls3-news-list article.ls3-in-view{transform:translateY(0)}

@media (prefers-reduced-motion:reduce){.ls3-hero-sticker,.ls3-sun,.ls3-scribble,.ls3-parent-board{animation:none!important}.ls3-motion-ready .ls3-thing,.ls3-motion-ready .ls3-parent-board,.ls3-motion-ready .ls3-play-gallery figure,.ls3-motion-ready .ls3-facebook-feed,.ls3-motion-ready .ls3-news-list article{opacity:1!important;transform:none!important;transition:none!important}}

/* Gallery photos must never leave a blank page when an animation is interrupted. */
.ls3-motion-ready .ls3-play-gallery figure{opacity:1!important}.ls3-motion-ready .ls3-play-gallery figure:first-child{transform:rotate(-1deg)!important}.ls3-motion-ready .ls3-play-gallery figure:last-child{transform:rotate(1deg)!important}