/* Animation-only additions for the preserved-preview copy.
   Existing colors, typography, backgrounds, dimensions and layout are untouched. */
body.scroll-effects-enabled #main > :not(.hero) .reveal {
  transition-duration: .8s;
  transition-timing-function: cubic-bezier(.2,.7,.2,1);
}
body.scroll-effects-enabled #main > :not(.hero) .reveal:not(.in) {
  transform: translate3d(0,22px,0);
}
body.scroll-effects-enabled #main > :not(.hero) .reveal.in { transform: none; }
body.scroll-effects-enabled .mv-card:nth-child(2) { transition-delay: .12s; }
/* A quiet lift, Azure edge and icon glow give both statement cards depth.
   Individual translate/scale leave scroll reveals and upright glyphs intact. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  body.scroll-effects-enabled #main #mission .mv-card.reveal {
    transition: opacity .8s cubic-bezier(.2,.7,.2,1),
      transform .8s cubic-bezier(.2,.7,.2,1),
      translate .36s cubic-bezier(.2,.7,.2,1),
      box-shadow .36s ease, border-color .36s ease;
    transition-delay: 0s;
  }
  body.scroll-effects-enabled #mission .mv-icon {
    transition: scale .36s cubic-bezier(.2,.7,.2,1), filter .36s ease;
    transform-origin: center;
  }
  body.scroll-effects-enabled:not(.scroll-effects-paused) #mission .mv-card.in:hover {
    translate: 0 -6px;
    border-color: rgba(0,128,255,.55);
    box-shadow: 0 18px 38px -20px rgba(0,29,66,.32), 0 0 26px -12px rgba(0,128,255,.32);
  }
  body.scroll-effects-enabled:not(.scroll-effects-paused) #mission .mv-card.in:hover .mv-icon {
    scale: 1.08;
    filter: drop-shadow(0 0 7px rgba(0,128,255,.36));
  }
  body.scroll-effects-paused #mission .mv-icon { transition: none; }
}
body.scroll-effects-enabled .scroll-effect-reveal {
  opacity: 1;
  translate: 0 0;
  transition: opacity .8s cubic-bezier(.2,.7,.2,1), translate .8s cubic-bezier(.2,.7,.2,1);
  transition-delay: var(--scroll-reveal-delay,0ms);
}
body.scroll-effects-enabled .scroll-effect-reveal[data-scroll-pending] {
  opacity: 0;
  translate: 0 22px;
}
/* Keep the interactive diagram's coordinate system unchanged during its fade. */
body.scroll-effects-enabled .scroll-effect-reveal[data-scroll-fade] { translate: none; }
body.scroll-effects-enabled .scroll-media-depth {
  translate: 0 var(--scroll-depth-y,0px);
  scale: 1.055;
}
/* The replacement clip fills the same frame as the original transition image. */
.transition-media video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center;
}

/* This is a new control only; these declarations do not restyle existing UI. */
.scroll-effects-control {
  position: fixed; z-index: 950; left: 18px; bottom: 18px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 10px 14px;
  border: 1px solid #d9dce1; border-radius: 999px;
  background: rgba(255,255,255,.96); color: #31353b;
  font: 12px/1.2 var(--body, sans-serif); cursor: pointer;
  box-shadow: 0 4px 20px rgba(0,0,0,.08);
}
.scroll-effects-control svg { width: 13px; height: 13px; fill: currentColor; }
.scroll-effects-control:focus-visible { outline: 2px solid var(--azure,#0080ff); outline-offset: 3px; }
.scroll-effects-control:disabled { cursor: default; }
body.menu-open .scroll-effects-control { visibility: hidden; }
@media(max-width:720px) {
  .scroll-effects-control { left: 10px; bottom: calc(88px + env(safe-area-inset-bottom)); }
}

/* A paused page must remain fully readable, including a newly selected card. */
html[data-scroll-effects='paused'] { scroll-behavior: auto; }
body.scroll-effects-paused #main > :not(.hero) *,
body.scroll-effects-paused #main > :not(.hero) *::before,
body.scroll-effects-paused #main > :not(.hero) *::after,
body.scroll-effects-paused footer *,
body.scroll-effects-paused footer *::before,
body.scroll-effects-paused footer *::after { animation-play-state: paused !important; }
/* Pause pre-existing decorative loops outside the post-hero scope too, without
   freezing the hero's entrance animation or hiding its text and CTA. */
body.scroll-effects-paused .btn .spark,
body.scroll-effects-paused .head-track::after,
body.scroll-effects-paused .scroll-cue .mi { animation-play-state: paused !important; }
body.scroll-effects-paused #main > :not(.hero) .reveal,
body.scroll-effects-paused .scroll-effect-reveal {
  opacity: 1 !important; transform: none !important; translate: none !important; transition: none !important;
}
body.scroll-effects-paused .sec-head :is(.spark-i,.eyebrow,.slug) { opacity: 1; transform: none; transition: none; }
body.scroll-effects-paused :is(.sec-head,.break-c) .rule { transform: scaleX(1); transition: none; }
body.scroll-effects-paused .scroll-media-depth { translate: none; scale: 1; }
body.scroll-effects-paused .ppanel:not([hidden]) { animation: none !important; opacity: 1; transform: none; }
body.scroll-effects-paused .foot-aura { opacity: 0; }
@media(prefers-reduced-motion:reduce) {
  body.scroll-effects-enabled #main > :not(.hero) .reveal,
  body.scroll-effects-enabled .scroll-effect-reveal { opacity: 1; transform: none; translate: none; transition: none; }
  body.scroll-effects-enabled .scroll-media-depth { translate: none; scale: 1; }
}
@media print {
  .scroll-effects-control { display: none; }
  body.scroll-effects-enabled .scroll-effect-reveal { opacity: 1; translate: none; }
  body.scroll-effects-enabled .scroll-media-depth { translate: none; scale: 1; }
}