/* ==========================================================================
   SvermiGold — Responsive Breakpoints & Mobile Optimization
   ========================================================================== */

/* Extra Large Screens (1440px+) */
@media (min-width: 1400px) {
  .container {
    max-width: 1320px;
  }
}

/* Large Screens & Desktop (992px - 1199px) */
@media (max-width: 1199.98px) {
  .hero-content h1 {
    font-size: 2.8rem;
  }
  .section-title {
    font-size: 2.2rem;
  }
}

/* Medium Screens & Tablets (768px - 991px) */
@media (max-width: 991.98px) {
  .top-bar {
    text-align: center;
  }
  
  .top-bar-right {
    margin-top: 6px;
  }
  
  .hero-section {
    padding: 60px 0;
    text-align: center;
  }
  
  .hero-content h1 {
    font-size: 2.4rem;
  }

  .hero-trust-tags {
    justify-content: center;
  }
  
  .hero-image-card {
    margin-top: 40px;
  }

  .product-actions {
    grid-template-columns: 1fr;
  }
  
  .bulk-cta-banner {
    padding: 40px 24px;
    text-align: center;
  }
}

/* Small Screens & Mobile (Up to 767px) */
@media (max-width: 767.98px) {
  .section-padding {
    padding: 50px 0;
  }

  .hero-content h1 {
    font-size: 2rem;
  }

  .hero-content p {
    font-size: 1.05rem;
  }

  .section-title {
    font-size: 1.8rem;
  }

  .floating-whatsapp {
    bottom: 80px;
    right: 20px;
    width: 52px;
    height: 52px;
    font-size: 26px;
  }

  .back-to-top {
    bottom: 140px;
    right: 20px;
    width: 40px;
    height: 40px;
  }

  .mobile-bottom-bar {
    display: block;
  }
  
  /* Ensure padding at bottom of body so sticky bar doesn't overlap content */
  .is-product-page body {
    padding-bottom: 70px;
  }
}

/* Extra Small Screens (320px - 480px) */
@media (max-width: 480px) {
  .navbar-brand {
    font-size: 1.25rem;
  }
  
  .brand-logo-icon {
    width: 36px;
    height: 36px;
  }

  .hero-badge-float {
    position: relative;
    bottom: auto;
    left: auto;
    margin-top: 16px;
    width: 100%;
  }

  .btn-svermi-primary, .btn-svermi-secondary, .btn-svermi-gold, .btn-svermi-whatsapp {
    width: 100%;
    padding: 12px 20px;
  }
}