/* No hidden initial state: all content is readable when scripts are unavailable. */
@media (prefers-reduced-motion: no-preference) {
  .button {
    transition: background-color 180ms ease, color 180ms ease,
      border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
  }
  .button:focus-visible {
    transform: translateY(-2px);
    box-shadow: 0 5px 14px #32182012;
  }
  .button:not(:disabled):active {
    transform: translateY(0) scale(.98);
    transition-duration: 70ms;
  }
  .button .arrow {
    transition: transform 180ms ease;
  }
  .button:hover .arrow, .button:focus-visible .arrow {
    transform: translate(2px,-2px);
  }
  .field input, .field select {
    transition: border-color 160ms ease, box-shadow 160ms ease;
  }
  .field input:focus, .field select:focus {
    box-shadow: 0 3px 12px #3218200b;
  }
  .faq summary::after {
    transition: transform 180ms ease;
  }
  .faq summary:hover::after, .faq summary:focus-visible::after {
    transform: scale(1.15);
  }
  .form-status:not(:empty), .form-next:not([hidden]) {
    animation: form-feedback-in 220ms cubic-bezier(.22,.68,.3,1);
  }
  @keyframes form-feedback-in {
    from { opacity: .6; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .button, .button:hover, .button:active, .button:focus-visible,
  .button .arrow, .faq summary::after { transform: none; }
}