/* AI Business Brain — reveal choreography and scroll performance.

   Everything is visible by default: the reveal only takes hold once the page
   has declared itself motion-enabled, so a failed script never hides content.
   Entrances ride the separate `translate` property, which leaves `transform`
   free for the hover lifts and card tilts each component already owns. */

:root { --ease-out: cubic-bezier(.16, 1, .3, 1); }

.reveal { --reveal-y: 30px; --reveal-delay: 0ms; }
.motion-enabled .reveal { transition: opacity .9s var(--ease-out), translate .9s var(--ease-out), filter .8s ease; transition-delay: var(--reveal-delay); }
.motion-enabled .reveal:not(.in-view) { opacity: 0; transform: none; translate: 0 var(--reveal-y); }
.motion-enabled .reveal-text:not(.in-view) { filter: blur(6px); }
.motion-enabled .reveal-rise:not(.in-view) { --reveal-y: 48px; }
.motion-enabled .reveal-side:not(.in-view) { translate: -34px 0; }
.motion-enabled .reveal-scale:not(.in-view) { scale: .96; }
.motion-enabled .reveal-scale { transition: opacity .9s var(--ease-out), translate .9s var(--ease-out), scale 1s var(--ease-out); transition-delay: var(--reveal-delay); }

/* Components that own a `transition` shorthand keep it and gain the entrance. */
.motion-enabled .problem-grid article.reveal { transition: transform .4s, border-color .4s, box-shadow .4s, opacity .9s var(--ease-out), translate .9s var(--ease-out); }
.motion-enabled .process-steps article.reveal { transition: background .5s, border-color .5s, transform .5s, opacity .9s var(--ease-out), translate .9s var(--ease-out); }
.motion-enabled .activation-grid article.reveal { transition: transform .25s, border-color .3s, box-shadow .3s, opacity .9s var(--ease-out), translate .9s var(--ease-out); }
.motion-enabled .catalog details.reveal { transition: background .3s, border-color .3s, opacity .9s var(--ease-out), translate .9s var(--ease-out); }
.motion-enabled .timeline article.reveal { transition: transform .5s, border-color .5s, background .5s, opacity .9s var(--ease-out), translate .9s var(--ease-out); }
.motion-enabled .year-stages > article.reveal { transition: transform .3s, border-color .3s, opacity .9s var(--ease-out), translate .9s var(--ease-out); }
.motion-enabled .portal-window.reveal { transition: box-shadow .4s, opacity 1s var(--ease-out), translate 1s var(--ease-out); }
.motion-enabled .price-card.reveal { transition: transform .5s, opacity .9s var(--ease-out), translate .9s var(--ease-out); }

/* Siblings arrive as a list, capped so the last never waits on the first. */
.reveal-group > .reveal:nth-child(2) { --reveal-delay: 80ms; }
.reveal-group > .reveal:nth-child(3) { --reveal-delay: 160ms; }
.reveal-group > .reveal:nth-child(4) { --reveal-delay: 240ms; }
.reveal-group > .reveal:nth-child(5) { --reveal-delay: 300ms; }
.reveal-group > .reveal:nth-child(n+6) { --reveal-delay: 340ms; }

/* Paused or reduced motion: nothing moves, nothing is hidden. */
.motion-paused .reveal, .motion-paused .reveal-scale { opacity: 1 !important; translate: none !important; scale: none !important; filter: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-scale { opacity: 1 !important; translate: none !important; scale: none !important; filter: none !important; transition: none !important; }
}

/* ---- scroll performance ------------------------------------------------------
   The two progress bars used to animate `width`, which forces layout on every
   scrolled frame; a scale on a full-width bar is a composite-only change. */
.reading-progress span, .scroll-progress > span { width: 100%; transform: scaleX(var(--progress, 0)); transform-origin: 0 50%; will-change: transform; }
/* Frosted surfaces over the animating hero are the dearest pixels on the page; a
   lighter radius keeps the look and roughly halves the blur work per frame. */
.site-header { backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); transition: transform .3s, background .3s, box-shadow .3s; }
.hero-controls { backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); }
.hero-note, .knowledge-tags .tag { backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
/* Sections below the fold neither lay out nor paint against each other. */
main > .section, main > .closing-section, main > .brain-contact { contain: layout paint; }
.brain-visual, .hero-intro, .hero-copy, .hero-note, .orbital-field, .hero-reveal { backface-visibility: hidden; }