*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    :root {
      --purple:   #4F2DC9;
      --purple-dk:#3B1FA0;
      --ink:      #1A0F4A;
      --yellow:   #FFD23F;
      --pink:     #FF3D8A;
      --mint:     #4CE0B3;
      --sky:      #4DA8FF;
      --orange:   #FF7A45;
      --paper:    #FFFBF2;
      --paper-dk: #FFF5DE;
      --shadow-soft: rgba(26,15,74,.35);
      --shadow-md:   rgba(26,15,74,.5);
    }
    html { scroll-behavior: smooth; }
    body { font-family: 'Nunito', sans-serif; background: var(--paper); overflow-x: hidden; font-size: 16px; line-height: 1.6; }

    /* ── ANIMATIONS ── */
    @keyframes float-a {
      0%,100% { transform: translateY(0) rotate(var(--r,0deg)); }
      50%      { transform: translateY(-13px) rotate(calc(var(--r,0deg) + 8deg)); }
    }
    @keyframes float-b {
      0%,100% { transform: translateY(0) rotate(var(--r,0deg)); }
      50%      { transform: translateY(-9px) rotate(calc(var(--r,0deg) - 6deg)); }
    }
    @keyframes float-c {
      0%,100% { transform: translateY(0) rotate(var(--r,0deg)); }
      50%      { transform: translateY(-18px) rotate(calc(var(--r,0deg) + 4deg)); }
    }
    @keyframes marquee-run {
      from { transform: translateX(0); }
      to   { transform: translateX(-50%); }
    }
    @keyframes glow-pulse {
      0%,100% { box-shadow: 0 0 40px rgba(255,210,63,.2), 0 0 80px rgba(79,45,201,.25), 8px 12px 0 var(--shadow-md); }
      50%      { box-shadow: 0 0 60px rgba(255,210,63,.35), 0 0 120px rgba(79,45,201,.4), 8px 12px 0 var(--shadow-md); }
    }
    @keyframes learning-bit-drift {
      0%,100% { transform: translate3d(0,0,0) rotate(var(--r,0deg)); }
      45%     { transform: translate3d(18px,-26px,0) rotate(calc(var(--r,0deg) + 9deg)); }
      70%     { transform: translate3d(-12px,-44px,0) rotate(calc(var(--r,0deg) - 8deg)); }
    }

    /* ── SCROLL REVEAL ── */
    .reveal { opacity: 0; transform: translateY(36px); transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
    .reveal.visible { opacity: 1; transform: translateY(0); }
    .d1 { transition-delay: .08s; } .d2 { transition-delay: .16s; }
    .d3 { transition-delay: .24s; } .d4 { transition-delay: .32s; }
    .d5 { transition-delay: .40s; } .d6 { transition-delay: .48s; }

    /* ── REDUCED MOTION ── */
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        transition-delay: 0ms !important;
      }
      .reveal { opacity: 1; transform: none; }
      .marquee-inner { animation: none; }
    }

    /* ── FOCUS RINGS ── */
    :focus-visible {
      outline: 3px solid var(--yellow);
      outline-offset: 3px;
      border-radius: 4px;
    }
    .btn:focus-visible { outline-color: #fff; }
    .mobile-menu a:focus-visible { outline-color: var(--mint); }

    /* ── SKIP LINK ── */
    .skip-link {
      position: absolute; top: -100px; left: 16px; z-index: 9999;
      background: var(--yellow); color: var(--ink);
      font-family: 'Fredoka', sans-serif; font-weight: 600;
      padding: 10px 20px; border-radius: 8px; border: 3px solid var(--ink);
      text-decoration: none; transition: top .2s;
    }
    .skip-link:focus { top: 16px; }

    /* ── NAV ── */
    nav {
      background: var(--purple); padding: 14px 48px;
      display: flex; align-items: center; justify-content: space-between;
      position: sticky; top: 0; z-index: 300;
      border-bottom: 3px solid rgba(26,15,74,.4);
      backdrop-filter: blur(12px);
    }
    .nav-brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
    .nav-icon {
      width: 42px; height: 42px; border-radius: 12px;
      border: 2px solid rgba(255,255,255,.25); box-shadow: 2px 3px 0 var(--shadow-soft);
      overflow: hidden; flex-shrink: 0;
    }
    .nav-icon img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .nav-logo {
      font-family: 'Fredoka', sans-serif; font-weight: 700; font-size: 1.8rem;
      color: var(--yellow); text-shadow: 2px 3px 0 var(--shadow-soft);
      transform: rotate(-1.5deg); display: inline-block; letter-spacing: .01em;
    }
    .nav-links { display: flex; gap: 36px; list-style: none; align-items: center; }
    .nav-store-links { display: flex; align-items: center; gap: 10px; }
    .nav-links a {
      font-family: 'Fredoka', sans-serif; font-weight: 500;
      color: rgba(255,255,255,.9); text-decoration: none;
      font-size: 1.05rem; letter-spacing: .02em; transition: color .15s;
    }
    .nav-links a:hover { color: var(--yellow); }
    .nav-cta {
      background: var(--yellow) !important; color: var(--ink) !important;
      padding: 10px 26px !important; border-radius: 999px !important;
      border: 2px solid rgba(26,15,74,.3) !important;
      box-shadow: 3px 4px 0 var(--shadow-soft) !important;
      font-weight: 700 !important;
    }
    .nav-cta:hover { background: var(--pink) !important; color: #fff !important; transform: translateY(-2px) !important; }
    .hamburger {
      display: none; flex-direction: column; gap: 5px;
      background: none; border: none; cursor: pointer; padding: 4px;
    }
    .hamburger span {
      display: block; width: 26px; height: 3px;
      background: #fff; border-radius: 3px;
      transition: transform .3s, opacity .3s;
    }
    .hamburger.open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
    .hamburger.open span:nth-child(2) { opacity: 0; }
    .hamburger.open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

    /* ── MOBILE OVERLAY ── */
    .mobile-menu {
      display: none; position: fixed; inset: 0;
      background: var(--ink); z-index: 299;
      padding: 100px 40px 40px;
      flex-direction: column; align-items: center; gap: 32px;
    }
    .mobile-menu.open { display: flex; }
    .mobile-menu a {
      font-family: 'Fredoka', sans-serif; font-weight: 700; font-size: 2.6rem;
      color: var(--yellow); text-shadow: 3px 4px 0 rgba(79,45,201,.6);
      text-decoration: none; transform: rotate(-2deg); display: inline-block;
      letter-spacing: .02em;
    }
    .mobile-menu a.m-cta {
      background: var(--yellow); color: var(--ink) !important;
      text-shadow: none; transform: none;
      padding: 18px 52px; border-radius: 999px;
      border: 3px solid rgba(26,15,74,.3); box-shadow: 4px 5px 0 var(--shadow-soft);
      font-family: 'Fredoka', sans-serif; font-weight: 700; font-size: 1.4rem;
    }
    .mobile-store-row {
      display: flex;
      flex-direction: column;
      gap: 14px;
      width: min(100%, 300px);
    }

    /* ── CONFETTI ── */
    .confetti { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 1; }
    .confetti span { position: absolute; display: block; }
    .dot  { border-radius: 50%; }
    .rect { border-radius: 3px; }
    .squig { border-radius: 999px; }
    .fa { animation: float-a 4s ease-in-out infinite; }
    .fb { animation: float-b 5.5s ease-in-out infinite; }
    .fc { animation: float-c 3.8s ease-in-out infinite; }
    .confetti span:nth-child(2n)   { animation-delay: -1.4s; }
    .confetti span:nth-child(3n)   { animation-delay: -2.9s; }
    .confetti span:nth-child(4n+1) { animation-delay: -.7s; }

    .hero-particles,
    .learning-particles {
      position: absolute; inset: -44px -72px 0;
      z-index: 1; pointer-events: none; overflow: hidden;
    }
    .wprl-particles { inset: -26px -72px 0; }
    .hero-particle {
      position: absolute; display: inline-grid; place-items: center;
      font-family: 'Fredoka', sans-serif; font-size: 1.45rem; font-weight: 700;
      line-height: 1; opacity: .76;
      animation: learning-bit-drift 13s ease-in-out infinite;
      filter: drop-shadow(2px 3px 0 rgba(26,15,74,.18));
    }
    .hero-particle.note { color: rgba(255,210,63,.86); }
    .hero-particle.star { color: rgba(255,255,255,.76); }
    .hero-particle.plus { color: rgba(77,168,255,.82); }
    .hero-particle.dot {
      width: 14px; height: 14px; border-radius: 999px;
      background: rgba(255,210,63,.84);
    }
    .hero-particle.sprinkle {
      width: 30px; height: 8px; border-radius: 999px;
      background: rgba(255,61,138,.8);
    }
    .hero-particle:nth-child(1)  { left: 5%;  top: 14%; --r: -8deg;  animation-delay: -2s; }
    .hero-particle:nth-child(2)  { left: 18%; top: 66%; --r: 12deg;  animation-delay: -9s; }
    .hero-particle:nth-child(3)  { left: 35%; top: 22%; --r: -18deg; animation-delay: -5s; }
    .hero-particle:nth-child(4)  { left: 48%; top: 76%; --r: 0deg;   animation-delay: -11s; }
    .hero-particle:nth-child(5)  { left: 60%; top: 12%; --r: 28deg;  animation-delay: -4s; }
    .hero-particle:nth-child(6)  { left: 76%; top: 24%; --r: 8deg;   animation-delay: -8s; }
    .hero-particle:nth-child(7)  { left: 89%; top: 58%; --r: -10deg; animation-delay: -12s; }
    .hero-particle:nth-child(8)  { left: 8%;  top: 42%; --r: 0deg;   animation-delay: -6s; }
    .hero-particle:nth-child(9)  { left: 27%; top: 84%; --r: 16deg;  animation-delay: -3s; }
    .hero-particle:nth-child(10) { left: 69%; top: 82%; --r: -22deg; animation-delay: -10s; }
    .hero-particle:nth-child(11) { left: 92%; top: 18%; --r: 6deg;   animation-delay: -1s; }
    .hero-particle:nth-child(12) { left: 43%; top: 48%; --r: -12deg; animation-delay: -7s; }

    /* ── STAR DECO ── */
    .star-deco {
      position: absolute; z-index: 1; pointer-events: none;
      filter: drop-shadow(2px 3px 0 var(--shadow-soft)); font-style: normal;
    }

    /* ── LAYOUT ── */
    section { position: relative; overflow: hidden; }
    .inner { position: relative; z-index: 2; max-width: 1200px; margin: 0 auto; }

    /* ── PILLS ── */
    .pill {
      display: inline-block; font-family: 'Fredoka', sans-serif;
      font-weight: 600; font-size: .82rem; letter-spacing: .1em;
      text-transform: uppercase; padding: 9px 22px; border-radius: 999px;
      border: 2px solid rgba(26,15,74,.25); box-shadow: 2px 3px 0 var(--shadow-soft);
    }

    /* ── BUTTONS ── */
    .btn {
      display: inline-flex; align-items: center; gap: 10px;
      font-family: 'Fredoka', sans-serif; font-weight: 700; font-size: 1.1rem;
      padding: 16px 40px; border-radius: 999px; letter-spacing: .02em;
      border: 3px solid rgba(26,15,74,.3); box-shadow: 4px 5px 0 var(--shadow-soft);
      text-decoration: none; cursor: pointer;
      transition: transform .15s cubic-bezier(.16,1,.3,1), box-shadow .15s;
    }
    .btn:hover  { transform: translateY(-4px); box-shadow: 4px 9px 0 var(--shadow-soft); }
    .btn:active { transform: translateY(2px);  box-shadow: 2px 2px 0 var(--shadow-soft); }
    .btn-yellow { background: var(--yellow); color: var(--ink); }
    .btn-ghost  { background: transparent; color: #fff; border-color: rgba(255,255,255,.6); box-shadow: 4px 5px 0 rgba(0,0,0,.2); }
    .btn-purple { background: var(--purple); color: var(--yellow); }
    .btn-mint   { background: var(--mint); color: var(--ink); }
    .store-badge {
      display: inline-flex;
      align-items: center;
      justify-content: flex-start;
      gap: 10px;
      min-width: 174px;
      min-height: 54px;
      padding: 8px 14px;
      border-radius: 8px;
      border: 1.5px solid rgba(255,255,255,.75);
      background: #050507;
      color: #fff !important;
      text-decoration: none;
      box-shadow: 3px 4px 0 rgba(26,15,74,.28);
      transform: none !important;
      text-shadow: none !important;
      transition: transform .15s cubic-bezier(.16,1,.3,1), box-shadow .15s, border-color .15s;
    }
    .store-badge:hover {
      color: #fff !important;
      border-color: #fff;
      transform: translateY(-2px) !important;
      box-shadow: 3px 7px 0 rgba(26,15,74,.34);
    }
    .store-badge-icon {
      width: 28px;
      height: 28px;
      flex: 0 0 auto;
      display: block;
    }
    .store-badge-play {
      width: 30px;
      height: 30px;
    }
    .store-badge small,
    .store-badge strong {
      display: block;
      color: inherit;
      line-height: 1;
      white-space: nowrap;
    }
    .store-badge small {
      margin-bottom: 4px;
      font-family: 'Nunito', sans-serif;
      font-size: .63rem;
      font-weight: 800;
      letter-spacing: .02em;
      text-transform: none;
      opacity: .92;
    }
    .store-badge strong {
      font-family: 'Nunito', sans-serif;
      font-size: 1.08rem;
      font-weight: 900;
      letter-spacing: -.02em;
    }
    .store-badge--nav {
      min-width: 132px;
      min-height: 42px;
      padding: 6px 10px;
      border-radius: 7px;
    }
    .store-badge--nav .store-badge-icon {
      width: 22px;
      height: 22px;
    }
    .store-badge--nav .store-badge-play {
      width: 24px;
      height: 24px;
    }
    .store-badge--nav small {
      margin-bottom: 3px;
      font-size: .5rem;
    }
    .store-badge--nav strong {
      font-size: .82rem;
    }
    .store-badge--hero {
      min-width: 188px;
      min-height: 58px;
    }
    .store-badge--hero strong {
      font-size: 1.16rem;
    }
    .store-badge--mobile {
      width: 100%;
      justify-content: flex-start;
    }

    .hero-waitlist-row,
    .mobile-waitlist-row,
    .waitlist-store-row {
      display: flex;
      align-items: center;
      gap: 14px;
      flex-wrap: wrap;
    }

    .hero-waitlist-cta,
    .mobile-waitlist-cta,
    .waitlist-store-btn {
      text-decoration: none;
      white-space: nowrap;
    }

    .store-coming-soon,
    .footer-coming-soon {
      display: inline-flex;
      align-items: center;
      min-height: 40px;
      padding: 10px 16px;
      border-radius: 999px;
      border: 2px solid rgba(255, 255, 255, .42);
      background: rgba(255, 255, 255, .14);
      color: #fff;
      font-family: 'Nunito', sans-serif;
      font-size: .9rem;
      font-weight: 900;
      letter-spacing: .02em;
    }

    .store-coming-soon--mobile {
      width: 100%;
      justify-content: center;
    }

    /* ════════════════════════════
       HERO
    ════════════════════════════ */
    #hero {
      background: var(--purple); padding: 110px 48px 100px;
      min-height: 92vh; display: flex; align-items: center;
      overflow: visible;
    }
    #hero .inner { display: flex; align-items: center; justify-content: space-between; gap: 56px; }
    .hero-copy { flex: 1 1 640px; max-width: 760px; min-width: 0; }

    .hero-badges {
      display: flex; align-items: center; gap: 14px;
      flex-wrap: nowrap; margin-bottom: 28px;
    }
    .luda-badge {
      display: inline-flex; align-items: center; gap: 10px;
      background: rgba(255,255,255,.12); border: 1.5px solid rgba(255,255,255,.3);
      border-radius: 999px; padding: 9px 20px 9px 12px;
      backdrop-filter: blur(8px); white-space: nowrap; flex-shrink: 0;
    }
    .luda-icon {
      width: 30px; height: 30px; background: var(--yellow);
      border-radius: 50%; border: 2px solid rgba(26,15,74,.3);
      display: flex; align-items: center; justify-content: center;
      font-size: .95rem; flex-shrink: 0;
    }
    .luda-badge span {
      font-family: 'Nunito', sans-serif; font-weight: 700;
      font-size: .85rem; color: rgba(255,255,255,.92); letter-spacing: .02em;
    }

    .hero-tag { background: #fff; color: var(--ink); white-space: nowrap; flex-shrink: 0; }
    .hero-h1 {
      font-family: 'Baloo 2', sans-serif; font-weight: 800;
      font-size: clamp(2.7rem, 4vw, 4.55rem);
      color: var(--yellow);
      text-shadow: 4px 6px 0 var(--shadow-soft);
      line-height: 1.02;
      display: inline-block; width: max-content; max-width: 100%; margin-bottom: 26px;
      letter-spacing: .01em;
    }
    .hero-h1-line { display: block; white-space: nowrap; }
    .hero-sub {
      font-family: 'Nunito', sans-serif; font-weight: 600;
      font-size: clamp(1.05rem, 1.8vw, 1.2rem);
      color: rgba(255,255,255,.92); margin-bottom: 40px;
      line-height: 1.75; max-width: 460px;
    }
    .hero-stats {
      display: flex; gap: 28px; margin-bottom: 36px; flex-wrap: wrap;
    }
    .hero-stat { display: flex; flex-direction: column; gap: 3px; }
    .hero-stat-num {
      font-family: 'Fredoka', sans-serif; font-weight: 700; font-size: 1.7rem;
      color: var(--yellow); text-shadow: 2px 3px 0 var(--shadow-soft);
      line-height: 1; letter-spacing: .01em;
    }
    .hero-stat-lbl {
      font-family: 'Nunito', sans-serif; font-weight: 700;
      font-size: .74rem; color: rgba(255,255,255,.7);
      text-transform: uppercase; letter-spacing: .08em;
    }
    .hero-stat-div {
      width: 1px; background: rgba(255,255,255,.2); align-self: stretch;
    }
    .hero-btns { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 36px; align-items: center; }
    .hero-store-row { display: flex; gap: 14px; flex-wrap: wrap; }
    .hero-rating { display: inline-flex; align-items: center; gap: 10px; }
    .rating-stars { font-size: 1.1rem; letter-spacing: 2px; color: var(--yellow); }
    .rating-text {
      font-family: 'Nunito', sans-serif; font-weight: 700;
      font-size: .88rem; color: rgba(255,255,255,.8);
    }

    /* ── HERO VIDEO ── */
    .hero-video {
      flex-shrink: 0; position: relative;
      width: 616px; border-radius: 12px;
      background: #18162B;
      padding: 12px;
      border: 3px solid rgba(255,255,255,.2);
      box-shadow: 0 0 60px rgba(255,210,63,.25), 0 0 100px rgba(79,45,201,.35), 8px 14px 0 var(--shadow-md);
      aspect-ratio: 16/9;
      transform: rotate(6deg);
      animation: glow-pulse 4s ease-in-out infinite;
    }
    .hero-video video {
      width: 100%; height: 100%; display: block; border: none;
      object-fit: cover; border-radius: 4px;
    }
    .hero-video-mute {
      position: absolute; bottom: 14px; left: 14px;
      width: 40px; height: 40px; border-radius: 50%;
      background: rgba(0,0,0,.5); backdrop-filter: blur(8px);
      border: 1.5px solid rgba(255,255,255,.35);
      cursor: pointer; display: flex; align-items: center; justify-content: center;
      font-size: 1rem; transition: all .2s; z-index: 10; color: white;
    }
    .hero-video-mute:hover { background: rgba(255,210,63,.85); color: var(--ink); }

    .hero-visual { position: relative; flex-shrink: 0; padding-bottom: 90px; padding-right: 30px; }
    .hero-character {
      position: absolute; bottom: -156px; right: -252px;
      width: 600px; pointer-events: none; z-index: 3;
      filter: drop-shadow(4px 6px 0 var(--shadow-soft));
      animation: float-b 5s ease-in-out infinite;
    }

    /* ── WAVES ── */
    .wave-pu-ink { background: var(--purple); line-height: 0; }
    .wave-pu-ink svg { display: block; }
    .wave-ink-paper { background: var(--ink); color: var(--paper); line-height: 0; margin-bottom: -1px; }
    .wave-ink-paper svg { display: block; }
    .wave-fh2-paper { background: var(--paper); color: var(--paper); line-height: 0; margin-top: -6px; margin-bottom: -1px; position: relative; z-index: 3; }
    .wave-fh2-paper svg { display: block; height: 62px; }
    .wave-paper-ink { background: var(--paper); color: var(--ink); line-height: 0; margin-bottom: -1px; }
    .wave-paper-ink svg { display: block; }
    .wave-pu-yellow { background: var(--purple); line-height: 0; }
    .wave-pu-yellow svg { display: block; }
    .wave-yellow-pink { background: var(--yellow); line-height: 0; }
    .wave-yellow-pink svg { display: block; }
    .wave-pink-paper { background: #F31D6F; line-height: 0; }
    .wave-pink-paper svg { display: block; }
    .wave-paper-sky { background: var(--paper); line-height: 0; }
    .wave-paper-sky svg { display: block; }

    /* ════════════════════════════
       MARQUEE
    ════════════════════════════ */
    .marquee-strip {
      background: var(--ink);
      border-top: 3px solid var(--yellow);
      border-bottom: 3px solid var(--yellow);
      padding: 14px 0; overflow: hidden; white-space: nowrap;
    }
    .marquee-inner {
      display: inline-flex;
      animation: marquee-run 26s linear infinite;
    }
    .marquee-item {
      display: inline-flex; align-items: center; gap: 14px;
      padding: 0 40px;
      font-family: 'Fredoka', sans-serif; font-weight: 600;
      font-size: 1rem; color: var(--yellow);
      letter-spacing: .06em; text-transform: uppercase;
    }
    .m-dot {
      width: 8px; height: 8px; border-radius: 50%;
      background: var(--pink); flex-shrink: 0;
    }

    /* ════════════════════════════
       NEXT GENERATION
    ════════════════════════════ */
    #next-gen {
      background: var(--paper);
      padding: 104px 48px 36px;
    }
    .next-gen-wrap { max-width: 1280px; margin: 0 auto; }
    .next-gen-head {
      text-align: center;
      margin-bottom: 54px;
    }
    .next-gen-hed {
      font-family: 'Fredoka', sans-serif; font-weight: 700;
      font-size: clamp(2.5rem, 4.8vw, 4.5rem);
      line-height: 1.08;
      color: #5E3D96;
      letter-spacing: -.02em;
      text-shadow: 0 2px 0 rgba(255,255,255,.55);
    }
    .next-gen-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 32px;
      align-items: stretch;
    }
    .next-gen-card {
      position: relative;
      min-height: 710px;
      border-radius: 34px;
      overflow: hidden;
      border: 3px solid rgba(26,15,74,.1);
      box-shadow: 0 20px 40px rgba(26,15,74,.12);
      padding: 30px 28px 26px;
      display: flex;
      flex-direction: column;
    }
    .next-gen-card--thinkers {
      background:
        linear-gradient(180deg, rgba(255,255,255,.12) 0%, rgba(255,255,255,0) 22%),
        #F38DC4;
    }
    .next-gen-card--collaborators {
      background:
        linear-gradient(180deg, rgba(255,255,255,.14) 0%, rgba(255,255,255,0) 24%),
        #FFD919;
    }
    .next-gen-card--leaders {
      background:
        linear-gradient(180deg, rgba(255,255,255,.1) 0%, rgba(255,255,255,0) 24%),
        #19D0BA;
    }
    .next-gen-visual {
      position: relative;
      height: 318px;
      border-radius: 28px;
      overflow: hidden;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      margin-bottom: 28px;
      isolation: isolate;
    }
    .next-gen-visual::before {
      content: "";
      position: absolute;
      width: 250px;
      height: 250px;
      top: 22px;
      left: 50%;
      transform: translateX(-50%);
      background:
        radial-gradient(circle at 50% 50%, rgba(255,255,255,.22) 0 25%, transparent 25%),
        radial-gradient(circle at 50% 50%, transparent 0 48%, rgba(255,255,255,.18) 48% 62%, transparent 62%),
        radial-gradient(circle at 50% 50%, #B56AF5 0 28%, transparent 28%);
      filter: saturate(1.08);
      opacity: .92;
      z-index: 0;
      clip-path: polygon(50% 0%, 63% 15%, 82% 8%, 83% 30%, 100% 38%, 88% 55%, 98% 74%, 76% 78%, 74% 100%, 50% 88%, 26% 100%, 24% 78%, 2% 74%, 12% 55%, 0% 38%, 17% 30%, 18% 8%, 37% 15%);
    }
    .next-gen-card--collaborators .next-gen-visual::before {
      background:
        radial-gradient(circle at 50% 50%, rgba(255,255,255,.18) 0 22%, transparent 22%),
        radial-gradient(circle at 50% 50%, transparent 0 48%, rgba(41,160,69,.16) 48% 63%, transparent 63%),
        radial-gradient(circle at 50% 50%, #3AAE3E 0 29%, transparent 29%);
    }
    .next-gen-card--leaders .next-gen-visual::before {
      background:
        radial-gradient(circle at 50% 50%, rgba(255,255,255,.16) 0 22%, transparent 22%),
        radial-gradient(circle at 50% 50%, transparent 0 48%, rgba(255,255,255,.2) 48% 62%, transparent 62%),
        radial-gradient(circle at 50% 50%, #FF9CE3 0 28%, transparent 28%);
    }
    .next-gen-card--thinkers .next-gen-visual::before,
    .next-gen-card--collaborators .next-gen-visual::before,
    .next-gen-card--leaders .next-gen-visual::before {
      display: none;
    }
    .next-gen-visual::after {
      content: "";
      position: absolute;
      inset: auto 26px 22px;
      height: 84px;
      border-radius: 50%;
      background: radial-gradient(circle, rgba(26,15,74,.18) 0%, rgba(26,15,74,0) 70%);
      filter: blur(16px);
      z-index: 0;
    }
    .next-gen-doodle,
    .next-gen-figure,
    .next-gen-buddy,
    .next-gen-card-characters {
      position: absolute;
      z-index: 1;
    }
    .next-gen-card-characters {
      left: 50%;
      bottom: -6px;
      width: min(94%, 360px);
      max-height: 100%;
      transform: translateX(-50%);
      object-fit: contain;
      filter: drop-shadow(0 16px 24px rgba(26,15,74,.2));
    }
    .next-gen-card-characters--shine {
      width: min(96%, 372px);
      bottom: -8px;
    }
    .next-gen-figure {
      bottom: -4px;
      left: 50%;
      transform: translateX(-50%);
      width: 188px;
      object-fit: contain;
      filter: drop-shadow(0 16px 24px rgba(26,15,74,.22));
    }
    .next-gen-card--thinkers .next-gen-figure {
      width: 202px;
      transform: translateX(-38%);
    }
    .next-gen-card--collaborators .next-gen-figure {
      width: 174px;
      transform: translateX(-8%);
    }
    .next-gen-buddy {
      bottom: -6px;
      left: 50%;
      width: 172px;
      object-fit: contain;
      filter: drop-shadow(0 14px 22px rgba(26,15,74,.18));
    }
    .next-gen-card--thinkers .next-gen-buddy {
      transform: translateX(-78%) scaleX(-1);
    }
    .next-gen-card--collaborators .next-gen-buddy {
      transform: translateX(-96%);
      width: 160px;
    }
    .next-gen-shield {
      position: absolute;
      bottom: 10px;
      left: 50%;
      transform: translateX(-50%);
      width: 194px;
      height: 230px;
      border-radius: 44px 44px 54px 54px;
      background: linear-gradient(180deg, #3E9AFF 0%, #1E5ED4 100%);
      border: 8px solid rgba(255,255,255,.86);
      box-shadow: 0 14px 24px rgba(26,15,74,.2);
      clip-path: polygon(10% 8%, 90% 8%, 90% 68%, 50% 100%, 10% 68%);
      z-index: 1;
    }
    .next-gen-shield::before {
      content: "";
      position: absolute;
      top: 22px;
      left: 50%;
      transform: translateX(-50%);
      width: 106px;
      height: 40px;
      background:
        radial-gradient(circle, #FF3D8A 0 10px, transparent 11px) left center / 34px 28px no-repeat,
        radial-gradient(circle, #FFD23F 0 12px, transparent 13px) center center / 36px 32px no-repeat,
        radial-gradient(circle, #4DA8FF 0 10px, transparent 11px) right center / 34px 28px no-repeat;
    }
    .next-gen-shield::after {
      content: "";
      position: absolute;
      inset: 78px 24px 30px;
      background:
        linear-gradient(180deg, rgba(255,255,255,.1), rgba(255,255,255,.02)),
        radial-gradient(circle at 50% 32%, rgba(255,255,255,.22) 0 12%, transparent 13%),
        repeating-linear-gradient(180deg, transparent 0 28px, rgba(255,210,63,.75) 28px 31px, transparent 31px 44px);
      border-radius: 18px 18px 36px 36px;
      opacity: .9;
    }
    .next-gen-leaf,
    .next-gen-loop,
    .next-gen-zig {
      position: absolute;
      z-index: 2;
      pointer-events: none;
    }
    .next-gen-leaf {
      width: 84px;
      height: 84px;
      border-radius: 28px;
      background: linear-gradient(180deg, #D54BFF, #7E57FF);
      border: 6px solid rgba(26,15,74,.12);
      top: 52px;
      right: 34px;
      transform: rotate(15deg);
      box-shadow: 0 12px 18px rgba(26,15,74,.12);
    }
    .next-gen-leaf::before {
      content: "";
      position: absolute;
      inset: 16px;
      border-radius: 50%;
      border: 6px solid rgba(255,255,255,.8);
      border-top-color: transparent;
      border-right-color: transparent;
      transform: rotate(-28deg);
    }
    .next-gen-loop {
      left: 26px;
      bottom: 34px;
      width: 92px;
      height: 60px;
      border: 10px solid #7C4DE2;
      border-top-color: transparent;
      border-left-color: transparent;
      border-radius: 50%;
      transform: rotate(28deg);
      opacity: .92;
    }
    .next-gen-zig {
      right: 16px;
      bottom: 36px;
      width: 44px;
      height: 112px;
      background: linear-gradient(180deg, #FFB82E, #FFB82E);
      clip-path: polygon(0 0, 100% 0, 58% 30%, 100% 30%, 42% 64%, 82% 64%, 0 100%, 22% 66%, 0 66%, 46% 30%, 8% 30%);
      filter: drop-shadow(0 6px 10px rgba(255,184,46,.2));
    }
    .next-gen-card-title {
      font-family: 'Fredoka', sans-serif;
      font-weight: 700;
      font-size: clamp(2rem, 3vw, 2.35rem);
      color: #5E3D96;
      line-height: 1.05;
      text-align: center;
      margin-bottom: 12px;
    }
    .next-gen-card-desc {
      font-family: 'Nunito', sans-serif;
      font-size: 1rem;
      font-weight: 600;
      text-align: center;
      color: rgba(94,61,150,.94);
      line-height: 1.48;
      max-width: 330px;
      margin: 0 auto 24px;
    }
    .next-gen-tags {
      margin-top: auto;
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      justify-content: center;
      padding-top: 8px;
    }
    .next-gen-tag {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 42px;
      padding: 10px 18px;
      border-radius: 999px;
      font-family: 'Nunito', sans-serif;
      font-size: .96rem;
      font-weight: 800;
      color: rgba(94,61,150,.95);
      background: rgba(255,255,255,.35);
      border: 2px solid rgba(255,255,255,.26);
      backdrop-filter: blur(6px);
    }
    .next-gen-card--collaborators .next-gen-tag {
      background: rgba(255,250,214,.44);
    }
    .next-gen-card--leaders .next-gen-tag {
      background: rgba(225,255,248,.35);
    }
    .next-gen-signup {
      display: grid;
      gap: 18px;
      justify-items: center;
      margin-top: 40px;
      text-align: center;
    }
    .next-gen-form {
      width: min(100%, 640px);
      padding: 10px;
      border-radius: 24px;
      border: 3px solid rgba(26,15,74,.18);
      background: rgba(255,255,255,.92);
      box-shadow: 0 14px 28px rgba(26,15,74,.12);
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 10px;
    }
    .next-gen-form input {
      border: none;
      background: transparent;
      font-family: 'Nunito', sans-serif;
      font-size: 1.3rem;
      font-weight: 700;
      color: var(--ink);
      padding: 0 22px;
      min-width: 0;
    }
    .next-gen-form input::placeholder {
      color: rgba(94,61,150,.62);
    }
    .next-gen-form input:focus-visible {
      outline: none;
    }
    .waitlist-form {
      position: relative;
    }

    .waitlist-label {
      display: block;
      grid-column: 1 / -1;
      width: 100%;
      margin: 0 0 10px;
      color: var(--purple);
      font-family: 'Nunito', sans-serif;
      font-size: .95rem;
      font-weight: 900;
      text-align: left;
    }

    .waitlist-form input:disabled {
      cursor: not-allowed;
      background: rgba(255, 255, 255, .72);
      color: rgba(33, 20, 84, .58);
    }

    .waitlist-form button:disabled {
      cursor: not-allowed;
      opacity: .78;
      filter: saturate(.82);
      transform: none;
    }

    .waitlist-form.is-loading button {
      cursor: wait;
      opacity: .82;
      filter: saturate(.86);
      transform: none;
    }

    .waitlist-status {
      min-height: 1.4em;
      margin: -6px 0 0;
      font-family: 'Nunito', sans-serif;
      font-size: .92rem;
      font-weight: 900;
      line-height: 1.4;
      text-align: center;
    }

    .waitlist-status.is-success {
      color: #23E3C7;
    }

    .waitlist-status.is-error {
      color: #FFE15C;
    }

    .waitlist-pending-note {
      margin-top: 10px;
      font-family: 'Nunito', sans-serif;
      font-size: .82rem;
      font-weight: 800;
      color: rgba(255, 255, 255, .82);
      text-align: center;
    }

    .next-gen-signup .waitlist-pending-note {
      color: rgba(102, 65, 167, .82);
    }
    .next-gen-submit {
      border: none;
      border-radius: 18px;
      background: linear-gradient(135deg, #A24FFF, #8C45F8);
      color: #fff;
      font-family: 'Fredoka', sans-serif;
      font-size: 1.15rem;
      font-weight: 700;
      padding: 20px 36px;
      cursor: pointer;
      box-shadow: inset 0 2px 0 rgba(255,255,255,.22);
    }
    .next-gen-note {
      font-family: 'Nunito', sans-serif;
      font-size: 1rem;
      font-weight: 800;
      color: rgba(94,61,150,.95);
    }

    /* ════════════════════════════
       KIDNATION INTERACTIVES
    ════════════════════════════ */
    #interactives {
      background: #1977F2;
      padding: 104px 48px 110px;
    }
    .interactives-wrap {
      max-width: 1280px;
      margin: 0 auto;
    }
    .interactives-head {
      max-width: 1120px;
      margin: 0 auto 52px;
      text-align: center;
    }
    .interactives-hed {
      font-family: 'Fredoka', sans-serif;
      font-weight: 600;
      font-size: clamp(2.35rem, 4.5vw, 4.35rem);
      line-height: 1.08;
      color: #fff;
      letter-spacing: -.025em;
    }
    .interactives-hed .pink { color: #FF8BDA; }
    .interactives-hed .yellow { color: #FFD23F; }
    .interactives-hed .mint { color: #4CE0B3; }
    .interactives-stage {
      position: relative;
      max-width: 1008px;
      margin: 0 auto 44px;
      border-radius: 30px;
      overflow: hidden;
      border: 3px solid rgba(255,255,255,.26);
      box-shadow: 0 26px 50px rgba(9,34,89,.28);
      background: linear-gradient(180deg, rgba(255,255,255,.2), rgba(255,255,255,.06));
    }
    .interactives-stage img {
      display: block;
      width: 100%;
      height: auto;
      aspect-ratio: 16 / 9;
      object-fit: cover;
    }
    .interactives-badge {
      position: absolute;
      z-index: 2;
      border-radius: 999px;
      border: 3px solid rgba(255,255,255,.72);
      background: rgba(255,255,255,.9);
      box-shadow: 0 8px 18px rgba(9,34,89,.16);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #6B42E8;
      font-family: 'Fredoka', sans-serif;
      font-weight: 700;
    }
    .interactives-badge--pause {
      left: 22px;
      bottom: 26px;
      width: 58px;
      height: 58px;
      font-size: 1.7rem;
    }
    .interactives-badge--swipe {
      left: -20px;
      top: 50%;
      transform: translateY(-50%);
      width: 64px;
      height: 64px;
      font-size: 1.35rem;
    }
    .interactives-logo {
      position: absolute;
      top: 22px;
      right: 22px;
      width: 78px;
      height: 78px;
      border-radius: 50%;
      background: radial-gradient(circle at 35% 35%, #8DE8FF 0 20%, #4CE0B3 20% 46%, #FFD23F 46% 72%, #6B42E8 72%);
      border: 4px solid rgba(255,255,255,.65);
      box-shadow: 0 10px 20px rgba(9,34,89,.22);
    }
    .interactives-logo::before {
      content: "";
      position: absolute;
      inset: 22px 16px 18px 28px;
      border-radius: 40px 34px 34px 14px;
      background: #fff;
      transform: rotate(-8deg);
      opacity: .92;
    }
    .interactives-logo::after {
      content: "";
      position: absolute;
      top: 16px;
      left: 28px;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: #1A0F4A;
      box-shadow: 0 22px 0 #1A0F4A, 18px 11px 0 #1A0F4A;
    }
    .interactives-caption {
      position: absolute;
      right: 22px;
      bottom: 22px;
      z-index: 2;
      background: rgba(82, 101, 128, .88);
      color: #fff;
      font-family: 'Fredoka', sans-serif;
      font-size: 1.05rem;
      font-weight: 700;
      line-height: 1.05;
      padding: 10px 14px;
      border-radius: 14px;
      box-shadow: 0 8px 16px rgba(9,34,89,.18);
    }
    .interactives-toolbar {
      position: absolute;
      left: 50%;
      bottom: 0;
      transform: translate(-50%, 32%);
      z-index: 2;
      width: min(340px, 54%);
      height: 96px;
      border-radius: 24px;
      background: #5B418E;
      box-shadow: 0 18px 26px rgba(9,34,89,.24);
      display: flex;
      align-items: flex-end;
      justify-content: center;
      gap: 12px;
      padding: 18px 18px 0;
    }
    .interactives-pencil {
      width: 26px;
      border-radius: 999px 999px 6px 6px;
      box-shadow: inset 0 -8px 0 rgba(0,0,0,.08);
    }
    .interactives-pencil--pink { height: 78px; background: #FF7BC8; }
    .interactives-pencil--red { height: 84px; background: #E53935; }
    .interactives-pencil--orange { height: 86px; background: #FF8C42; }
    .interactives-pencil--yellow { height: 92px; background: #FFD23F; }
    .interactives-pencil--peach { height: 80px; background: #F9AF74; }
    .interactives-tool-dot {
      position: absolute;
      left: 18px;
      bottom: 24px;
      width: 32px;
      height: 32px;
      border-radius: 50%;
      background: #FFF2B2;
      box-shadow: inset 0 0 0 10px #fff;
    }
    .interactives-tool-slider {
      position: absolute;
      right: 18px;
      bottom: 31px;
      width: 70px;
      height: 14px;
      border-radius: 999px;
      background: rgba(255,255,255,.42);
    }
    .interactives-tool-slider::after {
      content: "";
      position: absolute;
      right: 10px;
      top: 50%;
      transform: translateY(-50%);
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: #fff;
      box-shadow: 0 2px 6px rgba(9,34,89,.18);
    }
    .interactives-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 22px;
      align-items: start;
    }
    .interactive-card {
      color: #fff;
    }
    .interactive-thumb {
      position: relative;
      height: 172px;
      border-radius: 20px;
      overflow: hidden;
      border: 4px solid var(--accent, #FFD23F);
      box-shadow: 0 14px 24px rgba(9,34,89,.18);
      background: rgba(255,255,255,.08);
      margin-bottom: 14px;
    }
    .interactive-thumb img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }
    .interactive-card-title {
      font-family: 'Fredoka', sans-serif;
      font-size: 1.95rem;
      font-weight: 700;
      line-height: 1;
      color: var(--accent, #FFD23F);
      margin-bottom: 8px;
      letter-spacing: -.02em;
    }
    .interactive-card-desc {
      font-family: 'Nunito', sans-serif;
      font-size: 1.05rem;
      font-weight: 700;
      line-height: 1.4;
      color: rgba(255,255,255,.96);
    }
    .interactive-chip {
      position: absolute;
      left: 14px;
      top: 14px;
      width: 42px;
      height: 42px;
      border-radius: 50%;
      background: rgba(255,255,255,.96);
      border: 3px solid var(--accent, #FFD23F);
      box-shadow: 0 6px 10px rgba(9,34,89,.15);
    }
    .interactive-chip::before,
    .interactive-chip::after {
      content: "";
      position: absolute;
      inset: 0;
      margin: auto;
      background: #5E3D96;
    }
    .interactive-chip--touch::before {
      width: 16px; height: 22px; border-radius: 10px 10px 4px 4px;
      clip-path: polygon(36% 0, 62% 0, 62% 52%, 90% 52%, 90% 100%, 10% 100%, 10% 52%, 36% 52%);
    }
    .interactive-chip--touch::after {
      width: 8px; height: 8px; border-radius: 50%;
      top: 8px; left: 26px; right: auto; bottom: auto;
      box-shadow: 12px 4px 0 #5E3D96;
      background: transparent;
      border: 2px solid #5E3D96;
    }
    .interactive-chip--camera::before {
      width: 20px; height: 16px; border-radius: 4px;
      box-shadow: 0 -6px 0 -2px #5E3D96;
    }
    .interactive-chip--camera::after {
      width: 8px; height: 8px; border-radius: 50%;
      background: rgba(255,255,255,.96);
      box-shadow: inset 0 0 0 3px #5E3D96;
    }
    .interactive-chip--microphone::before {
      width: 12px; height: 18px; border-radius: 999px;
      top: 9px;
    }
    .interactive-chip--microphone::after {
      width: 16px; height: 14px; background: transparent;
      border: 3px solid #5E3D96; border-top: none;
      border-radius: 0 0 12px 12px;
      top: 16px;
    }
    .interactive-chip--motion::before {
      width: 18px; height: 18px; border-radius: 50%;
    }
    .interactive-chip--motion::after {
      width: 28px; height: 28px; background: transparent;
      border: 3px solid #5E3D96; border-left-color: transparent; border-bottom-color: transparent;
      border-radius: 50%;
      transform: rotate(12deg);
    }

    /* ════════════════════════════
       FAVORITE CHARACTERS
    ════════════════════════════ */
    #characters-showcase {
      background: var(--paper);
      padding: 104px 0 110px;
      overflow: hidden;
    }
    .characters-showcase-inner {
      max-width: 1320px;
      margin: 0 auto;
      padding: 0 48px;
    }
    .characters-showcase-head {
      max-width: 980px;
      margin: 0 auto 26px;
      text-align: center;
    }
    .characters-showcase-hed {
      font-family: 'Fredoka', sans-serif;
      font-weight: 700;
      font-size: clamp(2.35rem, 4.5vw, 4.3rem);
      line-height: 1.06;
      color: #5E3D96;
      letter-spacing: -.03em;
    }
    .characters-showcase-hed .sky {
      color: #2E8DFF;
    }
    .characters-hero {
      position: relative;
      max-width: 1120px;
      margin: 0 auto 30px;
      border-radius: 34px;
      overflow: hidden;
      box-shadow: 0 28px 54px rgba(26, 15, 74, .16);
    }
    .characters-hero-art {
      display: block;
      width: 100%;
      aspect-ratio: 2730 / 1536;
      object-fit: cover;
    }
    .characters-wordmarks {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      gap: 22px 28px;
      max-width: 980px;
      margin: 0 auto 48px;
      color: rgba(94,61,150,.58);
    }
    .characters-wordmark {
      font-family: 'Fredoka', sans-serif;
      font-size: clamp(1.45rem, 2vw, 2.3rem);
      font-weight: 700;
      line-height: .95;
      letter-spacing: -.03em;
      text-align: center;
    }
    .characters-wordmark--tiny {
      font-size: clamp(1.05rem, 1.4vw, 1.55rem);
      line-height: 1.12;
      letter-spacing: -.01em;
    }
    .video-library-wrap {
      position: relative;
      overflow: hidden;
      padding: 8px 0 0;
      display: grid;
      gap: 18px;
    }
    .video-library-wrap::before,
    .video-library-wrap::after {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      width: 72px;
      z-index: 3;
      pointer-events: none;
    }
    .video-library-wrap::before {
      left: 0;
      background: linear-gradient(90deg, var(--paper) 10%, rgba(255,251,242,0));
    }
    .video-library-wrap::after {
      right: 0;
      background: linear-gradient(270deg, var(--paper) 10%, rgba(255,251,242,0));
    }
    .video-library-row {
      overflow: hidden;
    }
    .video-library-track {
      display: flex;
      align-items: center;
      gap: 18px;
      width: max-content;
      min-width: max-content;
      padding: 0 48px;
      animation: marquee-run 30s linear infinite;
      will-change: transform;
    }
    .video-library-row--bottom .video-library-track {
      animation-direction: reverse;
      animation-duration: 30s;
      padding-left: 184px;
    }
    .video-library-wrap:hover .video-library-track {
      animation-play-state: paused;
    }
    .video-library-set {
      display: flex;
      align-items: center;
      gap: 18px;
    }
    .video-library-set[aria-hidden="true"] {
      pointer-events: none;
    }
    .video-library-card {
      position: relative;
      flex: 0 0 clamp(240px, 21vw, 292px);
      aspect-ratio: 16 / 9;
      border-radius: 28px;
      overflow: hidden;
      background:
        radial-gradient(circle at 18% 20%, rgba(255,255,255,.16), rgba(255,255,255,0) 36%),
        linear-gradient(135deg, #5C3FA5, #1B7AFF);
      box-shadow: 0 18px 32px rgba(26,15,74,.16);
      border: 3px solid rgba(255,255,255,.6);
      isolation: isolate;
    }
    .video-library-card--mint { background: radial-gradient(circle at 18% 20%, rgba(255,255,255,.18), rgba(255,255,255,0) 34%), linear-gradient(135deg, #21C9AF, #2E8DFF); }
    .video-library-card--gold { background: radial-gradient(circle at 18% 20%, rgba(255,255,255,.18), rgba(255,255,255,0) 34%), linear-gradient(135deg, #FFC92E, #FF8C43); }
    .video-library-card--pink { background: radial-gradient(circle at 18% 20%, rgba(255,255,255,.18), rgba(255,255,255,0) 34%), linear-gradient(135deg, #FF65B8, #9D63FF); }
    .video-library-card--sky { background: radial-gradient(circle at 18% 20%, rgba(255,255,255,.18), rgba(255,255,255,0) 34%), linear-gradient(135deg, #52C4FF, #5885FF); }
    .video-library-card::after {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(180deg, rgba(13,18,46,0) 55%, rgba(13,18,46,.36) 100%);
      z-index: 1;
      pointer-events: none;
    }
    .video-library-card iframe {
      width: 100%;
      height: 100%;
      display: block;
      background: #1A0F4A;
      border: 0;
    }
    .video-library-chip,
    .video-library-title {
      display: none;
    }
    @media (prefers-reduced-motion: reduce) {
      .video-library-track {
        animation: none !important;
      }
    }

    /* ════════════════════════════
       SOCIAL FEED
    ════════════════════════════ */
    #social-feed {
      background: linear-gradient(180deg, #FFF8E8 0%, #FFF3D5 100%);
      padding: 104px 48px;
    }
    .social-feed-inner {
      max-width: 1260px;
      margin: 0 auto;
    }
    .social-feed-head {
      text-align: center;
      max-width: 820px;
      margin: 0 auto 42px;
    }
    .social-feed-hed {
      font-family: 'Fredoka', sans-serif;
      font-size: clamp(2.35rem, 4.5vw, 4.1rem);
      font-weight: 700;
      line-height: 1.05;
      color: var(--ink);
      letter-spacing: -.03em;
      margin-bottom: 12px;
    }
    .social-feed-sub {
      font-family: 'Nunito', sans-serif;
      font-size: 1.08rem;
      font-weight: 700;
      line-height: 1.6;
      color: rgba(26,15,74,.72);
    }
    .social-feed-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 28px;
    }
    .social-card {
      display: grid;
      gap: 14px;
      align-content: start;
    }
    .social-follow-row {
      display: flex;
      justify-content: center;
    }
    .social-follow-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 54px;
      padding: 0 26px;
      border-radius: 999px;
      text-decoration: none;
      font-family: 'Fredoka', sans-serif;
      font-size: 1rem;
      font-weight: 700;
      color: #fff;
      box-shadow: 0 8px 18px rgba(26,15,74,.14);
    }
    .social-follow-btn--instagram {
      background: linear-gradient(135deg, #FF4FA2, #FF8B4F);
    }
    .social-follow-btn--tiktok {
      background: linear-gradient(135deg, #111827, #00CDB2);
    }
    .social-embed-shell {
      border-radius: 24px;
      overflow: hidden;
      background: #fff;
      border: 2px solid rgba(26,15,74,.08);
      box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
      min-height: 520px;
    }
    .social-embed-shell iframe {
      width: 100%;
      min-height: 520px;
      border: 0;
      display: block;
    }
    .social-embed-shell .instagram-media,
    .social-embed-shell .tiktok-embed {
      margin: 0 auto !important;
      max-width: 100% !important;
      min-width: 100% !important;
    }

    /* ════════════════════════════
       FAQ
    ════════════════════════════ */
    #faq {
      background: #143A6B;
      padding: 96px 48px 104px;
      color: #fff;
    }
    .faq-inner {
      max-width: 860px;
      margin: 0 auto;
    }
    .faq-head {
      text-align: center;
      margin-bottom: 36px;
    }
    .faq-mascot {
      width: min(450px, calc(100vw - 32px));
      aspect-ratio: 16 / 9;
      margin: 0 auto 22px;
      border-radius: 24px;
      background: #fff;
      box-shadow: 0 14px 24px rgba(8,20,43,.22);
      position: relative;
      overflow: hidden;
    }
    .faq-mascot::before {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      box-shadow: inset 0 0 0 4px rgba(255,255,255,.72);
      z-index: 2;
      pointer-events: none;
    }
    .faq-mascot img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: 45% 52%;
      pointer-events: none;
    }
    .faq-hed {
      font-family: 'Fredoka', sans-serif;
      font-size: clamp(2.35rem, 4.2vw, 3.8rem);
      font-weight: 600;
      line-height: 1.08;
      color: #fff;
      letter-spacing: -.03em;
    }
    .faq-list {
      display: grid;
      gap: 0;
    }
    .faq-item {
      border-bottom: 2px solid rgba(255,255,255,.14);
    }
    .faq-item summary {
      list-style: none;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
      padding: 22px 0 18px;
    }
    .faq-item summary::-webkit-details-marker {
      display: none;
    }
    .faq-q {
      font-family: 'Fredoka', sans-serif;
      font-size: clamp(1.45rem, 2.2vw, 2rem);
      font-weight: 600;
      line-height: 1.14;
      letter-spacing: -.02em;
    }
    .faq-chevron {
      flex-shrink: 0;
      width: 24px;
      height: 24px;
      position: relative;
      transition: transform .2s ease;
    }
    .faq-chevron::before,
    .faq-chevron::after {
      content: "";
      position: absolute;
      top: 10px;
      width: 12px;
      height: 4px;
      border-radius: 999px;
      background: currentColor;
    }
    .faq-chevron::before {
      left: 1px;
      transform: rotate(45deg);
    }
    .faq-chevron::after {
      right: 1px;
      transform: rotate(-45deg);
    }
    .faq-item[open] .faq-chevron {
      transform: rotate(180deg);
    }
    .faq-a {
      padding: 0 0 20px;
      max-width: 720px;
      font-family: 'Nunito', sans-serif;
      font-size: 1.03rem;
      font-weight: 700;
      line-height: 1.6;
      color: rgba(255,255,255,.88);
    }
    .faq-item--pink .faq-q,
    .faq-item--pink .faq-chevron { color: #FF8BDA; }
    .faq-item--yellow .faq-q,
    .faq-item--yellow .faq-chevron { color: #FFBE45; }
    .faq-item--gold .faq-q,
    .faq-item--gold .faq-chevron { color: #FFE34F; }
    .faq-item--mint .faq-q,
    .faq-item--mint .faq-chevron { color: #23E3C7; }
    .faq-item--sky .faq-q,
    .faq-item--sky .faq-chevron { color: #54B9FF; }

    /* ════════════════════════════
       FREE TRIAL CTA
    ════════════════════════════ */
    #trial-cta {
      background: #1977F2;
      padding: 104px 48px;
      color: #fff;
      overflow: hidden;
    }
    .trial-cta-inner {
      max-width: 1240px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(280px, .75fr);
      gap: 40px;
      align-items: center;
    }
    .trial-cta-copy {
      max-width: 760px;
    }
    .trial-cta-hed {
      font-family: 'Fredoka', sans-serif;
      font-size: clamp(3rem, 6vw, 5.6rem);
      font-weight: 600;
      line-height: .96;
      letter-spacing: -.04em;
      margin-bottom: 36px;
      color: #fff;
    }
    .trial-cta-hed .mint {
      color: #23E3C7;
    }
    .trial-cta-points {
      list-style: none;
      display: grid;
      gap: 18px;
      margin-bottom: 38px;
      padding: 0;
    }
    .trial-cta-points li {
      display: flex;
      align-items: flex-start;
      gap: 14px;
      font-family: 'Nunito', sans-serif;
      font-size: clamp(1.1rem, 1.8vw, 1.35rem);
      font-weight: 700;
      line-height: 1.35;
      color: rgba(255,255,255,.98);
    }
    .trial-cta-check {
      flex-shrink: 0;
      font-family: 'Fredoka', sans-serif;
      font-size: 1.55rem;
      line-height: 1;
      color: #23E3C7;
      transform: translateY(2px);
    }
    .trial-cta-form {
      width: min(100%, 760px);
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 12px;
      padding: 10px;
      border-radius: 26px;
      background: rgba(255,251,242,.96);
      box-shadow: 0 18px 28px rgba(12,31,71,.2);
      margin-bottom: 16px;
    }
    .trial-cta-form input {
      border: none;
      background: transparent;
      min-width: 0;
      padding: 0 22px;
      min-height: 78px;
      font-family: 'Nunito', sans-serif;
      font-size: 1.35rem;
      font-weight: 800;
      color: var(--ink);
    }
    .trial-cta-form input::placeholder {
      color: rgba(94,61,150,.55);
    }
    .trial-cta-form input:focus-visible {
      outline: none;
    }
    .trial-cta-submit {
      border: none;
      border-radius: 20px;
      background: linear-gradient(135deg, #AA58FF, #8C45F8);
      color: #fff;
      font-family: 'Fredoka', sans-serif;
      font-size: 1.2rem;
      font-weight: 700;
      padding: 0 44px;
      min-height: 78px;
      cursor: pointer;
      box-shadow: inset 0 2px 0 rgba(255,255,255,.18);
    }
    .trial-cta-note {
      font-family: 'Nunito', sans-serif;
      font-size: 1.05rem;
      font-weight: 800;
      color: rgba(255,255,255,.96);
    }
    .trial-cta-visual {
      position: relative;
      min-height: 520px;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .trial-cta-glow {
      position: absolute;
      inset: 10% 6% 6%;
      background:
        radial-gradient(circle at 50% 32%, rgba(255,210,63,.38) 0 24%, rgba(255,210,63,0) 56%),
        radial-gradient(circle at 60% 38%, rgba(76,224,179,.22) 0 22%, rgba(76,224,179,0) 56%);
      filter: blur(10px);
      pointer-events: none;
    }
    .trial-cta-mascot {
      position: relative;
      z-index: 1;
      width: min(100%, 430px);
      filter: drop-shadow(0 18px 28px rgba(12,31,71,.24));
    }

    /* ════════════════════════════
       CONTENT PILLARS
    ════════════════════════════ */
    #pillars { background: var(--paper); padding: 110px 48px; }
    .pillars-head { text-align: center; margin-bottom: 60px; }
    .pillars-head .pill { background: var(--purple); color: var(--yellow); margin-bottom: 20px; }
    .pillars-hed {
      font-family: 'Fredoka', sans-serif; font-weight: 700;
      font-size: clamp(2.4rem, 4.5vw, 4rem);
      color: var(--ink);
      text-shadow: 3px 4px 0 rgba(26,15,74,.12);
      line-height: 1.15; transform: rotate(-1deg); display: inline-block;
      letter-spacing: .01em;
    }
    .pillars-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 24px; }
    .pillar-card {
      background: #fff; border: 3px solid rgba(26,15,74,.2);
      border-radius: 28px; box-shadow: 5px 7px 0 var(--shadow-soft);
      padding: 44px 28px 36px; text-align: center;
      transition: transform .2s cubic-bezier(.16,1,.3,1), box-shadow .2s;
      cursor: default;
    }
    .pillar-card:hover { transform: translateY(-7px) rotate(-1deg); box-shadow: 5px 14px 0 var(--shadow-soft); }
    .pillar-card:nth-child(2) { transform: rotate(1deg); }
    .pillar-card:nth-child(2):hover { transform: translateY(-7px) rotate(0deg); }
    .pillar-card:nth-child(4) { transform: rotate(-1.5deg); }
    .pillar-card:nth-child(4):hover { transform: translateY(-7px) rotate(-2.5deg); }
    .pillar-icon-scene {
      position: relative;
      width: 120px; height: 92px;
      margin: 0 auto 18px;
      display: flex; align-items: center; justify-content: center;
      filter: drop-shadow(0 10px 14px rgba(26,15,74,.12));
    }
    .pillar-accent {
      position: absolute; display: block; pointer-events: none;
      filter: drop-shadow(0 2px 0 rgba(26,15,74,.08));
    }
    .pillar-accent.star {
      width: 12px; height: 12px; background: var(--yellow);
      clip-path: polygon(50% 0%, 62% 35%, 100% 38%, 70% 58%, 80% 100%, 50% 74%, 20% 100%, 30% 58%, 0% 38%, 38% 35%);
    }
    .pillar-accent.dot {
      width: 10px; height: 10px; border-radius: 50%;
    }
    .pillar-accent.spark {
      width: 22px; height: 22px;
    }
    .pillar-accent.spark::before,
    .pillar-accent.spark::after {
      content: ""; position: absolute; inset: 0; margin: auto;
      background: currentColor; border-radius: 999px;
    }
    .pillar-accent.spark::before { width: 22px; height: 6px; }
    .pillar-accent.spark::after { width: 6px; height: 22px; }
    .pillar-accent.wave {
      width: 26px; height: 12px;
      border-top: 4px solid currentColor;
      border-radius: 999px;
      opacity: .9;
    }

    .icon-watch-board {
      position: relative;
      width: 90px; height: 66px;
      border-radius: 24px;
      background: linear-gradient(180deg, #7B59FF 0%, #4F2DC9 100%);
      border: 3px solid rgba(26,15,74,.18);
      box-shadow: inset 0 3px 0 rgba(255,255,255,.24);
    }
    .icon-watch-top {
      position: absolute; top: -10px; left: 8px;
      width: 74px; height: 24px;
      border-radius: 14px;
      background:
        repeating-linear-gradient(135deg, #B9A5FF 0 11px, #6E4DF0 11px 22px);
      border: 3px solid rgba(26,15,74,.18);
      transform: rotate(-7deg);
    }
    .icon-watch-play {
      position: absolute; inset: 0; margin: auto;
      width: 30px; height: 30px; border-radius: 50%;
      background: rgba(255,255,255,.18);
      border: 2px solid rgba(255,255,255,.24);
    }
    .icon-watch-play::before {
      content: ""; position: absolute; top: 7px; left: 11px;
      border-top: 7px solid transparent;
      border-bottom: 7px solid transparent;
      border-left: 12px solid #FFD23F;
    }

    .icon-play-controller {
      position: relative;
      width: 100px; height: 60px;
      border-radius: 28px 28px 24px 24px;
      background: linear-gradient(180deg, #3D4355 0%, #171B28 100%);
      border: 3px solid rgba(26,15,74,.18);
      box-shadow: inset 0 4px 0 rgba(255,255,255,.08);
    }
    .icon-play-controller::before,
    .icon-play-controller::after {
      content: ""; position: absolute; bottom: -4px;
      width: 28px; height: 20px; background: inherit;
      border-radius: 0 0 20px 20px;
    }
    .icon-play-controller::before { left: 6px; transform: rotate(18deg); }
    .icon-play-controller::after { right: 6px; transform: rotate(-18deg); }
    .icon-play-dpad,
    .icon-play-btns,
    .icon-play-stick {
      position: absolute; display: block;
    }
    .icon-play-dpad {
      left: 18px; top: 21px; width: 18px; height: 18px;
    }
    .icon-play-dpad::before,
    .icon-play-dpad::after {
      content: ""; position: absolute; background: #F5F7FA; border-radius: 999px;
    }
    .icon-play-dpad::before { width: 18px; height: 6px; top: 6px; left: 0; }
    .icon-play-dpad::after { width: 6px; height: 18px; top: 0; left: 6px; }
    .icon-play-btns {
      right: 16px; top: 18px; width: 28px; height: 24px;
    }
    .icon-play-btns::before,
    .icon-play-btns::after {
      content: ""; position: absolute; border-radius: 50%;
      width: 10px; height: 10px;
    }
    .icon-play-btns::before {
      background: #FF5A95; top: 0; left: 10px;
      box-shadow: -12px 8px 0 #4CE0B3, 0 16px 0 #FFD23F, 12px 8px 0 #4DA8FF;
    }
    .icon-play-stick {
      left: 43px; top: 32px; width: 14px; height: 14px; border-radius: 50%;
      background: #5B647C; box-shadow: inset 0 3px 0 rgba(255,255,255,.1);
    }

    .icon-read-book {
      position: relative;
      width: 92px; height: 68px;
    }
    .icon-read-book::before,
    .icon-read-book::after {
      content: ""; position: absolute; top: 6px;
      width: 44px; height: 54px; border-radius: 14px 14px 18px 18px;
      background: linear-gradient(180deg, #FFFFFF 0%, #FFF9EF 100%);
      border: 3px solid rgba(26,15,74,.14);
      box-shadow: inset 0 3px 0 rgba(255,255,255,.7);
    }
    .icon-read-book::before { left: 4px; transform: rotate(-8deg); }
    .icon-read-book::after { right: 4px; transform: rotate(8deg); }
    .icon-read-glow {
      position: absolute; top: 18px; left: 50%; transform: translateX(-50%);
      width: 32px; height: 26px;
      background: radial-gradient(circle, rgba(255,210,63,.75) 0%, rgba(255,210,63,0) 72%);
    }
    .icon-read-spine {
      position: absolute; top: 12px; left: 50%; transform: translateX(-50%);
      width: 10px; height: 48px; border-radius: 999px;
      background: linear-gradient(180deg, #FFB347 0%, #FF7A45 100%);
      border: 2px solid rgba(26,15,74,.12);
    }

    .icon-listen-note {
      position: relative;
      width: 76px; height: 82px;
    }
    .icon-listen-note::before {
      content: ""; position: absolute; right: 14px; top: 0;
      width: 18px; height: 58px; border-radius: 999px;
      background: linear-gradient(180deg, #8A67FF 0%, #4F2DC9 100%);
      border: 3px solid rgba(26,15,74,.16);
    }
    .icon-listen-note::after {
      content: ""; position: absolute; left: 10px; bottom: 6px;
      width: 34px; height: 34px; border-radius: 50%;
      background: linear-gradient(180deg, #A991FF 0%, #6B49F5 100%);
      border: 3px solid rgba(26,15,74,.16);
      box-shadow: 26px -10px 0 -4px #A991FF, 26px -10px 0 0 rgba(26,15,74,.16);
    }
    .pillar-word {
      font-family: 'Fredoka', sans-serif; font-weight: 700; font-size: 2rem;
      text-shadow: 2px 3px 0 var(--shadow-soft); display: block; margin-bottom: 12px;
      letter-spacing: .02em;
    }
    .pillar-desc {
      font-family: 'Nunito', sans-serif; font-size: .95rem;
      font-weight: 600; color: rgba(26,15,74,.65); line-height: 1.65;
    }

    /* ════════════════════════════
       WATCH.PLAY.READ.LISTEN
    ════════════════════════════ */
    #wprl { background: var(--purple); padding: 110px 48px; }
    #wprl .inner { display: flex; align-items: center; gap: 80px; }
    .wprl-copy { flex: 1; }
    .wprl-pill { background: var(--mint); color: var(--ink); margin-bottom: 30px; transform: rotate(1.5deg); }
    .wprl-hed {
      font-family: 'Fredoka', sans-serif; font-weight: 700;
      font-size: clamp(2.8rem, 5.5vw, 5.4rem); line-height: 1.1; margin-bottom: 30px;
      letter-spacing: .02em;
    }
    .wprl-hed span { display: block; text-shadow: 4px 6px 0 var(--shadow-soft); }
    .wprl-hed .w { color: var(--yellow); }
    .wprl-hed .p { color: var(--pink); }
    .wprl-hed .r { color: var(--mint); }
    .wprl-hed .l { color: var(--sky); }
    .wprl-sub {
      font-family: 'Nunito', sans-serif; font-weight: 600; color: rgba(255,255,255,.92);
      font-size: 1.15rem; line-height: 1.75; margin-bottom: 40px; max-width: 440px;
    }
    .phone-float {
      flex-shrink: 0; width: 290px; position: relative;
      animation: float-b 5s ease-in-out infinite;
    }
    .phone-float img {
      width: 100%; display: block; border-radius: 38px;
      filter: drop-shadow(8px 12px 0 var(--shadow-md));
    }
    .movie-phone {
      width: 320px;
      padding: 12px;
      border-radius: 46px;
      background: linear-gradient(145deg, rgba(255,255,255,.34), rgba(255,255,255,.08));
      border: 3px solid rgba(255,255,255,.28);
      box-shadow: 0 0 55px rgba(255,210,63,.2), 8px 12px 0 var(--shadow-md);
    }
    .movie-phone img {
      filter: none;
      border: 4px solid rgba(26,15,74,.72);
      box-shadow: inset 0 0 0 1px rgba(255,255,255,.16);
    }
    .movie-screen {
      position: absolute; left: 28px; right: 28px; top: 28px;
      aspect-ratio: 16 / 9; border-radius: 24px;
      background:
        linear-gradient(180deg, rgba(26,15,74,.12), rgba(26,15,74,.58)),
        linear-gradient(135deg, rgba(255,210,63,.82), rgba(255,61,138,.72) 48%, rgba(77,168,255,.78));
      border: 3px solid rgba(255,255,255,.78);
      box-shadow: 0 16px 30px rgba(26,15,74,.26);
      overflow: hidden;
      z-index: 2;
    }
    .movie-screen::before,
    .movie-screen::after {
      content: ""; position: absolute; top: 0; bottom: 0; width: 20px;
      background:
        radial-gradient(circle, rgba(255,255,255,.86) 0 3px, transparent 4px) 50% 10px / 12px 20px repeat-y,
        rgba(26,15,74,.36);
    }
    .movie-screen::before { left: 0; }
    .movie-screen::after { right: 0; }
    .movie-title {
      position: absolute; left: 38px; top: 18px;
      font-family: 'Fredoka', sans-serif; font-size: .72rem; font-weight: 700;
      color: #fff; letter-spacing: .08em; text-transform: uppercase;
      text-shadow: 0 2px 8px rgba(26,15,74,.55);
      z-index: 2;
    }
    .movie-play-button {
      position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%);
      width: 62px; height: 62px; border-radius: 50%;
      background: rgba(255,255,255,.94);
      border: 3px solid rgba(26,15,74,.18);
      box-shadow: 0 12px 24px rgba(26,15,74,.24);
      z-index: 2;
    }
    .movie-play-button::after {
      content: ""; position: absolute; left: 25px; top: 18px;
      border-left: 18px solid var(--pink);
      border-top: 12px solid transparent;
      border-bottom: 12px solid transparent;
    }
    .movie-progress {
      position: absolute; left: 36px; right: 36px; bottom: 16px;
      height: 8px; border-radius: 999px;
      background: rgba(255,255,255,.42);
      overflow: hidden;
      z-index: 2;
    }
    .movie-progress::before {
      content: ""; display: block; width: 58%; height: 100%;
      background: var(--yellow); border-radius: inherit;
    }
    .movie-reel {
      position: absolute; width: 78px; height: 78px; border-radius: 50%;
      background:
        radial-gradient(circle at 50% 50%, var(--ink) 0 8px, transparent 9px),
        radial-gradient(circle at 50% 20%, rgba(255,255,255,.92) 0 7px, transparent 8px),
        radial-gradient(circle at 78% 50%, rgba(255,255,255,.92) 0 7px, transparent 8px),
        radial-gradient(circle at 50% 80%, rgba(255,255,255,.92) 0 7px, transparent 8px),
        radial-gradient(circle at 22% 50%, rgba(255,255,255,.92) 0 7px, transparent 8px),
        linear-gradient(145deg, var(--yellow), var(--pink));
      border: 3px solid rgba(255,255,255,.62);
      box-shadow: 4px 6px 0 var(--shadow-soft);
      z-index: 3;
      animation: float-a 4s ease-in-out infinite;
    }
    .movie-reel-one { right: -26px; top: -22px; }
    .movie-reel-two {
      left: -22px; bottom: 42px; width: 54px; height: 54px;
      animation-delay: -1.8s;
    }
    .movie-chip {
      position: absolute; right: -26px; bottom: 112px;
      display: inline-flex; align-items: center; gap: 8px;
      padding: 9px 13px; border-radius: 999px;
      background: #fff; color: var(--ink);
      font-family: 'Fredoka', sans-serif; font-size: .82rem; font-weight: 700;
      box-shadow: 4px 6px 0 var(--shadow-soft);
      z-index: 4;
      white-space: nowrap;
    }

    /* ════════════════════════════
       EDUTAINMENT SLAPS
    ════════════════════════════ */
    #edu { background: var(--yellow); padding: 110px 48px; }
    #edu .inner { display: flex; align-items: center; gap: 80px; }
    .edu-phone { flex-shrink: 0; width: 280px; animation: float-a 4.5s ease-in-out infinite; }
    .edu-phone img {
      width: 100%; display: block; border-radius: 38px;
      filter: drop-shadow(8px 12px 0 var(--shadow-md));
    }
    .edu-copy { flex: 1; }
    .edu-eye {
      font-family: 'Fredoka', sans-serif; font-weight: 600; font-size: 1.05rem;
      color: var(--purple); text-transform: uppercase; letter-spacing: .08em;
      margin-bottom: 8px; display: block;
    }
    .edu-slaps {
      font-family: 'Fredoka', sans-serif; font-weight: 700;
      font-size: clamp(5rem, 9vw, 9rem); color: var(--pink);
      text-shadow: 6px 8px 0 var(--shadow-soft); line-height: .95;
      transform: rotate(-2deg); display: inline-block; margin-bottom: 24px;
      letter-spacing: .02em;
    }
    .edu-body {
      font-family: 'Nunito', sans-serif; font-weight: 600; font-size: 1.15rem;
      color: var(--ink); line-height: 1.75; max-width: 420px; margin-bottom: 36px;
    }

    /* ════════════════════════════
       MEET THE GANG
    ════════════════════════════ */
    #gang {
      --gang-pink: #FE0D6A;
      background:
        radial-gradient(circle at 8% 18%, rgba(255,210,63,.09) 0 8%, rgba(255,210,63,0) 24%),
        radial-gradient(circle at 94% 76%, rgba(77,168,255,.08) 0 9%, rgba(77,168,255,0) 25%),
        var(--gang-pink);
      padding: 88px 48px 96px;
      overflow: hidden;
      position: relative;
    }
    #gang .confetti,
    #gang .confetti span,
    #gang .star-deco {
      display: block;
      transform: rotate(var(--gang-rotate, 0deg));
      animation: gangFloatDrift 7s ease-in-out infinite;
    }
    #gang .confetti span.fb,
    #gang .star-deco:nth-of-type(2) {
      animation-delay: -2.3s;
      animation-duration: 8.4s;
    }
    #gang .confetti span.fc,
    #gang .star-deco:nth-of-type(3) {
      animation-delay: -4.2s;
      animation-duration: 9.2s;
    }
    .gang-heading {
      margin: 0 auto clamp(28px, 4vw, 42px);
      text-align: center;
      position: relative;
      z-index: 1;
    }
    .gang-card-grid {
      max-width: min(1180px, 100%);
      margin: 0 auto;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: clamp(16px, 1.8vw, 24px);
      background: transparent;
      position: relative;
      isolation: isolate;
    }
    .gang-card-grid::before {
      content: "";
      position: absolute;
      inset: 2% 1% 1%;
      border-radius: 28px;
      background:
        radial-gradient(ellipse at 50% 54%, rgba(31,17,92,.08) 0 16%, rgba(31,17,92,0) 56%),
        radial-gradient(ellipse at 50% 45%, rgba(254,13,106,.28) 0 34%, rgba(254,13,106,0) 74%);
      filter: blur(26px);
      opacity: .48;
      z-index: -1;
      pointer-events: none;
    }
    .gang-card {
      margin: 0;
      aspect-ratio: 442 / 430;
      display: flex;
      align-items: flex-end;
      justify-content: center;
      transform-origin: center;
      transform: rotate(var(--gang-card-tilt, 0deg));
      animation: gangCardFloat 5.2s ease-in-out infinite both;
      animation-delay: var(--gang-card-delay, 0s);
      transition: transform .22s ease, filter .22s ease;
      will-change: transform, filter;
    }
    .gang-card img {
      display: block;
      width: 100%;
      height: auto;
      margin: 0 auto;
      filter: none;
      transform: translateZ(0);
      backface-visibility: hidden;
    }
    .gang-card:hover,
    .gang-card:focus-within {
      transform: translate3d(0, -8px, 0) rotate(calc(var(--gang-card-tilt, 0deg) * .45)) scale(1.018);
      filter: drop-shadow(0 14px 18px rgba(31, 17, 92, .18));
    }

    @keyframes gangCardFloat {
      0%, 100% { transform: translate3d(0, 0, 0) rotate(var(--gang-card-tilt, 0deg)) scale(1); }
      38% { transform: translate3d(0, -14px, 0) rotate(calc(var(--gang-card-tilt, 0deg) + 1.1deg)) scale(1.014); }
      72% { transform: translate3d(0, 5px, 0) rotate(calc(var(--gang-card-tilt, 0deg) - .7deg)) scale(1.004); }
    }

    @keyframes gangFloatDrift {
      0%, 100% { transform: translate3d(0, 0, 0) rotate(var(--gang-rotate, 0deg)); }
      45% { transform: translate3d(8px, -12px, 0) rotate(calc(var(--gang-rotate, 0deg) + 8deg)); }
      75% { transform: translate3d(-5px, 7px, 0) rotate(calc(var(--gang-rotate, 0deg) - 5deg)); }
    }

    @media (prefers-reduced-motion: reduce) {
      #gang .confetti,
      #gang .star-deco,
      .gang-card {
        animation: none !important;
      }
      .gang-card,
      .gang-card:hover,
      .gang-card:focus-within {
        transform: none !important;
        filter: none !important;
      }
    }

    /* ════════════════════════════
       TESTIMONIALS
    ════════════════════════════ */
    #testimonials { background: var(--paper); padding: 110px 48px; }
    .test-header { text-align: center; margin-bottom: 60px; }
    .test-pill { background: var(--orange); color: var(--ink); margin-bottom: 20px; transform: rotate(1.5deg); }
    .test-hed {
      font-family: 'Fredoka', sans-serif; font-weight: 700;
      font-size: clamp(2.6rem, 5vw, 4.6rem); color: var(--purple);
      text-shadow: 3px 5px 0 rgba(79,45,201,.2); transform: rotate(-1.5deg);
      display: inline-block; letter-spacing: .02em;
    }
    .test-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; }
    .test-card {
      background: #fff; border: 3px solid rgba(26,15,74,.12);
      border-radius: 28px; box-shadow: 5px 7px 0 var(--shadow-soft);
      padding: 40px 30px 30px; position: relative;
      transition: transform .2s cubic-bezier(.16,1,.3,1);
    }
    .test-card:hover { transform: translateY(-5px); }
    .test-card:nth-child(2) { transform: rotate(.8deg); }
    .test-card:nth-child(2):hover { transform: translateY(-5px) rotate(.8deg); }
    .qmark {
      position: absolute; top: -18px; left: 26px;
      background: var(--yellow); border: 2px solid rgba(26,15,74,.2);
      border-radius: 50%; width: 40px; height: 40px;
      display: flex; align-items: center; justify-content: center;
      font-family: 'Fredoka', sans-serif; font-size: 1.6rem;
      color: var(--ink); box-shadow: 2px 3px 0 var(--shadow-soft);
    }
    .test-stars { font-size: 1.2rem; margin-bottom: 16px; display: block; letter-spacing: 3px; }
    .test-quote {
      font-family: 'Nunito', sans-serif; font-weight: 600;
      font-size: 1rem; color: var(--ink); line-height: 1.7; margin-bottom: 22px;
    }
    .test-author { display: flex; align-items: center; gap: 14px; }
    .author-av {
      width: 46px; height: 46px; border-radius: 50%;
      border: 2px solid rgba(26,15,74,.15); box-shadow: 2px 3px 0 var(--shadow-soft);
      display: flex; align-items: center; justify-content: center;
      font-size: 1.4rem; flex-shrink: 0;
    }
    .author-info strong {
      display: block; font-family: 'Fredoka', sans-serif;
      font-weight: 600; font-size: .95rem; color: var(--ink);
    }
    .author-info span {
      font-family: 'Nunito', sans-serif; font-size: .78rem;
      color: rgba(26,15,74,.5);
    }

    /* ════════════════════════════
       PARENTS APPROVE
    ════════════════════════════ */
    #parents { background: var(--sky); padding: 110px 48px; }
    #parents .inner { display: flex; align-items: center; gap: 80px; }
    .par-copy { flex: 1; }
    .par-eye {
      font-family: 'Fredoka', sans-serif; font-weight: 600; font-size: .98rem;
      color: var(--ink); text-transform: uppercase; letter-spacing: .1em;
      margin-bottom: 12px; display: block;
    }
    .par-hed {
      font-family: 'Fredoka', sans-serif; font-weight: 700;
      font-size: clamp(3rem, 5.5vw, 5.2rem); color: var(--yellow);
      text-shadow: 4px 6px 0 var(--shadow-soft); line-height: 1.1;
      transform: rotate(-1.5deg); display: inline-block; margin-bottom: 40px;
      letter-spacing: .02em;
    }
    .trust-list { display: flex; flex-direction: column; gap: 16px; }
    .trust-card {
      background: #fff; border: 2px solid rgba(26,15,74,.12);
      border-radius: 20px; box-shadow: 4px 5px 0 var(--shadow-soft);
      padding: 18px 24px; display: flex; align-items: center; gap: 18px;
      transition: transform .15s;
    }
    .trust-card:hover { transform: translateX(5px); }
    .trust-icon { font-size: 2rem; flex-shrink: 0; }
    .trust-txt strong {
      display: block; font-family: 'Fredoka', sans-serif; font-weight: 600;
      font-size: 1.05rem; color: var(--ink); margin-bottom: 2px;
    }
    .trust-txt span {
      font-family: 'Nunito', sans-serif; font-size: .88rem;
      color: rgba(26,15,74,.6); line-height: 1.5;
    }
    .par-phone { flex-shrink: 0; width: 285px; animation: float-a 4.8s ease-in-out infinite; }
    .par-phone img {
      width: 100%; display: block; border-radius: 38px;
      filter: drop-shadow(8px 12px 0 var(--shadow-md));
    }

    /* ════════════════════════════
       CTA
    ════════════════════════════ */
    #cta { background: var(--purple); padding: 130px 48px; text-align: center; }
    #cta .inner { display: flex; flex-direction: column; align-items: center; }
    .cta-pill { background: var(--mint); color: var(--ink); margin-bottom: 30px; transform: rotate(-2deg); }
    .cta-hed {
      font-family: 'Fredoka', sans-serif; font-weight: 700;
      font-size: clamp(3.2rem, 6.5vw, 6.2rem); color: var(--pink);
      text-shadow: 5px 7px 0 var(--shadow-soft); line-height: 1.1;
      transform: rotate(-2deg); display: inline-block; margin-bottom: 20px;
      letter-spacing: .02em;
    }
    .cta-sub {
      font-family: 'Nunito', sans-serif; font-weight: 600; font-size: 1.25rem;
      color: rgba(255,255,255,.92); max-width: 500px; line-height: 1.7; margin-bottom: 56px;
    }
    .store-row { display: flex; gap: 22px; justify-content: center; flex-wrap: wrap; margin-bottom: 64px; }
    .store-btn {
      display: flex; align-items: center; gap: 14px;
      background: var(--ink); color: #fff;
      padding: 18px 38px; border-radius: 20px;
      border: 2px solid rgba(255,255,255,.15);
      box-shadow: 4px 5px 0 rgba(255,210,63,.5);
      text-decoration: none;
      transition: transform .15s, box-shadow .15s;
    }
    .store-btn:hover { transform: translateY(-4px); box-shadow: 4px 9px 0 rgba(255,210,63,.6); }
    .store-icon { width: 32px; height: 32px; flex-shrink: 0; display: block; }
    .store-txt small { display: block; font-family: 'Nunito', sans-serif; font-size: .74rem; opacity: .75; letter-spacing: .04em; }
    .store-txt strong { display: block; font-family: 'Fredoka', sans-serif; font-weight: 600; font-size: 1.2rem; }
    .cta-phone { width: 252px; margin: 0 auto; animation: float-b 5s ease-in-out infinite; }
    .cta-phone img {
      width: 100%; display: block; border-radius: 38px;
      filter: drop-shadow(8px 12px 0 var(--shadow-md));
    }

    /* ════════════════════════════
       FOOTER
    ════════════════════════════ */
    footer { background: var(--ink); padding: 70px 48px 40px; }
    .footer-inner {
      max-width: 1200px; margin: 0 auto;
      display: flex; justify-content: space-between; align-items: flex-start;
      gap: 40px; padding-bottom: 44px;
      border-bottom: 1px solid rgba(255,255,255,.1); flex-wrap: wrap;
    }
    .footer-brand { flex: 1; min-width: 200px; }
    .footer-logo-wrap { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
    .footer-icon {
      width: 46px; height: 46px; border-radius: 13px;
      border: 2px solid rgba(255,255,255,.15); overflow: hidden;
    }
    .footer-icon img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .footer-logo { font-family: 'Fredoka', sans-serif; font-weight: 700; font-size: 2rem; color: var(--yellow); letter-spacing: .01em; }
    .footer-tagline { font-family: 'Nunito', sans-serif; font-size: .92rem; color: rgba(255,255,255,.5); line-height: 1.65; max-width: 260px; }
    .footer-cols { display: flex; gap: 60px; flex-wrap: wrap; }
    .footer-col h4 {
      font-family: 'Fredoka', sans-serif; font-weight: 600; font-size: .88rem;
      color: var(--yellow); text-transform: uppercase; letter-spacing: .1em; margin-bottom: 18px;
    }
    .footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 12px; }
    .footer-col a {
      font-family: 'Nunito', sans-serif; font-size: .9rem;
      color: rgba(255,255,255,.5); text-decoration: none; transition: color .15s;
    }
    .footer-col a:hover { color: var(--yellow); }
    .footer-bottom {
      max-width: 1200px; margin: 26px auto 0;
      display: flex; justify-content: space-between; align-items: center;
      flex-wrap: wrap; gap: 10px;
    }
    .footer-bottom p { font-family: 'Nunito', sans-serif; font-size: .82rem; color: rgba(255,255,255,.35); }
    .footer-bottom a { color: rgba(255,255,255,.42); text-decoration: none; }
    .footer-bottom a:hover { color: var(--mint); }
    .footer-luda { font-family: 'Nunito', sans-serif; font-size: .82rem; color: rgba(255,255,255,.35); }
    .footer-luda strong { color: var(--yellow); font-weight: 800; }

    /* ════════════════════════════
       SOCIAL PROOF / PRESS
    ════════════════════════════ */
    #press { background: var(--paper); padding: 80px 0 72px; overflow: hidden; }
    #press .inner { padding: 0 48px; }
    .press-eyebrow { text-align: center; margin-bottom: 48px; }
    .press-eyebrow-label {
      display: block; font-family: 'Fredoka', sans-serif; font-weight: 600;
      font-size: .8rem; letter-spacing: .14em; text-transform: uppercase;
      color: rgba(26,15,74,.38); margin-bottom: 10px;
    }
    .press-eyebrow-hed {
      display: block; font-family: 'Fredoka', sans-serif; font-weight: 700;
      font-size: clamp(1.5rem, 2.6vw, 2.1rem);
      color: var(--ink); letter-spacing: .01em; line-height: 1.2;
    }

    /* ── Quote Carousel ── */
    .quote-carousel-wrap {
      overflow: hidden; margin-bottom: 52px;
      position: relative;
    }
    /* fade edges */
    .quote-carousel-wrap::before,
    .quote-carousel-wrap::after {
      content: ''; position: absolute; top: 0; bottom: 0; width: 60px; z-index: 2;
      pointer-events: none;
    }
    .quote-carousel-wrap::before { left: 0; background: linear-gradient(to right, var(--paper), transparent); }
    .quote-carousel-wrap::after  { right: 0; background: linear-gradient(to left, var(--paper), transparent); }

    @keyframes marquee-quotes {
      from { transform: translateX(0); }
      to   { transform: translateX(-50%); }
    }
    .quote-carousel {
      display: flex; gap: 20px;
      align-items: stretch;
      width: max-content;
      padding: 10px 0 28px;
      animation: marquee-quotes 55s linear infinite;
      will-change: transform;
    }
    .quote-carousel-wrap:hover .quote-carousel {
      animation-play-state: paused;
    }
    @media (prefers-reduced-motion: reduce) {
      .quote-carousel { animation: none; overflow-x: auto; }
    }

    .quote-card {
      flex: 0 0 auto;
      inline-size: fit-content;
      min-inline-size: 300px;
      max-inline-size: clamp(330px, 23vw, 420px);
      border-radius: 22px; padding: 18px 20px 14px;
      border: 2px solid rgba(26,15,74,.07);
      box-shadow: 4px 6px 0 rgba(26,15,74,.08);
      display: flex; flex-direction: column; gap: 10px;
      transition: transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s;
    }
    .quote-card--wide {
      min-inline-size: 360px;
      max-inline-size: clamp(430px, 46vw, 560px);
    }
    .quote-card:hover { transform: translateY(-6px); box-shadow: 4px 12px 0 rgba(26,15,74,.11); }
    .quote-mark {
      font-size: 2rem; line-height: .78;
      font-family: Georgia, serif; display: block;
    }
    .quote-text {
      font-family: 'Nunito', sans-serif; font-weight: 700;
      font-size: .94rem; color: var(--ink); line-height: 1.5; flex: 1;
    }
    .quote-source-row { display: flex; align-items: center; gap: 8px; margin-top: 0; }
    .quote-source-pip { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
    .quote-source-name {
      font-family: 'Fredoka', sans-serif; font-weight: 600;
      font-size: .72rem; letter-spacing: .07em; text-transform: uppercase;
    }

    /* ── Award Seals ── */
    .press-divider-line {
      width: 100%; height: 1px; background: rgba(26,15,74,.08); margin-bottom: 36px;
    }
    .awards-seal-row {
      display: flex; gap: 24px;
      justify-content: center; align-items: flex-start;
      margin-bottom: 44px; overflow-x: auto;
      padding: 0 4px 12px;
      scrollbar-width: thin;
    }
    .award-seal {
      display: block; flex: 1 1 0;
      min-width: 320px; max-width: 560px;
      transition: transform .2s cubic-bezier(.16,1,.3,1);
      background: var(--paper);
    }
    .award-seal:hover { transform: translateY(-4px); }
    .award-seal img {
      display: block; width: 100%; height: auto;
      filter: sepia(.04) saturate(.97) brightness(1.01);
    }
    @media (max-width: 900px) {
      .awards-seal-row { justify-content: flex-start; }
      .award-seal { flex: 0 0 min(480px, 88vw); min-width: 280px; }
    }

    /* ── Press Logos ── */
    .press-logo-row {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 14px;
      flex-wrap: nowrap;
    }
    .press-logo-item {
      display: flex; align-items: center;
      justify-content: center;
      flex: var(--logo-flex, 1) 1 0;
      min-width: 0;
      height: 56px;
      transition: filter .25s, opacity .25s;
      filter: grayscale(1) opacity(.28);
    }
    .press-logo-item:hover { filter: grayscale(.3) opacity(.7); }
    .press-logo-img {
      width: 100%; height: 100%;
      display: block; object-fit: contain;
    }
    .press-logo-item--tonies { --logo-flex: 2.55; }
    .press-logo-item--delta  { --logo-flex: 1.95; }
    .press-logo-item--pressed { --logo-flex: 1.85; }
    .press-logo-item--moose { --logo-flex: 1.45; }
    .press-logo-item--cutie { --logo-flex: 1; }
    .press-logo-img--tonies { transform: scale(1.06); }
    .press-logo-img--moose { transform: scale(1.12); }
    .press-logo-img--cutie { transform: scale(.82); }

    /* ════════════════════════════
       FEATURE HIGHLIGHT
    ════════════════════════════ */
    #feature-highlight { background: var(--ink); padding: 110px 48px; }
    #feature-highlight .inner { display: flex; align-items: center; gap: 80px; }

    /* Tablet mockup */
    .fh-media { flex-shrink: 0; }
    .fh-mockup {
      background: #fff; border-radius: 28px;
      padding: 8px 8px 20px;
      box-shadow: 0 28px 72px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.06);
      width: 620px;
      animation: float-b 5.5s ease-in-out infinite;
      transform: rotate(-2deg);
    }
    .fh-mockup-cam {
      width: 10px; height: 10px; border-radius: 50%;
      background: #ddd; margin: 0 auto 10px;
    }
    .fh-mockup-screen {
      border-radius: 16px; overflow: hidden;
      aspect-ratio: 16/10; background: #111;
    }
    .fh-mockup-screen iframe {
      position: absolute; inset: 0; width: 100%; height: 100%;
      border: none; display: block;
    }
    .fh-mockup-screen {
      position: relative;
    }

    /* Copy */
    .fh-copy { flex: 1; }
    .fh-stat {
      font-family: 'Fredoka', sans-serif; font-weight: 700;
      font-size: clamp(2.8rem, 5vw, 4.6rem);
      color: #fff; line-height: 1.1; margin-bottom: 26px;
      letter-spacing: .01em;
    }
    .fh-stat-num { color: var(--mint); display: block; }
    .fh-desc {
      font-family: 'Nunito', sans-serif; font-weight: 600;
      font-size: 1.15rem; color: rgba(255,255,255,.82);
      line-height: 1.78; max-width: 430px; margin-bottom: 42px;
    }

    /* Icon row */
    .fh-icons { display: flex; gap: 14px; flex-wrap: wrap; }
    .fh-icon-btn {
      width: 62px; height: 62px; border-radius: 18px;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.6rem; flex-shrink: 0;
      box-shadow: 0 6px 18px rgba(0,0,0,.32);
      transition: transform .2s cubic-bezier(.16,1,.3,1), box-shadow .2s;
      cursor: default;
    }
    .fh-icon-btn:hover { transform: translateY(-5px) scale(1.1); box-shadow: 0 12px 26px rgba(0,0,0,.38); }

    /* ════════════════════════════
       FEATURE HIGHLIGHT 2
    ════════════════════════════ */
    #fh2 {
      background: linear-gradient(160deg, #1A0F4A 0%, #2E1B8C 55%, #1A0F4A 100%);
      padding: 110px 48px; position: relative; overflow: visible;
    }
    #fh2 .inner { display: flex; align-items: center; gap: 72px; }

    /* Copy */
    .fh2-copy { flex: 1 1 560px; max-width: 620px; }
    .fh2-hed {
      font-family: 'Fredoka', sans-serif; font-weight: 700;
      font-size: clamp(2.8rem, 5vw, 4.6rem);
      color: #fff; line-height: 1.12; margin-bottom: 28px;
      letter-spacing: .01em;
    }
    .fh2-hed-line { display: block; white-space: nowrap; }
    .fh2-h { color: var(--pink); }
    .fh2-e { color: var(--yellow); }
    .fh2-l1 { color: var(--mint); }
    .fh2-l2 { color: var(--sky); }
    .fh2-o { color: #C4B5FD; }
    .fh2-desc {
      font-family: 'Nunito', sans-serif; font-weight: 600;
      font-size: 1.15rem; color: rgba(255,255,255,.82);
      line-height: 1.78; max-width: 460px; margin-bottom: 38px;
    }
    .fh2-badges { display: flex; flex-wrap: wrap; gap: 12px; }
    .fh2-badge {
      display: inline-flex; align-items: center; gap: 8px;
      background: rgba(255,255,255,.1);
      border: 1.5px solid rgba(255,255,255,.18);
      border-radius: 999px; padding: 10px 20px;
      backdrop-filter: blur(10px);
      font-family: 'Nunito', sans-serif; font-weight: 700;
      font-size: .9rem; color: #fff; white-space: nowrap;
      transition: background .2s, border-color .2s;
    }
    .fh2-badge:hover { background: rgba(255,255,255,.17); border-color: rgba(255,255,255,.3); }
    .fh2-check { font-size: 1rem; font-weight: 900; }

    /* Media */
    .fh2-media { flex-shrink: 0; position: relative; }
    .fh2-glow {
      position: absolute; inset: -40px; border-radius: 50%;
      background: radial-gradient(ellipse at center, rgba(79,45,201,.45) 0%, transparent 68%);
      z-index: 0; pointer-events: none;
    }
    .fh2-card {
      width: 560px;
      background: #fff; border-radius: 28px;
      padding: 8px 8px 20px;
      box-shadow: 0 0 60px rgba(79,45,201,.35), 0 28px 70px rgba(0,0,0,.5);
      position: relative; z-index: 1;
      animation: float-b 5.2s ease-in-out infinite;
      transform: rotate(2deg);
    }
    .fh2-card-cam {
      width: 10px; height: 10px; border-radius: 50%;
      background: #ddd; margin: 0 auto 8px;
    }
    .fh2-card-screen {
      border-radius: 16px; overflow: hidden;
      aspect-ratio: 16/10; background: #111;
      position: relative;
    }
    .fh2-card-video {
      position: relative; width: 100%; aspect-ratio: 16/10; display: block;
    }
    .fh2-card-video iframe {
      position: absolute; inset: 0; width: 100%; height: 100%;
      border: none; display: block;
    }
    .fh2-character {
      position: absolute; bottom: -150px; left: -100px;
      width: 180px; pointer-events: none; z-index: 5;
      filter: drop-shadow(4px 8px 0 rgba(26,15,74,.6));
      animation: float-a 4.5s ease-in-out infinite;
    }

    /* ════════════════════════════
       RESPONSIVE
    ════════════════════════════ */
    @media (max-width: 1050px) {
      #gang { padding-top: 72px; padding-bottom: 80px; }
      .gang-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: min(760px, 100%);
      }
      .next-gen-grid { grid-template-columns: 1fr; max-width: 640px; margin: 0 auto; }
      .next-gen-card { min-height: 0; }
      .interactives-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .pillars-grid { grid-template-columns: repeat(2,1fr); }
    }
    @media (max-width: 860px) {
      html, body { max-width: 100%; overflow-x: hidden; }
      nav { padding: 14px 20px; }
      .nav-links { display: none; }
      .hamburger { display: flex; }
      section { padding: 72px 24px !important; }
      #hero { padding: 88px 20px 72px !important; min-height: auto; overflow: hidden; }
      .hero-copy { width: 100%; max-width: 100%; }
      .hero-badges { justify-content: center; flex-wrap: wrap; width: 100%; max-width: 100%; }
      .luda-badge, .hero-tag { max-width: 100%; white-space: normal; justify-content: center; }
      .hero-rating { flex-wrap: wrap; justify-content: center; }
      .hero-stats { justify-content: center; }
      .hero-stat { min-width: 0; }
      .hero-stat-div { display: none; }
      #hero .inner, #wprl .inner, #edu .inner, #parents .inner,
      #feature-highlight .inner, #fh2 .inner {
        flex-direction: column; text-align: center; gap: 48px;
      }
      #hero .inner { width: 100%; max-width: 100%; }
      .fh-mockup { width: 100%; max-width: 420px; margin: 0 auto; transform: none; }
      .fh-desc { margin-left: auto; margin-right: auto; }
      .fh-icons { justify-content: center; }
      .fh2-card { width: 100%; max-width: 460px; margin: 0 auto; transform: none; }
      .fh2-badges { align-items: center; }
      .fh2-character { display: none; }
      .next-gen-head { margin-bottom: 42px; }
      .next-gen-card { padding: 24px 22px 24px; }
      .next-gen-visual { height: 280px; }
      .interactives-head { margin-bottom: 38px; }
      .interactives-stage {
        margin-bottom: 72px;
        border-radius: 24px;
      }
      .interactives-badge--swipe {
        left: 12px;
        top: auto;
        bottom: 108px;
        transform: none;
      }
      .interactives-logo {
        width: 64px;
        height: 64px;
      }
      .interactives-toolbar {
        width: min(320px, calc(100% - 48px));
        height: 82px;
      }
      .interactives-grid { grid-template-columns: 1fr; }
      .characters-showcase-inner { padding: 0 24px; }
      .characters-hero {
        margin-bottom: 22px;
        border-radius: 24px;
      }
      .characters-wordmarks {
        gap: 16px 18px;
        margin-bottom: 32px;
      }
      .video-library-wrap::before,
      .video-library-wrap::after {
        width: 28px;
      }
      .video-library-track {
        gap: 14px;
        padding: 0 24px;
        animation-duration: 30s;
      }
      .video-library-row--bottom .video-library-track {
        animation-duration: 30s;
        padding-left: 110px;
      }
      .video-library-set {
        gap: 14px;
      }
      .video-library-card {
        flex-basis: 220px;
        border-radius: 22px;
      }
      .video-library-chip {
        top: 12px;
        left: 12px;
        min-height: 30px;
        padding: 7px 12px;
        font-size: .72rem;
      }
      .video-library-title {
        left: 12px;
        bottom: 12px;
        font-size: 1.02rem;
      }
      #social-feed { padding: 80px 24px 88px !important; }
      .social-feed-grid { grid-template-columns: 1fr; }
      .social-embed-shell {
        min-height: 440px;
      }
      #faq { padding: 80px 24px 88px !important; }
      .faq-head { margin-bottom: 28px; }
      .faq-item summary { padding: 18px 0 16px; }
      .faq-a { padding-bottom: 18px; }
      #trial-cta { padding: 80px 24px 88px !important; }
      .trial-cta-inner {
        grid-template-columns: 1fr;
        gap: 36px;
        text-align: center;
      }
      .trial-cta-copy {
        max-width: 100%;
      }
      .trial-cta-hed {
        margin-bottom: 28px;
      }
      .trial-cta-points {
        justify-items: center;
        margin-bottom: 30px;
      }
      .trial-cta-points li {
        max-width: 540px;
        text-align: left;
      }
      .trial-cta-form {
        grid-template-columns: 1fr;
      }
      .trial-cta-form input {
        min-height: 68px;
        text-align: center;
      }
      .trial-cta-submit {
        min-height: 68px;
      }
      .trial-cta-visual {
        min-height: 300px;
      }
      .trial-cta-mascot {
        width: min(100%, 300px);
      }
      .next-gen-form {
        width: min(100%, 520px);
        grid-template-columns: 1fr;
      }
      .next-gen-form input {
        min-height: 62px;
        text-align: center;
      }
      .next-gen-submit { width: 100%; }
      .hero-h1 { display: block; width: 100%; max-width: 100%; font-size: clamp(2.35rem, 12vw, 3.2rem); line-height: 1.04; overflow-wrap: anywhere; word-break: normal; }
      .hero-h1-line { white-space: normal; overflow-wrap: anywhere; }
      .hero-video { width: 100%; max-width: 420px; margin: 0 auto; }
      .hero-visual { padding-bottom: 0; }
      .hero-character { display: none; }
      .hero-btns { justify-content: center; }
      .hero-btns .btn { width: min(100%, 360px); justify-content: center; }
      .hero-store-row { width: min(100%, 390px); justify-content: center; }
      .hero-store-row .store-badge { flex: 1 1 180px; }
      .hero-waitlist-row,
      .waitlist-store-row {
        justify-content: center;
      }

      .hero-waitlist-cta,
      .waitlist-store-btn {
        width: 100%;
        justify-content: center;
      }

      .store-coming-soon {
        justify-content: center;
        width: 100%;
        text-align: center;
      }

      .waitlist-label {
        text-align: center;
      }
      .hero-sub { width: 100%; max-width: 340px; overflow-wrap: anywhere; }
      .hero-stats { width: 100%; gap: 18px; }
      .hero-sub, .wprl-sub, .edu-body, .cta-sub { margin-left: auto; margin-right: auto; }
      .phone-float, .edu-phone, .par-phone { width: 230px; margin: 0 auto; }
      .movie-phone { padding: 9px; border-radius: 38px; }
      .movie-screen { left: 22px; right: 22px; top: 22px; border-radius: 18px; }
      .movie-play-button { width: 48px; height: 48px; }
      .movie-play-button::after {
        left: 20px; top: 14px;
        border-left-width: 14px; border-top-width: 10px; border-bottom-width: 10px;
      }
      .movie-reel-one { right: -18px; top: -18px; }
      .movie-reel-two { left: -14px; bottom: 34px; }
      .movie-chip { right: -14px; bottom: 92px; font-size: .72rem; padding: 8px 11px; }
      .edu-slaps { font-size: clamp(3.6rem, 14vw, 6rem); }
      .gang-card-grid {
        grid-template-columns: minmax(0, 1fr);
        max-width: min(442px, 100%);
      }
      .gang-heading {
        margin-bottom: 28px;
      }
      .quote-card {
        min-inline-size: 280px;
        max-inline-size: min(82vw, 360px);
        padding: 18px 18px 14px;
      }
      .quote-card--wide {
        min-inline-size: 320px;
        max-inline-size: min(88vw, 430px);
      }
      .press-logo-row { flex-wrap: wrap; gap: 16px; }
      .press-logo-item { flex: 0 1 calc(33.333% - 16px); }
      .test-grid { grid-template-columns: 1fr; max-width: 420px; margin: 0 auto; }
      .pillars-grid { grid-template-columns: repeat(2,1fr); gap: 16px; }
      .trust-list { align-items: center; }
      .trust-card { max-width: 400px; width: 100%; }
      .store-row { flex-direction: column; align-items: center; }
      .footer-inner { flex-direction: column; }
      .footer-cols { gap: 28px; }
      .footer-bottom { flex-direction: column; text-align: center; }
    }
    @media (max-width: 520px) {
      .quote-card { min-inline-size: 260px; max-inline-size: 82vw; }
      .quote-card--wide { min-inline-size: 280px; max-inline-size: 88vw; }
      .press-logo-item { flex-basis: calc(50% - 16px); }
      .pillars-grid { grid-template-columns: 1fr; }
      .hero-video { max-width: 340px; }
    }

/* WordPress shortcode wrapper: mirrors the original static body styling. */
.kn-app-landing {
  font-family: 'Nunito', sans-serif;
  background: var(--paper);
  overflow-x: hidden;
  font-size: 16px;
  line-height: 1.6;
  color: var(--ink);
  width: 100vw;
  max-width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}
.kn-app-landing img,
.kn-app-landing video,
.kn-app-landing iframe {
  max-width: 100%;
}

.kn-app-landing .hero-h1,
.kn-app-landing .press-eyebrow-hed,
.kn-app-landing .fh-stat,
.kn-app-landing .fh2-hed,
.kn-app-landing .next-gen-hed,
.kn-app-landing .next-gen-card-title,
.kn-app-landing .interactives-hed,
.kn-app-landing .interactive-card-title,
.kn-app-landing .characters-showcase-hed,
.kn-app-landing .characters-wordmark,
.kn-app-landing .video-library-title,
.kn-app-landing .social-feed-hed,
.kn-app-landing .faq-hed,
.kn-app-landing .trial-cta-hed,
.kn-app-landing .pillars-hed,
.kn-app-landing .pillar-word,
.kn-app-landing .wprl-hed,
.kn-app-landing .movie-title,
.kn-app-landing .test-hed,
.kn-app-landing .par-hed,
.kn-app-landing .cta-hed {
  font-family: 'Baloo 2', sans-serif;
  font-weight: 800;
}


/* 2026-06-27 prepared launch updates */
.kn-app-landing nav {
  padding: 8px 48px;
  display: grid;
  grid-template-columns: minmax(160px, 1fr) auto minmax(160px, 1fr);
  align-items: center;
  min-height: 96px;
}
.kn-app-landing .nav-brand { justify-self: start; }
.kn-app-landing .nav-logo-img { display: block; width: min(118px, 28vw); height: auto; }
.kn-app-landing .nav-links { justify-self: center; }
.kn-app-landing .hamburger { justify-self: end; }
.kn-app-landing .mobile-menu { align-items: center; text-align: center; }
.kn-app-landing .mobile-menu a { justify-content: center; text-align: center; }
.kn-app-landing .hero-stats { gap: clamp(30px, 5vw, 56px); }
.kn-app-landing .hero-stat { align-items: center; }
.kn-app-landing .hero-stat-num { font-size: clamp(2.2rem, 5vw, 3.5rem); line-height: .9; }
.kn-app-landing .hero-stat-lbl { font-size: clamp(.95rem, 1.7vw, 1.18rem); }
.kn-app-landing .press-logo-row { align-items: center; }
.kn-app-landing .press-logo-item,
.kn-app-landing .press-logo-item:hover,
.kn-app-landing .press-logo-item:focus-visible {
  filter: none;
  opacity: 1;
  text-decoration: none;
}
.kn-app-landing .press-logo-item:focus-visible {
  outline: 3px solid var(--purple);
  outline-offset: 6px;
}
.kn-app-landing .press-logo-img { filter: none; opacity: 1; }
.kn-app-landing .footer-logo-img { display: block; width: min(190px, 54vw); height: auto; }
.kn-app-landing #trial-cta .trial-cta-visual { background: transparent; }
.kn-app-landing #trial-cta .trial-cta-glow { display: none; }
.kn-app-landing #trial-cta .trial-cta-mascot { filter: none; }
@media (max-width: 900px) {
  .kn-app-landing nav { display: flex; padding: 8px 20px; min-height: 88px; }
  .kn-app-landing .nav-brand { margin-right: auto; }
  .kn-app-landing .nav-logo-img { width: min(104px, 30vw); }
}