/*
 * Kids presentation, November 2026.
 * Loaded after site.css and journal-redesign.css, only on Kids routes.
 * The existing content, native illustrations, game states and privacy hooks stay
 * in their original markup. Narrow layouts reflow; no content is hidden to fit.
 */

.kids-site {
  --kids-purple: #7040ed;
  --kids-yellow: #ffd43b;
  --kids-lime: #c8f54a;
  --kids-cobalt: #244bea;
  --kids-coral: #ff765d;
  --kids-ink: #171a24;
  --kids-muted: #505565;
  --kids-line: #dfe1eb;
  --kids-gutter: 16px;
  --kids-container: 1440px;
  --paper: #fff;
  --surface: #fff;
  --ink: var(--kids-ink);
  --muted: var(--kids-muted);
  --line: var(--kids-line);
  --accent: var(--kids-purple);
  --accent-on: #fff;
  --kids-color: var(--kids-purple);
  --kids-on-color: #fff;
  --kids-deep: #5428b9;
  --kids-soft: #f4efff;
  background: #fff;
  color: var(--kids-ink);
  font-size: 18px;
  line-height: 1.65;
}

.kids-site .container,
.kids-site .header-inner {
  width: min(calc(100% - var(--kids-gutter) * 2), var(--kids-container));
  margin-inline: auto;
}

.kids-site :where(h1, h2, h3, p, a, button, summary) {
  overflow-wrap: break-word;
}

.kids-site :where(a, button, summary, input):focus-visible {
  outline: 3px solid var(--kids-cobalt);
  outline-offset: 4px;
}

.kids-site .theme-violet {
  --kids-color: var(--kids-purple);
  --kids-on-color: #fff;
  --kids-deep: #5428b9;
  --kids-soft: #f4efff;
}

.kids-site .theme-lime {
  --kids-color: var(--kids-lime);
  --kids-on-color: var(--kids-ink);
  --kids-deep: #375100;
  --kids-soft: #f2fbda;
}

.kids-site .theme-blue {
  --kids-color: var(--kids-cobalt);
  --kids-on-color: #fff;
  --kids-deep: #2342ba;
  --kids-soft: #edf1ff;
}

.kids-site .theme-amber {
  --kids-color: var(--kids-yellow);
  --kids-on-color: var(--kids-ink);
  --kids-deep: #6a4d00;
  --kids-soft: #fff8d9;
}

.kids-site .theme-coral {
  --kids-color: var(--kids-coral);
  --kids-on-color: var(--kids-ink);
  --kids-deep: #8e3020;
  --kids-soft: #fff0eb;
}

.kids-site :is(.theme-violet, .theme-lime, .theme-blue, .theme-amber, .theme-coral) {
  --tone: var(--kids-soft);
  --tone-soft: var(--kids-soft);
  --tone-strong: var(--kids-deep);
}

.kids-site .button {
  min-height: 52px;
  max-width: 100%;
  padding: 13px 18px;
  border-radius: 14px;
  font-size: 16px;
  font-weight: 750;
  line-height: 1.4;
  gap: 10px;
  white-space: normal;
  text-align: center;
}

.kids-site .button .icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

.kids-site .button-dark {
  background: var(--kids-purple);
  border: 2px solid var(--kids-purple);
  color: #fff;
}

.kids-site .button-dark:hover {
  background: #5829d1;
  border-color: #5829d1;
}

.kids-site .button-outline {
  background: #fff;
  border: 2px solid var(--kids-purple);
  color: #5428b9;
}

.kids-site .button-outline:hover {
  background: #f4efff;
}

.kids-site .icon-button {
  width: 48px;
  height: 48px;
  min-width: 48px;
  min-height: 48px;
  border: 1px solid var(--kids-line);
  border-radius: 14px;
  background: #fff;
  color: var(--kids-ink);
}

.kids-site .icon-button .icon {
  width: 24px;
  height: 24px;
}

.kids-site .eyebrow,
.kids-site .meta,
.kids-site .category-label,
.kids-site .collection-count {
  font-size: 13px;
  line-height: 1.5;
}

/* Header: two clear navigation rows on small screens, one row on laptops. */
.kids-site .kids-header {
  position: relative;
  z-index: 30;
  background: #fff;
  border-bottom: 1px solid var(--kids-line);
}

.kids-site .kids-header .header-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 48px;
  align-items: center;
  min-height: 0;
  padding-block: 16px;
  gap: 14px 12px;
}

.kids-site .kids-header .brand {
  grid-column: 1;
  grid-row: 1;
  order: initial;
  max-width: none;
  min-width: 0;
  gap: 9px;
}

.kids-site .kids-header .brand-mark {
  width: 42px;
  height: 48px;
  min-width: 42px;
  border-radius: 0;
  background: transparent;
  color: var(--kids-purple);
}

.kids-site .kids-header .brand-mark svg {
  width: 42px;
  height: 42px;
}

.kids-site .kids-header .brand-name {
  max-width: none;
  min-width: 0;
  font-size: 21px;
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -.035em;
  white-space: normal;
}

.kids-site .kids-word {
  display: block;
  margin: 3px 0 0;
  color: var(--kids-purple);
  font-family: inherit;
  font-size: 26px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: -.04em;
  line-height: 1;
  transform: none;
}

.kids-site .kids-exit {
  grid-column: 2;
  grid-row: 1;
  order: initial;
  justify-self: end;
}

.kids-site .kids-nav {
  grid-column: 1 / -1;
  grid-row: 2;
  order: initial;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
}

.kids-site .kids-nav a {
  justify-content: center;
  min-width: 0;
  min-height: 48px;
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 750;
  line-height: 1.35;
  gap: 8px;
  text-align: center;
  color: var(--kids-ink);
}

.kids-site .kids-nav a:hover,
.kids-site .kids-nav a[aria-current="page"] {
  background: var(--kids-yellow);
  color: var(--kids-ink);
}

.kids-site .kids-nav > a:last-child {
  grid-column: 1 / -1;
  font-size: 15px;
  font-weight: 650;
  color: #5428b9;
}

.kids-site .kids-nav .icon {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}

/* White, type-led hero with the existing native fruit illustration. */
.kids-site .kids-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 28px;
  min-height: 0;
  padding-block: 36px 30px;
}

.kids-site .kids-hero-copy {
  min-width: 0;
}

.kids-site .kids-eyebrow {
  margin-bottom: 18px;
  color: #5428b9;
  font-size: 13px;
  font-weight: 750;
  letter-spacing: .06em;
  line-height: 1.5;
  gap: 8px;
}

.kids-site .kids-eyebrow .icon {
  width: 20px;
  height: 20px;
  color: var(--kids-purple);
}

.kids-site .kids-hero h1 {
  max-width: 15ch;
  font-size: 40px;
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -.045em;
}

.kids-site .kids-hero h1 em {
  color: var(--kids-purple);
  font: inherit;
}

.kids-site .kids-hero-copy > p {
  max-width: 37ch;
  margin-top: 22px;
  font-size: 18px;
  line-height: 1.65;
  color: var(--kids-ink);
}

.kids-site .kids-hero-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin-top: 26px;
}

.kids-site .kids-hero-actions .button {
  justify-content: center;
  border-radius: 15px;
  min-height: 54px;
  padding: 14px 16px;
  font-size: 16px;
  gap: 10px;
}

.kids-site .kids-privacy-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 18px;
  font-size: 13px;
  line-height: 1.6;
  color: var(--kids-muted);
}

.kids-site .kids-privacy-note .icon {
  width: 17px;
  height: 17px;
  margin-top: 2px;
  flex-shrink: 0;
  color: #5428b9;
}

.kids-site .kids-hero-art {
  position: relative;
  width: 100%;
  max-width: none;
  height: 252px;
  min-height: 0;
  margin: 0;
  border-radius: 24px;
  background: var(--kids-yellow);
  isolation: isolate;
}

.kids-site .kids-planet {
  width: 61%;
  height: auto;
  aspect-ratio: 1;
  max-width: 310px;
  top: 18%;
  left: 9%;
  border-radius: 50%;
  background: var(--kids-lime);
  box-shadow: none;
  transform: rotate(-10deg);
}

.kids-site .kids-planet > span {
  font-size: 84px;
  filter: none;
}

.kids-site .kids-planet > span:first-child {
  left: -4%;
  top: 28%;
  font-size: 84px;
}

.kids-site .kids-planet > span:nth-child(2) {
  right: -5%;
  top: 0;
  font-size: 94px;
}

.kids-site .kids-planet > span:nth-child(3) {
  right: 6%;
  bottom: -4%;
  font-size: 80px;
}

.kids-site .kids-hero-hello {
  top: 7%;
  right: 7%;
  padding: 12px 16px;
  border-radius: 14px;
  background: var(--kids-purple);
  color: #fff;
  font-size: 29px;
  font-weight: 800;
  letter-spacing: -.04em;
  box-shadow: none;
  transform: rotate(7deg);
}

.kids-site .kids-hero-hello span {
  top: -15px;
  right: -10px;
  color: var(--kids-cobalt);
  font-size: 36px;
}

.kids-site .kids-hero-question {
  width: 65px;
  height: 78px;
  top: 45%;
  right: 7%;
  border-radius: 30px 30px 14px 14px;
  background: var(--kids-coral);
  color: var(--kids-ink);
  font-size: 57px;
  transform: rotate(8deg);
}

.kids-site .kids-orbit-star {
  top: 7%;
  left: 6%;
  color: var(--kids-cobalt);
  font-size: 38px;
}

.kids-site .kids-caption-card {
  left: 7%;
  bottom: 6%;
  max-width: 75%;
  padding: 10px 14px;
  border: 1px solid var(--kids-ink);
  border-radius: 12px;
  background: #fff;
  color: var(--kids-ink);
  box-shadow: 4px 4px 0 #171a2414;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  gap: 9px;
  transform: rotate(-5deg);
}

.kids-site .kids-caption-card .icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  color: var(--kids-purple);
}

/* Category bands wrap as a real grid; all live category names remain visible. */
.kids-site .kids-topic-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  padding: 8px 0 34px;
  overflow: visible;
}

.kids-site .kids-topic-strip a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  min-width: 0;
  min-height: 112px;
  padding: 14px 10px;
  border: 0;
  border-radius: 18px;
  background: var(--kids-purple);
  color: #fff;
  font-size: 17px;
  font-weight: 750;
  line-height: 1.35;
  text-align: center;
  gap: 10px;
}

.kids-site .kids-topic-strip a:nth-child(5n + 1) {
  background: var(--kids-coral);
  color: var(--kids-ink);
}

.kids-site .kids-topic-strip a:nth-child(5n + 2) {
  background: var(--kids-lime);
  color: var(--kids-ink);
}

.kids-site .kids-topic-strip a:nth-child(5n + 3) {
  background: var(--kids-cobalt);
  color: #fff;
}

.kids-site .kids-topic-strip a:nth-child(5n + 5) {
  background: var(--kids-yellow);
  color: var(--kids-ink);
}

.kids-site .kids-topic-strip a span {
  font-size: 35px;
  line-height: 1;
}

.kids-site .kids-topic-strip a:hover {
  transform: translateY(-3px);
  box-shadow: 0 5px 0 #171a2412;
}

/* Discovery cards use the full reading width on phones, including every dek. */
.kids-site .kids-discover {
  padding-block: 18px 44px;
}

.kids-site .section-heading {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 16px;
  margin-bottom: 26px;
}

.kids-site .section-heading > div {
  min-width: 0;
}

.kids-site .section-heading h2,
.kids-site .kids-games-section .section-heading h1 {
  max-width: 22ch;
  margin: 8px 0 0;
  color: var(--kids-ink);
  font-size: 32px;
  font-weight: 800;
  line-height: 1.16;
  letter-spacing: -.035em;
}

.kids-site .section-doodle,
.kids-site .game-heading-doodle {
  position: static;
  margin-top: 18px;
  color: var(--kids-purple);
  font-size: 36px;
  line-height: 1;
  transform: rotate(8deg);
}

.kids-site .collection-count {
  margin-top: 14px;
  font-size: 14px;
  color: var(--kids-muted);
}

.kids-site .story-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 26px;
}

.kids-site .story-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  height: 100%;
  gap: 0;
  border: 1px solid var(--kids-line);
  border-radius: 22px;
  background: #fff;
  overflow: hidden;
}

.kids-site .story-cover {
  display: block;
  width: 100%;
  min-height: 0;
  aspect-ratio: 3 / 2;
  border-radius: 0;
  border-bottom: 1px solid var(--kids-line);
  background: var(--kids-soft);
  flex-shrink: 0;
}

.kids-site .story-cover img,
.kids-site .story-cover .category-art {
  width: 100%;
  height: 100%;
  min-height: 0;
  object-fit: cover;
}

.kids-site .story-cover img.cover-diagram {
  object-fit: contain;
  background: #fff;
}

.kids-site .cover-arrow {
  width: 44px;
  height: 44px;
  background: #fff;
  color: var(--kids-ink);
}

.kids-site .story-copy {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
  padding: 20px;
}

.kids-site .story-copy .category-label {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  min-height: 44px;
  max-width: 100%;
  padding: 8px 12px;
  border-radius: 12px;
  background: var(--kids-color);
  color: var(--kids-on-color);
  font-size: 13px;
  font-weight: 750;
  letter-spacing: .035em;
  line-height: 1.45;
  white-space: normal;
}

.kids-site .story-copy h3 {
  margin: 14px 0 12px;
  font-size: 25px;
  font-weight: 750;
  line-height: 1.25;
  letter-spacing: -.025em;
}

.kids-site .story-copy h3 a {
  display: block;
  min-height: 44px;
  color: var(--kids-ink);
}

.kids-site .story-copy > p {
  display: block;
  max-width: none;
  margin: 0;
  color: var(--kids-muted);
  font-size: 17px;
  line-height: 1.65;
}

.kids-site .story-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  margin-top: auto;
  padding-top: 20px;
  color: var(--kids-muted);
  font-size: 13px;
  line-height: 1.5;
}

.kids-site .story-meta :is(span, time) {
  font-size: 13px;
}

.kids-site .story-meta .icon {
  width: 16px;
  height: 16px;
}

.kids-site .listing-header {
  padding-block: 32px;
}

.kids-site .back-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-bottom: 24px;
  font-size: 15px;
  color: #5428b9;
}

.kids-site .listing-title {
  align-items: start;
  gap: 20px;
}

.kids-site .listing-title h1 {
  font-size: 40px;
  line-height: 1.12;
  letter-spacing: -.035em;
}

.kids-site .listing-title p,
.kids-site .listing-tools > p {
  max-width: 55ch;
  font-size: 18px;
  line-height: 1.65;
}

.kids-site .listing-icon {
  width: 58px;
  height: 58px;
  min-width: 58px;
  background: var(--kids-yellow);
  color: var(--kids-ink);
}

.kids-site .listing-content {
  padding-bottom: 48px;
}

.kids-site .listing-tools {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 18px;
  margin-bottom: 30px;
}

.kids-site .filter-pills {
  display: flex;
  flex-wrap: wrap;
  max-width: 100%;
  gap: 10px;
  overflow: visible;
}

.kids-site .filter-pill {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  max-width: 100%;
  padding: 10px 15px;
  border: 1px solid var(--kids-line);
  border-radius: 12px;
  background: #fff;
  color: var(--kids-ink);
  font-size: 15px;
  line-height: 1.4;
  white-space: normal;
}

.kids-site .filter-pill.active,
.kids-site .filter-pill[aria-current="page"] {
  border-color: var(--kids-purple);
  background: var(--kids-purple);
  color: #fff;
}

.kids-site .pagination {
  margin-top: 32px;
  padding-top: 24px;
}

.kids-site .pagination-summary,
.kids-site .pagination-page,
.kids-site .pagination-direction {
  font-size: 14px;
  line-height: 1.5;
}

.kids-site .pagination-page,
.kids-site .pagination-direction {
  min-width: 44px;
  min-height: 48px;
  border-radius: 12px;
}

.kids-site .pagination-page.is-current {
  background: var(--kids-purple);
  color: #fff;
}

/* Four distinct game blocks, with the original subtitles and links intact. */
.kids-site .kids-games-section {
  padding-block: 40px 44px;
  border-top: 1px solid var(--kids-line);
  border-bottom: 1px solid var(--kids-line);
  background: #fff;
}

.kids-site .kids-games-section .section-heading p {
  max-width: 50ch;
  margin-top: 16px;
  color: var(--kids-muted);
  font-size: 18px;
  line-height: 1.65;
}

.kids-site .game-card-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
}

.kids-site .game-card {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  align-items: stretch;
  min-width: 0;
  border: 0;
  border-radius: 22px;
  background: var(--kids-color);
  color: var(--kids-on-color);
  box-shadow: none;
  overflow: hidden;
}

.kids-site .game-card[href$="/fruit-memory"] {
  --kids-color: var(--kids-yellow);
  --kids-on-color: var(--kids-ink);
}

.kids-site .game-card[href$="/pattern-puzzle"] {
  --kids-color: var(--kids-coral);
  --kids-on-color: var(--kids-ink);
}

.kids-site .game-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 7px 0 #171a2412;
}

.kids-site .game-card-art,
.kids-site .games-index .game-card-art {
  height: auto;
  min-height: 185px;
  background: transparent;
  color: inherit;
}

.kids-site .game-card-art > span:first-child {
  color: inherit;
  font-size: 54px;
}

.kids-site .game-card-art > i {
  left: 12%;
  top: 12%;
  color: inherit;
  font-size: 26px;
  opacity: .35;
}

.kids-site .game-card-art > i:nth-of-type(2) {
  right: 8%;
  bottom: 22%;
  color: inherit;
  font-size: 32px;
}

.kids-site .game-play-circle {
  width: 44px;
  height: 44px;
  right: 14px;
  bottom: 14px;
  background: #fff;
  color: var(--kids-ink);
  backdrop-filter: none;
}

.kids-site .game-play-circle .icon {
  width: 20px;
  height: 20px;
}

.kids-site .game-card-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 22px 18px 22px 10px;
  color: inherit;
}

.kids-site .game-card-copy > .eyebrow {
  margin-bottom: 10px;
  color: inherit;
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: .05em;
}

.kids-site .game-card-copy h3 {
  min-height: 0;
  margin-bottom: 12px;
  color: inherit;
  font-size: 25px;
  font-weight: 800;
  line-height: 1.16;
  letter-spacing: -.025em;
}

.kids-site .game-card-copy p {
  min-height: 0;
  margin-bottom: 18px;
  color: inherit;
  font-size: 17px;
  line-height: 1.6;
}

.kids-site .game-start {
  display: flex;
  align-items: center;
  min-height: 44px;
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid currentColor;
  color: inherit;
  font-size: 16px;
  font-weight: 750;
  line-height: 1.4;
}

.kids-site .game-start .icon {
  width: 22px;
  height: 22px;
}

/* Grown-up information, footer and deliberate exit stay visible and readable. */
.kids-site .grownups-banner {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  align-items: start;
  gap: 18px 16px;
  margin-block: 36px;
  padding: 24px 20px;
  border: 1px solid var(--kids-line);
  border-radius: 22px;
  background: #fff;
}

.kids-site .grownups-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  background: var(--kids-yellow);
  color: var(--kids-ink);
}

.kids-site .grownups-icon .icon {
  width: 26px;
  height: 26px;
}

.kids-site .grownups-banner > div {
  min-width: 0;
}

.kids-site .grownups-banner h2 {
  margin-bottom: 12px;
  color: var(--kids-ink);
  font-size: 26px;
  line-height: 1.2;
  letter-spacing: -.025em;
}

.kids-site .grownups-banner p {
  font-size: 17px;
  line-height: 1.65;
  color: var(--kids-muted);
}

.kids-site .grownups-banner > .button {
  grid-column: 1 / -1;
  width: 100%;
  margin: 0;
  font-size: 16px;
  min-height: 52px;
}

.kids-site .kids-footer {
  padding-block: 30px;
  border-top: 5px solid var(--kids-yellow);
  background: #fff;
}

.kids-site .kids-footer > .container {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 18px;
}

.kids-site .kids-footer .brand {
  max-width: 100%;
  gap: 10px;
}

.kids-site .kids-footer .brand-mark {
  background: var(--kids-purple);
  color: #fff;
}

.kids-site .kids-footer .brand-name {
  max-width: none;
  font-size: 24px;
  line-height: 1.2;
  white-space: normal;
}

.kids-site .kids-footer > .container > p {
  margin: 0;
  font-size: 17px;
  color: var(--kids-ink);
  line-height: 1.5;
}

.kids-site .kids-footer nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  gap: 8px 22px;
  margin: 0;
  font-size: 15px;
}

.kids-site .kids-footer nav a,
.kids-site .kids-footer nav .text-button {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding-block: 6px;
  color: #5428b9;
  font-size: 15px;
  line-height: 1.5;
  gap: 8px;
  text-align: left;
}

.kids-site .kids-footer nav .icon {
  width: 18px;
  height: 18px;
}

.kids-site .kids-footer .kids-privacy-note {
  width: auto;
  margin: 0;
  font-size: 13px;
}

.kids-site .kids-parents {
  max-width: 1120px;
}

.kids-site .policy-page {
  padding-block: 36px 48px;
}

.kids-site .policy-page > h1 {
  font-size: 39px;
  line-height: 1.15;
  letter-spacing: -.035em;
}

.kids-site .policy-lead,
.kids-site .policy-body p {
  font-size: 18px;
  line-height: 1.75;
}

.kids-site .policy-body h2 {
  font-size: 28px;
  line-height: 1.25;
}

.kids-site .parents-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
  margin-top: 32px;
}

.kids-site .parents-grid section {
  padding: 24px;
  border: 1px solid var(--kids-line);
  border-radius: 22px;
  background: #fff;
}

.kids-site .parents-icon {
  width: 48px;
  height: 48px;
  margin-bottom: 20px;
  border-radius: 14px;
  background: var(--kids-purple);
  color: #fff;
}

.kids-site .parents-icon .icon {
  width: 26px;
  height: 26px;
  color: inherit;
}

.kids-site .parents-grid h2 {
  margin-bottom: 16px;
  font-size: 27px;
  line-height: 1.2;
}

.kids-site .parents-grid p,
.kids-site .parent-exit-box p {
  font-size: 18px;
  line-height: 1.75;
  color: var(--kids-muted);
}

.kids-site .parent-exit-box {
  padding: 26px 24px;
  border-radius: 22px;
  background: var(--kids-yellow);
  color: var(--kids-ink);
}

.kids-site .parent-exit-box h2 {
  font-size: 29px;
  line-height: 1.2;
}

.kids-site .parent-exit-box p {
  color: var(--kids-ink);
}

.kids-site .parent-exit-box .button {
  min-height: 52px;
  font-size: 16px;
}

.kids-site #kids-exit-dialog {
  width: min(620px, calc(100% - 32px));
  max-height: calc(100dvh - 32px);
  padding: 64px 24px 28px;
  border: 1px solid var(--kids-line);
  border-radius: 24px;
  background: #fff;
  color: var(--kids-ink);
  overflow-y: auto;
}

.kids-site #kids-exit-dialog .dialog-close {
  top: 12px;
  right: 12px;
}

.kids-site #kids-exit-dialog .dialog-symbol {
  width: 52px;
  height: 52px;
  margin-bottom: 24px;
  background: var(--kids-yellow);
  color: var(--kids-ink);
}

.kids-site #kids-exit-dialog h2 {
  margin-bottom: 20px;
  font-size: 30px;
  line-height: 1.18;
}

.kids-site #kids-exit-dialog p {
  margin-bottom: 26px;
  font-size: 18px;
  line-height: 1.65;
  color: var(--kids-muted);
}

.kids-site #kids-exit-dialog .dialog-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
}

/* Games: controls, instructions and feedback keep their full readable labels. */
.kids-site .game-page {
  max-width: 1100px;
  padding-block: 28px 48px;
}

.kids-site .game-page-heading {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: start;
  gap: 18px;
  margin-bottom: 28px;
}

.kids-site .game-title-icon {
  width: 58px;
  height: 64px;
  margin-top: 4px;
  border-radius: 18px;
  background: var(--kids-color);
  color: var(--kids-on-color);
  font-size: 38px;
  transform: rotate(-6deg);
}

.kids-site .game-page-heading .eyebrow {
  margin-bottom: 10px;
  font-size: 13px;
}

.kids-site .game-page-heading h1 {
  font-size: 34px;
  line-height: 1.13;
  letter-spacing: -.035em;
}

.kids-site .game-page-heading p {
  margin-top: 14px;
  font-size: 18px;
  line-height: 1.65;
  color: var(--kids-muted);
}

.kids-site .game-shell {
  min-height: 0;
  padding: 20px 14px;
  border: 2px solid var(--kids-line);
  border-top: 7px solid var(--kids-color);
  border-radius: 24px;
  background: #fff;
  box-shadow: 0 8px 0 #171a2405;
}

.kids-site .game-loading {
  padding: 64px 16px;
  font-size: 18px;
}

.kids-site .game-topbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
  padding-bottom: 22px;
  margin-bottom: 22px;
  border-bottom: 1px solid var(--kids-line);
}

.kids-site .game-instruction {
  max-width: 58ch;
  color: var(--kids-ink);
  font-size: 18px;
  line-height: 1.65;
}

.kids-site .game-reset {
  justify-self: start;
  min-height: 46px;
  margin: 0;
  padding: 10px 16px;
  border: 1px solid var(--kids-ink);
  border-radius: 12px;
  background: #fff;
  color: var(--kids-ink);
  font-size: 15px;
  font-weight: 650;
  line-height: 1.4;
}

.kids-site .game-progress {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 24px;
  color: var(--kids-muted);
  font-size: 15px;
  line-height: 1.6;
}

.kids-site .game-progress strong {
  color: var(--kids-ink);
}

.kids-site .game-difficulty {
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--kids-line);
  border-radius: 14px;
  background: #fff;
}

.kids-site .game-difficulty button {
  min-width: 76px;
  min-height: 44px;
  padding: 8px 12px;
  border-radius: 10px;
  background: #fff;
  color: var(--kids-ink);
  font-size: 15px;
  line-height: 1.4;
}

.kids-site .game-difficulty button[aria-pressed="true"] {
  background: var(--kids-purple);
  color: #fff;
}

.kids-site .game-stage {
  max-width: 760px;
}

.kids-site .memory-grid,
.kids-site .memory-grid.memory-six {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 720px;
  gap: 12px;
}

.kids-site .memory-card {
  min-width: 0;
  min-height: 112px;
  padding: 12px 6px;
  aspect-ratio: 1.05;
  border: 2px solid var(--kids-purple);
  border-radius: 16px;
  background: var(--kids-purple);
  color: #fff;
  font-size: 42px;
  font-weight: 750;
}

.kids-site .memory-card[data-state="closed"]:hover:not(:disabled) {
  background: #5829d1;
  border-color: #5829d1;
  transform: translateY(-2px);
}

.kids-site .memory-card[data-state="open"] {
  background: #fff;
  border-color: var(--kids-cobalt);
  color: var(--kids-ink);
  font-size: 42px;
}

.kids-site .memory-card[data-state="matched"] {
  background: var(--kids-lime);
  border-color: #5e810e;
  color: var(--kids-ink);
  font-size: 42px;
  opacity: 1;
}

.kids-site .memory-card-label {
  max-width: 100%;
  margin-top: 8px;
  color: var(--kids-ink);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.kids-site .game-question {
  margin-block: 24px;
  font-size: 27px;
  font-weight: 750;
  line-height: 1.25;
  letter-spacing: -.02em;
}

.kids-site .game-status {
  min-height: 32px;
  margin-top: 26px;
  color: var(--kids-ink);
  font-size: 18px;
  font-weight: 650;
  line-height: 1.65;
}

.kids-site .veggie-object {
  max-width: 380px;
  min-height: 210px;
  padding: 24px 18px;
  border: 0;
  border-radius: 22px;
  background: var(--kids-lime);
  color: var(--kids-ink);
}

.kids-site .veggie-object span {
  margin-bottom: 16px;
  font-size: 90px;
}

.kids-site .veggie-object strong {
  max-width: 100%;
  font-size: 28px;
  line-height: 1.25;
  text-align: center;
}

.kids-site .game-choices {
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin-top: 24px;
}

.kids-site .game-choice {
  min-width: 0;
  min-height: 56px;
  padding: 14px 12px;
  flex-direction: row;
  gap: 10px;
  border: 2px solid var(--kids-line);
  border-radius: 14px;
  background: #fff;
  color: var(--kids-ink);
  font-size: 18px;
  font-weight: 650;
  line-height: 1.4;
}

.kids-site .game-choice span {
  font-size: 28px;
}

.kids-site .game-choice:not(.correct):not(.incorrect):hover:not(:disabled) {
  background: #f4efff;
  border-color: var(--kids-purple);
}

.kids-site .game-choice.correct {
  background: var(--kids-lime);
  border-color: #5e810e;
  color: var(--kids-ink);
  opacity: 1;
}

.kids-site .game-choice.incorrect {
  background: #fff0eb;
  border-color: #b74731;
  color: var(--kids-ink);
  opacity: 1;
}

.kids-site .game-next {
  margin-top: 24px;
}

.kids-site .game-next .button {
  min-height: 52px;
  padding: 13px 22px;
  border-radius: 14px;
  font-size: 17px;
}

.kids-site .game-complete {
  padding: 30px 8px;
}

.kids-site .game-complete-symbol {
  margin-bottom: 28px;
  font-size: 76px;
}

.kids-site .game-complete h2 {
  margin-bottom: 20px;
  font-size: 32px;
  line-height: 1.2;
}

.kids-site .game-complete p {
  max-width: 48ch;
  margin-bottom: 28px;
  font-size: 18px;
  line-height: 1.75;
}

.kids-site .game-complete .button {
  min-height: 52px;
  border-radius: 14px;
  font-size: 17px;
}

.kids-site .pattern-sequence {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  justify-items: center;
  gap: 12px;
  min-height: 0;
  margin-block: 24px;
  padding: 20px 14px;
  border: 1px solid var(--kids-line);
  border-radius: 20px;
  background: #f4efff;
}

.kids-site .pattern-symbol {
  width: 56px;
  height: 56px;
  max-width: 100%;
  border: 1px solid #d8c9fa;
  border-radius: 12px;
  background: #fff;
  color: var(--kids-ink);
  font-size: 32px;
}

.kids-site .pattern-symbol.missing {
  border: 2px dashed var(--kids-purple);
  color: #5428b9;
}

.kids-site .pattern-choices {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 580px;
  gap: 8px;
}

.kids-site .pattern-choices .game-choice {
  min-height: 60px;
  padding: 10px 4px;
  font-size: 30px;
}

.kids-site .shape-board {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px 12px;
  min-height: 260px;
  padding: 24px 12px;
  border: 1px solid var(--kids-line);
  border-radius: 20px;
  background: #fff;
}

.kids-site .safari-shape {
  width: 38px;
  height: 38px;
}

.kids-site .safari-diamond {
  width: 29px;
  height: 29px;
}

/* Keep the original shape fills: the game's accessible names identify colors. */
.kids-site .count-choices {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  max-width: 580px;
  gap: 10px;
}

.kids-site .count-choices .game-choice {
  min-height: 52px;
  padding: 8px 4px;
  font-size: 23px;
}

.kids-site .game-privacy-caption {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 8px;
  max-width: 65ch;
  margin: 24px auto 0;
  font-size: 13px;
  line-height: 1.65;
  color: var(--kids-muted);
}

.kids-site .game-privacy-caption .icon {
  width: 17px;
  height: 17px;
  margin-top: 2px;
  flex-shrink: 0;
}

/* Article layout/type scale belongs to journal-redesign.css and its reader
 * controls. Only the Kids colors and readable supporting labels are set here. */
.kids-site .article-figure figcaption {
  color: var(--kids-muted);
  font-size: 14px;
  line-height: 1.65;
}

.kids-site .image-license,
.kids-site .article-sources .review-date {
  font-size: 13px;
  line-height: 1.6;
}

.kids-site .reading-progress {
  top: 0;
}

/* 360: more room for five numbered choices, without reducing control size. */
@media (min-width: 360px) {
  .kids-site { --kids-gutter: 18px; }
  .kids-site .kids-hero h1 { font-size: 44px; }
  .kids-site .kids-hero-art { height: 275px; }
  .kids-site .kids-planet > span:first-child { font-size: 92px; }
  .kids-site .kids-planet > span:nth-child(2) { font-size: 104px; }
  .kids-site .kids-planet > span:nth-child(3) { font-size: 90px; }
  .kids-site .game-card { grid-template-columns: 90px minmax(0, 1fr); }
  .kids-site .game-card-art > span:first-child { font-size: 62px; }
  .kids-site .count-choices { grid-template-columns: repeat(5, minmax(0, 1fr)); }
}

/* 390: three navigation destinations and two clear hero actions fit together. */
@media (min-width: 390px) {
  .kids-site { --kids-gutter: 20px; }
  .kids-site .kids-header .brand-name { font-size: 24px; }
  .kids-site .kids-nav { grid-template-columns: 1fr .8fr 1.2fr; }
  .kids-site .kids-nav a { flex-direction: column; gap: 5px; padding: 9px 8px; }
  .kids-site .kids-nav > a:last-child { grid-column: auto; }
  .kids-site .kids-hero h1 { font-size: 48px; }
  .kids-site .kids-hero-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kids-site .kids-hero-art { height: 290px; }
  .kids-site .story-copy { padding: 24px; }
  .kids-site .story-copy h3 { font-size: 27px; }
  .kids-site .memory-grid,
  .kids-site .memory-grid.memory-six { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
  .kids-site .memory-card { min-height: 108px; padding-inline: 4px; aspect-ratio: auto; }
  .kids-site .memory-card,
  .kids-site .memory-card[data-state="open"],
  .kids-site .memory-card[data-state="matched"] { font-size: 36px; }
  .kids-site #kids-exit-dialog .dialog-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* 430: horizontal category bands and a little more space for game instructions. */
@media (min-width: 430px) {
  .kids-site { --kids-gutter: 24px; }
  .kids-site .kids-nav a { flex-direction: row; min-height: 50px; font-size: 16px; }
  .kids-site .kids-nav > a:last-child { font-size: 15px; }
  .kids-site .kids-hero h1 { font-size: 52px; }
  .kids-site .kids-hero-art { height: 310px; border-radius: 28px; }
  .kids-site .kids-topic-strip a { flex-direction: row; min-height: 94px; gap: 9px; }
  .kids-site .kids-topic-strip a span { font-size: 32px; }
  .kids-site .game-card { grid-template-columns: 110px minmax(0, 1fr); }
  .kids-site .game-card-copy { padding: 24px 22px 24px 12px; }
  .kids-site .game-card-art > span:first-child { font-size: 74px; }
  .kids-site .game-shell { padding: 24px 18px; }
  .kids-site .game-page-heading { grid-template-columns: 72px minmax(0, 1fr); }
  .kids-site .game-title-icon { width: 72px; height: 76px; font-size: 46px; }
  .kids-site .game-page-heading h1 { font-size: 38px; }
  .kids-site .game-choices:not(.pattern-choices):not(.count-choices) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kids-site .game-choices:not(.pattern-choices):not(.count-choices) .game-choice { flex-direction: column; padding: 14px 8px; font-size: 17px; }
}

/* 768: tablet story pairs, a balanced hero, and two broad game blocks per row. */
@media (min-width: 768px) {
  .kids-site { --kids-gutter: 32px; }
  .kids-site .kids-header .header-inner { padding-block: 20px; gap: 16px 24px; }
  .kids-site .kids-header .brand-mark { width: 54px; min-width: 54px; height: 58px; }
  .kids-site .kids-header .brand-mark svg { width: 54px; height: 54px; }
  .kids-site .kids-header .brand-name { font-size: 28px; }
  .kids-site .kids-word { font-size: 31px; }
  .kids-site .kids-nav { grid-template-columns: repeat(3, max-content); justify-content: center; gap: 18px; }
  .kids-site .kids-nav a { padding: 11px 20px; font-size: 18px; }
  .kids-site .kids-nav > a:last-child { font-size: 17px; }
  .kids-site .kids-hero { grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); gap: 32px; padding-block: 46px 42px; }
  .kids-site .kids-hero h1 { font-size: 52px; }
  .kids-site .kids-hero-copy > p { font-size: 18px; }
  .kids-site .kids-hero-actions { grid-template-columns: minmax(0, 1fr); max-width: 288px; }
  .kids-site .kids-hero-art { height: 340px; }
  .kids-site .kids-planet { width: 68%; top: 25%; left: 6%; }
  .kids-site .kids-planet > span:first-child { font-size: 96px; }
  .kids-site .kids-planet > span:nth-child(2) { font-size: 104px; }
  .kids-site .kids-planet > span:nth-child(3) { font-size: 92px; }
  .kids-site .kids-topic-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding-bottom: 46px; }
  .kids-site .kids-topic-strip a { min-height: 100px; font-size: 18px; gap: 12px; }
  .kids-site .kids-topic-strip a span { font-size: 38px; }
  .kids-site .kids-discover { padding-block: 24px 60px; }
  .kids-site .section-heading { align-items: center; margin-bottom: 32px; gap: 28px; }
  .kids-site .section-heading h2,
  .kids-site .kids-games-section .section-heading h1 { font-size: 42px; }
  .kids-site .section-doodle,
  .kids-site .game-heading-doodle { font-size: 58px; margin-top: 0; }
  .kids-site .story-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; }
  .kids-site .story-copy { padding: 24px; }
  .kids-site .story-copy h3 { font-size: 27px; }
  .kids-site .listing-header { padding-block: 44px; }
  .kids-site .listing-title h1 { font-size: 56px; }
  .kids-site .listing-icon { width: 96px; min-width: 96px; height: 96px; }
  .kids-site .kids-games-section { padding-block: 54px 60px; }
  .kids-site .game-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
  .kids-site .game-card { grid-template-columns: 90px minmax(0, 1fr); }
  .kids-site .game-card-copy { padding: 24px 22px 24px 8px; }
  .kids-site .game-card-art > span:first-child { font-size: 66px; }
  .kids-site .grownups-banner { padding: 32px; margin-block: 46px; grid-template-columns: 56px minmax(0, 1fr); gap: 24px; }
  .kids-site .grownups-icon { width: 56px; height: 56px; }
  .kids-site .grownups-banner h2 { font-size: 30px; }
  .kids-site .grownups-banner > .button { grid-column: 2; justify-self: start; width: auto; }
  .kids-site .kids-footer { padding-block: 38px; }
  .kids-site .kids-footer > .container { grid-template-columns: 1fr 1fr; gap: 24px; }
  .kids-site .kids-footer > .container > p { justify-self: end; text-align: right; }
  .kids-site .kids-footer nav { grid-column: 1 / -1; gap: 24px; }
  .kids-site .kids-footer .kids-privacy-note { grid-column: 1 / -1; }
  .kids-site .policy-page { padding-block: 48px 64px; }
  .kids-site .policy-page > h1 { font-size: 54px; }
  .kids-site .parents-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .kids-site .parents-grid section { padding: 30px; }
  .kids-site .parent-exit-box { padding: 36px; }
  .kids-site #kids-exit-dialog { padding: 64px 40px 40px; }
  .kids-site #kids-exit-dialog h2 { font-size: 38px; }
  .kids-site .game-page { padding-block: 36px 60px; }
  .kids-site .game-page-heading { grid-template-columns: 92px minmax(0, 1fr); gap: 26px; margin-bottom: 36px; }
  .kids-site .game-title-icon { width: 92px; height: 92px; font-size: 56px; }
  .kids-site .game-page-heading h1 { font-size: 48px; }
  .kids-site .game-shell { padding: 30px; }
  .kids-site .game-topbar { grid-template-columns: minmax(0, 1fr) auto; align-items: start; gap: 24px; }
  .kids-site .game-reset { justify-self: end; }
  .kids-site .memory-grid,
  .kids-site .memory-grid.memory-six { gap: 16px; }
  .kids-site .memory-card { min-height: 142px; aspect-ratio: 1.1; padding: 14px 8px; }
  .kids-site .memory-card,
  .kids-site .memory-card[data-state="open"],
  .kids-site .memory-card[data-state="matched"] { font-size: 52px; }
  .kids-site .memory-card-label { font-size: 15px; }
  .kids-site .game-question { font-size: 32px; }
  .kids-site .pattern-sequence { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; padding: 26px 18px; }
  .kids-site .pattern-symbol { width: 64px; height: 64px; font-size: 36px; }
  .kids-site .shape-board { grid-template-columns: repeat(4, minmax(0, 1fr)); padding: 30px; gap: 26px; min-height: 320px; }
  .kids-site .safari-shape { width: 48px; height: 48px; }
  .kids-site .safari-diamond { width: 37px; height: 37px; }
  .kids-site .game-choices:not(.pattern-choices):not(.count-choices) .game-choice { flex-direction: row; font-size: 18px; }
  .kids-site .game-complete { padding: 46px 24px; }
  .kids-site .game-complete h2 { font-size: 40px; }
}

/* 1024: one-row navigation and side-by-side actions; story columns stay roomy. */
@media (min-width: 1024px) {
  .kids-site { --kids-gutter: 40px; }
  .kids-site .kids-header .header-inner { grid-template-columns: minmax(220px, 1fr) auto 48px; gap: 24px; }
  .kids-site .kids-nav { grid-column: 2; grid-row: 1; display: flex; width: auto; gap: 6px; }
  .kids-site .kids-nav a { padding: 12px 16px; font-size: 17px; }
  .kids-site .kids-nav > a:last-child { font-size: 16px; }
  .kids-site .kids-exit { grid-column: 3; }
  .kids-site .kids-hero { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 40px; padding-block: 54px 48px; }
  .kids-site .kids-hero h1 { font-size: 64px; }
  .kids-site .kids-hero-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 480px; }
  .kids-site .kids-hero-actions .button { font-size: 17px; min-height: 58px; }
  .kids-site .kids-hero-art { height: 400px; border-radius: 32px; }
  .kids-site .kids-planet { width: 66%; top: 18%; left: 9%; }
  .kids-site .kids-planet > span:first-child { font-size: 124px; }
  .kids-site .kids-planet > span:nth-child(2) { font-size: 142px; }
  .kids-site .kids-planet > span:nth-child(3) { font-size: 118px; }
  .kids-site .kids-hero-hello { padding: 16px 20px; font-size: 40px; }
  .kids-site .kids-hero-hello span { font-size: 46px; }
  .kids-site .kids-hero-question { width: 88px; height: 104px; font-size: 76px; }
  .kids-site .kids-orbit-star { font-size: 54px; }
  .kids-site .kids-caption-card { padding: 14px 20px; font-size: 16px; }
  .kids-site .kids-topic-strip { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .kids-site .kids-topic-strip:has(> a:nth-child(6):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .kids-site .kids-topic-strip a { flex-direction: column; min-height: 128px; font-size: 18px; }
  .kids-site .kids-topic-strip a span { font-size: 40px; }
  .kids-site .story-grid { gap: 30px; }
  .kids-site .story-copy h3 { font-size: 30px; }
  .kids-site .story-copy > p { font-size: 18px; }
  .kids-site .listing-tools { flex-direction: row; justify-content: space-between; align-items: center; }
  .kids-site .listing-tools > p { flex-shrink: 0; }
  .kids-site .filter-pills { justify-content: flex-end; }
  .kids-site .game-card { grid-template-columns: 130px minmax(0, 1fr); }
  .kids-site .game-card-art > span:first-child { font-size: 90px; }
  .kids-site .game-card-copy h3 { font-size: 30px; }
  .kids-site .game-card-copy { padding: 28px 26px 28px 12px; }
  .kids-site .grownups-banner { grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; }
  .kids-site .grownups-banner > .button { grid-column: 3; grid-row: 1; }
  .kids-site .kids-footer > .container { grid-template-columns: auto minmax(0, 1fr); }
  .kids-site .kids-footer nav { grid-column: 2; grid-row: 1; justify-content: flex-end; }
  .kids-site .kids-footer > .container > p { grid-column: 1; grid-row: 2; text-align: left; justify-self: start; }
  .kids-site .kids-footer .kids-privacy-note { grid-column: 2; grid-row: 2; justify-self: end; }
  .kids-site .game-shell { padding: 40px; }
}

/* 1280: three generous story columns and the complete four-game row. */
@media (min-width: 1280px) {
  .kids-site { --kids-gutter: 48px; }
  .kids-site .kids-header .brand-name { font-size: 30px; }
  .kids-site .kids-nav { gap: 16px; }
  .kids-site .kids-nav a { font-size: 19px; }
  .kids-site .kids-nav > a:last-child { font-size: 18px; }
  .kids-site .kids-hero { gap: 48px; }
  .kids-site .kids-hero h1 { font-size: 72px; }
  .kids-site .kids-hero-copy > p { font-size: 19px; }
  .kids-site .kids-hero-art { height: 430px; }
  .kids-site .kids-planet { left: 12%; top: 16%; }
  .kids-site .kids-planet > span:first-child { font-size: 140px; }
  .kids-site .kids-planet > span:nth-child(2) { font-size: 156px; }
  .kids-site .kids-planet > span:nth-child(3) { font-size: 132px; }
  .kids-site .kids-topic-strip a { flex-direction: row; min-height: 112px; font-size: 18px; padding-inline: 14px; }
  .kids-site .kids-topic-strip a span { font-size: 38px; }
  .kids-site .section-heading h2,
  .kids-site .kids-games-section .section-heading h1 { font-size: 48px; }
  .kids-site .story-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
  .kids-site .story-copy h3 { font-size: 28px; }
  .kids-site .story-copy > p { font-size: 17px; }
  .kids-site .game-card-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
  .kids-site .game-card { grid-template-columns: minmax(0, 1fr); grid-template-rows: 150px minmax(0, 1fr); }
  .kids-site .game-card-art,
  .kids-site .games-index .game-card-art { height: 150px; min-height: 150px; }
  .kids-site .game-card-art > span:first-child { font-size: 90px; }
  .kids-site .game-card-copy { display: flex; flex-direction: column; padding: 22px; }
  .kids-site .game-card-copy h3 { font-size: 28px; }
  .kids-site .game-card-copy p { margin-bottom: 18px; }
  .kids-site .game-card .game-start { margin-top: auto; }
  .kids-site .listing-title h1 { font-size: 64px; }
}

/* 1440: broader hero art, stronger bands and comfortable large-laptop type. */
@media (min-width: 1440px) {
  .kids-site { --kids-gutter: 56px; }
  .kids-site .kids-hero { gap: 56px; padding-block: 60px 54px; }
  .kids-site .kids-hero h1 { font-size: 80px; }
  .kids-site .kids-hero-art { height: 460px; }
  .kids-site .kids-planet { max-width: 340px; }
  .kids-site .kids-planet > span:first-child { font-size: 154px; }
  .kids-site .kids-planet > span:nth-child(2) { font-size: 174px; }
  .kids-site .kids-planet > span:nth-child(3) { font-size: 146px; }
  .kids-site .kids-hero-hello { font-size: 46px; }
  .kids-site .kids-hero-question { width: 98px; height: 116px; font-size: 84px; }
  .kids-site .kids-topic-strip { gap: 18px; padding-bottom: 56px; }
  .kids-site .kids-topic-strip:has(> a:nth-child(6):last-child) { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .kids-site .kids-topic-strip a { min-height: 120px; font-size: 20px; gap: 14px; }
  .kids-site .kids-topic-strip a span { font-size: 44px; }
  .kids-site .story-copy { padding: 28px; }
  .kids-site .story-copy h3 { font-size: 30px; }
  .kids-site .story-copy > p { font-size: 18px; }
  .kids-site .game-card-art,
  .kids-site .games-index .game-card-art { height: 170px; min-height: 170px; }
  .kids-site .game-card { grid-template-rows: 170px minmax(0, 1fr); }
  .kids-site .game-card-copy { padding: 26px; }
  .kids-site .game-card-copy h3 { font-size: 30px; }
  .kids-site .kids-discover { padding-bottom: 72px; }
  .kids-site .kids-games-section { padding-block: 64px 72px; }
}

/* 1920: a bounded wide composition, with four readable discovery cards. */
@media (min-width: 1920px) {
  .kids-site { --kids-gutter: 64px; }
  .kids-site .kids-hero { gap: 64px; padding-block: 68px 60px; }
  .kids-site .kids-hero h1 { font-size: 88px; }
  .kids-site .kids-hero-art { height: 480px; }
  .kids-site .kids-hero-actions .button { font-size: 18px; min-height: 60px; }
  .kids-site .section-heading h2,
  .kids-site .kids-games-section .section-heading h1 { font-size: 52px; }
  .kids-site .kids-discover > .story-grid,
  .kids-site .listing-content > .story-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 26px; }
  .kids-site .story-copy { padding: 24px; }
  .kids-site .story-copy h3 { font-size: 27px; }
  .kids-site .story-copy > p { font-size: 17px; }
}

@media (prefers-reduced-motion: reduce) {
  .kids-site *,
  .kids-site *::before,
  .kids-site *::after {
    animation: none !important;
    transition: none !important;
  }
  .kids-site .kids-topic-strip a:hover,
  .kids-site .game-card:hover,
  .kids-site .memory-card:hover:not(:disabled),
  .kids-site .game-choice:hover:not(:disabled) {
    transform: none;
  }
}

.kids-site[data-motion="false"] .kids-topic-strip a:hover,
.kids-site[data-motion="false"] .game-card:hover,
.kids-site[data-motion="false"] .memory-card:hover:not(:disabled),
.kids-site[data-motion="false"] .game-choice:hover:not(:disabled) {
  transform: none;
}

@media print {
  .kids-site .kids-header,
  .kids-site .kids-footer,
  .kids-site #kids-exit-dialog {
    display: none !important;
  }
  .kids-site,
  .kids-site .game-shell,
  .kids-site .parents-grid section,
  .kids-site .parent-exit-box {
    background: #fff;
    color: #111;
    box-shadow: none;
  }
  .kids-site .container { width: 100%; max-width: none; }
  .kids-site .story-grid,
  .kids-site .parents-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kids-site .story-card,
  .kids-site .parents-grid section { break-inside: avoid; }
}

/* Shared discovery: people, a small first activity and useful grown-up guidance. */
.kids-site .kids-family-hero {
  grid-template-columns: minmax(0, 1fr);
  gap: 26px;
  padding-block: 30px 32px;
}

.kids-site .kids-family-hero h1 {
  max-width: 18ch;
  font-size: 36px;
  line-height: 1.12;
  letter-spacing: -.035em;
}

.kids-site .kids-family-hero .kids-hero-copy > p {
  max-width: 47ch;
  margin-top: 20px;
  font-size: 18px;
  line-height: 1.6;
}

.kids-site .kids-family-hero .kids-hero-actions {
  grid-template-columns: minmax(0, 1fr);
  max-width: none;
  gap: 12px;
  margin-top: 24px;
}

.kids-site .kids-family-hero .kids-hero-actions .button {
  min-height: 54px;
  padding: 13px 16px;
  font-size: 17px;
  line-height: 1.4;
  border-radius: 13px;
}

.kids-site .kids-family-welcome {
  margin-top: 24px;
}

.kids-site .kids-family-welcome > p {
  max-width: 48ch;
  margin: 0;
  color: var(--kids-ink);
  font-size: 18px;
  line-height: 1.6;
}

.kids-site .kids-family-welcome .text-link,
.kids-site .family-parent-actions .text-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  max-width: 100%;
  padding-block: 7px;
  border: 0;
  color: var(--kids-cobalt);
  font-size: 18px;
  font-weight: 650;
  line-height: 1.5;
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 5px;
}

.kids-site .kids-family-art,
.kids-site .family-parent-art {
  min-width: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.kids-site .kids-family-art {
  overflow: hidden;
  border-radius: 24px;
}

.kids-site .kids-family-art img,
.kids-site .family-parent-art img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: contain;
  margin: 0;
  border: 0;
  border-radius: 0;
  filter: none;
  box-shadow: none;
}

.kids-site .family-starter {
  padding-block: 12px 30px;
  scroll-margin-top: 24px;
}

.kids-site .family-starter > h2,
.kids-site .family-topic-heading,
.kids-site .family-parent-steps > h2,
.kids-site .family-parent-details > h2 {
  margin: 0;
  color: var(--kids-ink);
  font-size: 30px;
  font-weight: 800;
  line-height: 1.17;
  letter-spacing: -.035em;
}

.kids-site .family-starter-lead {
  max-width: 64ch;
  margin: 12px 0 0;
  font-size: 18px;
  line-height: 1.6;
  color: var(--kids-ink);
}

.kids-site .family-choices {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  max-width: 680px;
  margin-top: 22px;
  margin-bottom: 20px;
}

.kids-site .family-choices[hidden],
.kids-site .family-panel[hidden] {
  display: none !important;
}

.kids-site .family-choices button {
  min-width: 0;
  min-height: 48px;
  padding: 10px 6px;
  border: 2px solid var(--kids-purple);
  border-radius: 12px;
  background: #fff;
  color: var(--kids-ink);
  font-family: inherit;
  font-size: 17px;
  font-weight: 750;
  line-height: 1.4;
  cursor: pointer;
}

.kids-site .family-choices button[aria-pressed="true"] {
  background: var(--kids-purple);
  color: #fff;
}

.kids-site .family-choices button:not([aria-pressed="true"]):hover {
  background: #f4efff;
}

.kids-site .family-panels {
  display: grid;
  gap: 18px;
  margin-top: 20px;
}

.kids-site .family-panel {
  min-width: 0;
  padding: 24px 20px;
  border-radius: 20px;
  background: #f2ecff;
  color: var(--kids-ink);
}

.kids-site .family-panel > h3 {
  max-width: 44ch;
  margin: 0 0 22px;
  font-size: 25px;
  font-weight: 800;
  line-height: 1.22;
  letter-spacing: -.025em;
}

.kids-site .family-panel-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
}

.kids-site .family-steps {
  display: grid;
  align-content: start;
  gap: 14px;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: family-step;
}

.kids-site .family-steps > li {
  position: relative;
  min-height: 34px;
  padding-left: 44px;
  color: var(--kids-ink);
  font-size: 18px;
  line-height: 1.6;
  counter-increment: family-step;
}

.kids-site .family-steps > li::before {
  content: counter(family-step);
  position: absolute;
  top: 0;
  left: 0;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--kids-yellow);
  color: var(--kids-ink);
  font-size: 18px;
  font-weight: 800;
  line-height: 1;
}

.kids-site .family-panel-aside {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-width: 0;
  padding-top: 22px;
  border-top: 1px solid #d2bdf7;
  gap: 20px;
}

.kids-site .family-question {
  max-width: 48ch;
  margin: 0;
  color: var(--kids-ink);
  font-size: 18px;
  line-height: 1.6;
}

.kids-site .family-panel-aside > .button {
  justify-content: center;
  min-height: 52px;
  width: 100%;
  max-width: 320px;
  font-size: 17px;
}

.kids-site .family-inclusive-note {
  max-width: 72ch;
  margin: 16px 0 0;
  color: var(--kids-ink);
  font-size: 18px;
  line-height: 1.65;
}

.kids-site .family-topic-heading {
  margin-inline: auto;
  margin-top: 14px;
  margin-bottom: 22px;
}

.kids-site .family-topic-heading + .kids-topic-strip {
  padding-bottom: 30px;
}

/* Parent guidance starts with an invitation; detailed policy remains available. */
.kids-site .family-parent-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 24px;
  padding-block: 34px 24px;
}

.kids-site .family-parent-copy {
  min-width: 0;
}

.kids-site .family-parent-copy h1 {
  max-width: 18ch;
  margin: 0;
  font-size: 37px;
  font-weight: 800;
  line-height: 1.13;
  letter-spacing: -.035em;
}

.kids-site .family-parent-copy > p {
  max-width: 40ch;
  margin: 20px 0 0;
  font-size: 18px;
  line-height: 1.6;
  color: var(--kids-ink);
}

.kids-site .family-parent-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 20px;
  margin-top: 24px;
}

.kids-site .family-parent-actions > .button {
  width: 100%;
  min-height: 54px;
  font-size: 17px;
}

.kids-site .family-parent-steps {
  padding-block: 24px 36px;
}

.kids-site .family-parent-step-list {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 28px;
  margin: 26px 0 0;
  padding: 0;
  list-style: none;
}

.kids-site .family-parent-step-list > li {
  min-width: 0;
}

.kids-site .family-step-symbols {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 58px;
  margin-bottom: 16px;
}

.kids-site .family-step-number {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 13px;
  background: var(--kids-purple);
  color: #fff;
  font-size: 27px;
  font-weight: 800;
  line-height: 1;
}

.kids-site .family-step-icon {
  flex-shrink: 0;
  width: 54px;
  height: 54px;
  color: var(--kids-purple);
}

.kids-site .family-parent-step-list > li:nth-child(2) .family-step-number {
  background: var(--kids-yellow);
  color: var(--kids-ink);
}

.kids-site .family-parent-step-list > li:nth-child(3) .family-step-number {
  background: var(--kids-coral);
  color: var(--kids-ink);
}

.kids-site .family-parent-step-list > li:nth-child(3) .family-step-icon {
  color: #c9402b;
}

.kids-site .family-parent-step-list h3 {
  margin: 0 0 12px;
  font-size: 25px;
  font-weight: 800;
  line-height: 1.22;
  letter-spacing: -.025em;
}

.kids-site .family-parent-step-list p {
  max-width: 50ch;
  margin: 0;
  font-size: 18px;
  line-height: 1.65;
  color: var(--kids-ink);
}

.kids-site .family-inclusive {
  padding: 26px 22px;
  margin-block: 10px 38px;
  border-radius: 23px;
  background: #fff4bf;
  color: var(--kids-ink);
}

.kids-site .family-inclusive h2 {
  max-width: 30ch;
  margin: 0 0 12px;
  font-size: 29px;
  line-height: 1.2;
  letter-spacing: -.035em;
}

.kids-site .family-inclusive p {
  max-width: 80ch;
  margin: 0;
  font-size: 18px;
  line-height: 1.65;
  color: var(--kids-ink);
}

.kids-site .family-parent-details {
  padding-bottom: 48px;
}

.kids-site .family-parent-details > h2 {
  margin-bottom: 24px;
}

.kids-site .family-parent-detail {
  min-width: 0;
  margin-top: 12px;
  border: 1px solid #c8cad6;
  border-radius: 14px;
  background: #fff;
}

.kids-site .family-parent-detail > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 60px;
  padding: 15px 18px;
  gap: 18px;
  color: var(--kids-ink);
  font-size: 18px;
  font-weight: 750;
  line-height: 1.45;
  list-style: none;
  cursor: pointer;
}

.kids-site .family-parent-detail > summary::-webkit-details-marker,
.kids-site .family-prompt summary::-webkit-details-marker {
  display: none;
}

.kids-site .family-parent-detail > summary::marker,
.kids-site .family-prompt summary::marker {
  content: '';
}

.kids-site .family-parent-detail > summary .icon {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
}

.kids-site .family-parent-detail[open] > summary .icon {
  transform: rotate(180deg);
}

.kids-site .family-parent-detail-body {
  min-width: 0;
  padding: 0 18px 24px;
}

.kids-site .family-parent-detail-body h3 {
  margin: 22px 0 12px;
  font-size: 23px;
  line-height: 1.25;
}

.kids-site .family-parent-detail-body p,
.kids-site .family-parent-detail-body .policy-body p {
  max-width: 78ch;
  margin: 16px 0 0;
  font-size: 18px;
  line-height: 1.75;
  color: var(--kids-ink);
}

.kids-site .family-parent-detail-body .policy-body {
  max-width: none;
  margin: 0;
  padding: 0;
}

.kids-site .family-parent-detail-body a:not(.button),
.kids-site .family-prompt a:not(.button) {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--kids-cobalt);
  font-size: 18px;
  line-height: 1.5;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* An optional conversation prompt beside reading and play, outside article prose. */
.kids-site .family-prompt {
  min-width: 0;
  padding: 22px 20px;
  border: 1px solid #dfd1ff;
  border-left: 5px solid var(--kids-purple);
  border-radius: 17px;
  background: #f4efff;
  color: var(--kids-ink);
}

.kids-site .family-reader-prompt {
  margin-block: 26px;
}

.kids-site .family-game-prompt {
  margin: 0 0 24px;
}

.kids-site .family-prompt h2 {
  margin: 0;
  color: var(--kids-ink);
  font-size: 25px;
  line-height: 1.25;
  letter-spacing: -.025em;
}

.kids-site .family-prompt p {
  max-width: 76ch;
  margin: 12px 0 0;
  color: var(--kids-ink);
  font-size: 18px;
  line-height: 1.65;
}

.kids-site .family-prompt summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  gap: 16px;
  color: #5428b9;
  font-size: 18px;
  font-weight: 750;
  line-height: 1.45;
  list-style: none;
  cursor: pointer;
}

.kids-site .family-prompt summary .icon {
  flex-shrink: 0;
  width: 22px;
  height: 22px;
}

.kids-site .family-prompt details[open] > summary .icon {
  transform: rotate(180deg);
}

.kids-site .family-reader-prompt > details {
  margin-top: 12px;
}

/* On phones, show the shared moment before the extra grown-up reassurance. */
@media (max-width: 389px) {
  .kids-site .kids-nav { grid-template-columns: minmax(0, 1fr) minmax(0, .8fr) minmax(0, 1.2fr); }
  .kids-site .kids-nav a { flex-direction: column; gap: 5px; padding: 9px 6px; }
  .kids-site .kids-nav > a:last-child { grid-column: auto; }
}

@media (max-width: 767px) {
  .kids-site .kids-family-hero { row-gap: 20px; }
  .kids-site .kids-family-hero .kids-hero-copy { display: contents; }
  .kids-site .kids-family-hero h1 { grid-column: 1; grid-row: 1; margin: 0; }
  .kids-site .kids-family-hero .kids-hero-copy > p { grid-column: 1; grid-row: 2; margin: 0; }
  .kids-site .kids-family-hero .kids-hero-actions { grid-column: 1; grid-row: 3; margin: 0; }
  .kids-site .kids-family-hero .kids-family-art { grid-column: 1; grid-row: 4; }
  .kids-site .kids-family-hero .kids-family-welcome { grid-column: 1; grid-row: 5; margin: 0; }
}

@media (min-width: 360px) {
  .kids-site .kids-family-hero h1 { font-size: 40px; }
  .kids-site .family-parent-copy h1 { font-size: 41px; }
  .kids-site .family-choices button { font-size: 18px; }
}

@media (min-width: 390px) {
  .kids-site .kids-family-hero h1 { font-size: 43px; }
  .kids-site .family-parent-copy h1 { font-size: 44px; }
  .kids-site .family-panel { padding: 26px 24px; }
  .kids-site .family-choices { gap: 10px; }
}

@media (min-width: 430px) {
  .kids-site .kids-family-hero h1 { font-size: 47px; }
  .kids-site .family-parent-copy h1 { font-size: 48px; }
  .kids-site .family-starter > h2,
  .kids-site .family-topic-heading,
  .kids-site .family-parent-steps > h2,
  .kids-site .family-parent-details > h2 { font-size: 34px; }
}

@media (min-width: 600px) and (max-width: 767px) {
  .kids-site .kids-family-hero .kids-hero-actions { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
  .kids-site .family-parent-actions > .button { width: auto; }
}

@media (min-width: 768px) {
  .kids-site .kids-family-hero { grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); gap: 28px; padding-block: 42px 40px; }
  .kids-site .kids-family-hero h1 { font-size: 42px; }
  .kids-site .kids-family-hero .kids-hero-copy > p { font-size: 19px; }
  .kids-site .kids-family-art { border-radius: 28px; }
  .kids-site .family-starter { padding-block: 12px 36px; }
  .kids-site .family-starter > h2,
  .kids-site .family-topic-heading,
  .kids-site .family-parent-steps > h2,
  .kids-site .family-parent-details > h2 { font-size: 38px; }
  .kids-site .family-starter-lead { font-size: 19px; }
  .kids-site .family-choices { gap: 12px; max-width: 640px; margin-top: 24px; margin-bottom: 22px; }
  .kids-site .family-choices button { min-height: 52px; padding: 12px 18px; font-size: 20px; }
  .kids-site .family-panel { padding: 30px 28px; border-radius: 22px; }
  .kids-site .family-panel > h3 { font-size: 29px; margin-bottom: 24px; }
  .kids-site .family-panel-layout { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 28px; }
  .kids-site .family-steps { gap: 16px; }
  .kids-site .family-steps > li { padding-left: 48px; font-size: 19px; }
  .kids-site .family-steps > li::before { width: 34px; height: 34px; font-size: 19px; }
  .kids-site .family-panel-aside { padding: 0 0 0 28px; border-top: 0; border-left: 1px solid #d2bdf7; }
  .kids-site .family-question { font-size: 19px; }
  .kids-site .family-panel-aside > .button { width: auto; min-width: 210px; max-width: 100%; padding-inline: 24px; font-size: 18px; }
  .kids-site .family-topic-heading { margin-top: 20px; margin-bottom: 26px; }
  .kids-site .family-parent-hero { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); padding-block: 44px 32px; gap: 24px; }
  .kids-site .family-parent-copy h1 { font-size: 43px; }
  .kids-site .family-parent-copy > p { font-size: 19px; }
  .kids-site .family-parent-steps { padding-block: 30px 46px; }
  .kids-site .family-parent-step-list { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 32px; }
  .kids-site .family-parent-step-list h3 { font-size: 25px; }
  .kids-site .family-parent-step-list p { font-size: 18px; }
  .kids-site .family-inclusive { padding: 32px; margin-block: 10px 44px; }
  .kids-site .family-inclusive h2 { font-size: 36px; }
  .kids-site .family-inclusive p { font-size: 19px; }
  .kids-site .family-parent-detail > summary { min-height: 66px; padding: 16px 24px; font-size: 20px; }
  .kids-site .family-parent-detail-body { padding: 0 24px 28px; }
  .kids-site .family-parent-details { padding-bottom: 60px; }
  .kids-site .family-prompt { padding: 24px 28px; }
  .kids-site .family-reader-prompt { margin-block: 32px; }
  .kids-site .family-prompt h2 { font-size: 28px; }
  .kids-site .family-prompt p { font-size: 19px; }
}

@media (min-width: 1024px) {
  .kids-site .kids-family-hero { gap: 38px; padding-block: 44px 40px; }
  .kids-site .kids-family-hero h1 { font-size: 50px; }
  .kids-site .kids-family-hero .kids-hero-actions { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
  .kids-site .kids-family-welcome { margin-top: 26px; }
  .kids-site .family-starter > h2,
  .kids-site .family-topic-heading,
  .kids-site .family-parent-steps > h2,
  .kids-site .family-parent-details > h2 { font-size: 42px; }
  .kids-site .family-panel { padding: 30px 34px; }
  .kids-site .family-panel-layout { gap: 38px; }
  .kids-site .family-panel-aside { padding-left: 38px; }
  .kids-site .family-parent-hero { gap: 36px; padding-block: 48px 34px; }
  .kids-site .family-parent-copy h1 { font-size: 54px; }
  .kids-site .family-parent-actions > .button { width: auto; }
  .kids-site .family-parent-step-list { gap: 36px; }
  .kids-site .family-parent-step-list h3 { font-size: 28px; }
  .kids-site .family-parent-step-list p { font-size: 19px; }
  .kids-site .family-step-number { width: 48px; height: 48px; font-size: 29px; }
  .kids-site .family-step-icon { width: 58px; height: 58px; }
  .kids-site .family-inclusive { padding: 34px 38px; }
}

@media (min-width: 1280px) {
  .kids-site .kids-family-hero { gap: 44px; }
  .kids-site .kids-family-hero h1 { font-size: 56px; }
  .kids-site .kids-family-hero .kids-hero-copy > p { font-size: 20px; }
  .kids-site .kids-family-hero .kids-hero-actions .button { min-height: 56px; font-size: 18px; }
  .kids-site .kids-family-art { border-radius: 30px; }
  .kids-site .family-panel > h3 { font-size: 33px; }
  .kids-site .family-starter-lead,
  .kids-site .family-steps > li,
  .kids-site .family-question { font-size: 20px; }
  .kids-site .family-panel-aside > .button { min-width: 248px; }
  .kids-site .family-parent-copy h1 { font-size: 62px; }
  .kids-site .family-parent-copy > p { font-size: 20px; }
  .kids-site .family-parent-actions > .button { font-size: 18px; }
  .kids-site .family-parent-step-list h3 { font-size: 30px; }
  .kids-site .family-parent-step-list p,
  .kids-site .family-inclusive p,
  .kids-site .family-prompt p { font-size: 20px; }
  .kids-site .family-inclusive h2 { font-size: 40px; }
}

@media (min-width: 1440px) {
  .kids-site .kids-family-hero h1 { font-size: 60px; }
  .kids-site .family-starter > h2,
  .kids-site .family-topic-heading,
  .kids-site .family-parent-steps > h2,
  .kids-site .family-parent-details > h2 { font-size: 46px; }
  .kids-site .family-panel { padding: 32px 40px; }
  .kids-site .family-parent-copy h1 { font-size: 66px; }
}

@media (min-width: 1920px) {
  .kids-site .kids-family-hero { gap: 54px; padding-block: 50px 44px; }
  .kids-site .kids-family-hero h1 { font-size: 64px; }
  .kids-site .family-parent-copy h1 { font-size: 70px; }
  .kids-site .family-parent-hero { gap: 48px; }
}

@media print {
  .kids-site .family-panel,
  .kids-site .family-inclusive,
  .kids-site .family-prompt {
    break-inside: avoid;
    background: #fff;
    color: #111;
    border: 1px solid #bbb;
  }
  .kids-site .family-parent-step-list > li { break-inside: avoid; }
}