/* =========================================================================
   Responsive breakpoints
   ========================================================================= */

@media (max-width: 1024px) {
	.hhc-about-grid { grid-template-columns: repeat(2, 1fr); }
	.hhc-benefits-grid { grid-template-columns: repeat(2, 1fr); }
	.hhc-ingredients-grid { grid-template-columns: repeat(3, 1fr); }
	.hhc-order-grid { grid-template-columns: 1fr; }
}

@media (max-width: 860px) {
	.hhc-primary-nav { position: fixed; top: 0; right: -100%; width: min(320px, 80vw); height: 100vh; background: var(--hhc-cream); box-shadow: -10px 0 30px rgba(0,0,0,.15); padding: 90px 30px 30px; transition: right .3s ease; z-index: 1000; }
	.hhc-primary-nav.is-open { right: 0; }
	.hhc-nav-menu { flex-direction: column; gap: 22px; }
	.hhc-menu-toggle { display: flex; }
	.hhc-menu-toggle.is-active span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
	.hhc-menu-toggle.is-active span:nth-child(2) { opacity: 0; }
	.hhc-menu-toggle.is-active span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

	.hhc-hero-inner { grid-template-columns: 1fr; text-align: center; }
	.hhc-hero-buttons, .hhc-trust-badges { justify-content: center; }
	.hhc-hero-subtitle { margin-left: auto; margin-right: auto; }
	.hhc-bottle-stage { height: 340px; }
	.hhc-bottle, .hhc-bottle-placeholder { max-height: 280px; }

	.hhc-product-grid, .hhc-usage-columns { grid-template-columns: 1fr; }
	.hhc-product-image-stage { order: -1; }

	.hhc-compare-table { grid-template-columns: 120px repeat(2, 1fr); font-size: 13px; }
	.hhc-compare-col { padding: 12px; }

	.hhc-footer-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 600px) {
	.hhc-section { padding: 60px 0; }
	.hhc-about-grid, .hhc-benefits-grid, .hhc-ingredients-grid { grid-template-columns: 1fr 1fr; }
	.hhc-combo-grid { grid-template-columns: 1fr; }
	.hhc-hero { padding: 40px 0 20px; }
	.hhc-hero-title { font-size: 28px; }
	.hhc-btn { width: 100%; padding: 14px 20px; }
	.hhc-hero-buttons { flex-direction: column; }
	.hhc-footer-grid { grid-template-columns: 1fr; text-align: center; }
	.hhc-social-links { justify-content: center; }
	.hhc-whatsapp-float { width: 50px; height: 50px; bottom: 16px; right: 16px; }
	.hhc-review-card { flex-basis: 85vw; }
	.hhc-compare-table { grid-template-columns: 90px repeat(2, 1fr); font-size: 12px; }
}