/* =============================================================
   RESPONSIVE · refinements
   Breakpoints:
   - tablet: 1024px e sotto
   - mobile: 768px e sotto
   - small:  480px e sotto

   NOTA: l'header (.topbar / .topbar-nav / .burger), il footer
   (.foot-cols / .foot-sign), l'hero (.hero-grid / .hero-specs)
   e il marquee (.marquee) gestiscono il responsive nei rispettivi
   file (layout.css, components.css). Qui restano solo i ritocchi
   trasversali (spaziatura, griglie prodotti, tipografia, gdpr, print).
   ============================================================= */

/* ---------- 1440 (wide desktop) ---------- */
@media (max-width: 1440px) {
	:root { --container: 1200px; }
}

/* ---------- 1024 (tablet landscape / laptop piccolo) ---------- */
@media (max-width: 1024px) {
	:root { --container: 100%; }

	.section { padding: var(--s-8) 0; }

	.woocommerce ul.products { grid-template-columns: repeat(2, 1fr) !important; gap: var(--s-5); }
}

/* ---------- 768 (mobile landscape / tablet portrait) ---------- */
@media (max-width: 768px) {
	:root {
		--s-5: 1.2rem;
		--s-6: 1.75rem;
		--s-7: 2.5rem;
		--s-8: 3.5rem;
		--s-9: 4rem;
		--s-10: 5rem;
	}

	body { font-size: 0.97rem; }

	.container {
		padding-left: var(--s-4);
		padding-right: var(--s-4);
	}

	.posts-grid { grid-template-columns: 1fr; gap: var(--s-5); padding: var(--s-6) 0; }

	.woocommerce ul.products { grid-template-columns: 1fr !important; gap: var(--s-5); }

	.woocommerce div.product form.cart .quantity { flex: 0 0 100%; }
	.woocommerce div.product form.cart .quantity input[type="number"] { width: 100%; }
	.woocommerce div.product form.cart .button { width: 100%; }

	.mobilemenu__list a { font-size: 1.6rem; }

	h1 { font-size: clamp(1.8rem, 8vw, 2.8rem); }
	h2 { font-size: clamp(1.5rem, 6vw, 2.2rem); }

	.gdpr-banner { left: var(--s-3); right: var(--s-3); bottom: var(--s-3); padding: var(--s-4); }
}

/* ---------- 480 (mobile portrait stretto) ---------- */
@media (max-width: 480px) {
	.container { padding-left: var(--s-3); padding-right: var(--s-3); }
	.btn { padding: var(--s-3) var(--s-5); min-height: 44px; }
	.btn--lg { min-height: 52px; padding: var(--s-3) var(--s-6); }
}

/* Dark mode (ottimizzato, opt-in via body.auto-dark) */
@media (prefers-color-scheme: dark) {
	body.auto-dark {
		--bg:      #15140F;
		--bg-alt:  #1F1D17;
		--ink:     #EFE8DB;
		--muted:   #A49E8F;
		--line:    #2A2720;
	}
}

/* Print */
@media print {
	.topbar, .marquee, .foot, .site-footer, .mobilemenu, .mobilemenu-backdrop, .gdpr-banner {
		display: none !important;
	}
	body { background: white; color: black; }
	a { color: black; text-decoration: underline; }
	.hero { min-height: auto; color: black; background: none; }
	.hero-photo, .hero-photo-wrap { display: none; }
}