/* ============================================================
   Responsive — mobile / tablet overrides for all layouts.
   ============================================================ */

/* -------- Tablet -------- */
@media (max-width: 1024px) {
  .nav-wrap { gap: 14px; }
  .main-nav { display: none; }
  .nav-burger { display: inline-flex; }

  .hero-inner { padding: 0 10px; }
  .hero-title { font-size: clamp(2rem, 7vw, 2.8rem); }
  .hero-sub { font-size: 1.1rem; }
  .hero-cta { flex-direction: column; align-items: stretch; }

  .ai-grid { grid-template-columns: 1fr; gap: 32px; }

  .services-layout { grid-template-columns: 1fr; }

  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .dash-main { flex-direction: column; gap: 20px; }
}

/* -------- Small tablet -------- */
@media (max-width: 830px) {
  .hero { height: 90vh; min-height: 76vh; padding-top: var(--header-h); padding-bottom: calc(var(--header-h) + 48px); }
  .hero-inner { max-width: 95%; }
  .hero-cta { gap: 12px; }

  .solutions-grid { grid-template-columns: 1fr 1fr; }
  .products-grid { grid-template-columns: 1fr; }
  .platform-grid { grid-template-columns: 1fr; }
  .news-grid { grid-template-columns: 1fr; }
  .cs-grid { grid-template-columns: 1fr; }

  .map-stage { height: 380px; }
  .lifecycle { flex-wrap: wrap; gap: 6px; }

  .footer-top { flex-direction: column; gap: 26px; }
  .footer-bottom { flex-direction: column; gap: 14px; text-align: center; }
  .footer-legal { justify-content: center; }
}

/* -------- Mobile -------- */
@media (max-width: 600px) {
  :root {
    --container: 600px;
  }
  .container { padding: 0 18px; }

  .hero-badge { font-size: 12px; padding: 6px 14px; }
  .hero-title { font-size: clamp(1.9rem, 8vw, 2.4rem); }
  .hero-sub { font-size: 1rem; }

  .nav-phone { display: none; }

  .brand-logo { height: 32px; }

  .stats-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .cust-strip { flex-wrap: wrap; justify-content: center; gap: 14px; }

  .dash-kpis { grid-template-columns: 1fr; }
  .dash-top { flex-wrap: wrap; gap: 10px; }

  .modal-panel { margin: 32px 6px; padding: 28px 22px; }
}

@media (max-width: 480px) {
  .hero { padding-top: calc(var(--header-h) - 10px); }
  .hero-title { font-size: clamp(1.7rem, 8.5vw, 2.1rem); }
  .section { padding: 64px 0; }
  .stats-grid { grid-template-columns: 1fr; }
  .footer-col { min-width: 100%; }
  .footer-top { flex-direction: column; }
}

/* -------- Nav breakpoint (desktop dropdown -> mobile) -------- */
@media (min-width: 1025px) {
  .mobile-nav { display: none; }
}

/* -------- Aspect-ratio helpers -------- */
[style*="--y"] { /* map positioning uses --y --x vars */ }