/* Motion is progressive enhancement: content remains visible without JS or blur. */
.ux-module-progress { display: none; }
@media (max-width: 767px) {
  .site-header {
    isolation: isolate; background: rgba(7, 25, 43, .88);
    border-bottom-color: rgba(174, 207, 226, .26);
    box-shadow: inset 0 1px rgba(255,255,255,.08), 0 4px 16px rgba(0,12,26,.12);
  }
  .site-header::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: url('assets/mobile/hero-team-960.webp') center top / 100% auto no-repeat; transform: scaleY(-1); filter: blur(7px) saturate(.8); opacity: .36; clip-path: inset(0); }
  .site-header::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: linear-gradient(110deg,rgba(255,255,255,.08),transparent 48%,rgba(255,158,68,.04)); }
  .story-copy { gap: 10px; }
  .story-copy h1 { font-size: clamp(38px,11.6vw,50px); }
  .v3-hero-highlights { gap: 6px; }
  .v3-hero-highlights > div { border-radius: 11px; padding: 9px; border-color: #b7d4e633; background: linear-gradient(125deg,#254962ad,#102d46cf); box-shadow: inset 0 1px #ffffff0c; }
  .v3-hero-highlights > div:not(.v3-hero-career-paths) { border-left: 2px solid #f59b4b; }
  .v3-hero-highlights strong { font-size: 12px; }
  .v3-hero-highlights small { color: #d0e0ec; font-size: 10px; }
  .v3-hero-career-paths strong { color: #ffb56d; font-size: 11px; }
  .v3-hero-career-paths li { font-size: 10px; }
  .story-actions { gap: 8px; }
  .story-actions .button { min-height: 46px; font-size: 12px; border-radius: 10px; padding: 9px 13px; }
  .story-actions .button-orange { background: linear-gradient(115deg,#ff8b18,#f47705); box-shadow: inset 0 1px #ffffff35,0 5px 12px #00000014; }
  .story-actions .button-outline { background: linear-gradient(125deg,#23445a6b,#122b4266); border-color: #adcddd66; }
  .story-actions .button span { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; background: #ffffff16; font-size: 15px; }
  .story-actions .button:active { transform: translateY(1px); }
  .v3-course-state .ux-course-intro { font-size: 12px; line-height: 1.4; margin: 0 0 10px; color: #d3e2ec; }
  .v3-course-state .ux-course-outcome { margin: 10px 0 0; padding: 9px 10px; background: #24465c88; border-left: 2px solid #ffa252; border-radius: 0 8px 8px 0; font-size: 11px; line-height: 1.4; }
  .ux-course-outcome strong { display: block; color: #ffb873; font-size: 10px; margin-bottom: 3px; }
  .ux-module-progress { display: grid; grid-template-columns: repeat(9,1fr); gap: 2px; position: fixed; z-index: 1001; left: 0; right: 0; top: 0; height: 3px; pointer-events: none; }
  .ux-module-progress span { background: #456078; transition: background-color 300ms ease; }
  .ux-module-progress .is-complete { background: #b96928; }
  .ux-module-progress .is-current { background: #ff9a3c; }
  .mobile-detail-mode .ux-module-progress { display: none; }
  .mobile-screen::after { content: ''; position: absolute; z-index: -1; pointer-events: none; inset: 0; background: linear-gradient(#071b3060, transparent 38px, transparent calc(100% - 38px), #071b3060); }
  .is-pinned .v3-state-stack { height: var(--story-stage-height); }
  .is-pinned .v3-state, .is-pinned .v3-state.is-active { position: absolute; top: 0; left: 0; transform: none; transition: opacity 360ms ease, visibility 360ms; }
  .is-pinned .v3-state.is-active { transition-delay: 0s; }
  .is-pinned .v3-scene, .is-pinned .v3-course-photo { opacity: 0; transition: opacity 360ms ease; }
  .is-pinned .v3-state-copy { opacity: 0; transform: translateY(7px); transition: opacity 320ms ease, transform 360ms ease; }
  .is-pinned .is-active .v3-scene, .is-pinned .is-active .v3-course-photo { opacity: 1; }
  .is-pinned .is-active .v3-state-copy { opacity: 1; transform: none; transition-delay: 45ms; }
  .v3-rail button, .v3-rail button > span { transition: color 300ms ease, background-color 300ms ease, border-color 300ms ease; }
  .ux-motion-ready .ux-reveal { transition: opacity 380ms ease var(--ux-delay,0ms), transform 380ms ease var(--ux-delay,0ms); }
  .ux-motion-ready .ux-reveal:not(.is-revealed) { opacity: .01; transform: translateY(10px); }
  .ux-motion-ready .ux-reveal.is-revealed { opacity: 1; transform: none; }
  /* One reveal system coordinates groups; avoid overlapping legacy animations. */
  .v3-career-outcomes.is-visible .v3-career-card, .v3-plan-steps.is-visible .v3-plan-card { animation: none; }
}
@media (max-width: 767px) and (max-height: 700px) {
  .hero.hero-story { padding-top: clamp(135px,calc(68vw - 100px),165px); }
  .story-copy { gap: 5px; }
  .story-copy h1 { font-size: 30px; }
  .v3-hero-highlights > div { padding: 6px 7px; }
  .v3-hero-highlights strong { font-size: 11px; }
  .v3-hero-highlights small { font-size: 9px; margin-top: 3px; }
  .v3-course-state .ux-course-intro { font-size: 10px; margin-bottom: 7px; }
  .v3-course-state .ux-course-outcome { font-size: 9px; padding: 6px 7px; margin-top: 7px; }
  .ux-course-outcome strong { font-size: 9px; margin-bottom: 2px; }
}
@media (prefers-reduced-motion: reduce) {
  .ux-reveal, .ux-motion-ready .ux-reveal:not(.is-revealed) { opacity: 1 !important; transform: none !important; transition: none !important; }
  .ux-module-progress span { transition: none; }
}
