/* ========================================
   SMALL SCREENS (< 480px)
   Base mobile styles — fix overflow, tighten spacing
   ======================================== */

/* Prevent horizontal overflow */
html {
  overflow-x: hidden;
}

/* Anomaly map: stack vertically, hide sidebar on small */
@media (max-width: 479px) {
  .anomaly__map {
    aspect-ratio: 4 / 3;
  }

  .hero__floating-badge {
    display: none;
  }

  .anomaly__counter-value {
    font-size: 2rem;
  }

  .pricing__card {
    padding: 24px;
  }

  .testimonial-card {
    width: calc(100vw - 48px);
    padding: 24px;
  }

  .contact__form-wrapper {
    padding: 20px;
  }
}

/* ========================================
   LARGE PHONES (480px+)
   ======================================== */

@media (min-width: 480px) {
  .hero__ctas {
    flex-wrap: nowrap;
  }

}

/* ========================================
   TABLETS (768px+)
   ======================================== */

@media (min-width: 768px) {
  .solution__flow {
    flex-wrap: nowrap;
  }

  /* Hide mobile-only elements */
  .mobile-only {
    display: none;
  }

  /* Show desktop-only elements */
  .desktop-only {
    display: block;
  }

  /* Anomaly sidebar visible (handled in sections.css) */

  /* Better testimonial card widths */
  .testimonial-card {
    width: 360px;
  }
}

/* ========================================
   SMALL DESKTOP (1024px+)
   ======================================== */

@media (min-width: 1024px) {
  /* Section-specific responsive rules are in sections.css */
  /* This handles global overrides */

  .testimonial-card {
    width: 380px;
  }
}

/* ========================================
   LARGE DESKTOP (1280px+)
   ======================================== */

@media (min-width: 1280px) {
  .hero {
    padding-top: 120px;
  }

  .hero__content {
    max-width: 640px;
  }

  .testimonial-card {
    max-width: 420px;
  }
}

/* ========================================
   PRINT STYLES
   ======================================== */

@media print {
  body::after,
  .glow-orb,
  .navbar,
  .mobile-menu,
  .trust-bar,
  .footer__social {
    display: none !important;
  }

  body {
    background: white;
    color: #111;
  }

  section {
    padding: 24px 0;
    page-break-inside: avoid;
  }

  .card {
    border: 1px solid #ccc;
    background: white;
  }
}