/* ==========================================================================
   responsive.css — Manswered.com breakpoints (mobile-first, min-width)
   Mobile: base styles in style.css (320–767px)
   Tablet: 768px+   Desktop: 1024px+   Large desktop: 1440px+
   ========================================================================== */

/* ---------- Small phones up ---------- */
@media (min-width: 480px) {
  .hero__ctas { flex-direction: row; flex-wrap: wrap; }
  .inline-form { flex-direction: row; }
  .inline-form .btn { flex-shrink: 0; }
  .social-grid { grid-template-columns: repeat(3, 1fr); }
  .cookie-bar { left: auto; right: 16px; bottom: 16px; max-width: 440px; }
}

/* ---------- Tablet ---------- */
@media (min-width: 768px) {
  :root { --gutter: 24px; --header-h: 72px; }
  .product-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
  .carousel__slide { flex-basis: calc((100% - 20px) / 2); }
  .health-grid { grid-template-columns: repeat(2, 1fr); }
  .category-grid { gap: 16px; }
  .feature-grid { grid-template-columns: repeat(2, 1fr); }
  .testimonial-grid { grid-template-columns: repeat(3, 1fr); }
  .footer-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-bottom { flex-direction: row; justify-content: space-between; text-align: left; }
  .brand-grid { grid-template-columns: repeat(2, 1fr); }
  .mini-products { grid-template-columns: repeat(3, 1fr); }
  .ad-card { flex-direction: row; align-items: center; justify-content: space-between; padding: 30px 36px; }
  .ad-card .btn { align-self: center; flex-shrink: 0; }
  .ad-card__text { max-width: 620px; }
  .values-grid { grid-template-columns: repeat(3, 1fr); }
  .contact-layout { grid-template-columns: 1.5fr 1fr; }
  .quickview__grid { grid-template-columns: 1fr 1fr; }
  .quickview__info { padding: 36px 32px; }
  .health-section__head { grid-template-columns: 1fr; }
  .cookie-bar { grid-template-columns: 1fr; }
  .trust-badges li { flex-direction: row; justify-content: center; text-align: left; }
  .hero__scroll { display: block; }
  .newsletter-modal__body { padding: 48px 44px 36px; }
}

/* ---------- Desktop ---------- */
@media (min-width: 1024px) {
  .main-nav { display: block; }
  .menu-toggle { display: none; }
  .bottom-nav { display: none; }
  .has-bottom-nav { padding-bottom: 0; }
  .has-bottom-nav .scroll-top, .has-sticky-atc .scroll-top { bottom: 24px; }
  .has-bottom-nav .cookie-bar { bottom: 16px; }
  .has-sticky-atc { padding-bottom: 0 !important; }
  .sticky-atc { display: none; }
  .scroll-top { right: 24px; bottom: 24px; }

  .product-grid { grid-template-columns: repeat(3, 1fr); }
  .product-grid--wide { grid-template-columns: repeat(4, 1fr); }
  .carousel__slide { flex-basis: calc((100% - 60px) / 4); }
  .health-grid { grid-template-columns: repeat(4, 1fr); }
  .category-grid { grid-template-columns: repeat(4, 1fr); gap: 20px; }
  .feature-grid { grid-template-columns: repeat(4, 1fr); }
  .footer-grid { grid-template-columns: 1.3fr 1fr 1fr 1.4fr; gap: 40px; }
  .social-grid { grid-template-columns: repeat(6, 1fr); gap: 10px; }

  .shop-layout { grid-template-columns: 260px 1fr; gap: 36px; align-items: start; }
  .filters { position: sticky; top: calc(var(--header-h) + 20px); }
  .filters__toggle { pointer-events: none; }
  .filters__toggle .icon--chev { display: none; }
  .filters__body { display: block; }

  .pdp { grid-template-columns: 1.05fr 1fr; gap: 56px; align-items: start; padding-top: 32px; }
  .gallery { position: sticky; top: calc(var(--header-h) + 20px); }
  .gallery__thumb { width: 88px; height: 88px; }

  .brand-grid { grid-template-columns: repeat(3, 1fr); }
  .health-section__head { grid-template-columns: 1.3fr 1fr; align-items: end; }
  .split { grid-template-columns: 1fr 1fr; gap: 64px; }
  .split--reverse .split__media { order: 2; }
  .founder { grid-template-columns: 360px 1fr; gap: 64px; }
  .contact-layout { gap: 48px; }
  .legal-layout { grid-template-columns: 250px 1fr; gap: 56px; }
  .toc { position: sticky; top: calc(var(--header-h) + 24px); }
  .hero { min-height: calc(100vh - 38px - var(--header-h)); }
}

/* ---------- Large desktop ---------- */
@media (min-width: 1440px) {
  :root { --container: 1360px; }
  .product-grid--wide { grid-template-columns: repeat(4, 1fr); }
  .shop-layout .product-grid { grid-template-columns: repeat(4, 1fr); }
  .hero__content { max-width: 900px; }
}

/* ---------- Hover-capable devices only ---------- */
@media (hover: none) {
  .product-card__quick { display: none; }
  .product-card:hover { transform: none; }
}

/* ---------- Print ---------- */
@media print {
  .announcement, .site-header, .site-footer, .bottom-nav, .scroll-top, .cookie-bar, .toc, .sticky-atc { display: none !important; }
  body { background: #fff; color: #000; }
  .prose p, .prose li, h1, h2, h3 { color: #000; }
  .page-hero { background: none; color: #000; }
}
