/* Sensory Kiddos Music home, ported from the design prototype for production. */
:root[data-theme="sage"]{
  --bg:#f4f1e8; --bg-warm:#efeadd; --surface:#fffdf7; --surface-2:#f8f5ec;
  --ink:#2c352d; --ink-soft:#4b564c; --muted:#717a6f;
  --primary:#5f7d68; --primary-deep:#465f4d; --primary-tint:#e6ecdf;
  --accent:#d8b46a; --accent-deep:#bd9344; --accent-tint:#f3e9cf;
  --line:#e3dccb; --line-soft:#ece6d7; --hero-glow:#e9efe0;
  --cta:#5f7d68; --cta-deep:#465f4d;
}
:root[data-theme="dusk"]{
  --bg:#eef1f6; --bg-warm:#e8ecf3; --surface:#ffffff; --surface-2:#f5f7fb;
  --ink:#28303c; --ink-soft:#48515f; --muted:#6b7585;
  --primary:#6d89a8; --primary-deep:#4f6884; --primary-tint:#e4eaf2;
  --accent:#b3a4cc; --accent-deep:#8f7cb0; --accent-tint:#ece6f3;
  --line:#dde3ec; --line-soft:#e7ecf3; --hero-glow:#e6ecf4;
  --cta:#8d76c6; --cta-deep:#7058a4;
}
:root[data-theme="clay"]{
  --bg:#f6eee4; --bg-warm:#f0e5d6; --surface:#fffdf8; --surface-2:#f9f1e7;
  --ink:#3a2e26; --ink-soft:#5c4c40; --muted:#7e6e60;
  --primary:#b67a52; --primary-deep:#955d39; --primary-tint:#f0e2d3;
  --accent:#7f9472; --accent-deep:#63785a; --accent-tint:#e6ecdd;
  --line:#e7dbcb; --line-soft:#efe6d8; --hero-glow:#f1e6d7;
  --cta:#b67a52; --cta-deep:#955d39;
}
:root[data-head="serif"]{ --font-head:"Newsreader", Georgia, serif; --head-weight:500; }
:root[data-head="spectral"]{ --font-head:"Spectral", Georgia, serif; --head-weight:500; }
:root[data-head="round"]{ --font-head:"Nunito Sans", system-ui, sans-serif; --head-weight:700; }

*{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; }
body{
  font-family:"Nunito Sans", system-ui, -apple-system, sans-serif;
  background:var(--bg);
  color:var(--ink);
  font-size:18px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  font-optical-sizing:auto;
}
body.menu-open{ overflow:hidden; }
@media (prefers-reduced-motion: reduce){ *{ animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
h1,h2,h3,h4{
  color:var(--ink);
  font-family:var(--font-head);
  font-weight:var(--head-weight);
  line-height:1.12;
  letter-spacing:0;
  text-wrap:balance;
}
p{ text-wrap:pretty; }
a{ color:inherit; text-decoration:none; }
em{ font-style:italic; }
svg{ display:block; }
.wrap{ width:min(1140px, 92vw); margin-inline:auto; }
.eyebrow{ display:inline-flex; align-items:center; gap:.6em; color:var(--primary-deep); font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.eyebrow::before{ content:""; width:22px; height:1.5px; background:var(--accent-deep); border-radius:2px; }

.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5em; min-height:50px; cursor:pointer; border:0; font-family:inherit; font-size:17px; font-weight:700; line-height:1; padding:16px 26px; border-radius:999px; transition:transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease; }
.btn-primary{ background:var(--cta); color:#fff; box-shadow:0 8px 24px -10px color-mix(in srgb, var(--cta) 78%, transparent); }
.btn-primary:hover{ background:var(--cta-deep); transform:translateY(-2px); box-shadow:0 16px 34px -12px color-mix(in srgb, var(--cta) 82%, transparent); }
.btn-ghost{ background:transparent; color:var(--ink); border:1.5px solid var(--line); padding:14.5px 24px; }
.btn-ghost:hover{ border-color:var(--primary); color:var(--primary-deep); background:var(--surface); }
.btn .play{ width:22px; height:22px; border-radius:50%; display:inline-grid; place-items:center; background:var(--primary-tint); }
.btn .play svg{ width:10px; height:10px; }

header.nav{ position:sticky; top:0; z-index:50; background:color-mix(in srgb, var(--bg) 86%, transparent); backdrop-filter:blur(12px); border-bottom:1px solid var(--line-soft); }
.nav-inner{ display:flex; align-items:center; justify-content:space-between; height:74px; gap:24px; }
.brand{ display:flex; align-items:center; gap:11px; flex:none; font-family:var(--font-head); font-weight:600; font-size:21px; line-height:1; letter-spacing:0; }
.brand .mark{ width:40px; height:40px; display:grid; place-items:center; flex:none; --c1:var(--primary-deep); --c2:var(--cta); --c3:var(--accent); }
.brand .mark svg{ width:40px; height:40px; filter:drop-shadow(0 8px 18px rgba(79,104,132,.16)); }
.brand small{ display:block; margin-top:4px; color:var(--muted); font-family:"Nunito Sans",sans-serif; font-size:11px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.nav-links{ display:flex; align-items:center; gap:28px; }
.nav-links a{ color:var(--ink-soft); font-size:15.5px; font-weight:600; white-space:nowrap; transition:color .2s; }
.nav-links a:hover{ color:var(--primary-deep); }
.nav-cta{ display:flex; align-items:center; }
.nav-cta .btn{ min-height:44px; padding:12px 20px; font-size:15px; white-space:nowrap; }
.nav-toggle{ display:none; place-items:center; width:46px; height:46px; border:1.5px solid var(--line); border-radius:12px; background:var(--surface); color:var(--ink); cursor:pointer; }
.nav-toggle svg{ width:24px; height:24px; }

.hero{ position:relative; overflow:hidden; padding:70px 0 80px; }
.hero::before{ content:""; position:absolute; inset:0; z-index:0; background:radial-gradient(120% 90% at 78% 8%, var(--hero-glow) 0%, transparent 55%), radial-gradient(80% 70% at 8% 95%, var(--accent-tint) 0%, transparent 60%); opacity:.85; }
.hero-grid{ position:relative; z-index:1; display:grid; grid-template-columns:1.05fr .95fr; gap:58px; align-items:center; }
.hero h1{ max-width:12.8ch; margin:20px 0 0; font-size:clamp(36px, 4.7vw, 60px); }
.hero h1 em{ color:var(--primary-deep); }
.hero .lede{ max-width:36ch; margin-top:22px; color:var(--ink-soft); font-size:clamp(18px,1.5vw,20.5px); }
.hero .lede-short{ display:none; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin-top:32px; }
.assure{ display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-top:24px; }
.assure-item{ display:flex; align-items:center; gap:8px; color:var(--ink-soft); font-size:14.5px; font-weight:600; }
.assure-item svg{ width:17px; height:17px; flex:none; color:var(--primary); }
.dot{ width:4px; height:4px; border-radius:50%; background:var(--line); }
.hero-cta-mobile{ display:none; }
.hero-media{ position:relative; }
.hero-frame{ position:relative; min-height:520px; overflow:hidden; border:1px solid var(--line-soft); border-radius:28px; box-shadow:0 40px 80px -40px rgba(44,53,45,.4); background:var(--surface-2); }
.badge-float{ position:absolute; top:-16px; left:-22px; z-index:4; display:flex; align-items:center; gap:11px; max-width:230px; padding:12px 16px; border:1px solid var(--line-soft); border-radius:16px; background:var(--surface); box-shadow:0 18px 40px -22px rgba(44,53,45,.5); }
.badge-float .h{ width:38px; height:38px; display:grid; place-items:center; flex:none; border-radius:50%; background:var(--accent-tint); color:var(--accent-deep); }
.badge-float .h svg{ width:19px; height:19px; }
.badge-float .x{ color:var(--ink-soft); font-size:13px; line-height:1.35; }
.badge-float .x b{ color:var(--ink); }
.image-scene{ position:relative; overflow:hidden; min-height:100%; background:linear-gradient(145deg, rgba(255,255,255,.86), rgba(245,247,251,.72)), repeating-linear-gradient(90deg, rgba(79,104,132,.055) 0 1px, transparent 1px 78px), var(--surface-2); }
.hero-child{ height:520px; display:grid; place-items:center; }
.child-face{ position:relative; width:190px; height:190px; border-radius:48% 52% 46% 54%; background:radial-gradient(circle at 39% 43%, #28303c 0 5px, transparent 6px), radial-gradient(circle at 62% 43%, #28303c 0 5px, transparent 6px), radial-gradient(ellipse at 50% 62%, rgba(112,88,164,.28) 0 14px, transparent 15px), #f3d4ba; box-shadow:0 26px 60px -34px rgba(40,48,60,.56); }
.child-face::before,.child-face::after{ content:""; position:absolute; top:52px; width:42px; height:78px; border:12px solid var(--primary-deep); }
.child-face::before{ left:-34px; border-right:0; border-radius:42px 0 0 42px; }
.child-face::after{ right:-34px; border-left:0; border-radius:0 42px 42px 0; }
.sound-ripples{ position:absolute; top:70px; right:-96px; display:grid; gap:8px; }
.sound-ripples i{ display:block; width:58px; height:18px; border-top:4px solid var(--accent-deep); border-right:4px solid var(--accent-deep); border-radius:0 40px 0 0; opacity:.82; animation:pulse-ripple 1.8s ease-in-out infinite; }
.sound-ripples i:nth-child(2){ width:78px; opacity:.55; animation-delay:.18s; }
.sound-ripples i:nth-child(3){ width:98px; opacity:.32; animation-delay:.36s; }
@keyframes pulse-ripple{ 0%,100%{ transform:translateX(0); opacity:.34; } 50%{ transform:translateX(5px); opacity:.88; } }
.now-playing{ position:absolute; left:18px; right:18px; bottom:18px; z-index:3; display:flex; align-items:center; gap:14px; padding:14px 16px; border:1px solid var(--line-soft); border-radius:18px; background:color-mix(in srgb, var(--surface) 92%, transparent); backdrop-filter:blur(10px); box-shadow:0 16px 34px -20px rgba(44,53,45,.5); }
.np-play{ width:46px; height:46px; display:grid; place-items:center; flex:none; border:0; border-radius:50%; background:var(--primary); color:#fff; cursor:pointer; transition:transform .2s, background .2s; }
.np-play:hover{ background:var(--primary-deep); transform:scale(1.05); }
.np-play svg{ width:16px; height:16px; }
.np-meta{ flex:1; min-width:0; }
.np-meta .t{ color:var(--ink); font-size:15px; font-weight:700; }
.np-meta .s{ color:var(--muted); font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.np-wave{ display:flex; align-items:flex-end; gap:3px; height:26px; }
.np-wave span{ width:3px; border-radius:3px; background:var(--accent-deep); animation:wave 1.3s ease-in-out infinite; animation-play-state:paused; }
.is-playing .np-wave span{ animation-play-state:running; }
@keyframes wave{ 0%,100%{ height:6px; } 50%{ height:24px; } }

.stats{ padding:66px 0; background:var(--ink); color:#fff; }
.stats .lead{ max-width:760px; margin:0 auto 44px; text-align:center; }
.stats .lead .eyebrow{ justify-content:center; color:var(--accent); }
.stats .lead .eyebrow::before{ background:var(--accent); }
.stats .lead h2{ margin-top:16px; color:#fff; font-size:clamp(25px,3vw,36px); }
.stats .lead h2 em{ color:var(--accent); }
.stat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; }
.stat{ padding:6px 26px; text-align:center; border-left:1px solid color-mix(in srgb,#fff 14%,transparent); }
.stat:first-child{ border-left:0; }
.stat .num{ color:var(--accent); font-family:var(--font-head); font-size:clamp(40px,5vw,58px); font-weight:600; line-height:1; letter-spacing:0; }
.stat .lab{ margin-top:12px; color:color-mix(in srgb,#fff 84%,transparent); font-size:15px; line-height:1.4; }
.stat .src{ margin-top:8px; color:color-mix(in srgb,#fff 50%,transparent); font-size:12px; }
.stats .foot-note{ max-width:75ch; margin:36px auto 0; color:color-mix(in srgb,#fff 48%,transparent); font-size:12.5px; text-align:center; }

section.block{ padding:96px 0; }
.section-head{ max-width:680px; }
.section-head.center{ margin-inline:auto; text-align:center; }
.section-head h2{ margin-top:18px; font-size:clamp(30px,3.6vw,46px); }
.section-head h2 em{ color:var(--primary-deep); }
.section-head p{ margin-top:18px; color:var(--ink-soft); font-size:19px; }
.why{ background:var(--primary-deep); color:#fff; }
.why .section-head{ margin-inline:auto; text-align:center; }
.why .section-head h2,.why-card h3{ color:#fff; }
.why .section-head h2 em{ color:var(--accent); }
.why .section-head p{ color:color-mix(in srgb,#fff 80%,transparent); }
.why .eyebrow{ justify-content:center; color:var(--accent); }
.why .eyebrow::before{ background:var(--accent); }
.why-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:54px; }
.why-card{ display:flex; flex-direction:column; padding:32px 30px 28px; border:1px solid color-mix(in srgb,#fff 14%,transparent); border-radius:22px; background:color-mix(in srgb,#fff 6%,transparent); }
.why-card .ic,.mech-card .ic,.song-card .ic{ display:grid; place-items:center; margin-bottom:18px; color:var(--primary-deep); background:var(--primary-tint); }
.why-card .ic{ width:54px; height:54px; border-radius:15px; color:var(--accent); background:color-mix(in srgb,var(--accent) 22%,transparent); }
.why-card .ic svg{ width:27px; height:27px; }
.why-card h3{ margin-bottom:12px; font-size:23px; line-height:1.18; }
.why-card p{ flex:1; color:color-mix(in srgb,#fff 82%,transparent); font-size:16.5px; }
.why-card .cite{ flex:none; margin-top:20px; padding-top:16px; border-top:1px solid color-mix(in srgb,#fff 13%,transparent); color:color-mix(in srgb,#fff 60%,transparent); font-size:12.5px; line-height:1.45; }

.story-band{ padding:18px 0; }
.story-figure{ position:relative; overflow:hidden; border:1px solid var(--line-soft); border-radius:26px; box-shadow:0 40px 80px -46px rgba(44,53,45,.45); }
.story-figure .image-scene{ height:clamp(320px,44vw,500px); min-height:0; }
.story-reach{ background:radial-gradient(circle at 24% 58%, rgba(243,212,186,.95) 0 8%, transparent 8.5%), radial-gradient(circle at 42% 48%, rgba(79,104,132,.58) 0 7%, transparent 7.5%), radial-gradient(circle at 64% 42%, rgba(179,164,204,.55) 0 10%, transparent 10.5%), linear-gradient(135deg,#eef1f6,#fffdf9); }
.story-together{ background:radial-gradient(circle at 35% 55%, rgba(243,212,186,.95) 0 9%, transparent 9.5%), radial-gradient(circle at 55% 50%, rgba(141,118,198,.32) 0 13%, transparent 13.5%), linear-gradient(135deg,#f3e9cf,#eef1f6); }
.story-cap{ position:absolute; left:0; right:0; bottom:0; padding:54px 44px 34px; background:linear-gradient(to top, rgba(20,26,21,.76), rgba(20,26,21,.15) 60%, transparent); color:#fff; pointer-events:none; }
.story-cap .eyebrow{ color:var(--accent); }
.story-cap .eyebrow::before{ background:var(--accent); }
.story-cap p{ max-width:20ch; margin-top:12px; color:#fff; font-family:var(--font-head); font-size:clamp(22px,2.9vw,36px); font-weight:500; line-height:1.2; text-wrap:balance; }

.song-sec,.timeline-sec{ background:var(--bg-warm); }
.mech-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:50px; }
.mech-card,.song-card,.profile,.phase,.uc{ border:1px solid var(--line-soft); background:var(--surface); transition:transform .25s ease, box-shadow .25s ease; }
.mech-card{ padding:26px 24px; border-radius:20px; }
.mech-card:hover,.song-card:hover{ transform:translateY(-4px); box-shadow:0 24px 46px -32px rgba(44,53,45,.45); }
.mech-card .ic{ width:46px; height:46px; border-radius:13px; }
.mech-card .ic svg{ width:23px; height:23px; }
.mech-card h3{ margin-bottom:7px; font-size:19px; }
.mech-card p{ color:var(--ink-soft); font-size:15px; }
.lower-head{ margin-top:80px; }
.song-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:22px; margin-top:30px; }
.song-card{ padding:30px 30px 32px; border-radius:22px; }
.song-card .ic{ width:50px; height:50px; border-radius:14px; }
.song-card .ic svg{ width:25px; height:25px; }
.song-card h3{ margin-bottom:8px; font-size:22px; }
.song-card p{ color:var(--ink-soft); font-size:16.5px; }
.song-card .ex{ display:inline-block; margin-top:14px; padding-top:12px; border-top:1px dashed var(--line); color:var(--muted); font-size:14px; font-style:italic; }
.pull{ max-width:900px; margin:64px auto 0; padding:8px 0 4px; text-align:center; }
.pull blockquote{ color:var(--ink); font-family:var(--font-head); font-size:clamp(24px,3vw,36px); font-weight:500; line-height:1.28; }
.pull blockquote em{ color:var(--primary-deep); }
.pull .by{ margin-top:18px; color:var(--accent-deep); font-size:14px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }

.tuned-intro{ display:grid; grid-template-columns:1.04fr .96fr; gap:50px; align-items:center; margin-bottom:6px; }
.tuned-intro .section-head{ margin:0; }
.ti-media{ position:relative; overflow:hidden; border:1px solid var(--line-soft); border-radius:24px; box-shadow:0 30px 60px -40px rgba(44,53,45,.45); }
.ti-media .image-scene{ height:360px; min-height:0; background:radial-gradient(circle at 46% 48%, rgba(243,212,186,.9) 0 12%, transparent 12.5%), radial-gradient(circle at 60% 42%, rgba(79,104,132,.4) 0 16%, transparent 16.5%), linear-gradient(135deg,#fffdf9,#e4eaf2); }
.tag-float{ position:absolute; left:16px; bottom:16px; display:flex; align-items:center; gap:8px; padding:9px 14px; border:1px solid var(--line-soft); border-radius:12px; background:color-mix(in srgb,var(--surface) 92%,transparent); backdrop-filter:blur(8px); color:var(--ink); font-size:13px; font-weight:700; }
.tag-float svg{ width:16px; height:16px; color:var(--primary); }
.tuned-grid{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:48px; }
.profile{ padding:30px; border-radius:22px; }
.profile .tag{ display:inline-flex; align-items:center; gap:8px; margin-bottom:18px; padding:6px 14px; border-radius:999px; background:var(--primary-tint); color:var(--primary-deep); font-size:13px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.profile h3{ margin-bottom:10px; font-size:22px; }
.profile > p{ margin-bottom:18px; color:var(--ink-soft); font-size:16px; }
.specs{ display:flex; flex-wrap:wrap; gap:8px; }
.specs span{ padding:7px 14px; border:1px solid var(--line-soft); border-radius:999px; background:var(--surface-2); color:var(--ink-soft); font-size:13.5px; font-weight:600; }
.moment-head{ max-width:640px; margin-top:64px; }
.moment-head h3{ font-size:clamp(22px,2.4vw,30px); }
.moment-head p{ margin-top:12px; font-size:17px; }
.usecases{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:18px; }
.uc{ overflow:hidden; padding:0; border-radius:18px; }
.uc-img{ height:150px; background:linear-gradient(135deg,var(--accent-tint),var(--primary-tint)); }
.uc-img.bedtime{ background:linear-gradient(135deg,#d9e4f0,#efe6f3); }
.uc-img.calm{ background:linear-gradient(135deg,#ece6f3,#fffdf9); }
.uc-img.morning{ background:linear-gradient(135deg,#f3e9cf,#e4eaf2); }
.uc-img.dropoff{ background:linear-gradient(135deg,#e4eaf2,#ffffff); }
.uc-img.car{ background:linear-gradient(135deg,#dbe6ef,#f3e9cf); }
.uc-img.play{ background:linear-gradient(135deg,#ece6f3,#d9e4f0); }
.uc-body{ padding:22px; }
.uc .hd{ display:flex; align-items:center; gap:11px; margin-bottom:12px; }
.uc .hd .ic{ width:38px; height:38px; border-radius:11px; background:var(--accent-tint); color:var(--accent-deep); }
.uc .hd b{ font-family:var(--font-head); font-size:18px; font-weight:600; }
.uc .bpm{ margin-bottom:6px; color:var(--primary-deep); font-size:13px; font-weight:700; letter-spacing:.03em; }
.uc p{ color:var(--ink-soft); font-size:14.5px; }

.tl{ position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:52px; }
.phase{ position:relative; padding:30px 28px; border-radius:22px; }
.phase .ph-h{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:6px; }
.phase .when{ color:var(--ink); font-family:var(--font-head); font-size:21px; font-weight:600; }
.phase .tag{ color:var(--accent-deep); font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.phase .prog{ height:4px; overflow:hidden; margin:14px 0 22px; border-radius:4px; background:var(--line); }
.phase .prog i{ display:block; height:100%; border-radius:4px; background:var(--primary); transform-origin:left; animation:grow-bar 1.1s ease both paused; }
.phase.in .prog i{ animation-play-state:running; }
@keyframes grow-bar{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }
.phase ul{ display:flex; flex-direction:column; gap:16px; list-style:none; }
.phase li{ display:flex; align-items:flex-start; gap:12px; }
.phase li .ic{ width:30px; height:30px; display:grid; place-items:center; flex:none; border-radius:9px; background:var(--primary-tint); color:var(--primary-deep); }
.phase li .tx b{ display:block; color:var(--ink); font-size:14px; font-weight:700; }
.phase li .tx span{ color:var(--ink-soft); font-size:14.5px; }
.timeline-note{ max-width:70ch; margin:28px auto 0; color:var(--muted); font-size:13.5px; text-align:center; }

.proof{ background:var(--primary-deep); color:#fff; }
.proof .section-head h2{ color:#fff; }
.proof .section-head h2 em{ color:var(--accent); }
.proof .section-head p{ color:color-mix(in srgb,#fff 78%,transparent); }
.proof .eyebrow{ color:var(--accent); }
.proof .eyebrow::before{ background:var(--accent); }
.t-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:48px; }
.t-card{ display:flex; flex-direction:column; padding:28px; border:1px solid color-mix(in srgb,#fff 14%,transparent); border-radius:22px; background:color-mix(in srgb,#fff 7%,transparent); }
.t-card .stars{ margin-bottom:16px; color:var(--accent); letter-spacing:2px; }
.t-card blockquote{ flex:1; color:#fff; font-family:var(--font-head); font-size:19px; line-height:1.5; }
.t-card .who{ display:flex; align-items:center; gap:12px; margin-top:22px; padding-top:20px; border-top:1px solid color-mix(in srgb,#fff 14%,transparent); }
.t-card .av{ width:42px; height:42px; display:grid; place-items:center; flex:none; border-radius:50%; background:var(--accent-tint); color:var(--accent-deep); font-size:16px; font-weight:700; }
.t-card .nm{ color:#fff; font-size:15px; font-weight:700; }
.t-card .lo{ color:color-mix(in srgb,#fff 70%,transparent); font-size:13px; }

.promise{ background:var(--accent-tint); }
.promise .wrap{ display:grid; grid-template-columns:.9fr 1.1fr; gap:54px; align-items:center; }
.promise-seal{ display:grid; place-items:center; }
.seal{ width:200px; height:200px; display:grid; place-items:center; border:2px dashed var(--accent-deep); border-radius:50%; background:var(--surface); text-align:center; box-shadow:0 30px 60px -34px color-mix(in srgb,var(--accent-deep) 60%, transparent); }
.seal .big{ color:var(--primary-deep); font-family:var(--font-head); font-size:46px; font-weight:600; line-height:1; }
.seal .lab{ margin-top:8px; color:var(--accent-deep); font-size:12px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.seal .sub{ margin-top:4px; color:var(--muted); font-size:13px; }
.promise h2{ font-size:clamp(28px,3.4vw,42px); }
.promise h2 em{ color:var(--primary-deep); }
.promise p{ margin-top:18px; color:var(--ink-soft); font-size:19px; }
.promise ul{ display:flex; flex-direction:column; gap:13px; margin-top:24px; list-style:none; }
.promise li{ display:flex; align-items:flex-start; gap:11px; color:var(--ink-soft); font-size:16.5px; }
.promise li svg{ width:20px; height:20px; flex:none; margin-top:2px; color:var(--primary); }

.faq-list{ max-width:820px; margin-top:44px; }
.faq{ border-bottom:1px solid var(--line); }
.faq summary{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 0; color:var(--ink); cursor:pointer; font-family:var(--font-head); font-size:21px; font-weight:600; list-style:none; }
.faq summary::-webkit-details-marker{ display:none; }
.faq .pm{ width:30px; height:30px; display:grid; place-items:center; flex:none; border:1.5px solid var(--line); border-radius:50%; color:var(--primary-deep); transition:transform .3s, border-color .2s, background .2s; }
.faq[open] .pm{ transform:rotate(45deg); border-color:var(--primary); background:var(--primary); color:#fff; }
.faq .ans{ max-width:68ch; padding:0 0 26px; color:var(--ink-soft); font-size:17px; }

.final{ position:relative; overflow:hidden; padding:108px 0; text-align:center; }
.final::before{ content:""; position:absolute; inset:0; background:radial-gradient(70% 120% at 50% 0%, var(--hero-glow), transparent 62%); }
.final .wrap{ position:relative; z-index:1; max-width:780px; }
.final .eyebrow{ justify-content:center; }
.final h2{ font-size:clamp(32px,4.4vw,56px); }
.final h2 em{ color:var(--primary-deep); }
.final p{ max-width:52ch; margin:22px auto 0; color:var(--ink-soft); font-size:20px; }
.final .hero-cta{ justify-content:center; margin-top:36px; }

footer.foot{ padding:64px 0 40px; background:var(--ink); color:color-mix(in srgb,#fff 72%,transparent); }
.foot-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:34px; border-bottom:1px solid color-mix(in srgb,#fff 14%,transparent); }
.foot .brand{ color:#fff; }
.foot .brand small{ color:color-mix(in srgb,#fff 55%,transparent); }
.foot .brand .mark{ --c1:#fff; --c2:var(--accent); --c3:color-mix(in srgb,#fff 65%, transparent); }
.foot .blurb{ max-width:34ch; margin-top:16px; font-size:15px; line-height:1.6; }
.foot h5{ margin-bottom:16px; color:#fff; font-family:"Nunito Sans",sans-serif; font-size:13px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }
.foot ul{ display:flex; flex-direction:column; gap:11px; list-style:none; }
.foot ul a{ font-size:15px; transition:color .2s; }
.foot ul a:hover{ color:#fff; }
.foot .disclaimer{ max-width:88ch; margin:26px 0 0; color:color-mix(in srgb,#fff 45%,transparent); font-size:12.5px; line-height:1.55; }
.foot-bottom{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:20px; padding-top:24px; color:color-mix(in srgb,#fff 52%,transparent); font-size:13.5px; }
.foot-bottom .trust{ display:flex; flex-wrap:wrap; gap:22px; }

.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }
.mobile-menu,.mobile-cta{ display:none; }

@media(max-width:1120px){
  .nav-links,.nav-buy{ display:none; }
  .nav-inner{ gap:14px; }
  .nav-toggle{ display:inline-grid; }
  .mobile-menu{ display:block; position:fixed; top:74px; left:0; right:0; z-index:48; padding:8px 0 20px; background:var(--bg); border-bottom:1px solid var(--line); box-shadow:0 24px 44px -26px rgba(44,53,45,.45); transform:translateY(-135%); transition:transform .38s cubic-bezier(.4,0,.2,1); }
  .mobile-menu.open{ transform:translateY(0); }
  .mobile-menu .wrap{ display:flex; flex-direction:column; }
  .mobile-menu a.mlink{ display:flex; align-items:center; justify-content:space-between; padding:15px 2px; border-bottom:1px solid var(--line-soft); color:var(--ink); font-size:18px; font-weight:600; }
  .mobile-menu a.mlink svg{ width:18px; height:18px; color:var(--muted); }
  .mobile-menu .btn{ width:100%; margin-top:18px; }
  .mobile-cta{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:60; align-items:center; gap:14px; padding:11px 16px calc(11px + env(safe-area-inset-bottom)); background:color-mix(in srgb,var(--bg) 90%,transparent); backdrop-filter:blur(14px); border-top:1px solid var(--line); }
  .mobile-cta .btn{ flex:1; padding:15px; font-size:16px; }
  .mobile-cta .mc-note{ display:flex; align-items:center; gap:6px; max-width:96px; flex:none; color:var(--muted); font-size:11.5px; font-weight:700; line-height:1.25; }
  .mobile-cta .mc-note svg{ width:15px; height:15px; flex:none; color:var(--primary); }
  body{ padding-bottom:74px; }
}
@media(max-width:880px){
  .hero-grid{ grid-template-columns:1fr; gap:40px; }
  .hero-frame,.hero-child{ min-height:380px; height:380px; }
  .badge-float{ left:0; }
  .mech-grid{ grid-template-columns:1fr 1fr; }
  .why-grid,.tl,.t-grid{ grid-template-columns:1fr; max-width:520px; margin-inline:auto; }
  .tuned-intro{ grid-template-columns:1fr; gap:30px; }
  .usecases{ grid-template-columns:1fr; }
  .foot-top{ grid-template-columns:1fr 1fr; gap:32px; }
}
@media(max-width:760px){
  .stat-grid{ grid-template-columns:1fr 1fr; gap:34px 0; }
  .stat:nth-child(3){ border-left:0; }
  .song-grid,.tuned-grid,.promise .wrap{ grid-template-columns:1fr; }
  .promise-seal{ justify-self:start; }
}
@media(max-width:640px){
  body{ font-size:17px; }
  .wrap{ width:94vw; }
  section.block{ padding:62px 0; }
  .hero{ padding:20px 0 38px; }
  .hero-grid{ gap:22px; }
  .hero h1{ margin-top:12px; font-size:clamp(35px,10vw,48px); }
  .hero .lede{ margin-top:13px; max-width:none; }
  .hero .lede-full,.h1-tail{ display:none; }
  .hero .lede-short{ display:block; font-size:16.5px; }
  .hero-copy .hero-cta{ display:none; }
  .hero-cta-mobile{ display:flex; margin-top:18px; }
  .hero-cta-mobile .btn{ width:100%; }
  .assure{ display:none; }
  .badge-float{ top:-13px; left:0; max-width:200px; padding:10px 13px; }
  .hero-frame,.hero-child{ min-height:300px; height:300px; }
  .child-face{ width:142px; height:142px; }
  .child-face::before,.child-face::after{ top:39px; width:32px; height:58px; border-width:9px; }
  .child-face::before{ left:-26px; }
  .child-face::after{ right:-26px; }
  .sound-ripples{ top:52px; right:-68px; gap:5px; }
  .sound-ripples i{ width:42px; height:14px; border-width:3px; }
  .sound-ripples i:nth-child(2){ width:58px; }
  .sound-ripples i:nth-child(3){ width:72px; }
  .now-playing{ left:12px; right:12px; bottom:12px; padding:12px; }
  .np-wave{ display:none; }
  .stats{ padding:50px 0; }
  .stat-grid{ gap:30px 18px; }
  .stat{ padding:0 6px; }
  .section-head h2{ font-size:clamp(27px,7.5vw,36px); }
  .section-head p{ font-size:17px; }
  .why-card,.song-card,.profile,.phase{ padding:26px 22px; }
  .mech-grid{ grid-template-columns:1fr; }
  .pull blockquote{ font-size:clamp(21px,6vw,28px); }
  .story-figure .image-scene{ height:clamp(260px,62vw,340px); }
  .story-cap{ padding:26px 20px 20px; }
  .story-cap p{ font-size:clamp(20px,6vw,26px); }
  .ti-media .image-scene{ height:300px; }
  .seal{ width:160px; height:160px; }
  .seal .big{ font-size:38px; }
  .faq summary{ padding:20px 0; font-size:18px; }
  .final{ padding:80px 0; }
  .foot-top{ grid-template-columns:1fr; gap:26px; }
}