/* =============================================
   NEXUS WAVE — responsive.css
   All media queries in one place
   ============================================= */

/* ─── Large tablets / small desktops ─── */
@media (max-width: 1100px) {
  section {
    padding: 96px 40px;
  }
  #navbar {
    padding-left: 40px;
    padding-right: 40px;
  }
  footer {
    padding-left: 40px;
    padding-right: 40px;
  }

  /* Hero */
  .hero-headline {
    font-size: clamp(52px, 9vw, 96px);
  }
}

/* ─── Tablets ─── */
@media (max-width: 900px) {
  /* Navbar */
  .nav-links { display: none; }
  .nav-cta   { display: none; }
  .hamburger { display: flex; }
  .mobile-menu { display: flex; }

  /* Services index */
  .services-index .svc-row {
    grid-template-columns: auto 1fr auto;
  }
  .svc-tags { display: none; }

  /* Stats */
  .stats-row {
    grid-template-columns: 1fr 1fr;
  }

  /* Portfolio */
  .portfolio-grid {
    grid-template-columns: 1fr 1fr;
  }

  /* Testimonials */
  .testi-grid {
    grid-template-columns: 1fr;
  }

  /* Why grid */
  .why-grid {
    grid-template-columns: 1fr;
  }

  /* Footer */
  .footer-top {
    flex-direction: column;
    gap: 40px;
  }
  .footer-cols {
    gap: 40px;
  }
  .footer-bottom {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ─── Mobile ─── */
@media (max-width: 640px) {
  section {
    padding: 72px 20px;
  }
  #navbar {
    padding-left: 20px;
    padding-right: 20px;
  }
  footer {
    padding-left: 20px;
    padding-right: 20px;
  }

  /* Hero */
  .hero {
    padding: 120px 20px 72px;
  }
  .hero-headline {
    font-size: clamp(44px, 12vw, 72px);
    letter-spacing: -2px;
  }
  .hero-btns {
    flex-direction: column;
    align-items: flex-start;
  }

  /* Marquee */
  .marquee-row {
    padding: 12px 0;
  }

  /* Stats */
  .stats-row {
    grid-template-columns: 1fr;
  }

  /* Portfolio */
  .portfolio-grid {
    grid-template-columns: 1fr;
  }

  /* FAQ */
  .faq-q h4 {
    font-size: 14px;
  }

  /* Contact form */
  .form-row {
    flex-direction: column;
  }

  /* WhatsApp button */
  .wa-float {
    bottom: 20px;
    right: 20px;
  }
}
