@media (max-width: 480px) {
	.hv-slider-track.products>li.product,
	body .woocommerce ul.products.hv-slider-track > li.product {
		flex: 0 0 calc(50% - 10px) !important;
	}

	.hv-slider-track--blog>* {
		flex: 0 0 260px !important;
	}

	.hv-section-head .hv-slider-nav {
		position: static;
		transform: none;
		justify-content: center;
		margin: 16px 0 0;
	}
}

/* ── Mobile: Comprehensive layout & spacing fixes (≤ 768px) ─────── */
@media (max-width: 768px) {

	/* Shared container */
	.hv-container {
		padding: 0 20px;
	}

	/* Collections — 3 columns */
	#hv-collections {
		padding: 40px 20px;
	}

	.hv-collections-grid {
		grid-template-columns: repeat(3, 1fr);
		gap: 10px;
	}

	/* About Us section */
	#hv-about-us {
		padding: 50px 0;
	}

	.hv-about-ref-inner {
		padding: 0 20px;
		gap: 28px;
	}

	/* About (stats/badge section) */
	#hv-about {
		padding: 50px 0;
	}

	.hv-about-inner {
		grid-template-columns: 1fr;
		padding: 0 20px;
		gap: 32px;
	}

	.hv-about-badge {
		display: none;
	}

	/* Product sections */
	.hv-products-section {
		padding: 50px 0;
	}

	.hv-products-section .hv-container {
		padding: 0 20px;
	}

	.hv-section-hdr {
		margin-bottom: 28px;
	}

	/* Why Choose Us — 2×2 grid */
	#hv-why {
		padding: 50px 0;
	}

	.hv-why-grid {
		grid-template-columns: repeat(2, 1fr);
		gap: 16px;
	}

	.hv-why-card {
		padding: 28px 20px;
	}

	/* Shipping */
	#hv-shipping {
		padding: 50px 0;
	}

	.hv-shipping-grid {
		grid-template-columns: 1fr;
		gap: 16px;
	}

	/* Values */
	#hv-values {
		padding: 50px 0;
	}

	/* Testimonials */
	#hv-testimonials {
		padding: 50px 0;
	}

	/* Quick Links / Top Searches */
	#hv-quick-links {
		padding: 40px 0;
	}

	.hv-ql-cloud {
		padding: 20px;
		gap: 6px;
	}

	.hv-ql-tag {
		font-size: .72rem;
		padding: 5px 11px;
	}

	/* FAQ */
	#hv-faq {
		padding: 50px 0;
	}

	/* Hero image banner — add side padding once max-width no longer kicks in */
	#hv-hero-img {
		padding: 16px 20px 0;
	}

	.hv-hero-fullimg {
		border-radius: 12px;
	}
}

/* ── Mobile: Extra-small screens (≤ 480px) ──────────────────────── */
@media (max-width: 480px) {

	/* Collections — 2 columns on very small screens */
	.hv-collections-grid {
		grid-template-columns: repeat(2, 1fr);
	}

	/* Why — stack to single column */
	.hv-why-grid {
		grid-template-columns: 1fr;
	}

	/* Hero image */
	#hv-hero-img {
		padding: 12px 12px 0;
	}

	.hv-hero-fullimg {
		border-radius: 10px;
		min-height: 300px;
		object-fit: cover;
		object-position: center top;
	}

}

/* ─── RESPONSIVE OVERRIDES for home-v2 sections ─────────────────────
   These target the class names added to each section's inner grid
   so we can override inline grid-template-columns at breakpoints.
   ─────────────────────────────────────────────────────────────────── */

/* Tablet — 768px */
@media (max-width: 768px) {
	/* About: stack content + badge circle */
	.hv-about-inner       { grid-template-columns: 1fr !important; }
	.hv-about-badge       { display: none !important; }

	/* Why: 4 cols → 2 cols */
	.hv-why-grid          { grid-template-columns: repeat(2, 1fr) !important; }

	/* Shipping: 3 cols → 1 col */
	.hv-shipping-grid     { grid-template-columns: 1fr !important; }

	/* Collections: 6 cols → 3 cols */
	.hv-collections-grid  { grid-template-columns: repeat(3, 1fr) !important; }
}