/* Precision motion: small, finite effects on independent rendering layers. */
:root {
  --ease-enter: cubic-bezier(.22, 1, .36, 1);
}

/* The portrait crops independently of the card, caption and carousel tilt. */
#hero-carousel-host .hc-photo { overflow: hidden; }

@keyframes fp-hero-enter {
  from { opacity: 0; transform: translate3d(0, 8px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}
@keyframes fp-portrait-depth {
  from { translate: 0 -10px; }
  to { translate: 0 10px; }
}
@keyframes fp-dialog-enter {
  from { opacity: .85; translate: 0 6px; }
  to { opacity: 1; translate: 0 0; }
}

@media (prefers-reduced-motion: no-preference) {
  .hero-copy > .eyebrow,
  .hero-copy > h1,
  .hero-copy > .hero-description,
  .hero-copy > .hero-actions,
  .hero-copy > .hero-offer-note {
    animation: fp-hero-enter 380ms var(--ease-enter) backwards;
  }
  .hero-copy > h1 {
    animation-delay: 40ms;
  }
  .hero-copy > .hero-description { animation-delay: 80ms; }
  .hero-copy > .hero-actions {
    animation-delay: 120ms;
  }
  .hero-copy > .hero-offer-note { animation-delay: 120ms; }

  .lead-dialog[open] { animation: fp-dialog-enter 180ms var(--ease-enter); }
  .lead-dialog:has(:focus-visible) { animation: none; }
}

@media (min-width: 1024px) and (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .header .header-demo {
    transition: transform 160ms var(--ease-enter), color 150ms var(--ease-ui), border-color 150ms var(--ease-ui), background-color 150ms var(--ease-ui);
  }
  .hero-actions .button-primary {
    transition: transform 160ms var(--ease-enter), background-color 150ms var(--ease-ui);
  }
  .header .header-demo:hover,
  .hero-actions .button-primary:hover { transform: translateY(-2px); }
  .header .header-demo:active,
  .hero-actions .button-primary:active { transform: translateY(0); }
  .hero-actions .button-primary:hover > span { transform: translateX(2px); }

  #hero-carousel-host .hc-photo img,
  .team-carousel-photo img {
    transform-origin: 50% 45%;
    transition: transform 320ms var(--ease-ui);
  }
  #hero-carousel-host .hc-slide:hover .hc-photo img,
  .team-carousel-photo:hover img { transform: scale(1.015); }

  /* Native scroll timeline; unsupported browsers keep a static portrait.
     Only the visual strip moves. Controls and slide transforms stay intact. */
  @supports (animation-timeline: view()) {
    .hero { view-timeline: --fp-hero-scroll block; }
    #hero-carousel-host .hc-track {
      animation: fp-portrait-depth 1s linear both;
      animation-timeline: --fp-hero-scroll;
      animation-range: cover 0% cover 100%;
    }
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-copy > .eyebrow,
  .hero-copy > h1,
  .hero-copy > .hero-description,
  .hero-copy > .hero-actions,
  .hero-copy > .hero-offer-note,
  #hero-carousel-host .hc-track,
  .lead-dialog[open] { animation: none; }
  #hero-carousel-host .hc-track { translate: none; }
  #hero-carousel-host .hc-photo img,
  .team-carousel-photo img,
  .header .header-demo,
  .hero-actions .button-primary { transform: none; }
}