/* ====== FUN, BRIGHT, KID-FRIENDLY THEME ====== */
:root{
  --ink:#0f172a; --muted:#475569; --bg:#ffffff;
  --brand1:#7dd3fc; /* sky */
  --brand2:#fde68a; /* sunny */
  --brand3:#fca5a5; /* strawberry */
  --brand4:#a7f3d0; /* mint */
  --brand5:#c7d2fe; /* lilac */
  --card:#fff; --shadow:0 14px 30px rgba(2,6,23,.08);
  --radius:22px; --radius-lg:28px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue","Noto Sans",Arial,sans-serif}
img{max-width:100%;height:auto}
.wrap{width:min(1150px,92vw);margin:0 auto}

/* Floating gradient blobs */
.blob{position:fixed;z-index:-1;filter:blur(18px);opacity:.35;pointer-events:none}
.blob-a{width:420px;height:420px;left:-120px;top:-60px;background:radial-gradient(50% 50% at 50% 50%, var(--brand1), transparent 60%)}
.blob-b{width:380px;height:380px;right:-100px;top:40px;background:radial-gradient(50% 50%, var(--brand3), transparent 60%)}
.blob-c{width:360px;height:360px;left:50%;bottom:-120px;transform:translateX(-50%);background:radial-gradient(50% 50%, var(--brand4), transparent 60%)}

/* Header */
.site-header{position:sticky;top:0;background:rgba(255,255,255,.9);backdrop-filter:blur(8px);border-bottom:1px solid rgba(2,6,23,.06);z-index:50}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;padding:.9rem 0}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:inherit}
.brand-name{font-weight:900;letter-spacing:.2px}
.brand-name span{color:#0284c7}
.brand-bubble{width:32px;height:32px;border-radius:50%;display:inline-block;background:
  radial-gradient(60% 60% at 30% 30%, var(--brand1), #38bdf8)}
.menu{display:flex;gap:1rem;list-style:none;margin:0;padding:0}
.menu a{font-weight:800;text-decoration:none;color:#0f172a}
.nav-toggle{display:none}

/* Buttons */
.btn{display:inline-block;font-weight:900;text-decoration:none;border-radius:999px;padding:.8rem 1.1rem;box-shadow:var(--shadow)}
.btn-small{padding:.5rem .9rem}
.btn-lg{padding:.95rem 1.25rem;font-size:1.05rem}
.btn-primary{background:linear-gradient(180deg, var(--brand1), #60a5fa);color:#0b1324;border:2px solid #0ea5e9}
.btn-ghost{background:#fff;border:2px dashed #94a3b8;color:#0f172a}
.btn-outline{background:#fff;border:2px solid #0ea5e9;color:#0ea5e9}

/* Hero */
.hero{position:relative;overflow:hidden;padding:3.2rem 0 2.4rem}
.hero-waves{position:absolute;inset:auto 0 0 0;height:26px;background:
  radial-gradient(12px 6px at 12px 6px,#fff 98%,transparent) repeat-x;opacity:.8}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:2rem;align-items:center}
.hero-title{font-size:clamp(2.2rem,4.8vw,3.6rem);line-height:1.05;margin:0 0 .6rem}
.scribble{position:relative}
.scribble:after{content:"";position:absolute;left:-6px;right:-6px;bottom:-8px;height:14px;
  background:linear-gradient(90deg,var(--brand1),var(--brand2),var(--brand3),var(--brand4),var(--brand5));
  filter:blur(6px);opacity:.85;border-radius:999px;z-index:-1}
.hero-sub{font-size:1.15rem;color:var(--muted);margin:.25rem 0 1rem}
.hero-bullets{list-style:"✨ ";padding-left:1.1rem;margin:0 0 1rem;color:#334155}
.cta-row{display:flex;gap:.8rem;flex-wrap:wrap}
.tiny{font-size:.88rem;color:#64748b}

.hero-card{background:#fff;border:1px solid rgba(2,6,23,.06);border-radius:var(--radius-lg);
  box-shadow:var(--shadow);padding:1rem}
.hero-art{height:260px;border-radius:var(--radius);
  background:
    conic-gradient(from 180deg at 50% 50%, var(--brand1) 0 20%, var(--brand2) 20% 40%, var(--brand3) 40% 60%, var(--brand4) 60% 80%, var(--brand5) 80% 100%);
  mask: radial-gradient(circle at 50% 50%, #000 60%, transparent 61%) top / 36px 36px repeat;opacity:.95}
.hero-card-badges{display:flex;gap:.5rem;margin-top:.6rem;flex-wrap:wrap}
.badge{background:#fff;border:2px dashed #94a3b8;border-radius:999px;padding:.35rem .7rem;font-weight:900;color:#0f172a}

/* Sections */
.section{padding:3rem 0}
.section-title{font-size:clamp(1.6rem,3.6vw,2.2rem);margin:0 0 1rem}
.lead{color:#334155}
.card{background:var(--card);border:1px solid rgba(2,6,23,.06);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.2rem;position:relative}
.rainbow-border{border-image:linear-gradient(135deg,var(--brand1),var(--brand2),var(--brand3),var(--brand4)) 1}

.section-dots{background:
  radial-gradient(160px 70px at 10% 10%, rgba(125,211,252,.35), transparent 60%),
  radial-gradient(120px 60px at 90% 30%, rgba(252,165,165,.35), transparent 60%)}

.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.step .circle{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;
  background:var(--brand1);font-weight:900;margin-bottom:.6rem}

.section-bubbles{background:
  radial-gradient(200px 100px at 20% 40%, rgba(167,243,208,.35), transparent 60%),
  radial-gradient(140px 60px at 85% 60%, rgba(199,210,254,.35), transparent 60%)}
.age-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}

.section-highlight{background:linear-gradient(180deg,#f0f9ff,#fff)}
.safety-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:1.2rem;align-items:center}
.mockup .mockup-screen{height:230px;border-radius:16px;background:
  linear-gradient(135deg,#e2e8f0,#f1f5f9);border:2px dashed #cbd5e1}

.section-pricing{position:relative;background:linear-gradient(180deg,#fff,#fffbea 80%,#fff)}
.wave-top,.wave-bottom{height:26px;background:
  radial-gradient(12px 6px at 12px 6px,#fff 98%,transparent) repeat-x}
.wave-top{margin-top:-26px}
.wave-bottom{margin-top:26px}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.price-amount{font-size:2.1rem;font-weight:900;margin:.2rem 0}
.card-pop{transform:translateY(-6px);border-color:#fde047}
.ribbon{position:absolute;right:-6px;top:12px;background:#f59e0b;color:#111827;padding:.25rem .6rem;border-radius:999px;font-size:.8rem;font-weight:900}

.section-cta{background:linear-gradient(180deg,#ecfeff,#fff)}
.cta-wrap{display:grid;place-items:center;text-align:center;gap:.7rem}

/* Footer */
.site-footer{border-top:1px solid rgba(2,6,23,.06);padding:2rem 0;background:#fff}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1rem;align-items:start}
.foot-links{list-style:none;margin:0;padding:0}
.foot-links li + li{margin-top:.35rem}

/* Scroll reveal */
.pop-in{transform:translateY(18px);opacity:0;transition:all .6s cubic-bezier(.2,.7,.2,1)}
.pop-in.revealed{transform:none;opacity:1}

/* Responsive */
@media (max-width:980px){
  .hero-grid{grid-template-columns:1fr}
  .steps-grid,.age-grid,.price-grid{grid-template-columns:1fr 1fr}
  .safety-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  .menu{display:none}
  .nav-toggle{display:inline-block;background:#fff;border:2px solid #cbd5e1;border-radius:10px;padding:.45rem .7rem;font-weight:900}
  .steps-grid,.age-grid,.price-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
}