.under16-page {
  --under16-green: #22f8a2;
  --under16-cyan: #82c6a8;
  --under16-surface: color-mix(in srgb, var(--color-surface) 88%, var(--color-background));
  --under16-border: color-mix(in srgb, var(--color-border) 88%, transparent);
}

.under16-page main { position: relative; z-index: 1; }
.under16-kicker {
  display: block;
  margin-bottom: .75rem;
  color: var(--color-accent-readable);
  font: 600 .66rem/1.3 "JetBrains Mono", monospace;
  letter-spacing: .1em;
}
.under16-hero {
  min-height: min(850px, 100svh);
  display: flex;
  align-items: center;
  padding: clamp(8rem, 13vw, 11rem) 0 clamp(4rem, 8vw, 6.5rem);
  background:
    radial-gradient(circle at 78% 30%, color-mix(in srgb, var(--under16-cyan) 12%, transparent), transparent 28%),
    radial-gradient(circle at 18% 16%, color-mix(in srgb, var(--color-accent) 13%, transparent), transparent 34%);
}
.under16-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(300px, .55fr);
  align-items: center;
  gap: clamp(2.5rem, 6vw, 5rem);
}
.under16-hero h1 {
  max-width: 780px;
  margin: 0 0 1.2rem;
  color: var(--color-heading);
  font-size: clamp(2.35rem, 4.2vw, 3.75rem);
  letter-spacing: -.048em;
  line-height: 1.03;
}
.under16-hero__content > p:not(.under16-parent-note) {
  max-width: 720px;
  margin: 0;
  color: var(--color-text-muted);
  font-size: clamp(.95rem, 1.5vw, 1.08rem);
  line-height: 1.75;
}
.under16-hero__actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 2rem; }
.under16-parent-note {
  display: flex;
  align-items: center;
  gap: .55rem;
  margin: 1.2rem 0 0;
  color: var(--color-text-muted);
  font-size: .7rem;
}
.under16-parent-note > span[aria-hidden] { flex: 0 0 18px; display: grid; place-items: center; width: 18px; height: 18px; color: var(--under16-cyan); background: color-mix(in srgb, var(--under16-cyan) 10%, transparent); border-radius: 50%; font-size: .6rem; }

.under16-program-card {
  padding: 1.2rem;
  background: linear-gradient(145deg, color-mix(in srgb, var(--color-accent) 7%, transparent), transparent 58%), var(--under16-surface);
  border: 1px solid var(--under16-border);
  border-radius: 1.25rem;
  box-shadow: 0 24px 65px color-mix(in srgb, var(--color-shadow) 48%, transparent);
}
.under16-program-card__top { display: flex; align-items: center; gap: 1rem; padding-bottom: 1.1rem; border-bottom: 1px solid var(--under16-border); }
.under16-program-card__top picture,
.under16-program-card__top img { display: block; width: 76px; height: 76px; border-radius: .9rem; }
.under16-program-card__top span,
.under16-program-card__top strong { display: block; }
.under16-program-card__top span { color: var(--color-text-muted); font: 600 .58rem "JetBrains Mono", monospace; letter-spacing: .08em; }
.under16-program-card__top strong { margin-top: .35rem; color: var(--color-heading); font-size: .9rem; }
.under16-program-card dl { display: grid; grid-template-columns: repeat(2, 1fr); margin: 0; }
.under16-program-card dl div { padding: 1rem .75rem; border-bottom: 1px solid var(--under16-border); }
.under16-program-card dl div:nth-child(odd) { border-right: 1px solid var(--under16-border); }
.under16-program-card dt { color: var(--color-text-muted); font-size: .62rem; }
.under16-program-card dd { margin: .25rem 0 0; color: var(--color-heading); font-size: 1rem; font-weight: 600; }
.under16-program-card > p { margin: 1rem .5rem .25rem; color: var(--color-text-muted); font-size: .66rem; line-height: 1.65; }

.under16-section { padding: clamp(4.5rem, 8vw, 7rem) 0; scroll-margin-top: 5rem; }
.under16-section--surface { background: color-mix(in srgb, var(--color-surface) 34%, transparent); border-block: 1px solid var(--under16-border); }
.under16-intro {
  display: grid;
  grid-template-columns: minmax(260px, .72fr) minmax(0, 1fr);
  gap: clamp(2rem, 8vw, 7rem);
  align-items: end;
  margin-bottom: 3rem;
}
.under16-intro h2,
.under16-section-heading h2,
.under16-sticky-heading h2 {
  margin: 0;
  color: var(--color-heading);
  font-size: clamp(2rem, 4vw, 3rem);
  letter-spacing: -.04em;
  line-height: 1.08;
}
.under16-intro > p { margin: 0; color: var(--color-text-muted); font-size: .93rem; line-height: 1.75; }
.under16-principles { display: grid; grid-template-columns: repeat(3, 1fr); border-block: 1px solid var(--under16-border); }
.under16-principles article { min-width: 0; padding: 1.8rem; border-right: 1px solid var(--under16-border); }
.under16-principles article:first-child { padding-left: 0; }
.under16-principles article:last-child { padding-right: 0; border-right: 0; }
.under16-principles article > span { color: var(--color-accent-readable); font: 500 .68rem "JetBrains Mono", monospace; }
.under16-principles h3 { margin: 2.8rem 0 .75rem; color: var(--color-heading); font-size: 1.05rem; }
.under16-principles p { margin: 0; color: var(--color-text-muted); font-size: .75rem; line-height: 1.7; }

.under16-editorial-grid { display: grid; grid-template-columns: minmax(260px, .7fr) minmax(0, 1.3fr); align-items: start; gap: clamp(3rem, 9vw, 8rem); }
.under16-sticky-heading { position: sticky; top: 7rem; }
.under16-sticky-heading > p { margin: 1rem 0 0; color: var(--color-text-muted); font-size: .78rem; line-height: 1.7; }
.under16-checklist { border-top: 1px solid var(--under16-border); }
.under16-checklist article { display: grid; grid-template-columns: 42px 1fr; gap: 1rem; padding: 1.35rem 0; border-bottom: 1px solid var(--under16-border); }
.under16-checklist article > span { color: var(--color-accent-readable); font: 500 .65rem "JetBrains Mono", monospace; }
.under16-checklist h3 { margin: 0 0 .35rem; color: var(--color-heading); font-size: .88rem; }
.under16-checklist p { margin: 0; color: var(--color-text-muted); font-size: .72rem; line-height: 1.65; }

.under16-section-heading { max-width: 750px; margin-bottom: 2.5rem; }
.under16-section-heading > p { margin: 1rem 0 0; color: var(--color-text-muted); font-size: .82rem; line-height: 1.75; }
.under16-benefits { display: grid; grid-template-columns: repeat(6, 1fr); gap: .8rem; }
.under16-benefit { grid-column: span 2; min-height: 220px; display: flex; flex-direction: column; justify-content: flex-end; padding: 1.35rem; background: var(--under16-surface); border: 1px solid var(--under16-border); border-radius: 1rem; }
.under16-benefit--featured { grid-column: span 4; background: linear-gradient(135deg, color-mix(in srgb, var(--color-accent) 13%, transparent), transparent 62%), var(--under16-surface); }
.under16-benefit > span { margin-bottom: auto; color: var(--color-accent-readable); font: 600 .6rem "JetBrains Mono", monospace; letter-spacing: .08em; }
.under16-benefit h3 { margin: 2rem 0 .5rem; color: var(--color-heading); font-size: 1rem; }
.under16-benefit p { margin: 0; color: var(--color-text-muted); font-size: .7rem; line-height: 1.65; }

.under16-process { counter-reset: none; display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--under16-border); border-left: 1px solid var(--under16-border); }
.under16-process li { display: grid; grid-template-columns: 42px 1fr; gap: 1rem; min-height: 210px; padding: 1.5rem; border-right: 1px solid var(--under16-border); border-bottom: 1px solid var(--under16-border); }
.under16-process li > span { color: var(--color-accent-readable); font: 500 .68rem "JetBrains Mono", monospace; }
.under16-process h3 { margin: 0 0 .55rem; color: var(--color-heading); font-size: .92rem; }
.under16-process p { margin: 0 0 1rem; color: var(--color-text-muted); font-size: .72rem; line-height: 1.7; }
.under16-process small { color: var(--color-text-muted); font: 500 .6rem "JetBrains Mono", monospace; }

.under16-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 2rem;
  padding: clamp(1.8rem, 5vw, 3.5rem);
  background: linear-gradient(115deg, color-mix(in srgb, var(--color-accent) 13%, transparent), transparent 68%), var(--under16-surface);
  border: 1px solid color-mix(in srgb, var(--color-accent) 28%, var(--under16-border));
  border-radius: 1.25rem;
}
.under16-cta h2 { max-width: 760px; margin: 0 0 .75rem; color: var(--color-heading); font-size: clamp(1.65rem, 3vw, 2.5rem); letter-spacing: -.035em; line-height: 1.12; }
.under16-cta > div:first-child > p { max-width: 700px; margin: 0; color: var(--color-text-muted); font-size: .78rem; line-height: 1.7; }
.under16-cta__actions { display: flex; flex-direction: column; gap: .65rem; min-width: 190px; }
.under16-cta__legal { grid-column: 1 / -1; margin: 0; padding-top: 1.1rem; color: var(--color-text-muted); border-top: 1px solid var(--under16-border); font-size: .62rem; }
.under16-cta__legal a { color: var(--color-accent-readable); text-decoration: underline; text-underline-offset: 2px; }

@media (max-width: 950px) {
  .under16-hero { min-height: auto; }
  .under16-hero__grid { grid-template-columns: 1fr; }
  .under16-program-card { max-width: 620px; }
  .under16-editorial-grid { grid-template-columns: 1fr; }
  .under16-sticky-heading { position: static; }
  .under16-benefit { grid-column: span 3; }
  .under16-benefit--featured { grid-column: span 6; }
}

@media (max-width: 720px) {
  .under16-intro { grid-template-columns: 1fr; }
  .under16-principles { grid-template-columns: 1fr; }
  .under16-principles article,
  .under16-principles article:first-child,
  .under16-principles article:last-child { padding: 1.5rem 0; border-right: 0; border-bottom: 1px solid var(--under16-border); }
  .under16-principles article:last-child { border-bottom: 0; }
  .under16-principles h3 { margin-top: 1.1rem; }
  .under16-benefits { grid-template-columns: 1fr; }
  .under16-benefit,
  .under16-benefit--featured { grid-column: auto; min-height: 190px; }
  .under16-process { grid-template-columns: 1fr; }
  .under16-process li { min-height: 0; }
  .under16-cta { grid-template-columns: 1fr; }
  .under16-cta__actions { align-items: stretch; }
}

@media (max-width: 500px) {
  .under16-hero__actions { flex-direction: column; align-items: stretch; }
  .under16-program-card dl { grid-template-columns: 1fr; }
  .under16-program-card dl div:nth-child(odd) { border-right: 0; }
  .under16-program-card__top picture,
  .under16-program-card__top img { width: 64px; height: 64px; }
  .under16-checklist article { grid-template-columns: 34px 1fr; }
  .under16-process li { grid-template-columns: 34px 1fr; padding: 1.2rem; }
}
