/* ==========================================================================
   MUSCLE ZONE — Responsive Rules
   Mobile-first overrides layered on top of style.css
   ========================================================================== */

@media (max-width: 991.98px) {
  .mz-nav-links,
  .mz-nav-phone { display: none; }
  .mz-burger { display: flex; }

  .section-pad { padding: 80px 0; }
  .section-pad-sm { padding: 56px 0; }

  .price-card.popular { transform: scale(1); }

  .mz-hero { background-attachment: scroll; }
  .mz-cta-banner { background-attachment: scroll; }

  .mz-hero-stats { gap: 30px; }
}

@media (max-width: 767.98px) {
  .mz-hero-title { font-size: clamp(2.4rem, 11vw, 3.6rem); }
  .mz-hero-actions { flex-direction: column; align-items: stretch; }
  .mz-hero-actions .btn-mz { justify-content: center; }
  .mz-hero-stats { flex-direction: column; gap: 18px; }

  .section-title { font-size: clamp(1.8rem, 8vw, 2.4rem); }

  .mz-page-hero { padding: 150px 0 60px; }

  .mz-footer-bottom { flex-direction: column; text-align: center; }

  .mz-float-btn { width: 48px; height: 48px; font-size: 1.1rem; right: 16px; }
  .mz-whatsapp { bottom: 16px; }
  .mz-backtotop { bottom: 74px; }

  .testi-card { padding: 30px 24px; }

  .mz-timeline { padding-left: 30px; }
  .mz-timeline-item::before { left: -35px; }
}

@media (max-width: 575.98px) {
  .container-xl { padding: 0 18px; }
  .mz-hero-content { padding-top: 60px; }
  .price-card { padding: 36px 24px; }
  .feature-card { padding: 32px 22px; }
  .gallery-filter { gap: 8px; }
  .gallery-filter button { padding: 8px 14px; font-size: 0.68rem; }
}