/* A New Page, PARENT PAGES look (beauty pass Batch 3, Stage 3, Part 9 B1 and B4), 2026-10-19.
   Load after the page's own stylesheets. Presentation only: no words change.
   1. The 5 to 10 page (body.age-kids) takes the 5 to 10 palette: its light bands warm to #FFFBF2 and its paper bands
      to map parchment #F3E6C8. Pairs: #1F2E55 on #F3E6C8 11.0:1, #4B5674 on #F3E6C8 6.0:1, on #FFFBF2 7.3:1.
      The 11 to 18 page is the teen base Joel loves and the Littles page already wears the Littles pastels: untouched.
      The homepage is untouched (its gold line and palette are Joel's).
   2. Neutral parent pages (state guides, privacy, terms, 404) open on a calm sage band with a small open-book line
      mark, the parent palette's third colour. Pairs: #1F2E55 on sage #EEF3EF 11.9:1, #4B5674 on sage 6.9:1.
   Nothing here animates. Pictures are not touched. */

/* 1. ages 5 to 10 */
body.age-kids{--anp-cream:#FFFBF2;--anp-paper:#F3E6C8}
body.age-kids .band-paper,body.age-kids section.band-paper{background:#F3E6C8}

/* 2. neutral parent pages: the sage header band */
:root{--parent-sage:#EEF3EF;--parent-sage-ink:#2F5D4E}
body:has(.lp-article) #top.lp-hero,body:has(.nf-hero) #top.lp-hero{position:relative}
body:has(.lp-article) #top.lp-hero.band-light,body:has(.nf-hero) #top.lp-hero.band-light{background:radial-gradient(60% 70% at 85% 0%,rgba(47,93,78,.10),transparent 70%),var(--parent-sage)}
body:has(.lp-article) #top.lp-hero::after,body:has(.nf-hero) #top.lp-hero::after{content:"";position:absolute;top:20px;right:max(16px,calc(50% - 560px));width:44px;height:44px;border-radius:50%;pointer-events:none;
  background:#FFFFFF url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232F5D4E' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5.5c2.6-1 5.2-1 8 .8 2.8-1.8 5.4-1.8 8-.8v12.6c-2.6-1-5.2-1-8 .8-2.8-1.8-5.4-1.8-8-.8z'/%3E%3Cpath d='M12 6.3v12.6'/%3E%3C/svg%3E") center/24px no-repeat;box-shadow:0 1px 2px rgba(19,28,52,.06),0 8px 20px rgba(19,28,52,.08)}
@media (max-width:599px){body:has(.lp-article) #top.lp-hero::after,body:has(.nf-hero) #top.lp-hero::after{display:none}}
/* privacy and terms: the page opens on the same sage band behind its title block */
@media screen and (prefers-color-scheme: light){:root:not([data-theme="dark"]) body.anp-legal-page main.anp-legal{background:linear-gradient(180deg,var(--parent-sage) 0,var(--parent-sage) 260px,var(--anp-cream,#FBF8F1) 260px)}}
@media screen{:root[data-theme="light"] body.anp-legal-page main.anp-legal{background:linear-gradient(180deg,var(--parent-sage) 0,var(--parent-sage) 260px,var(--anp-cream,#FBF8F1) 260px)}}
@media print{body:has(.lp-article) #top.lp-hero::after,body:has(.nf-hero) #top.lp-hero::after{display:none}body.anp-legal-page main.anp-legal{background:none}}

/* 3. the age pages' hero below 1024px: the words fill the hero, so the floating fireflies drifted behind them (the
   5 to 10 hero words fell to 3.4 to 4.2:1 where a glowing firefly sat, and something moved behind words). On phones
   and tablets the hero is still navy with no fireflies; the picture is already shown whole elsewhere on the page.
   From 1024 up the art and the fireflies sit beside the words and stay as they are. */
@media (max-width:1023px){body.age-page .age-hero .fireflies{display:none}}
/* and the hero ground under the words below 1024px: the light-sky worlds (Kitty Hawk, Endurance) lifted the navy to
   about 4:1 behind the italic line. The ground keeps a touch of the world colour on deep night ink, so every hero word
   holds 4.5:1 or better in all 11 worlds. */
@media (max-width:1023px){body.age-page .age-hero.hero-v2{background:linear-gradient(180deg,color-mix(in srgb,var(--w-bg1,var(--anp-dusk)) 14%,var(--anp-ink-deep,#141E3C)),color-mix(in srgb,var(--w-bg2,var(--anp-ink-deep)) 10%,var(--anp-ink-deep,#141E3C)))}}
