/* public/css/kids-media.css — TotsName Kids Media & Learning World (v10.339).
   Mobile-first; uses the site tokens (--rose, --ink, --cream …). Headings keep
   the site-wide brand pink set in style.css. */
.km{--km-navy:#1B2A4A;--km-mut:#5E5873;--km-line:rgba(107,33,244,.12);--km-card:#fff;--km-soft:#FFF6FA;--km-radius:18px;color:var(--ink,#0F0820)}
.km *{box-sizing:border-box}
.km-page{max-width:1180px;margin:0 auto;padding:14px 16px 56px;overflow-wrap:anywhere}
.km-sr{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.km-crumbs{font-size:13px;color:var(--km-mut);display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 14px}
.km-crumbs a{color:var(--km-mut);text-decoration:underline;text-underline-offset:2px}
.km-eyebrow{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#D6005E;margin:0 0 6px}
.km-lede{font-size:17px;line-height:1.6;color:var(--km-mut);margin:6px 0 10px}
.km-small{font-size:13px;color:var(--km-mut);margin:6px 0}
.km-sec{margin:34px 0}
.km-sec h2{font-family:var(--font-display,serif);font-size:clamp(22px,3vw,30px);margin:0 0 12px;line-height:1.2}
.km-sec h3{font-size:18px;margin:16px 0 8px}
.km-sec p{line-height:1.75;margin:0 0 12px}
.km-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:11px 22px;border-radius:100px;border:0;cursor:pointer;background:linear-gradient(135deg,#D6005E,#A8004A);color:#fff !important;font-weight:700;font-size:15px;text-decoration:none;box-shadow:0 8px 20px rgba(240,0,107,.22);transition:transform .15s,box-shadow .15s}
.km-btn:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(240,0,107,.3)}
.km-btn-ghost{background:#fff;color:var(--km-navy) !important;border:1.5px solid var(--km-line);box-shadow:none}
.km-btn-ghost:hover{border-color:var(--rose,#F0006B);box-shadow:none}
.km-btn[disabled]{opacity:.6;pointer-events:none}
.km-btn-row{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 4px}
.km-block{display:flex;width:100%;margin-top:14px}
.km-link{background:none;border:0;padding:0 2px;color:#D6005E;font-weight:700;cursor:pointer;text-decoration:underline;font-size:inherit}

/* navigation */
.km-nav{margin:18px 0 8px}
.km-nav ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.km-nav a{display:flex;align-items:center;gap:10px;min-height:48px;padding:8px 12px;background:#fff;border:1px solid var(--km-line);border-radius:14px;text-decoration:none;color:var(--km-navy);font-weight:600;font-size:14px;transition:border-color .15s,transform .15s}
.km-nav a:hover,.km-nav a[aria-current]{border-color:var(--rose,#F0006B);color:#D6005E}
.km-nav-ic{flex:none;width:32px;height:32px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--km-soft);color:#D6005E}
@media(min-width:600px){.km-nav ul{grid-template-columns:repeat(5,minmax(0,1fr))}}

/* hub */
.km-world{margin:14px 0 8px}
.km-hubsearch{position:relative;display:flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--km-line);border-radius:16px;padding:6px 6px 6px 14px;margin:14px 0;color:var(--km-mut)}
.km-hubsearch input{flex:1;min-width:0;border:0;outline:0;font-size:16px;padding:10px 4px;background:transparent;color:var(--ink,#0F0820)}
.km-hubsearch:focus-within{border-color:var(--rose,#F0006B)}
.km-hres{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:40;list-style:none;margin:0;padding:6px;background:#fff;border:1px solid var(--km-line);border-radius:14px;box-shadow:0 18px 40px rgba(22,11,46,.14);max-height:60vh;overflow:auto}
.km-hres a{display:flex;align-items:center;gap:10px;padding:8px;border-radius:10px;text-decoration:none;color:var(--ink,#0F0820)}
.km-hres a:hover{background:var(--km-soft)}
.km-hres img{width:64px;height:40px;object-fit:cover;border-radius:8px;flex:none}
.km-hres span{display:flex;flex-direction:column;min-width:0}
.km-hres small{color:var(--km-mut);font-size:12px}
.km-hres-none{padding:10px;color:var(--km-mut);font-size:14px}
.km-journey{list-style:none;padding:0;margin:8px 0 0;display:flex;flex-wrap:wrap;gap:6px;justify-content:center}
.km-journey li{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--km-navy);background:var(--km-soft);border-radius:100px;padding:6px 12px}
.km-journey li:not(:last-child)::after{content:'→';color:#D6005E;margin-left:4px}

/* category cards */
.km-catgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:10px}
.km-catcard{display:flex;align-items:center;gap:12px;padding:10px;background:#fff;border:1px solid var(--km-line);border-radius:16px;text-decoration:none;color:var(--ink,#0F0820);transition:transform .15s,box-shadow .15s,border-color .15s}
.km-catcard:hover{transform:translateY(-2px);border-color:var(--rose,#F0006B);box-shadow:0 10px 24px rgba(22,11,46,.08)}
.km-catcard img{width:64px;height:64px;border-radius:12px;object-fit:cover;flex:none}
.km-catcard span{display:flex;flex-direction:column}
.km-catcard small{color:var(--km-mut);font-size:12.5px}

/* content cards */
.km-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:600px){.km-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1000px){.km-grid{grid-template-columns:repeat(3,1fr)}.km-page>.km-sec>.km-grid:not(.km-grid-feat){grid-template-columns:repeat(4,1fr)}}
.km-card{display:flex;flex-direction:column;background:var(--km-card);border:1px solid var(--km-line);border-radius:var(--km-radius);overflow:hidden;text-decoration:none;color:var(--ink,#0F0820);transition:transform .18s,box-shadow .18s,border-color .18s;min-width:0}
.km-card:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(22,11,46,.10);border-color:rgba(240,0,107,.35)}
.km-card:focus-visible{outline:3px solid var(--rose,#F0006B);outline-offset:2px}
.km-card-img{position:relative;display:block;aspect-ratio:16/10;background:var(--km-soft)}
.km-card-img img{width:100%;height:100%;object-fit:cover;display:block}
.km-chip{position:absolute;left:10px;top:10px;background:rgba(255,255,255,.94);color:var(--km-navy);font-size:11.5px;font-weight:700;border-radius:100px;padding:4px 10px}
.km-card-body{display:flex;flex-direction:column;gap:6px;padding:14px 16px 16px;flex:1}
.km-card-title{font-family:var(--font-display,serif);font-size:19px;font-weight:700;line-height:1.25;color:var(--km-navy)}
.km-card-sum{font-size:14px;line-height:1.5;color:var(--km-mut);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.km-card-age{margin-top:auto;font-size:12px;font-weight:700;color:#D6005E}

/* category hero */
.km-cat-hero{display:grid;grid-template-columns:1fr;gap:18px;align-items:center;background:linear-gradient(135deg,#FFF6FA,#F3EEFF);border:1px solid var(--km-line);border-radius:24px;padding:22px}
.km-cat-hero h1{font-family:var(--font-display,serif);font-size:clamp(30px,5vw,46px);line-height:1.1;margin:0}
.km-cat-hero-img{width:100%;max-width:420px;border-radius:18px;justify-self:center;aspect-ratio:16/10;object-fit:cover}
.km-ages{font-size:14px;margin:0}
@media(min-width:860px){.km-cat-hero{grid-template-columns:1.3fr 1fr;padding:32px}}

.km-what{display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:860px){.km-what{grid-template-columns:1.4fr 1fr;align-items:start}}
.km-box{background:#fff;border:1px solid var(--km-line);border-radius:var(--km-radius);padding:18px 20px;margin:18px 0}
.km-box h2,.km-box h3{margin-top:0}
.km-ticks{list-style:none;padding:0;margin:0}
.km-ticks li{position:relative;padding:6px 0 6px 28px;line-height:1.55}
.km-ticks li::before{content:'✓';position:absolute;left:4px;top:6px;color:#12A150;font-weight:800}
.km-facts{display:grid;grid-template-columns:1fr;gap:12px}
.km-facts>div{background:#fff;border:1px solid var(--km-line);border-radius:16px;padding:16px}
.km-facts h3{margin:0 0 6px;font-size:17px}
.km-facts p{margin:0;line-height:1.6;color:var(--km-mut)}
@media(min-width:700px){.km-facts{grid-template-columns:repeat(2,1fr)}}
.km-two{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:760px){.km-two{grid-template-columns:1fr 1fr}}
.km-box-trad{border-left:5px solid #F59E0B;margin:0}
.km-box-sci{border-left:5px solid #0090FF;margin:0}

.km-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.km-chips a{min-height:40px;display:inline-flex;align-items:center;padding:6px 14px;border-radius:100px;background:#fff;border:1px solid var(--km-line);text-decoration:none;color:var(--km-navy);font-size:14px;font-weight:600}
.km-chips a[aria-current]{background:#C4005A;border-color:transparent;color:#fff}
.km-pager{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:22px 0 0}
.km-pager a{min-width:42px;min-height:42px;display:flex;align-items:center;justify-content:center;border-radius:12px;border:1px solid var(--km-line);background:#fff;text-decoration:none;color:var(--km-navy);font-weight:700}
.km-pager a[aria-current]{background:#C4005A;color:#fff;border-color:transparent}
.km-empty{color:var(--km-mut)}
.km-count{font-weight:700;color:var(--km-mut)}

.km-learnband{display:flex;flex-direction:column;gap:14px;align-items:flex-start;background:linear-gradient(135deg,#1B2A4A,#3A2A7A);color:#fff;border-radius:22px;padding:22px;margin:34px 0}
.km-learnband h2{margin:0 0 6px;font-size:24px;-webkit-text-fill-color:#fff !important;color:#fff !important}
.km-learnband p{margin:0;color:rgba(255,255,255,.85);line-height:1.6}
@media(min-width:760px){.km-learnband{flex-direction:row;align-items:center;justify-content:space-between}}
.km-details{background:#fff;border:1px solid var(--km-line);border-radius:14px;padding:12px 16px;margin:8px 0}
.km-details summary{cursor:pointer;font-weight:700;color:var(--km-navy);min-height:28px}
.km-details p{margin:10px 0 0;line-height:1.65;color:var(--km-mut)}
.km-cta{text-align:center;background:var(--km-soft);border-radius:22px;padding:26px 18px;margin:34px 0 0}
.km-cta .km-btn-row{justify-content:center}

/* item page */
.km-item-hero{display:grid;grid-template-columns:1fr;gap:18px;align-items:start}
.km-item-img{width:100%;border-radius:20px;aspect-ratio:16/10;object-fit:cover;box-shadow:0 14px 36px rgba(22,11,46,.10)}
.km-item-copy h1{font-family:var(--font-display,serif);font-size:clamp(30px,5vw,44px);line-height:1.12;margin:0}
.km-hi{font-size:20px;margin:4px 0 0;color:var(--km-navy)}
.km-meta{list-style:none;padding:0;margin:6px 0;display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13.5px;color:var(--km-mut)}
@media(min-width:860px){.km-item-hero{grid-template-columns:1.1fr 1fr}}
.km-notice{background:#FFF8E6;border:1px solid #F5D98B;border-radius:14px;padding:12px 16px;margin:18px 0;line-height:1.6;font-size:14.5px}
.km-urgent{background:#FDECEC;border:1px solid #F3C2C2;color:#8A1C1C;border-radius:14px;padding:12px 16px;margin:14px 0;line-height:1.6}
.km-item-cols{display:grid;grid-template-columns:1fr;gap:26px}
@media(min-width:1000px){.km-item-cols{grid-template-columns:minmax(0,1fr) 320px}.km-item-side{position:sticky;top:90px;align-self:start}}
.km-item-side h2{font-size:20px;margin:28px 0 12px}
.km-grid-side{grid-template-columns:1fr !important}
.km-story p{font-size:17.5px;line-height:1.85}
.km-moral{background:linear-gradient(135deg,#FFF0F6,#FFF8EC);border-radius:18px;padding:18px 22px;margin:22px 0}
.km-moral h2{margin:0 0 6px;font-size:20px}
.km-moral p{margin:0;font-size:18px;font-weight:600;color:var(--km-navy)}
.km-lyrics{margin:14px 0 6px;padding:16px 20px;background:var(--km-soft);border-left:4px solid var(--rose,#F0006B);border-radius:0 14px 14px 0;font-size:18px;line-height:1.8;font-style:italic}
.km-vocab{display:grid;grid-template-columns:1fr;gap:8px;margin:0}
.km-vocab div{background:#fff;border:1px solid var(--km-line);border-radius:12px;padding:10px 14px}
.km-vocab dt{font-weight:800;color:var(--km-navy)}
.km-vocab dd{margin:2px 0 0;color:var(--km-mut)}
@media(min-width:700px){.km-vocab{grid-template-columns:repeat(2,1fr)}}
.km-q li{margin:6px 0;line-height:1.6}
.km-act{background:#F0FAF5;border-color:#BFE8D2}
.km-mtext{background:linear-gradient(135deg,#FFF6EA,#FFF0F6);border-radius:20px;padding:20px;margin:26px 0}
.km-deva{font-size:clamp(20px,3vw,26px);line-height:1.8;font-family:'Noto Sans Devanagari',var(--font-body),sans-serif;color:#5A2A0A}
.km-iast{font-size:17px;line-height:1.8;font-style:italic;color:var(--km-navy)}
.km-bigsound{font-size:clamp(28px,6vw,44px);font-weight:900;color:#D6005E;margin:0 0 12px;letter-spacing:.02em}
.km-sources{padding-left:20px;margin:10px 0 0}
.km-sources li{margin:0 0 14px;line-height:1.55}
.km-lvl{display:inline-block;font-size:11.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;padding:3px 10px;border-radius:100px;background:#EEF2FF;color:#2F3FA8}
.km-lvl-guideline,.km-lvl-expert-body{background:#E6F7EE;color:#12833F}
.km-lvl-pilot,.km-lvl-small-study{background:#FFF3DC;color:#7E22CE}
.km-src-find{margin:6px 0 2px}
.km-src-lim{margin:0 0 2px;font-size:14px;color:var(--km-mut)}
.km-src-cite{margin:0;font-size:13px;color:var(--km-mut)}
.km-src-cite a{color:#1E66FF}
.km-babies{background:#F2F8FF;border-radius:20px;padding:20px}
.km-note{font-size:14px;color:var(--km-mut)}
.km-quiz fieldset{border:1px solid var(--km-line);border-radius:16px;padding:14px 16px;margin:0 0 12px;background:#fff}
.km-quiz legend{font-weight:700;padding:0 6px;color:var(--km-navy)}
.km-opt{display:inline-flex;align-items:center;min-height:44px;margin:6px 6px 0 0;padding:8px 16px;border-radius:100px;border:1.5px solid var(--km-line);background:#fff;cursor:pointer;font-size:15px;color:var(--ink,#0F0820)}
.km-opt.is-right{background:#E6F7EE;border-color:#12A150;color:#0B6B33}
.km-opt.is-wrong{background:#FDECEC;border-color:#D93A3A;color:#8A1C1C}
.km-qfb{margin:8px 0 0;font-weight:700;min-height:1.2em}
.km-searchform{display:grid;grid-template-columns:1fr;gap:10px;margin:14px 0 20px}
.km-searchform input,.km-searchform select{min-height:48px;padding:10px 14px;border:1.5px solid var(--km-line);border-radius:12px;font-size:16px;background:#fff;color:var(--ink,#0F0820);width:100%}
@media(min-width:860px){.km-searchform{grid-template-columns:2fr 1fr 1fr 1fr auto}}
.vm-hero-kicker{font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin:0 0 6px;opacity:.95}
@media (prefers-reduced-motion:reduce){.km-card,.km-btn,.km-catcard{transition:none}}
[data-theme="dark"] .km{--km-card:#1C1830;--km-soft:#241E3C;--km-mut:#C9C1E0;--km-navy:#ECE8F7}
[data-theme="dark"] .km-nav a,[data-theme="dark"] .km-catcard,[data-theme="dark"] .km-box,[data-theme="dark"] .km-facts>div,[data-theme="dark"] .km-details,[data-theme="dark"] .km-vocab div,[data-theme="dark"] .km-hubsearch,[data-theme="dark"] .km-hres,[data-theme="dark"] .km-quiz fieldset,[data-theme="dark"] .km-opt,[data-theme="dark"] .km-chips a,[data-theme="dark"] .km-pager a,[data-theme="dark"] .km-btn-ghost{background:#1C1830;color:#ECE8F7}
/* style.css gives every <section> 46px vertical padding; inside Kids Media the
   spacing comes from .km-sec margins, so reset it and restore padding only on
   the boxed sections (higher specificity than the reset). */
.km section{padding-top:0;padding-bottom:0}
.km .km-box{padding:18px 20px}.km .km-moral{padding:18px 22px}.km .km-babies{padding:20px}
.km .km-mtext{padding:20px}.km .km-learnband{padding:22px}.km .km-cta{padding:26px 18px}

/* ======================================================================
   DARK MODE (v10.340) — every light "box" gets a real dark variant, so its
   text never sits light-on-light. Verified with an automated WCAG contrast
   sweep of every Kids Media & Learning page (>= 4.5:1, 3:1 for large text).
   ====================================================================== */
[data-theme="dark"] .km{--km-line:rgba(255,255,255,.14);color:#ECE8F7}
[data-theme="dark"] .km p,[data-theme="dark"] .km li,[data-theme="dark"] .km dd,[data-theme="dark"] .km span,[data-theme="dark"] .km strong{-webkit-text-fill-color:currentColor}
[data-theme="dark"] .km-cat-hero{background:linear-gradient(135deg,#231A36,#1A1A33);border-color:rgba(255,255,255,.1)}
[data-theme="dark"] .km-notice{background:#2B2410;border-color:#6B5A20;color:#F6EBCB}
[data-theme="dark"] .km-notice strong{color:#FFE7A3}
[data-theme="dark"] .km-urgent{background:#3A1418;border-color:#7A2A30;color:#FFD9D9}
[data-theme="dark"] .km-urgent strong{color:#FFFFFF}
[data-theme="dark"] .km-moral{background:linear-gradient(135deg,#2E1428,#2A2012)}
[data-theme="dark"] .km-moral p{color:#FFFFFF}
[data-theme="dark"] .km-babies{background:#132437}
[data-theme="dark"] .km-mtext{background:linear-gradient(135deg,#2A1C12,#2A1424)}
[data-theme="dark"] .km-deva{color:#FFD9B0}
[data-theme="dark"] .km-iast{color:#E6DDF7}
[data-theme="dark"] .km-act{background:#10281D;border-color:#1F5A3C}
[data-theme="dark"] .km-cta{background:#221B38}
[data-theme="dark"] .km-lyrics{background:#241E3C;color:#F3EEFE}
[data-theme="dark"] .km-chip{background:rgba(15,10,30,.88);color:#FFFFFF}
[data-theme="dark"] .km-card-age,[data-theme="dark"] .km-eyebrow,[data-theme="dark"] .km-link{color:#FF8FC0}
[data-theme="dark"] .km-card-title{color:#F3EEFE}
[data-theme="dark"] .km-bigsound{color:#FF8FC0}
[data-theme="dark"] .km-src-cite a,[data-theme="dark"] .km a:not(.km-btn):not(.km-card):not(.km-catcard):not([class*="km-"]){color:#9CC8FF}
[data-theme="dark"] .km-lvl{background:#23305C;color:#D6E0FF}
[data-theme="dark"] .km-lvl-guideline,[data-theme="dark"] .km-lvl-expert-body{background:#113A25;color:#B8F0CF}
[data-theme="dark"] .km-lvl-pilot,[data-theme="dark"] .km-lvl-small-study{background:#3A2C0C;color:#FFE2A3}
[data-theme="dark"] .km-box-trad{border-left-color:#F59E0B}
[data-theme="dark"] .km-box-sci{border-left-color:#5AA9FF}
[data-theme="dark"] .km-opt.is-right{background:#12391F;border-color:#3FCF7A;color:#C8F5D8}
[data-theme="dark"] .km-opt.is-wrong{background:#3D1616;border-color:#FF6B6B;color:#FFD2D2}
[data-theme="dark"] .km-hubsearch input,[data-theme="dark"] .km-searchform input,[data-theme="dark"] .km-searchform select{background:#1C1830;color:#ECE8F7;border-color:rgba(255,255,255,.18)}
[data-theme="dark"] .km-hubsearch input::placeholder,[data-theme="dark"] .km-searchform input::placeholder{color:#B9B0D6}
[data-theme="dark"] .km-nav-ic{background:#2A2145;color:#FF8FC0}
[data-theme="dark"] .km-journey li{background:#241E3C;color:#ECE8F7}
[data-theme="dark"] .km-card,[data-theme="dark"] .km-catcard{border-color:rgba(255,255,255,.12)}
/* v10.340 light-mode contrast: small pink text uses the deeper brand pink. */
.km-card-age,.km-eyebrow,.km-link,.km-nav a[aria-current],.km-nav a:hover,.km-nav-ic{color:#C4005A}
.km-lvl-guideline,.km-lvl-expert-body{color:#0B6B33}
[data-theme="dark"] .km-nav a[aria-current],[data-theme="dark"] .km-nav a:hover{color:#FF8FC0}
.km-src-cite a{color:#1450C8}
.km-values{list-style:none;padding:0;margin:4px 0 0;display:flex;flex-wrap:wrap;gap:8px}
.km-values li{background:#FFF0F6;color:#8A0040;border:1px solid #F7C6DB;border-radius:100px;padding:6px 14px;font-size:14px;font-weight:700}
[data-theme="dark"] .km-values li{background:#2E1428;color:#FFD0E4;border-color:#5A2A48}

/* ===================== Kids Studio (v10.342) ===================== */
/* Hero heading: vibrant aquamarine blue, theme-aware (brief §10). Scoped to
   the Kids Studio hero only — the site's heading colours are untouched.
   Light #00838F on the cream scrim ≈ 4.4:1; dark #5DE3DC on the dark scrim
   ≈ 9:1 (large text needs 3:1). */
/* v10.344: hero heading is HOT PINK in both themes (was aquamarine).
   (v10.345: now the brand deep hot pink tokens — see below)
   on the dark scrim ≈ 5:1 — large text needs 3:1. Variable name kept. */
:root{ --ks-hero-aqua:var(--tn-rose-dk,#D6005E); }                 /* v10.345: brand DEEP hot pink (not ordinary hot pink) */
[data-theme="dark"]{ --ks-hero-aqua:var(--tn-rose,#F0006B); }
.vm .vm-hero h1#vm-title{ color:var(--ks-hero-aqua) !important; -webkit-text-fill-color:var(--ks-hero-aqua) !important;
  font-weight:700; letter-spacing:-.01em; text-shadow:0 1px 0 rgba(255,255,255,.55); }
[data-theme="dark"] .vm .vm-hero h1#vm-title{ text-shadow:0 0 1px rgba(255,255,255,.35),0 2px 12px rgba(0,0,0,.7); }

/* Listen Now block */
.km-listen{ margin:16px 0 6px; display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.km-listen-btn{ display:inline-flex; align-items:center; gap:10px; min-height:52px; padding:12px 30px; border:0; border-radius:100px; cursor:pointer;
  background:linear-gradient(135deg,#D6005E,#A8004A); color:#fff; font:800 16px/1 var(--font-body,sans-serif); letter-spacing:.08em;
  box-shadow:0 10px 24px rgba(214,0,94,.28); transition:transform .15s, box-shadow .15s; }
.km-listen-btn:hover{ transform:translateY(-1px); box-shadow:0 14px 30px rgba(214,0,94,.34); }
.km-platforms{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.km-platform{ display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:8px 14px; border-radius:12px; text-decoration:none;
  background:#fff; border:1px solid rgba(15,8,32,.12); color:#1B2A4A; font-weight:700; font-size:14px; transition:border-color .15s, transform .15s; }
.km-platform:hover{ transform:translateY(-1px); border-color:#D6005E; }
.km-brand-ico{ flex:none; }
.km-listen.is-open .km-platform{ box-shadow:0 0 0 2px rgba(214,0,94,.18); }
.km-player{ position:relative; width:100%; max-width:560px; aspect-ratio:16/9; border-radius:16px; overflow:hidden; background:#0F0820; }
.km-player iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.km-player-poster{ position:absolute; inset:0; padding:0; border:0; cursor:pointer; background:#0F0820; }
.km-player-poster img{ width:100%; height:100%; object-fit:cover; opacity:.92; }
.km-player-cta{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); display:inline-flex; align-items:center; gap:8px;
  padding:12px 20px; border-radius:100px; background:rgba(214,0,94,.94); color:#fff; font-weight:800; font-size:15px; white-space:nowrap; }
[data-theme="dark"] .km-platform{ background:#1C1830; border-color:rgba(255,255,255,.16); color:#F3EEFE; }

/* Narrator controls */
.km-voice{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:14px 0 4px; padding:10px 12px; border-radius:16px;
  background:#F4F9FA; border:1px solid #CFE7EA; }
.km-vbtn{ display:inline-flex; align-items:center; gap:6px; min-width:44px; min-height:44px; padding:8px 12px; border-radius:12px;
  border:1px solid #BFDDE1; background:#fff; color:#0B4F55; font-weight:700; cursor:pointer; }
.km-vplay{ background:#00838F; border-color:#00838F; color:#fff; }
.km-voice.is-playing .km-vplay{ opacity:.7; }
.km-vvol,.km-vrate{ display:inline-flex; align-items:center; gap:6px; color:#0B4F55; min-height:44px; }
.km-vvol input{ width:96px; accent-color:#00838F; }
.km-vrate select{ min-height:40px; border-radius:10px; border:1px solid #BFDDE1; padding:4px 8px; background:#fff; color:#0B4F55; font-weight:700; }
.km-vstatus{ flex-basis:100%; margin:2px 2px 0; font-size:12.5px; color:#3E5A5E; min-height:1em; }
[data-theme="dark"] .km-voice{ background:#10262A; border-color:#1F4A50; }
[data-theme="dark"] .km-vbtn,[data-theme="dark"] .km-vrate select{ background:#15343A; border-color:#2A5A61; color:#CFF6F8; }
[data-theme="dark"] .km-vplay{ background:#0FA3AE; border-color:#0FA3AE; color:#04262A; }
[data-theme="dark"] .km-vvol,[data-theme="dark"] .km-vrate,[data-theme="dark"] .km-vstatus{ color:#BDE9EC; }

/* Media card (songs & videos) */
.ks-media-grid{ display:grid; grid-template-columns:1fr; gap:16px; }
@media(min-width:700px){ .ks-media-grid{ grid-template-columns:repeat(3,1fr); } }
.ks-media-card{ background:#fff; border:1px solid rgba(107,33,244,.12); border-radius:18px; overflow:hidden; display:flex; flex-direction:column; }
.ks-media-card .km-player{ max-width:none; border-radius:0; }
.ks-media-body{ padding:14px 16px 16px; display:flex; flex-direction:column; gap:6px; }
.ks-media-title{ font-family:var(--font-display,serif); font-size:18px; font-weight:700; color:#1B2A4A; line-height:1.25; margin:0; }
.ks-media-meta{ font-size:12.5px; color:#5E5873; margin:0; }
.ks-media-desc{ font-size:14px; color:#5E5873; margin:0; }
.ks-media-card .km-listen{ margin:6px 0 0; }
.ks-media-card .km-listen-btn{ min-height:44px; padding:10px 20px; font-size:14px; }
[data-theme="dark"] .ks-media-card{ background:#1C1830; border-color:rgba(255,255,255,.12); }
[data-theme="dark"] .ks-media-title{ color:#F3EEFE; } [data-theme="dark"] .ks-media-meta,[data-theme="dark"] .ks-media-desc{ color:#C9C1E0; }

/* ===================== v10.343 media cards + modal ===================== */
.km-watch-btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:50px; padding:12px 26px; border:0; border-radius:100px;
  cursor:pointer; background:linear-gradient(135deg,#D6005E,#A8004A); color:#fff; font:800 15.5px/1 var(--font-body,sans-serif); letter-spacing:.01em;
  box-shadow:0 10px 24px rgba(214,0,94,.26); transition:transform .15s, box-shadow .15s; }
.km-watch-btn:hover{ transform:translateY(-1px); box-shadow:0 14px 30px rgba(214,0,94,.34); }
.km-watch-btn:focus-visible{ outline:3px solid #5DE3DC; outline-offset:3px; }
.km-item-copy .km-watch-btn{ margin:14px 0 4px; }

/* cards: equal height per row; body grows; button pinned to the bottom so
   every "Watch / Listen Now" sits on the same line whatever the title length */
.ks-media-grid{ display:grid; grid-template-columns:1fr; gap:18px; align-items:stretch; }
@media(min-width:640px){ .ks-media-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(min-width:1000px){ .ks-media-grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.ks-media-card{ display:flex; flex-direction:column; height:100%; min-width:0; background:#fff; border:1px solid rgba(107,33,244,.12);
  border-radius:20px; overflow:hidden; box-shadow:0 6px 18px rgba(22,11,46,.05); transition:transform .18s, box-shadow .18s; }
.ks-media-card:hover{ transform:translateY(-3px); box-shadow:0 16px 36px rgba(22,11,46,.10); }
.ks-media-thumb{ position:relative; aspect-ratio:16/9; background:linear-gradient(135deg,#2B1B4A,#5A2A6A); }
.ks-media-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.ks-media-badge{ position:absolute; left:12px; top:12px; background:rgba(255,255,255,.95); color:#1B2A4A; font-size:11.5px; font-weight:800;
  padding:4px 10px; border-radius:100px; }
.ks-media-body{ flex:1 1 auto; display:flex; flex-direction:column; gap:8px; padding:16px 18px 6px; }
.ks-media-title{ margin:0; font-family:var(--font-display,serif); font-size:18px; line-height:1.3; color:#1B2A4A;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.ks-media-desc{ margin:0; font-size:14px; line-height:1.5; color:#5E5873; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ks-media-foot{ padding:12px 18px 18px; display:flex; justify-content:center; }
.ks-media-foot .km-watch-btn{ width:100%; }
[data-theme="dark"] .ks-media-card{ background:#1C1830; border-color:rgba(255,255,255,.12); }
[data-theme="dark"] .ks-media-title{ color:#F3EEFE; } [data-theme="dark"] .ks-media-desc{ color:#C9C1E0; }

/* modal */
html.km-modal-open{ overflow:hidden; }
.km-modal{ position:fixed; inset:0; z-index:99990; background:rgba(8,5,18,.78); display:flex; align-items:center; justify-content:center;
  padding:max(12px, env(safe-area-inset-top)) 12px; animation:kmFade .18s ease-out; }
.km-m-dialog{ width:min(88vw, 1120px); max-height:94vh; overflow:auto; background:#120C24; color:#F3EEFE; border-radius:20px;
  box-shadow:0 30px 90px rgba(0,0,0,.55); }
.km-m-head{ display:flex; align-items:center; gap:12px; padding:14px 16px 12px 20px; }
.km-m-head h2{ flex:1; margin:0; font-size:17px; line-height:1.35; color:#5DE3DC !important; -webkit-text-fill-color:#5DE3DC !important; }
.km-m-close{ flex:none; width:44px; height:44px; border-radius:50%; border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.08);
  color:#fff; font-size:18px; cursor:pointer; }
.km-m-close:hover{ background:rgba(255,255,255,.18); }
.km-m-video{ position:relative; aspect-ratio:16/9; background:#000; }
.km-m-video iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.km-m-audio{ display:grid; grid-template-columns:120px 1fr; gap:16px; align-items:center; padding:8px 20px 16px; }
.km-m-disc{ width:120px; height:120px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:48px;
  background:radial-gradient(circle,#2A1F48 18%,#D6005E 19%,#7A2AC8 70%); color:#fff; box-shadow:0 10px 30px rgba(214,0,94,.35); }
.km-m-audio iframe{ width:100%; height:175px; border:0; border-radius:14px; }
.km-m-more{ padding:12px 20px 18px; border-top:1px solid rgba(255,255,255,.1); }
.km-m-more p{ margin:0 0 8px; font-size:12.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#BDB4DB; }
.km-m-links{ display:flex; flex-wrap:wrap; gap:8px; }
.km-m-links .km-platform{ background:#1C1830; border-color:rgba(255,255,255,.16); color:#F3EEFE; }
@media (max-width:640px){
  .km-modal{ padding:0; align-items:stretch; }
  .km-m-dialog{ width:100vw; max-height:100vh; height:100%; border-radius:0; display:flex; flex-direction:column; }
  .km-m-video{ margin-top:auto; } .km-m-more{ margin-bottom:auto; }
  .km-m-audio{ grid-template-columns:1fr; justify-items:center; }
}
@keyframes kmFade{ from{ opacity:0 } to{ opacity:1 } }
@media (prefers-reduced-motion:reduce){ .km-modal{ animation:none } }
.ks-media-badge,[data-theme="dark"] .ks-media-badge{ color:#1B2A4A !important; -webkit-text-fill-color:#1B2A4A; }
/* a thumbnail that fails to load shows the card's gradient, not its alt text */
.ks-media-thumb img{ color:transparent; font-size:0; }
/* keep the one primary action on a single line in narrow cards */
.ks-media-foot .km-watch-btn{ white-space:nowrap; padding:12px 14px; font-size:14.5px; gap:8px; }

/* v10.350 Kids Studio hero: title, subtitle and buttons at the TOP-LEFT of the
   hero image; both buttons solid hot pink (brand #D6005E, white text ≈ 5.3:1).
   The readability scrim becomes a soft top-left glow so the artwork (baby, moon)
   stays clear. */
.vm .vm-hero .vm-hero-copy{ justify-content:flex-start; align-items:flex-start; }
.vm .vm-hero .vm-hero-scrim{ inset:0 auto auto 0; width:72%; height:82%;
  background:radial-gradient(ellipse at 0% 0%, rgba(254,250,241,.94) 0%, rgba(254,250,241,.62) 42%, rgba(254,250,241,0) 72%); }
[data-theme="dark"] .vm .vm-hero .vm-hero-scrim{
  background:radial-gradient(ellipse at 0% 0%, rgba(18,10,31,.88) 0%, rgba(18,10,31,.55) 45%, rgba(18,10,31,0) 74%); }
.vm .vm-hero .vm-hero-btns .vm-glass{ background:#D6005E; border-color:#D6005E; color:#FFFFFF !important;
  -webkit-text-fill-color:#FFFFFF; -webkit-backdrop-filter:none; backdrop-filter:none; box-shadow:0 8px 20px rgba(214,0,94,.28); }
.vm .vm-hero .vm-hero-btns .vm-glass:hover{ background:#B8004F; border-color:#B8004F; }
.vm .vm-hero .vm-hero-btns .vm-glass:focus-visible{ outline:3px solid #FFFFFF; outline-offset:2px; }
[data-theme="dark"] .vm .vm-hero .vm-hero-btns .vm-glass{ background:#D6005E; border-color:#D6005E; color:#FFFFFF !important; }

/* ===== v10.373 night hero (dark artwork: baby asleep on the moon) =====
   Desktop: copy on the RIGHT over the open starry sky, deep-navy scrim from the right,
   light text — the moon and the baby on the left stay fully visible.
   Phones: the baby stays in view at the top; copy sits at the bottom on a navy fade. */
.vm-hero--night > img{ object-position:30% 50%; }
.vm-hero--night .vm-hero-scrim{ background:linear-gradient(270deg, rgba(6,10,36,.92) 0%, rgba(6,10,36,.72) 30%, rgba(6,10,36,.25) 52%, rgba(6,10,36,0) 64%) !important; opacity:1 !important; }
.vm-hero--night .vm-hero-copy{ align-items:flex-end !important; justify-content:center !important; text-align:right; padding:2rem 2.4rem !important; }
.vm-hero--night .vm-hero-copy > *{ max-width:24rem; }
.vm-hero--night .vm-hero-kicker{ color:#F5D27A !important; -webkit-text-fill-color:#F5D27A; }
.vm-hero--night h1#vm-title{ color:#FFFFFF !important; -webkit-text-fill-color:#FFFFFF; text-shadow:0 2px 14px rgba(0,0,0,.6); }
.vm-hero--night p{ color:#E9E6FF !important; -webkit-text-fill-color:#E9E6FF; text-shadow:0 1px 6px rgba(0,0,0,.6); }
.vm-hero--night .vm-hero-btns{ justify-content:flex-end; }
@media (max-width:700px){
  .vm-hero--night > img{ object-position:38% 30%; aspect-ratio:4 / 5 !important; }
  .vm-hero--night .vm-hero-scrim{ background:linear-gradient(0deg, rgba(6,10,36,.95) 0%, rgba(6,10,36,.8) 34%, rgba(6,10,36,.2) 56%, rgba(6,10,36,0) 66%) !important; }
  .vm-hero--night .vm-hero-copy{ align-items:flex-start !important; justify-content:flex-end !important; text-align:left; padding:1.2rem 1.1rem 1.25rem !important; }
  .vm-hero--night .vm-hero-btns{ justify-content:flex-start; flex-wrap:nowrap; gap:.5rem; }
  .vm-hero--night .vm-hero-btns .vm-glass{ padding:.6rem .9rem !important; font-size:.85rem !important; white-space:nowrap; }
  .vm-hero--night .vm-hero-kicker{ font-size:11.5px; }
}
/* v10.373 night hero refinements: no glass box behind the copy, legible title, phone buttons wrap */
.vm-hero--night .vm-hero-copy,.vm-hero--night .vm-hero-copy::before,.vm-hero--night .vm-hero-copy::after{ background:none !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; box-shadow:none !important; border:0 !important; }
.vm-hero--night h1#vm-title{ color:#FF8FC4 !important; -webkit-text-fill-color:#FF8FC4 !important; }
@media (max-width:700px){ .vm-hero--night .vm-hero-btns{ flex-wrap:wrap; } }
.vm .vm-hero.vm-hero--night h1#vm-title{ color:#FF8FC4 !important; -webkit-text-fill-color:#FF8FC4 !important; }
.vm .vm-hero.vm-hero--night .vm-hero-scrim{ inset:0 !important; width:auto !important; height:auto !important; }

/* ===== v10.374 Kids Studio polish ===== */
/* category chips: words never break in the middle ("Learnin-g", "Knowle-dge") */
.km-nav a span:last-child{ overflow-wrap:normal !important; word-break:normal !important; hyphens:none !important; line-height:1.2; }
.vm-main .km-nav a{ gap:8px; padding:8px 10px; font-size:13.5px; }
.vm-main .km-nav .km-nav-ic{ width:28px; height:28px; border-radius:9px; }
.vm-main .km-nav ul{ grid-template-columns:repeat(auto-fit,minmax(132px,1fr)) !important; }

/* v10.378 — Kids Studio hero: the two buttons sit at the BOTTOM of the
   picture. Desktop: pinned to the bottom-right corner, the title block stays
   where it was. Phone: the copy already sits at the bottom; the buttons keep
   to one row there when they fit. */
@media (min-width:701px){
  .vm .vm-hero.vm-hero--night .vm-hero-btns{
    position:absolute; right:2.4rem; bottom:1.6rem; margin:0 !important;
    max-width:none !important; justify-content:flex-end; z-index:2;
  }
  .vm .vm-hero.vm-hero--night .vm-hero-copy{ padding-bottom:5.5rem !important; }
}
@media (max-width:700px){
  .vm .vm-hero.vm-hero--night .vm-hero-btns{ margin-top:.9rem; }
}

/* v10.378 — Kids Studio hero: the words never touch the sleeping baby.
   Desktop: the title block moves UP into the open starry sky (top-right) and
   is kept narrower, so its left edge stays clear of the baby's head.
   Phone: the picture is shown a little taller with the baby lifted towards
   the top, and the words sit on the clouds below him. */
@media (min-width:701px){
  .vm .vm-hero.vm-hero--night .vm-hero-copy{
    justify-content:flex-start !important; padding-top:1.6rem !important; }
  .vm .vm-hero.vm-hero--night .vm-hero-copy > *{ max-width:20rem; }
}
@media (max-width:700px){
  .vm .vm-hero.vm-hero--night > img{ aspect-ratio:3 / 4.6 !important; object-position:34% 0% !important; }
}
/* Phone: the picture is too narrow to hold words beside the baby, so the
   words move BELOW the picture, on the same night-navy, and never cover him. */
@media (max-width:700px){
  .vm .vm-hero.vm-hero--night{ background:#0A1030; }
  .vm .vm-hero.vm-hero--night > img{ aspect-ratio:4 / 3.4 !important; object-position:34% 40% !important; }
  .vm .vm-hero.vm-hero--night .vm-hero-scrim{ display:none !important; }
  .vm .vm-hero.vm-hero--night .vm-hero-copy{
    position:relative !important; inset:auto !important;
    padding:1rem 1.1rem 1.25rem !important; background:#0A1030 !important; }
  .vm .vm-hero.vm-hero--night .vm-hero-copy::before{
    content:""; position:absolute; left:0; right:0; top:-48px; height:48px;
    background:linear-gradient(0deg,#0A1030,rgba(10,16,48,0)) !important; pointer-events:none; }
}
/* No shadow over the background picture: the navy scrim is removed at every
   size, and the phone's fade above the words too. Legibility comes from a
   soft shadow on the letters only. */
.vm .vm-hero.vm-hero--night .vm-hero-scrim{ display:none !important; }
@media (max-width:700px){ .vm .vm-hero.vm-hero--night .vm-hero-copy::before{ display:none !important; } }
.vm .vm-hero.vm-hero--night .vm-hero-kicker,
.vm .vm-hero.vm-hero--night h1#vm-title,
.vm .vm-hero.vm-hero--night .vm-hero-copy p{ text-shadow:0 1px 2px rgba(0,0,0,.85), 0 0 10px rgba(0,0,0,.55) !important; }

/* v10.378 — verse-by-verse stotram */
.km-verse-list{ list-style:none; counter-reset:kmv; margin:.6rem 0 0; padding:0; display:grid; gap:14px; }
.km-verse{ counter-increment:kmv; position:relative; padding:16px 18px 14px 56px; border-radius:16px;
  background:var(--surface,#fff); border:1px solid var(--border,#F2DCE8); }
.km-verse::before{ content:counter(kmv); position:absolute; left:14px; top:16px; width:30px; height:30px; border-radius:50%;
  display:grid; place-items:center; font-weight:800; font-size:14px; background:#FFE6F1; color:#B0004E; }
.km-verse .km-deva{ margin:0 0 8px; font-size:1.15rem; line-height:1.8; }
.km-verse-hi{ margin:0 0 4px; font-size:1rem; line-height:1.65; }
.km-verse-en{ margin:0; font-size:.95rem; line-height:1.6; color:var(--muted,#6B5B78); }
@media (max-width:600px){ .km-verse{ padding:14px 14px 12px 48px; } .km-verse::before{ left:10px; } }

/* v10.378 — narrator choice: Dadi Maa / Maa / Papa */
.km-narrators{ flex:1 1 100%; display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0 0 4px; }
.km-narr-lab{ font-size:13px; font-weight:700; color:var(--muted,#6B5B78); margin-right:2px; }
.km-narr{ display:inline-flex; align-items:center; gap:6px; min-height:40px; padding:6px 14px; border-radius:999px; cursor:pointer;
  font:600 14px/1 inherit; background:#FFFFFF; color:#2A1433; border:1.5px solid #F2DCE8; }
.km-narr span{ font-size:18px; line-height:1; }
.km-narr:hover{ border-color:#FF7DB4; }
.km-narr[aria-checked="true"]{ background:#D6005E; border-color:#D6005E; color:#FFFFFF; }
.km-narr:focus-visible{ outline:3px solid #6B21F4; outline-offset:2px; }
[data-theme="dark"] .km-narr{ background:#21182E; color:#F6EFF8; border-color:#3B2D50; }
[data-theme="dark"] .km-narr[aria-checked="true"]{ background:#FF4F9A; border-color:#FF4F9A; color:#1A0010; }
[data-theme="dark"] .km-narr-lab{ color:#C9BAD8; }

/* v10.378b: a narrator with no voice of its own is hidden, not shown greyed */
.km-narrators[hidden], .km-narr[hidden] { display: none !important; }

/* ===== v10.379 Kids Pass lines on story pages ===== */
.km-pass-line{ margin:12px 0 0; padding:10px 14px; border-radius:12px; background:#FFF3F8; border:1px solid #F7B5D2; font-size:14.5px; line-height:1.5; color:#5A0F33; }
.km-pass-line a{ color:#D6005E; font-weight:800; }
.km-voice-pass{ margin:8px 0 0; font-size:13.5px; color:#5A0F33; } .km-voice-pass a{ color:#D6005E; font-weight:800; }
[data-theme="dark"] .km-pass-line{ background:#2A1220; border-color:#6B2347; color:#FFD7EA; }
[data-theme="dark"] .km-pass-line a,[data-theme="dark"] .km-voice-pass a{ color:#FF6FB4; }
[data-theme="dark"] .km-voice-pass{ color:#FFD7EA; }
/* v10.380a — no empty space beside the picture: columns may shrink (no overflow off
   the right edge), and on wide screens the picture stays in view while the text column
   scrolls past it. The share bar now sits full width under the hero. */
@media(min-width:860px){
  .km-item-hero{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
  .km-item-hero{align-items:center}
}
.km-item-copy{min-width:0}
.km-share-wrap{margin:4px 0 18px}
.km-share-wrap .tn-share{margin:0}
.km-share-wrap .km-pass-line{margin:0 0 12px}
/* v10.381 — Play and the Kids Studio hero title use the mobile menu's dark-mode
   Sign Up colour (#45E0D0, text #082020), in light and dark mode alike. */
.km-vplay, [data-theme="dark"] .km-vplay{ background:#45E0D0 !important; border-color:#45E0D0 !important; color:#082020 !important; }
.km-vplay:hover{ filter:brightness(1.06); }
.vm .vm-hero h1#vm-title, .vm .vm-hero.vm-hero--night h1#vm-title,
[data-theme="dark"] .vm .vm-hero h1#vm-title{ color:#45E0D0 !important; -webkit-text-fill-color:#45E0D0 !important; }

/* v10.419 Kids Studio hero — every line of the copy shares one right edge on
   desktop (kicker on one line, the sub-line balanced, Enroll Now flush right
   like the two buttons under it). Phone: the two buttons sit side by side at
   equal width and Enroll Now spans the same width below them. */
.vm .vm-hero.vm-hero--night .vm-hero-copy p{ text-wrap:balance; }
@media (min-width:701px){
  .vm .vm-hero.vm-hero--night .vm-hero-copy > *{ max-width:22rem; }
  .vm .vm-hero.vm-hero--night .vm-hero-kicker{ max-width:none; white-space:nowrap; font-size:11.5px; letter-spacing:.07em; }
  .vm .vm-hero.vm-hero--night .tn-enroll-wrap{ justify-content:flex-end; margin:16px 0 0; }
}
@media (max-width:700px){
  .vm .vm-hero.vm-hero--night .vm-hero-copy > *{ max-width:none; width:100%; }
  .vm .vm-hero.vm-hero--night .vm-hero-btns{ display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6rem; }
  .vm .vm-hero.vm-hero--night .vm-hero-btns .vm-glass{ justify-content:center; text-align:center; white-space:normal; min-height:48px; padding:.6rem .7rem !important; }
  .vm .vm-hero.vm-hero--night .tn-enroll-wrap{ margin:14px 0 0; }
  .vm .vm-hero.vm-hero--night .tn-enroll{ width:100%; box-sizing:border-box; }
  .vm .vm-hero.vm-hero--night .tn-enroll-t{ flex:1; }
}

/* v10.419 Enroll Now is the first button of the hero row, a size smaller —
   same height family as Explore Library / Start Kids Learning. */
.vm .vm-hero.vm-hero--night .vm-hero-btns{ align-items:center; }
.vm .vm-hero.vm-hero--night .vm-hero-btns .tn-enroll-wrap{ margin:0 !important; display:flex; }
.vm .vm-hero.vm-hero--night .vm-hero-btns .tn-enroll{ min-height:50px; gap:9px; padding:6px 18px 6px 7px; }
.vm .vm-hero.vm-hero--night .vm-hero-btns .tn-enroll-ic{ width:36px; height:36px; font-size:18px; }
.vm .vm-hero.vm-hero--night .vm-hero-btns .tn-enroll-t b{ font-size:17px; }
.vm .vm-hero.vm-hero--night .vm-hero-btns .tn-enroll-t small{ font-size:11px; margin-top:1px; }
.vm .vm-hero.vm-hero--night .vm-hero-btns .tn-enroll-ar{ font-size:17px; }
@media (max-width:700px){
  .vm .vm-hero.vm-hero--night .vm-hero-btns .tn-enroll-wrap{ grid-column:1 / -1; }
  .vm .vm-hero.vm-hero--night .vm-hero-btns .tn-enroll{ width:100%; }
}
/* v10.423 Scientists and Discoveries — "The Big Discovery" card */
.km-disc{background:linear-gradient(135deg,#EEF6FF,#F4EEFF);border-color:#C9DBFA;border-left:5px solid #0072D6}
.km-disc-dl{display:grid;gap:10px;margin:0}
.km-disc-dl div{display:grid;grid-template-columns:120px 1fr;gap:10px;align-items:baseline}
.km-disc-dl dt{font-weight:800;color:#0B4F9C}
.km-disc-dl dd{margin:0;color:#1B1035}
@media(max-width:520px){.km-disc-dl div{grid-template-columns:1fr;gap:2px}}
[data-theme="dark"] .km-disc{background:linear-gradient(135deg,#14213A,#221A3A);border-color:#2C4A78;border-left-color:#5CA8FF}
[data-theme="dark"] .km-disc-dl dt{color:#8CC2FF!important;-webkit-text-fill-color:#8CC2FF!important}
[data-theme="dark"] .km-disc-dl dd{color:#ECE8F7!important;-webkit-text-fill-color:#ECE8F7!important}
