/* Runtime motion + hero centering fix. Loaded last on core company pages. */

/* Round 1: exact hero centering across company pages. */
.hero > .wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
}
.hero .eyebrow{
  width:100%;
  justify-content:center!important;
  text-align:center!important;
  margin-left:auto;
  margin-right:auto;
}
.hero .eyebrow::before{display:none!important}
.hero .display,
.hero .lede{
  text-align:center!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.hero-mark{margin-left:auto!important;margin-right:auto!important}

/* Round 2: polished visible motion when motion is allowed. */
.hero .display em{animation:finalAccentBreath 7.2s ease-in-out 1.1s infinite}
@keyframes finalAccentBreath{
  0%,100%{transform:translate3d(0,0,0);text-shadow:0 0 0 transparent}
  50%{transform:translate3d(0,-2px,0);text-shadow:0 0 22px color-mix(in srgb,var(--lavender) 24%,transparent)}
}

/* Round 3: explicit site setting “Reduce motion: Off” must override OS Reduce Motion. */
html[data-motion=no] .home-hero::before{animation:finalGlow 8.5s var(--motion-gentle) infinite alternate!important}
html[data-motion=no] .home-ambient span{animation:homeDrift 24s linear infinite!important}
html[data-motion=no] .home-mark{animation:finalMarkIn .68s var(--motion-emphasized) both,finalMarkFloat 6.4s ease-in-out .8s infinite!important}
html[data-motion=no] .home-wordmark{animation:finalWordmarkFloat 8.2s ease-in-out 1.05s infinite!important}
html[data-motion=no] .home-wordmark span:first-child{animation:finalWordLeft .74s var(--motion-emphasized) .06s both!important}
html[data-motion=no] .home-wordmark em{animation:finalWordRight .82s var(--motion-emphasized) .14s both!important}
html[data-motion=no] .home-tagline{animation:finalRise .68s var(--motion-emphasized) .24s both!important}
html[data-motion=no] .home-actions{animation:finalRise .68s var(--motion-emphasized) .32s both!important}
html[data-motion=no] .home-proof{animation:finalRise .68s var(--motion-emphasized) .40s both!important}

html[data-motion=no] .hero::before{animation:finalGlow 8.5s var(--motion-gentle) infinite alternate!important}
html[data-motion=no] .hero .eyebrow{animation:finalRise .58s var(--motion-emphasized) .04s both!important;opacity:1!important}
html[data-motion=no] .hero .display span:first-child{animation:finalHeroLineOne .72s var(--motion-emphasized) .10s both!important;opacity:1!important}
html[data-motion=no] .hero .display span:nth-child(2){animation:finalHeroLineTwo .78s var(--motion-emphasized) .17s both!important;opacity:1!important}
html[data-motion=no] .hero .display em{animation:finalAccentBreath 7.2s ease-in-out 1.1s infinite!important}
html[data-motion=no] .hero .lede{animation:finalRise .66s var(--motion-emphasized) .28s both!important;opacity:1!important}
html[data-motion=no] .hero-mark{animation:finalMarkIn .68s var(--motion-emphasized) .06s both,finalMarkFloat 6.4s ease-in-out .8s infinite!important;opacity:1!important}

/* Re-enable scroll reveals when the site preference explicitly allows motion. */
html[data-motion=no] .section .reveal{
  opacity:0!important;
  transform:translate3d(0,14px,0)!important;
  filter:none!important;
  transition:opacity .62s var(--motion-emphasized),transform .62s var(--motion-emphasized)!important;
}
html[data-motion=no] .section .reveal.in{
  opacity:1!important;
  transform:none!important;
}
html[data-motion=no] .section .stagger > *{
  opacity:0!important;
  transform:translate3d(0,14px,0)!important;
  animation:none!important;
  transition:opacity .58s var(--motion-emphasized),transform .58s var(--motion-emphasized)!important;
}
html[data-motion=no] .section .stagger.in > *{opacity:1!important;transform:none!important}
html[data-motion=no] .section .stagger.in > :nth-child(1){transition-delay:.04s!important}
html[data-motion=no] .section .stagger.in > :nth-child(2){transition-delay:.10s!important}
html[data-motion=no] .section .stagger.in > :nth-child(3){transition-delay:.16s!important}
html[data-motion=no] .section .stagger.in > :nth-child(4){transition-delay:.22s!important}

/* Round 4: reduced motion still wins when the user asks for it. */
html[data-motion=reduce] .hero .display em{animation:none!important;transform:none!important;text-shadow:none!important}
@media (prefers-reduced-motion:reduce){
  :root:not([data-motion=no]) .hero .display em{animation:none!important;transform:none!important;text-shadow:none!important}
}

@media (max-width:560px){
  .hero > .wrap{padding-left:20px;padding-right:20px}
  .hero .lede{max-width:34ch}
  html[data-motion=no] .home-ambient span{animation-duration:28s!important}
}
