/* Hero only: one fixed photograph, separate light layers, no body animations. */
.has-motion .hero-photo img{--hero-motion:heroReveal 1.4s cubic-bezier(.22,.8,.24,1) .05s both;animation:var(--hero-motion)}
.has-motion .hero-frame{--hero-motion:heroDrift 14s cubic-bezier(.38,.08,.35,1) 1.4s infinite alternate;transform-origin:50% 20%;animation:var(--hero-motion)}
@keyframes heroReveal{from{opacity:0;clip-path:inset(0 0 12% 0);translate:0 1.2%}to{opacity:1;clip-path:inset(0);translate:0 0}}
@keyframes heroDrift{from{transform:scale(1)}to{transform:scale(1.065) translate3d(-.25%,-.2%,0)}}

.has-motion .hero-light{--hero-motion:lightIn 1.4s ease .3s both,lightDrift 12s ease-in-out 1.7s infinite alternate;animation:var(--hero-motion)}
.hero-light::before{content:"";position:absolute;inset:-8%;pointer-events:none;opacity:0;background:radial-gradient(ellipse 4% 6% at 8% 72%,rgba(237,187,127,.38),transparent 78%),radial-gradient(ellipse 3% 5% at 93% 22%,rgba(229,175,191,.23),transparent 80%),radial-gradient(ellipse 8% 9% at 90% 82%,rgba(102,158,211,.18),transparent 80%)}
.has-motion .hero-light::before{--hero-motion:cornerBokeh 16s ease-in-out .4s infinite alternate;animation:var(--hero-motion)}
.has-motion .hero-glow{--hero-motion:glowIn 1.5s ease .2s both,glowBreath 13s ease-in-out 1.7s infinite alternate;animation:var(--hero-motion)}
@keyframes lightIn{from{opacity:.2}to{opacity:.75}}
@keyframes lightDrift{from{transform:translate3d(-1%,1%,0);opacity:.65}to{transform:translate3d(2%,-2%,0);opacity:.95}}
@keyframes cornerBokeh{from{opacity:.35;transform:translate3d(-1%,2%,0)}to{opacity:.8;transform:translate3d(2%,-2%,0)}}
@keyframes glowIn{from{opacity:.2}to{opacity:1}}
@keyframes glowBreath{from{opacity:1}to{opacity:.65}}

.has-motion .ln>span{--hero-motion:lineUp 1.1s var(--ease) calc(.35s + var(--k,0)*.15s) both;animation:var(--hero-motion)}
.has-motion .ln2>span{--k:1}
.has-motion .hero-in:not(.hero-pause){--hero-motion:fadeUp .9s var(--ease) calc(.9s + var(--i,0)*.12s) both;animation:var(--hero-motion)}
.has-motion .kicker.hero-in{--hero-motion:fadeUp .8s var(--ease) .2s both}
@keyframes lineUp{from{transform:translateY(112%)}to{transform:none}}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
/* The control stays immediately available, even with reduced motion. */
.hero-pause{animation:none!important;opacity:1;transform:none}

@media(max-width:900px){
  .has-motion .hero-frame{--hero-motion:heroDriftMobile 14s cubic-bezier(.38,.08,.35,1) 1.4s infinite alternate}
  @keyframes heroDriftMobile{from{transform:scale(1)}to{transform:scale(1.04) translate3d(-.15%,-.1%,0)}}
  .hero-light::before{background:radial-gradient(ellipse 5% 7% at 5% 76%,rgba(237,187,127,.32),transparent 80%),radial-gradient(ellipse 5% 5% at 94% 24%,rgba(229,175,191,.2),transparent 80%)}
}
@media(prefers-reduced-motion:reduce){
  :root:not(.motion-user-enabled) .hero-frame,
  :root:not(.motion-user-enabled) .hero-light,
  :root:not(.motion-user-enabled) .hero-glow,
  :root:not(.motion-user-enabled) .hero-photo img,
  :root:not(.motion-user-enabled) .ln>span,
  :root:not(.motion-user-enabled) .hero-in{animation:none!important;transform:none!important;translate:none!important;scale:none!important;opacity:revert!important;clip-path:none!important}
  :root:not(.motion-user-enabled) .hero-light{opacity:.6!important}
  :root:not(.motion-user-enabled) .hero-light::before{animation:none!important;opacity:0!important}
  /* Explicit session-only opt-in overrides global animation:none only here.
     All motion outside these named hero effects remains reduced. */
  :root.has-motion.motion-user-enabled .hero .hero-frame,
  :root.has-motion.motion-user-enabled .hero .hero-photo img,
  :root.has-motion.motion-user-enabled .hero .hero-light,
  :root.has-motion.motion-user-enabled .hero .hero-light::before,
  :root.has-motion.motion-user-enabled .hero .hero-glow,
  :root.has-motion.motion-user-enabled .hero .ln>span,
  :root.has-motion.motion-user-enabled .hero .hero-in:not(.hero-pause){animation:var(--hero-motion)!important}
}
/* Last in the cascade, with matching specificity for reduced-motion opt-in.
   Finite entrances also stop when the tab/hero is not visible. */
:root.has-motion .hero.is-paused .hero-frame,
:root.has-motion .hero.is-paused .hero-photo img,
:root.has-motion .hero.is-paused .hero-light,
:root.has-motion .hero.is-paused .hero-light::before,
:root.has-motion .hero.is-paused .hero-glow,
:root.has-motion .hero.is-paused .ln>span,
:root.has-motion .hero.is-paused .hero-in:not(.hero-pause){animation-play-state:paused!important}
