/* ============================================
   MOBILE SPACING - AGGRESSIVE FIX
   Override all spacing on mobile screens
   ============================================ */

@media (max-width: 768px) {
  /* Hero Section - ABSOLUTE MINIMAL spacing */
  .animated-hero-section {
    padding-top: clamp(4rem, calc(4rem + 0.5vw), 4.5rem) !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Hero Content - Minimal gap */
  .animated-hero-content {
    gap: 0.5rem !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Hero Left - Minimal spacing */
  .animated-hero-left {
    gap: 0.5rem !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Hero Right - No spacing */
  .animated-hero-right {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Hero Title - Minimal margin */
  .animated-hero-title {
    margin-top: 0 !important;
    margin-bottom: 0.5rem !important;
  }

  /* Hero Description - Minimal margin */
  .animated-hero-description {
    margin-top: 0 !important;
    margin-bottom: 0.75rem !important;
  }

  /* Stats Container - Minimal spacing */
  .animated-stats-container {
    margin-top: 0 !important;
    margin-bottom: 0.75rem !important;
    gap: 0.5rem !important;
  }

  /* CTA Buttons - Minimal spacing */
  .animated-cta-buttons {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Slideshow Container - No spacing */
  .product-slideshow-container {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Features Section - ABSOLUTE MINIMAL */
  .features-section {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Process Section - ABSOLUTE MINIMAL */
  .process-section {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Section Header - Minimal spacing */
  .section-header {
    margin-top: 0 !important;
    margin-bottom: 0.5rem !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Section Badge - Minimal spacing */
  .section-badge {
    margin-top: 0 !important;
    margin-bottom: 0.5rem !important;
  }

  /* Section Title - Minimal spacing */
  .section-title {
    margin-top: 0 !important;
    margin-bottom: 0.5rem !important;
  }

  /* Section Description - Minimal spacing */
  .section-description {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Remove all container padding that adds spacing */
  .animated-hero-section .container,
  .features-section .container,
  .process-section .container {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

@media (max-width: 480px) {
  /* Small mobile - EVEN MORE MINIMAL */
  .animated-hero-section {
    padding-top: clamp(3.5rem, calc(4rem + 0.25vw), 4rem) !important;
    padding-bottom: 0 !important;
  }

  .animated-hero-content {
    gap: 0.25rem !important;
  }

  .animated-hero-left {
    gap: 0.25rem !important;
  }

  .animated-hero-title {
    margin-bottom: 0.25rem !important;
  }

  .animated-hero-description {
    margin-bottom: 0.5rem !important;
  }

  .animated-stats-container {
    margin-bottom: 0.5rem !important;
    gap: 0.25rem !important;
  }

  .features-section,
  .process-section {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }

  .section-header {
    margin-bottom: 0.25rem !important;
  }
}