/* ============================================================
   FORDERSUR — Responsive
   Puntos de quiebre: 1024px (tablet) y 640px (móvil).
   ============================================================ */

/* ---------- Tablet ---------- */
@media (max-width: 1024px) {
  :root { --header-h: 76px; }

  .cards { grid-template-columns: repeat(2, 1fr); }
  .services { grid-template-columns: repeat(3, 1fr); }
  .reasons { grid-template-columns: repeat(2, 1fr); }
  .footer__grid { grid-template-columns: 1fr 1fr; gap: 34px; }

  .hero__badge { width: 150px; height: 150px; }
  .hero__badge-num { font-size: 2.7rem; }

  /* --- Menú móvil (drawer) --- */
  .nav-toggle { display: flex; }
  .nav {
    position: fixed; inset: var(--header-h) 0 auto 0;
    flex-direction: column; align-items: stretch; gap: 0;
    background: #fff; border-bottom: 1px solid var(--line);
    box-shadow: var(--shadow-md);
    padding: 10px 20px 22px;
    transform: translateY(-14px); opacity: 0; pointer-events: none;
    transition: opacity .22s ease, transform .22s ease;
  }
  .nav.is-open { transform: translateY(0); opacity: 1; pointer-events: auto; }
  .nav__list { flex-direction: column; align-items: stretch; gap: 0; width: 100%; }
  .nav__link { display: block; padding: 15px 4px; border-bottom: 1px solid var(--line); font-size: 1.05rem; }
  .nav__link::after { display: none; }
  .nav__cta { margin-top: 16px; width: 100%; }
}

/* ---------- Móvil ---------- */
@media (max-width: 640px) {
  body { font-size: 16px; }

  .container { width: min(100% - 32px, var(--container)); }

  .brand__logo { height: 38px; }

  /* Hero */
  .hero { min-height: auto; padding-block: calc(var(--header-h) + 48px) 60px; }
  .hero__inner { flex-direction: column; align-items: flex-start; }
  .hero__actions { width: 100%; }
  .hero__actions .btn { flex: 1; min-width: 0; }
  .hero__badge {
    position: absolute; top: calc(var(--header-h) + 8px); right: 16px;
    width: 96px; height: 96px; border-width: 4px; transform: rotate(-6deg);
  }
  .hero__badge-num { font-size: 1.9rem; }
  .hero__badge-label { font-size: .58rem; }

  /* Franja de confianza en 2 columnas */
  .trust__inner { grid-template-columns: repeat(2, 1fr); gap: 4px 0; }
  .trust__item:nth-child(2) { border-right: 0; }
  .trust__item:nth-child(odd) { border-right: 1px solid rgba(255,255,255,.14); }
  .trust__item { padding: 12px 8px; }

  /* Grids a una columna */
  .grid-2 { grid-template-columns: 1fr; }
  .cards { grid-template-columns: 1fr; }
  .services { grid-template-columns: 1fr; }
  .reasons { grid-template-columns: 1fr; }
  .form { grid-template-columns: 1fr; }
  .field--half { grid-column: 1 / -1; }

  /* Nosotros: imagen primero */
  .nosotros__media { order: -1; margin-bottom: 30px; }
  .nosotros__stamp { right: 8px; bottom: -16px; padding: 10px 16px; }
  .nosotros__stamp strong { font-size: 1.3rem; }

  .footer__grid { grid-template-columns: 1fr; gap: 28px; padding: 46px 0 34px; }
  .footer__bottom-inner { flex-direction: column; text-align: center; }

  /* WhatsApp flotante compacto */
  .wa-float { right: 16px; bottom: 16px; padding: 13px; }
  .wa-float__text { display: none; }

  .section__head { margin-bottom: 38px; }
}

/* ---------- Pantallas muy pequeñas ---------- */
@media (max-width: 380px) {
  .hero__actions { flex-direction: column; }
  .hero__actions .btn { width: 100%; }
}
