/* Desktop-specific overrides (>=641px). Loaded only on larger screens via media attribute. */

/* You can tailor larger typography, layout densities, and component sizing here without affecting mobile. */

/* Example: slightly larger max container and headline sizes */
@media (min-width: 641px) {
  .container { width: min(1180px, 92%); }
  .hero h1 { font-size: clamp(36px, 3vw, 48px); }
  .hero .tagline { font-size: clamp(18px, 1.6vw, 22px); }
  .screenshot-card { max-width: 480px; }
  .carousel { width: min(1080px, 96%); margin: 0 auto; }
  .carousel-track { padding: 0 24px; }
  .carousel-btn.prev { left: 8px; }
  .carousel-btn.next { right: 8px; }
  .mobile-cta { display: none; }
}