  @font-face {
    font-family: 'Baloo 2';
    font-style: normal;
    font-weight: 500 800;
    font-display: swap;
    src: url('fonts/baloo2-latin.woff2') format('woff2');
  }
  @font-face {
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('fonts/inter-latin.woff2') format('woff2');
  }
  :root {
    --red: #FF5A5F;
    --orange: #FFA23A;
    --yellow: #FFC93C;
    --green: #4ECDC4;
    --leaf: #6BCB77;
    --blue: #4D9DE0;
    --purple: #A78BFA;
    --pink: #FF8FB1;
    --ink: #22223B;
    --muted: #6b7280;
    --cream: #FFFDF7;
    --border: #eee2d0;
    --font-head: 'Baloo 2', cursive;
    --font-body: 'Inter', system-ui, sans-serif;
  }
  * { box-sizing: border-box; }
  body { margin:0; font-family:var(--font-body); background:var(--cream); color:var(--ink); line-height:1.6; }
  h1,h2,h3,h4 { font-family:var(--font-head); margin:0; }
  a { color: inherit; }
  .shell { max-width:1140px; margin:0 auto; padding:0 24px; }
  .rainbow-bar { height:6px; background:linear-gradient(90deg,var(--red),var(--orange),var(--yellow),var(--leaf),var(--blue),var(--purple),var(--pink)); }

  /* Header */
  header { position:sticky; top:0; z-index:50; background:rgba(255,253,247,0.95); backdrop-filter:blur(6px); border-bottom:1px solid var(--border); }
  .nav-row { display:flex; align-items:center; justify-content:space-between; padding:16px 0; }
  .logo { font-family:var(--font-head); font-weight:800; font-size:1.5rem; color:var(--ink); text-decoration:none; display:flex; align-items:center; gap:8px; }
  .logo .dot { color:var(--red); }
  .launch-pill { background:var(--ink); color:#fff; font-weight:700; font-size:0.78rem; padding:7px 16px; border-radius:50px; letter-spacing:0.03em; display:inline-flex; align-items:center; gap:6px; }
  .launch-pill .spark { color:var(--yellow); }
  nav.links { display:flex; gap:28px; font-weight:600; font-size:0.95rem; }
  nav.links a:hover { color:var(--red); }
  @media (max-width:760px){ nav.links{ display:none; } }

  /* Hero */
  .hero { padding:64px 0 40px; }
  .hero-grid { display:grid; grid-template-columns:1.1fr 0.9fr; gap:48px; align-items:center; }
  @media (max-width:900px){ .hero-grid{ grid-template-columns:1fr; } }
  .eyebrow-badge { display:inline-flex; align-items:center; gap:8px; background:#fff; border:2px solid var(--yellow); color:#a86b00; font-weight:700; font-size:0.85rem; padding:8px 16px; border-radius:50px; margin-bottom:20px; }
  .hero h1 { font-size:clamp(2.4rem,5vw,3.6rem); line-height:1.08; margin-bottom:18px; }
  .hero h1 .accent { color:var(--red); }
  .hero h1 .accent2 { color:var(--blue); }
  .hero p.lead { font-size:1.15rem; color:var(--muted); max-width:52ch; margin-bottom:28px; }
  .hero-ctas { display:flex; gap:14px; flex-wrap:wrap; }
  .btn { display:inline-block; padding:15px 28px; border-radius:50px; font-weight:700; text-decoration:none; font-family:var(--font-body); font-size:1rem; border:none; cursor:pointer; }
  .btn-primary { background:var(--red); color:#fff; box-shadow:0 8px 20px rgba(255,90,95,0.35); }
  .btn-primary:hover { background:#e8474c; }
  .btn-secondary { background:#fff; color:var(--ink); border:2px solid var(--border); }
  .hero-image-wrap { position:relative; border-radius:28px; overflow:hidden; box-shadow:0 20px 50px rgba(0,0,0,0.15); }
  .hero-image-wrap img { width:100%; display:block; }
  .hero-image-caption { position:absolute; bottom:0; left:0; right:0; background:linear-gradient(0deg,rgba(0,0,0,0.65),transparent); color:#fff; padding:20px; font-weight:700; font-family:var(--font-head); font-size:1.1rem; }

  /* Generic section */
  section { padding:70px 0; }
  .section-eyebrow { color:var(--red); font-weight:800; font-size:0.85rem; text-transform:uppercase; letter-spacing:0.08em; text-align:center; margin-bottom:10px; }
  .section-title { text-align:center; font-size:clamp(1.8rem,4vw,2.6rem); margin-bottom:16px; }
  .section-sub { text-align:center; color:var(--muted); max-width:60ch; margin:0 auto 48px; font-size:1.05rem; }

  /* How it works */
  .how-grid { display:grid; grid-template-columns:1fr 1fr; gap:32px; }
  @media (max-width:760px){ .how-grid{ grid-template-columns:1fr; } }
  .how-card { background:#fff; border:2px solid var(--border); border-radius:20px; padding:32px; }
  .how-step { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:50%; color:#fff; font-family:var(--font-head); font-weight:700; margin-bottom:16px; }
  .how-card.step1 .how-step { background:var(--blue); }
  .how-card.step2 .how-step { background:var(--red); }
  .how-card h3 { font-size:1.4rem; margin-bottom:10px; }
  .how-card p { color:var(--muted); }

  /* Examples */
  .examples-bg { background:#fff; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
  .example-pair { display:grid; grid-template-columns:1fr 1fr; gap:24px; background:var(--cream); border:2px solid var(--border); border-radius:24px; padding:28px; margin-bottom:32px; }
  @media (max-width:700px){ .example-pair{ grid-template-columns:1fr; } }
  .example-card { background:#fff; border-radius:16px; padding:18px; text-align:center; border:2px dashed var(--border); }
  .example-card svg { width:100%; max-width:260px; height:auto; }
  .example-card .tag { display:inline-block; font-weight:700; font-size:0.8rem; padding:5px 14px; border-radius:50px; margin-bottom:12px; }
  .tag-color { background:#fde2e2; color:var(--red); }
  .tag-draw { background:#e0f2fe; color:#0369a1; }
  .example-legend { text-align:center; color:var(--muted); font-size:0.9rem; margin-top:-8px; margin-bottom:8px; }
  .example-legend .solid { color:var(--ink); font-weight:700; } .example-legend .hint { color:#94a3b8; font-weight:700; }

  /* Age bands */
  .age-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
  @media (max-width:900px){ .age-grid{ grid-template-columns:1fr; } }
  .age-card { border-radius:24px; padding:32px; color:#fff; position:relative; overflow:hidden; }
  .age-card.band1 { background:linear-gradient(160deg,var(--pink),var(--red)); }
  .age-card.band2 { background:linear-gradient(160deg,var(--blue),var(--purple)); }
  .age-card.band3 { background:linear-gradient(160deg,var(--leaf),#2fa87a); }
  .age-photo { border-radius:16px; overflow:hidden; margin-bottom:20px; background:rgba(255,255,255,0.15); }
  .age-photo img { width:100%; height:180px; object-fit:cover; display:block; }
  .age-photo-placeholder { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; height:180px; border:2px dashed rgba(255,255,255,0.5); font-size:2rem; }
  .age-photo-placeholder span { font-size:0.85rem; font-weight:700; opacity:0.85; }
  .age-card .age-range { font-family:var(--font-head); font-size:2.2rem; font-weight:800; margin-bottom:4px; }
  .age-card .age-name { font-weight:700; opacity:0.9; margin-bottom:16px; }
  .age-card ul { padding-left:20px; margin:0; }
  .age-card li { margin-bottom:8px; }

  /* Trust */
  .trust-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; text-align:center; }
  @media (max-width:760px){ .trust-grid{ grid-template-columns:1fr; } }
  .trust-item .icon { font-size:2.2rem; margin-bottom:12px; }
  .trust-item h4 { font-size:1.1rem; margin-bottom:8px; }
  .trust-item p { color:var(--muted); font-size:0.95rem; }

  /* Waitlist */
  .waitlist-section { background:var(--ink); color:#fff; text-align:center; }
  .waitlist-section .section-title { color:#fff; }
  .waitlist-section .section-eyebrow { color:var(--yellow); }
  .waitlist-card { max-width:480px; margin:0 auto; background:#fff; border-radius:20px; padding:36px; color:var(--ink); }
  .form-group { margin-bottom:14px; text-align:left; }
  .form-group label { display:block; font-size:0.8rem; font-weight:700; margin-bottom:6px; color:var(--muted); }
  .form-control { width:100%; padding:13px 14px; border-radius:10px; border:2px solid var(--border); font-size:1rem; font-family:inherit; }
  .form-control:focus { outline:none; border-color:var(--blue); }
  .waitlist-note { font-size:0.82rem; color:var(--muted); margin-top:14px; }

  footer { padding:40px 0; text-align:center; color:var(--muted); font-size:0.9rem; }
  footer .rainbow-bar { margin-bottom:24px; }
  footer .footer-links { margin-top:10px; }
  footer .footer-links a { color:var(--muted); text-decoration:underline; font-size:0.85rem; margin:0 8px; cursor:pointer; background:none; border:none; padding:0; font-family:inherit; }
  footer .footer-links a:hover { color:var(--red); }

  /* Cookie consent banner */
  .cookie-banner { position:fixed; left:0; right:0; bottom:0; z-index:200; background:#fff; border-top:2px solid var(--border); box-shadow:0 -8px 30px rgba(0,0,0,0.12); padding:20px 24px; }
  .cookie-banner-inner { max-width:1140px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
  .cookie-banner-text { flex:1; min-width:240px; font-size:0.92rem; color:var(--ink); }
  .cookie-banner-text a { color:var(--blue); text-decoration:underline; }
  .cookie-banner-buttons { display:flex; gap:10px; flex-wrap:wrap; }
  .cookie-btn { padding:11px 22px; border-radius:50px; font-weight:700; font-size:0.88rem; font-family:var(--font-body); border:none; cursor:pointer; }
  .cookie-btn-accept { background:var(--red); color:#fff; }
  .cookie-btn-accept:hover { background:#e8474c; }
  .cookie-btn-reject { background:#fff; color:var(--ink); border:2px solid var(--border); }
  @media (max-width:640px){ .cookie-banner-inner{ flex-direction:column; align-items:stretch; text-align:center; } }
