/* ==========================================================================
   MILAGROS — RESPONSIVE.CSS
   Mobile-first overrides. Breakpoints: 1024px (tablet/desktop), 768px (tablet),
   480px (large phone), 360px (small phone).
   ========================================================================== */

/* ---------- ≤1024px : tablet ---------- */
@media (max-width: 1024px) {
	.dish-grid { grid-template-columns: repeat(2, 1fr); }
	.category-grid { grid-template-columns: repeat(4, 1fr); }
	.location-grid { grid-template-columns: repeat(2, 1fr); }
	.site-footer__top { grid-template-columns: 1fr 1fr; }
	.gallery-grid { columns: 3; }
	.post-list { grid-template-columns: 1fr; }
}

/* ---------- ≤900px : nav collapses to mobile menu ---------- */
@media (max-width: 900px) {
	.site-header__nav,
	.site-header__cta { display: none; }
	.mobile-menu-toggle { display: flex; }

	.split,
	.split--reverse { grid-template-columns: 1fr; direction: ltr; }
	.split__media { order: -1; }

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

/* ---------- ≤768px : mobile ---------- */
@media (max-width: 768px) {
	:root {
		--space-xl: 4.5rem;
		--space-lg: 2.75rem;
		--header-height: 76px;
		--header-height-sticky: 60px;
	}

	.container { padding-inline: 1.25rem; }

	.hero__content { padding-block: 6.5rem 2rem; }
	.hero__strip-inner { gap: 1rem 2rem; }

	.section-heading { flex-direction: column; align-items: flex-start; gap: 0.75rem; }

	.category-grid { grid-template-columns: repeat(3, 1fr); }
	.location-grid { grid-template-columns: 1fr; }
	.location-item--map { order: -1; min-height: 220px; }

	.instagram-grid { grid-template-columns: repeat(3, 1fr); }

	.site-footer__top { grid-template-columns: 1fr; gap: 2rem; }
	.site-footer__bottom-inner { flex-direction: column; align-items: flex-start; }

	.menu-list__row--featured { grid-template-columns: 84px 1fr; }
	.menu-list__row--featured .menu-list__price { grid-column: 1 / -1; }
	.menu-list__row--featured .menu-list__image { width: 84px; height: 84px; }

	.gallery-grid { columns: 2; }
}

/* ---------- ≤480px : large phone ---------- */
@media (max-width: 480px) {
	.hero__title-line { font-size: clamp(2.4rem, 12vw, 3.4rem); }
	.hero__actions { flex-direction: column; align-items: stretch; }
	.hero__actions .btn { justify-content: center; }

	.category-grid { grid-template-columns: repeat(2, 1fr); }
	.dish-grid { grid-template-columns: 1fr; }
	.instagram-grid { grid-template-columns: repeat(2, 1fr); }

	.menu-nav__list { gap: 1.25rem; }

	.final-cta .hero__actions,
	.section--404 .hero__actions { flex-direction: column; width: 100%; }
}

/* ---------- ≤360px : small phone ---------- */
@media (max-width: 360px) {
	.container { padding-inline: 1rem; }
	.heading-xl { font-size: 2.2rem; }
	.gallery-grid { columns: 1; }
}
