/* ===============================================================
   JUNIOR PREP — teal-accented phase page
   Inherits all layout from preschool.css via shared classnames,
   but targets .phase-root--juniorprep for colour overrides.
   =============================================================== */

/* Phase color: teal (default of phases.css — we just reassert for clarity) */
.phase-root--juniorprep {
  --phase: var(--ba-teal);
  --phase-dark: var(--ba-teal);
  --phase-ink: var(--ba-navy);
  --phase-soft: rgba(3, 156, 172, 0.08);
}

/* Eyebrows match heading-em accent — teal */
.phase-root--juniorprep .eyebrow-txt { color: var(--ba-teal); }

/* Hero tightening — same as Preschool */
.phase-root--juniorprep .phase-hero-v { min-height: 700px; }
.phase-root--juniorprep .phase-hero-v__inner {
  padding-top: 56px;
  min-height: 520px;
}
.phase-root--juniorprep .phase-hero-v__copy { padding-bottom: 72px; }
.phase-root--juniorprep .phase-hero-v__cutout img { max-width: 480px; }
@media (max-width: 900px) {
  .phase-root--juniorprep .phase-hero-v { min-height: 0; }
  .phase-root--juniorprep .phase-hero-v__inner { padding-top: 112px; min-height: 0; }
}

/* Hero eyebrow + display accent — mint-light on dark (consistent w/ HS pattern) */
.phase-root--juniorprep .phase-hero-v__eyebrow { color: rgba(255,255,255,0.85); }
.phase-root--juniorprep .phase-hero-billboard__display em {
  color: var(--ba-teal);
}

/* Hero wash — navy gradient, warmer tone */
.phase-root--juniorprep .phase-hero-v--natural .phase-hero-v__bg {
  filter: saturate(1.05) contrast(1.02);
  background-position: center 55%;
}
.phase-root--juniorprep .phase-hero-v--natural .phase-hero-v__wash {
  background:
    linear-gradient(100deg, rgba(0,29,57,0.82) 0%, rgba(0,29,57,0.52) 30%, rgba(0,29,57,0.12) 50%, rgba(0,29,57,0) 72%),
    linear-gradient(180deg, rgba(0,29,57,0) 55%, rgba(0,29,57,0.45) 100%);
}

/* CTA — teal italic on dark */
.phase-root--juniorprep .phase-cta-photo__title em {
  color: var(--ba-teal);
}

/* Day in the life — photo background with navy wash, light strip (matches Preschool) */
.phase-root--juniorprep .phase-section--day {
  background-image:
    linear-gradient(180deg, rgba(0,21,42,0.86) 0%, rgba(0,29,57,0.90) 100%),
    url(../assets/photos/web/jp-curiosity.jpg);
  background-size: cover;
  background-position: center 42%;
}
.phase-root--juniorprep .phase-section--day .eyebrow-txt { color: var(--phase); }
.phase-root--juniorprep .phase-section--day .phase-section__title { color: #fff; }
.phase-root--juniorprep .phase-section--day .phase-section__title em { color: var(--phase); }
.phase-root--juniorprep .phase-section--day .day-rhythm {
  border-top-color: rgba(255,255,255,0.20);
  border-bottom-color: rgba(255,255,255,0.20);
}
.phase-root--juniorprep .phase-section--day .day-rhythm__item { border-left-color: rgba(255,255,255,0.16); }
.phase-root--juniorprep .phase-section--day .day-rhythm__time { color: var(--phase); }
.phase-root--juniorprep .phase-section--day .day-rhythm__body { color: #fff; font-family: var(--font-sans); font-size: 15px; line-height: 1.5; }
.phase-root--juniorprep .phase-section--day .day-rhythm__body em { color: #fff; font-style: normal; }

/* Gallery — italic in title is teal on the dark band */
.phase-root--juniorprep .hs-gallery .phase-section__title em {
  color: var(--ba-teal);
}

/* All accents on this page are teal, not mint — incl. primary buttons */
.phase-root--juniorprep {
  --ba-mint: var(--ba-teal);
  --ba-mint-light: var(--ba-teal);
}
.phase-root--juniorprep .btn-primary { background: var(--ba-teal); color: #fff; }
.phase-root--juniorprep .btn-primary:hover { background: var(--ba-teal-dark); }

/* Aftercare card headline — no italics, no teal (white on the slate card) */
.phase-root--juniorprep .phase-aftercare__headline em { font-style: normal; color: #fff; }

/* Aftercare accents: teal (not the Preschool mint baked into preschool.css) */
.phase-root--juniorprep .phase-aftercare .eyebrow-txt,
.phase-root--juniorprep .phase-aftercare__title em,
.phase-root--juniorprep .phase-aftercare__eyebrow,
.phase-root--juniorprep .phase-section--day .eyebrow-txt,
.phase-root--juniorprep .phase-section--day .phase-section__title em,
.phase-root--juniorprep .phase-section--day .day-rhythm__time,
.phase-root--juniorprep .phase-section--day .day-rhythm__dot { color: var(--ba-teal); }
.phase-root--juniorprep .phase-section--day .day-rhythm__dot { background: var(--ba-teal); }

/* Need to know — values in navy sans, no teal italics */
.phase-root--juniorprep .ntk-def dd { font-family: var(--font-sans); color: var(--ba-navy); }
.phase-root--juniorprep .ntk-def dd em { font-style: normal; color: var(--ba-navy); }
.phase-root--seniorprep .ntk-def dd { font-family: var(--font-sans); color: var(--ba-navy); }
.phase-root--seniorprep .ntk-def dd em { font-style: normal; color: var(--ba-navy); }