/* Motion enhances the existing markup; no pending/offscreen rule hides content. */
:root {
  --motion-ease: cubic-bezier(.22, .61, .36, 1);
  --motion-short: 260ms;
  --motion-medium: 480ms;
}

@media (prefers-reduced-motion: no-preference) {
  .site-header,
  #header {
    transition: background-color var(--motion-medium), color var(--motion-medium),
      border-color var(--motion-medium), padding var(--motion-medium) var(--motion-ease);
  }

  .small-cta,
  .newsletter-submit,
  .text-link,
  .header-inquire,
  .submit-button,
  .map-load,
  .video-control,
  .cookie-secondary,
  .dialog-close,
  .cookie-close,
  .lightbox-bottom button {
    transition: color var(--motion-short), background-color var(--motion-short),
      border-color var(--motion-short), opacity var(--motion-short),
      translate var(--motion-short) var(--motion-ease);
  }

  .text-link > span:last-child:not(:first-child),
  .header-inquire > span:last-child:not(:first-child),
  .submit-button > span:last-child:not(:first-child),
  .map-load > span:last-child:not(:first-child) {
    display: inline-block;
    transition: translate var(--motion-short) var(--motion-ease);
  }

  .text-link:focus-visible > span:last-child:not(:first-child),
  .header-inquire:focus-visible > span:last-child:not(:first-child),
  .submit-button:focus-visible > span:last-child:not(:first-child) {
    translate: 2px -2px;
  }

  .menu-toggle span {
    transition: transform 320ms var(--motion-ease), opacity var(--motion-short);
  }

  #mobile-menu:not([hidden]) nav > * {
    animation: atma-menu-entry 400ms var(--motion-ease) both;
  }
  #mobile-menu:not([hidden]) nav > :nth-child(2) { animation-delay: 35ms; }
  #mobile-menu:not([hidden]) nav > :nth-child(3) { animation-delay: 70ms; }
  #mobile-menu:not([hidden]) nav > :nth-child(4) { animation-delay: 105ms; }
  #mobile-menu:not([hidden]) nav > :nth-child(n + 5) { animation-delay: 140ms; }

  dialog[open]::backdrop {
    animation: atma-backdrop-entry 240ms ease-out both;
  }
  dialog[open] > :not(.dialog-close):not(.cookie-close) {
    animation: atma-panel-entry 300ms var(--motion-ease) both;
  }

  .field input,
  .field textarea,
  .field select,
  .field label,
  .consent-label,
  .form-status,
  .cookie-option {
    transition: border-color var(--motion-short), color var(--motion-short),
      background-color var(--motion-short), opacity var(--motion-short);
  }
  .field:focus-within label { opacity: 1; }

  .visual-zoom img,
  .multi-landscape img,
  .multi-portrait img,
  img[data-motion="media"] {
    transition: scale 850ms var(--motion-ease), filter var(--motion-medium);
  }
  .wordmark,
  .footer-partnership,
  .footer-atma,
  .footer-corporate,
  .official-social a,
  .official-resources a {
    transition: opacity var(--motion-short), color var(--motion-short);
  }

  @media (hover: hover) and (pointer: fine) {
    .text-link:hover > span:last-child:not(:first-child),
    .header-inquire:hover > span:last-child:not(:first-child),
    .submit-button:enabled:hover > span:last-child:not(:first-child),
    .map-load:enabled:hover > span:last-child:not(:first-child) { translate: 3px -3px; }
    .small-cta:hover,
    .newsletter-submit:enabled:hover,
    .header-inquire:hover,
    .submit-button:enabled:hover,
    .cookie-secondary:hover { translate: 0 -1px; }
    .visual-zoom:hover img,
    .multi-landscape:hover img,
    .multi-portrait:hover img,
    img[data-motion="media"]:hover { scale: 1.018; }
    .wordmark:hover,
    .footer-partnership:hover,
    .footer-atma:hover { opacity: .82; }
  }
}

@keyframes atma-menu-entry {
  from { opacity: 0; translate: 0 9px; }
  to { opacity: 1; translate: 0 0; }
}
@keyframes atma-panel-entry {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes atma-backdrop-entry {
  from { opacity: 0; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-motion],
  #mobile-menu nav > *,
  dialog[open] > *,
  dialog[open]::backdrop,
  .visual-zoom img,
  .multi-landscape img,
  .multi-portrait img,
  .small-cta,
  .newsletter-submit,
  .text-link,
  .header-inquire,
  .submit-button,
  .map-load,
  .video-control,
  .menu-toggle span {
    animation: none !important;
    transition: none !important;
  }
}
