/* =========================================================
   UBERSERRA — Responsivo (mobile-first ajustes)
   ========================================================= */

@media (max-width: 1180px) {
  .nav__link { padding: 12px 10px; font-size: 0.75rem; }
  .footer__grid { grid-template-columns: 1fr 1fr 1fr; }
}

@media (max-width: 1024px) {
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .grid--3 { grid-template-columns: repeat(2, 1fr); }
  .stats__grid { grid-template-columns: repeat(3, 1fr); }
  .stats__item:nth-child(4) { border-left: 0; }
  .recognitions { grid-template-columns: 1fr; }
  .city-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  .nav,
  .header__actions .btn { display: none; }
  .burger { display: grid; }
  .split { grid-template-columns: 1fr; }
  .split--reverse .split__media { order: -1; }
  .topbar__links a.hide-sm { display: none; }
}

@media (max-width: 720px) {
  :root { --header-h: 68px; }
  .brand img { height: 42px; }
  .grid--2,
  .grid--3,
  .grid--4 { grid-template-columns: 1fr; }
  .stats__grid { grid-template-columns: repeat(2, 1fr); }
  .stats__item { border-left: 0; border-top: 1px solid rgba(255,255,255,0.1); padding: 24px 16px; }
  .stats__item:nth-child(-n+2) { border-top: 0; }
  .form__row { grid-template-columns: 1fr; }
  .footer__grid { grid-template-columns: 1fr 1fr; }
  .city-grid { grid-template-columns: 1fr; }
  .mobile-bar { display: flex; }
  .wa-float { display: none; }
  body { padding-bottom: 54px; }
  .cookie-bar { bottom: 70px; }
  .cta-band__inner { flex-direction: column; align-items: flex-start; }
  .hero__actions .btn { flex: 1 1 100%; }
}

@media (max-width: 420px) {
  .topbar__links { gap: 12px; }
  .footer__grid { grid-template-columns: 1fr; }
}

@media (max-width: 1024px) {
  .clients { grid-template-columns: repeat(4, 1fr); }
  .section--solutions .split,
  .section--solutions .split--reverse { grid-template-columns: 1fr; }
  .section--solutions .split__media img { aspect-ratio: 16 / 10; }
}

@media (max-width: 560px) {
  .clients { grid-template-columns: repeat(2, 1fr); }
}
