/* Second chapter only: an animated blue title scene followed by pale blue steps. */
.learning-introduction.wrap { padding: 0; background: var(--chapter-pale); position: relative; }
.learning-introduction .journey-next {
  display: flex; flex-direction: column; justify-content: center; align-items: stretch;
  gap: 0; padding: 124px max(var(--rhythm-gutter), calc((100% - var(--rhythm-width)) / 2)) 72px;
  isolation: isolate;
}
.learning-intro-backdrop { position: absolute; inset: 0; z-index: -1; background: var(--chapter-pale); pointer-events: none; }
.learning-intro-copy { width: 100%; max-width: 1120px; margin: auto; }
.learning-introduction .family-eyebrow { display: block; font-size: 13px; margin: 0 0 24px; color: var(--blue); }
.learning-introduction .journey-next h2 { font-size: clamp(52px, 6.3vw, 90px); line-height: 1.04; letter-spacing: -.05em; }
.learning-introduction .journey-title-line { display: block; }
.learning-introduction .journey-title-last { padding-left: 15%; }
.learning-introduction .journey-next-bottom { padding-left: 15%; margin-top: 28px; }
.learning-introduction .journey-next-bottom p { max-width: 48ch; }
.learning.wrap { background: var(--chapter-pale); position: relative; }
.learning-introduction.has-learning-reveal { --learning-title-height: min(84svh, 740px); height: calc(var(--learning-title-height) + 20svh); }
.has-learning-reveal .journey-next { position: sticky; top: 0; height: var(--learning-title-height); min-height: 0; padding-block: 136px 64px; }
/* Keep adjacent sections in normal flow: the step surface must never mask text. */
.has-learning-reveal + .learning { margin-top: 0; }
.has-learning-reveal .learning-intro-backdrop { will-change: opacity; }
.has-learning-reveal .learning-intro-copy { margin: 0 auto auto; will-change: transform, opacity; }
.learning-introduction:not(.has-learning-reveal) :is(.learning-intro-copy, .learning-intro-backdrop, .journey-title-line, .family-eyebrow, .journey-next-bottom) {
  opacity: 1 !important; transform: none !important;
}
@media (max-width: 760px) {
  .learning-introduction .journey-next { padding-block: 108px 52px; }
  .learning-introduction .journey-next h2 { max-width: none; font-size: clamp(35px, 9.4vw, 60px); }
  .learning-introduction .journey-title-last { padding-left: 0; }
  .learning-introduction .journey-next-bottom { padding-left: 0; margin-top: 24px; }
  .learning-introduction .family-eyebrow { margin-bottom: 20px; }
  .learning-introduction.has-learning-reveal { --learning-title-height: min(76svh, 620px); }
  .has-learning-reveal .journey-next { padding-block: 108px 64px; }
}
@media (max-height: 600px) and (min-width: 761px) {
  .learning-introduction .journey-next h2 { font-size: 48px; }
  .learning-introduction .journey-next-bottom { margin-top: 20px; }
  .learning-introduction .family-eyebrow { margin-bottom: 16px; }
}