/* AERIS motion, 2026-10-25. Final layout remains the approved v2 design. */
:root {
  --am-ease: cubic-bezier(.16,1,.3,1);
  --am-soft: cubic-bezier(.22,.61,.36,1);
}
.hero__photo { animation-duration: 26s; }
/* A tall desktop preview keeps the face inside the photo's visible area. */
@media (min-width:1001px) and (max-aspect-ratio:6/5) {
  .hero__photo { object-position:72% 45%; }
}
.hero__progress span { animation-duration: 52s; }
.hero__line > span { animation-duration: 1.15s; animation-timing-function: var(--am-ease); }
.hero__line--offset > span { animation-delay: .39s; }
.hero__message { animation-duration: 1s; animation-delay: .68s; }
.hero__signature { animation-duration: 1.35s; animation-delay: .65s; }
.panel[open] { animation-duration: .55s; animation-timing-function: var(--am-ease); }

/* Elements are visible by default. JS only prepares offscreen entries. */
.am-ready { opacity: 0; }
.am-line { position: relative; border-top-color: transparent !important; }
.am-line::after {
  content: "";
  position: absolute;
  top: -1px; left: 0; width: 100%; height: 1px;
  background: var(--aeris-rule);
  transform: scaleX(1); transform-origin: left;
}
.careers .am-line::after { background: rgba(255,255,255,.35); }
.motion-enabled .am-line::after { transition: transform 950ms var(--am-ease); }
.motion-enabled .am-line:not(.am-seen)::after { transform: scaleX(0); }
.motion-enabled .process li::after { transform-origin: top; transition: transform 900ms var(--am-soft); }
.motion-enabled .process li:not(.am-seen)::after { transform: scaleY(0); }
.person__photo img { transition: transform 850ms var(--am-ease); }
.person__arrow { transition: color 260ms ease, background 260ms ease, border-color 260ms ease; }
.person__arrow .icon { transition: transform 420ms var(--am-ease); }
.closing__link .icon, .header__entry .icon, .story-link .icon { transition: transform 420ms var(--am-ease); }
@media (hover:hover) and (pointer:fine) {
  .person:hover .person__photo img { transform: scale(1.035); }
  .person:hover .person__arrow .icon { transform: translate(3px,-3px); }
  .closing__link:hover .icon, .header__entry:hover .icon { transform: translate(4px,-4px); }
}
.person:focus-visible .person__arrow .icon { transform: translate(3px,-3px); }
.closing__link:focus-visible .icon, .header__entry:focus-visible .icon { transform: translate(4px,-4px); }
.closing__link:active > span:first-child, .header__entry:active > span:first-child { transform: translateY(1px); }

/* Explicit static view also makes a stable QA and comparison destination. */
html[data-motion="off"] { scroll-behavior: auto; }
html[data-motion="off"] .hero__photo,
html[data-motion="off"] .hero__line > span,
html[data-motion="off"] .hero__message,
html[data-motion="off"] .hero__signature,
html[data-motion="off"] .hero__progress span,
html[data-motion="off"] .header,
html[data-motion="off"] .eyebrow,
html[data-motion="off"] .hero__bottom,
html[data-motion="off"] .panel { animation: none !important; }
html[data-motion="off"] .hero__signature { opacity: .9; transform: none; clip-path: none; }
html[data-motion="off"] .am-ready { opacity: 1; }
html[data-motion="off"] .am-line::after,
html[data-motion="off"] .process li::after { transform: none; transition: none; }
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  .am-ready { opacity: 1; }
  .am-line::after, .process li::after { transform: none !important; transition: none !important; }
  .person__photo img, .person__arrow .icon, .closing__link .icon, .header__entry .icon, .story-link .icon { transform: none !important; transition: none !important; }
}
