/* Mobile-first adjustments (the base styles already work in one column; these refine the layout at the breakpoints). */
@media (max-width: 62rem) {
  .wizard-layout { grid-template-columns: 1fr; }
  .summary { position: static; order: -1; padding: var(--space-3) var(--space-4); }
  .summary__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3) var(--space-4); }
  .summary__row { padding-block-end: 0; border-bottom: 0; }
  .summary__row dd { font-size: var(--fs-lg); }
  .results__grid { grid-template-columns: 1fr; }
  .preview { grid-template-columns: 1fr; padding: var(--space-4); }
}

@media (max-width: 40rem) {
  :root { --fs-base: 1rem; }
  .section, .start, .results, .contact { padding-block: var(--space-5); }
  .btn--lg { width: 100%; padding-inline: var(--space-4); }
  /* keep a focused field clear of the sticky step navigation */
  .step input, .step select { scroll-margin-block-end: 7rem; }
  .preview__payment { font-size: 2.75rem; }
  .wizard { padding: var(--space-4) var(--space-3); min-height: 0; border-radius: var(--radius); }
  .progress { margin-block-end: var(--space-4); }
  .choices, .fields { grid-template-columns: 1fr; gap: var(--space-3); }
  .step__title { font-size: 1.75rem; }
  .step .input { font-size: var(--fs-lg); min-height: 4rem; }
  .step__nav { position: sticky; bottom: 0; margin-inline: calc(-1 * var(--space-3)); padding: var(--space-3); background: var(--ivory-soft); border-top: 1px solid var(--line); }
  .step__nav .btn { flex: 1; min-width: 0; padding-inline: var(--space-3); }
  .step__nav .btn--ghost { flex: 0 0 auto; }
  .stats { grid-template-columns: 1fr 1fr; }
  .payment { padding: var(--space-4); }
  .contact__card { padding: var(--space-4) var(--space-3); }
  .form-actions .btn { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}