/* Mobile-first adjustments and swaps */

/* Defaults (desktop shows desktop variants) */
.hero-text--mobile, .img--mobile { display: none; }

@media (max-width: 840px) {
  .grid-2 { grid-template-columns: 1fr; }
  .gallery { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .hero__grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .nav { gap: 10px; }
  section { padding: 18px; margin: 14px 0; }

  /* Swap to mobile variants */
  .hero-text--desktop, .img--desktop { display: none; }
  .hero-text--mobile, .img--mobile { display: block; }

  .gallery { grid-template-columns: 1fr; }
}