@media (prefers-reduced-motion: no-preference) {
  [data-aos].aos-init {
    opacity: 0;
    translate: var(--entrance-x, 0) var(--entrance-y, 1.125rem);
    scale: var(--entrance-scale, none);
  }

  [data-aos="zoom-in"].aos-init {
    --entrance-scale: .96;
    --entrance-y: 0;
  }

  @media (min-width: 800px) {
    [data-aos="fade-left"].aos-init { --entrance-x: 1.125rem; --entrance-y: 0; }
    [data-aos="fade-right"].aos-init { --entrance-x: -1.125rem; --entrance-y: 0; }
  }

  [data-aos].aos-init:is(.aos-animate, :focus-within) {
    opacity: 1;
    translate: none;
    scale: none;
  }

  [data-aos].aos-init.aos-animate {
    transition-property: opacity, translate, scale;
    transition-duration: 600ms;
    transition-delay: var(--entrance-delay, 0ms);
    transition-timing-function: cubic-bezier(.22, 1, .36, 1);
  }

  [data-aos].aos-init:focus-within { transition-property: none; }

  :is(.hero-banner #big_headline, .subpage-hero__copy) {
    animation: content-enter 560ms cubic-bezier(.22, 1, .36, 1) both;
  }

  :is(.home-outcomes-nav, .subpage-hero__media, .subpage-hero__inner > .subpage-proof) {
    animation: content-enter 700ms cubic-bezier(.22, 1, .36, 1) 100ms both;
  }

  :is(.home-outcomes-nav, .subpage-hero__copy):focus-within { animation: none; }

  .subpage-hero::after {
    position: absolute;
    z-index: -1;
    inset: -18%;
    background: radial-gradient(ellipse at 68% 32%, #fff50032, transparent 52%);
    pointer-events: none;
    content: "";
    animation: hero-light 1.45s cubic-bezier(.2, .7, .3, 1) both;
  }

  .subpage-hero__frame img {
    animation: image-settle 950ms cubic-bezier(.22, 1, .36, 1) both;
  }

  .subpage-split__media.aos-init img { scale: 1.055; }

  .subpage-split__media.aos-init.aos-animate img {
    scale: 1;
    transition: scale 850ms cubic-bezier(.22, 1, .36, 1);
  }

  .subpage-workflow details[open] .subpage-workflow__body,
  .subpage-faq .accordion-question[aria-expanded="true"] + .subpage-faq__answer p {
    animation: detail-enter 280ms ease-out both;
  }

  :is(.subpage-button, .subpage-link)::after,
  :is(.home-outcomes-nav a, .home-outcomes__result a, .home-outcomes__action) span {
    transition: translate 200ms ease-out;
  }

  :is(.subpage-button, .subpage-link):is(:hover, :focus-visible)::after,
  :is(.home-outcomes__result a, .home-outcomes__action):is(:hover, :focus-visible) span {
    translate: 3px 0;
  }

  .home-outcomes-nav a:is(:hover, :focus-visible) span,
  .subpage-button--down:is(:hover, :focus-visible)::after {
    translate: 0 3px;
  }

  @media (hover: hover) and (pointer: fine) {
    :is(.subpage-feature, .home-outcomes__result)[data-aos].aos-init.aos-animate:not(:focus-within) {
      transition-property: opacity, translate, scale, border-color;
    }

    :is(.subpage-feature:has(a), .home-outcomes__result):hover { border-color: #fff50085; }

    .subpage-card {
      transition: border-color 200ms ease, background 200ms ease, translate 230ms ease-out;
    }

    .subpage-card:hover { translate: 0 -4px; }
  }
}

@keyframes content-enter {
  from { opacity: .25; translate: 0 1.125rem; }
  to { opacity: 1; translate: none; }
}

@keyframes hero-light {
  from { opacity: 0; transform: translate(14%, -9%) scale(.9); }
  to { opacity: .62; transform: none; }
}

@keyframes image-settle {
  from { scale: 1.05; }
  to { scale: 1; }
}

@keyframes detail-enter {
  from { opacity: .3; translate: 0 .3rem; }
  to { opacity: 1; translate: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }

  [data-aos].aos-init {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }

  .subpage-card:hover img { transform: none; }
}