/* Mobile <768; tablet 768–1023; desktop >=1024; amplo >=1440. */
@media (min-width: 768px) {
  :root {
    --container-gutter: 2rem;
    --grid-columns: 6;
    --grid-gap: var(--space-5);
    --section-space: clamp(5rem, 1rem + 8vw, 6rem);
    --section-content-gap: var(--space-7);
  }
  .span-4, .span-6 { grid-column: span 3; }
  .span-8, .span-12 { grid-column: 1 / -1; }
  .split { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  :root {
    --container-gutter: 3rem;
    --grid-columns: 12;
    --section-space: clamp(6.5rem, 4rem + 4vw, 7.5rem);
    --section-content-gap: var(--space-8);
  }
  .span-4 { grid-column: span 4; }
  .span-6 { grid-column: span 6; }
  .span-8 { grid-column: span 8; }
  .span-12 { grid-column: span 12; }
  .split--asymmetric { grid-template-columns: 5fr 7fr; }
}
@media (min-width: 1440px) {
  :root { --grid-gap: var(--space-6); }
}

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