/* =========================================================
   Responsive tweaks
   Most responsive behaviour comes from Tailwind utility
   breakpoints. This file holds the small adjustments that
   don't map cleanly to a Tailwind class.
   ========================================================= */

/* Mobile: center default alignment for headings, badges, cards */
@media (max-width: 640px) {
  .center-mobile { text-align: center; }
  .center-mobile .badge,
  .center-mobile > .inline-flex { margin-inline: auto; }
  .stack-center-mobile { align-items: center !important; justify-content: center !important; }
}

/* Prevent horizontal scrolling on narrow screens */
html, body { overflow-x: hidden; }

/* Hero images look nicer with a fixed aspect ratio on mobile */
@media (max-width: 640px) {
  .hero-media img { aspect-ratio: 4 / 3; object-fit: cover; }
}

/* Reduce motion for users who prefer it */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
  .reveal { opacity: 1 !important; transform: none !important; }
}