/* Media playback, cinematic entrances, and scroll-led visual depth. */
.header:after{content:'';position:absolute;left:0;right:0;bottom:0;z-index:1;height:1px;background:var(--gold);opacity:.15;transform:scaleX(var(--reading-progress,0));transform-origin:left center;pointer-events:none}
.architecture-depth{position:absolute;inset:-6%;transform:translate3d(0,var(--scene-offset,0px),0)}
.steps{position:relative}
.steps:before,.steps:after{content:'';position:absolute;left:-18px;top:22px;bottom:20px;width:2px;border-radius:2px;pointer-events:none}
.steps:before{background:#dce1e4}
.steps:after{background:var(--gold);transform:scaleY(var(--steps-progress,0));transform-origin:top}
.hero-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.film-enhanced .hero-film{opacity:0;transition:opacity .7s ease}
.film-enhanced.is-film-ready .hero-film{opacity:1}
.motion-toggle{position:absolute;top:22px;right:22px;z-index:2;display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:10px 15px;border:1px solid rgba(237,221,187,.65);border-radius:9px;background:rgba(16,38,56,.88);color:#fff;font:14px/1.2 var(--sans);cursor:pointer;transition:background .2s,border-color .2s}
.motion-toggle{width:44px;height:44px;padding:0;gap:0;justify-content:center;border-radius:50%}.motion-toggle .motion-label{display:none}
.motion-toggle[hidden]{display:none}.motion-toggle:hover{background:var(--navy);border-color:#dec797}.motion-toggle:focus-visible{outline:3px solid #dec797;outline-offset:4px}.motion-symbol{display:block;width:10px;height:12px;border-left:3px solid currentColor;border-right:3px solid currentColor}.motion-toggle[data-paused="true"] .motion-symbol{width:0;height:0;border:6px solid transparent;border-right:0;border-left:10px solid currentColor}
@media(prefers-reduced-motion:no-preference){
  .hero-copy>.eyebrow{animation:kla-entrance .8s .05s both}
  .hero-copy>h1{animation:kla-entrance 1s .12s both}
  .hero-copy>.hero-subtitle{animation:kla-entrance 1s .2s both}
  .hero-copy>.hero-description{animation:kla-entrance 1s .28s both}
  .hero-actions{animation:kla-entrance 1s .36s backwards}
  .architecture-visual.is-photo-ready .architecture-image{animation:kla-building-pan 16s linear infinite alternate;transform-origin:50% 42%}
  .architecture-visual.is-photo-paused .architecture-image{animation-play-state:paused}
}
@keyframes kla-entrance{from{opacity:0;transform:translate3d(0,15px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
@keyframes kla-building-pan{from{transform:scale(1.02) translate3d(0,0,0)}to{transform:scale(1.16) translate3d(-1.2%,.8%,0)}}
@media(max-width:600px){.motion-toggle{top:16px;right:16px;font-size:14px}.steps:before,.steps:after{left:-10px}}
@media(prefers-reduced-motion:reduce){.hero-film{transition:none!important}.architecture-image{animation:none!important;transform:none!important}.architecture-depth{transform:none}.photo-motion-toggle{display:none}}
