/* ============================================
   Maid Magic - Responsive Styles
   ============================================ */

/* --- Mobile (max 575px) --- */
@media (max-width: 575px) {
  .hero-section {
    min-height: 85vh;
  }

  .hero-buttons .btn-lg {
    padding: 12px 28px;
    font-size: 0.9rem;
  }

  .hero-sparkle i {
    font-size: 2rem;
  }

  h2 {
    font-size: 1.75rem;
  }

  .py-6 {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .footer-logo {
    height: 50px;
  }

  .about-stat-number {
    font-size: 1.35rem;
  }

  .about-stat-label {
    font-size: 0.65rem;
  }

  .about-image-placeholder {
    height: 280px;
  }

  .cta-heading {
    font-size: 1.5rem;
  }

  .cta-text {
    font-size: 0.95rem;
  }

  .contact-form-card,
  .contact-info-card {
    padding: 1.5rem;
  }
}

/* --- Small tablet (max 767px) --- */
@media (max-width: 767px) {
  .hero-heading {
    font-size: 2.25rem;
  }

  .hero-subheading {
    font-size: 1.05rem;
    padding: 0 1rem;
  }

  .nav-logo img {
    height: 75px;
  }
}

/* --- Tablet and up (min 768px) --- */
@media (min-width: 768px) {
  .hero-heading {
    font-size: 3rem;
  }
}

/* --- Desktop (min 992px) --- */
@media (min-width: 992px) {
  .hero-heading {
    font-size: 3.5rem;
  }

  .hero-subheading {
    font-size: 1.2rem;
  }
}
