/* ==========================================================================
   Zenith Solutions — Responsive Styles
   ========================================================================== */

/* Large tablets / small laptops */
@media (max-width: 991.98px) {
  .section { padding: 64px 0; }

  .hero__inner { grid-template-columns: 1fr; gap: 40px; padding: 64px 0; }
  .hero__media { order: -1; max-width: 520px; }

  .split { grid-template-columns: 1fr; gap: 34px; }
  .split .split__media { order: -1; }

  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .stats { grid-template-columns: repeat(2, 1fr); gap: 30px; }

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

  /* Mobile navigation */
  .nav-toggle { display: inline-grid; place-items: center; }
  .nav-menu {
    position: fixed;
    top: 74px;
    left: 0; right: 0;
    background: #fff;
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    padding: 16px 20px 24px;
    border-bottom: 1px solid var(--line);
    box-shadow: var(--shadow-md);
    transform: translateY(-12px);
    opacity: 0;
    pointer-events: none;
    transition: transform .25s ease, opacity .25s ease;
  }
  .nav-menu.open { transform: translateY(0); opacity: 1; pointer-events: auto; }
  .nav-menu a { padding: 12px 14px; }
  .nav-actions .btn-x { display: none; }
}

/* Tablets */
@media (max-width: 767.98px) {
  .section { padding: 52px 0; }
  .section-lead { font-size: 1rem; }

  .grid-2, .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .gallery { grid-template-columns: repeat(2, 1fr); }

  .cta-band { padding: 36px; text-align: center; justify-content: center; }
  .cta-band .cta-band__actions { width: 100%; display:flex; justify-content:center; gap:12px; flex-wrap:wrap; }

  .hero__badge { left: 12px; right: 12px; bottom: 12px; justify-content:center; }

  .footer-bottom { flex-direction: column; text-align: center; }
  .footer-social { justify-content: center; }
}

/* Phones */
@media (max-width: 575.98px) {
  .section { padding: 44px 0; }
  .card-x, .step, .quote { padding: 24px; }

  .stats { grid-template-columns: 1fr 1fr; gap: 22px; }
  .stat .num { font-size: 2rem; }

  .gallery { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; }

  .brand small { display: none; }
  .cta-band { padding: 28px; }

  .lightbox__nav { width: 44px; height: 44px; }
  .wa-float { width: 52px; height: 52px; font-size: 1.5rem; }
}
