/* One opening rhythm across all pages, independent of page-specific hero styles. */
body {
  /* Light section colours belong to sections, never the canvas beneath the fade. */
  background-color: #091B14 !important;
  animation: none !important;
}

main {
  animation: ke-page-open 850ms cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes ke-page-open {
  from { opacity: 0.12; }
  to { opacity: 1; }
}

/* The shared fade replaces the property's delayed, overlapping rise animations. */
main .hero .eyebrow,
main .hero h1,
main .hero-price,
main .hero-meta,
main .hero-actions {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

/* First-screen content opens together; scroll reveals keep the same short rhythm. */
main > section:first-child .reveal {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}

main .reveal {
  transition-duration: 550ms;
  transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

/* Keep the outgoing document on screen until its replacement can paint.
   The handoff itself is immediate; only main runs the approved opening fade. */
@view-transition { navigation: auto; }
::view-transition { background: #091B14; }
::view-transition-group(root),
::view-transition-old(root),
::view-transition-new(root) { animation: none !important; }
::view-transition-old(root) { display: none; }
::view-transition-new(root) { mix-blend-mode: normal; }

@media (prefers-reduced-motion: reduce) {
  main { animation: none !important; opacity: 1; }
  main .reveal { transition: none !important; }
}