/* =====================================================
   responsive.css — Media Queries
   =====================================================
   Breakpoints:
   1024px → tablet landscape / laptops pequeños
    768px → tablet portrait / móvil grande
    480px → móvil estándar
   ===================================================== */

/* ─── 1024px ────────────────────────────────────────── */
@media (max-width: 1024px) {

  .process-wrap {
    grid-template-columns: 1fr;
    gap: 2.5rem;
  }
  .process-card {
    position: static;
  }

  .contact-grid {
    grid-template-columns: 1fr;
  }

  .unlock-content { max-width: 100%; }
  .unlock-rings   { display: none; }

  .foot-grid {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
  .foot-brand-col {
    grid-column: span 2;
  }
}

/* ─── 768px ─────────────────────────────────────────── */
@media (max-width: 768px) {

  /* Nav → solo logo + CTA + hamburguesa */
  .nav__links,
  .lang-switch {
    display: none;
  }
  .nav__hamburger { display: flex; }

  /* Mostrar bottom nav y ocultar WA float */
  .bottom-nav { display: block; }
  .wa-float   { display: none; }

  /* Secciones con menos padding */
  .section { padding: 4rem 0; }

  /* Hero */
  .hero__title { font-size: clamp(3rem, 11vw, 5.5rem); }
  .hero__ctas  { flex-direction: column; }
  .hero__ctas .btn { width: 100%; justify-content: center; }
  .hero__desc  { max-width: 100%; }
  .hero__inner { padding-bottom: 8rem; } /* espacio para bottom nav */

  /* Stats: 2 columnas */
  .stats-band__grid { grid-template-columns: repeat(2, 1fr); }
  .stat:nth-child(2) { border-right: none; }
  .stat:nth-child(3),
  .stat:nth-child(4) { border-top: 1px solid var(--line); }

  /* Grids → 1 columna */
  .svc-grid     { grid-template-columns: 1fr !important; }
  .reviews-grid { grid-template-columns: 1fr !important; }
  .loyalty-grid { grid-template-columns: 1fr; }
  .pay-bento    { grid-template-columns: 1fr; }

  /* Tab nav */
  .tab-nav { width: 100%; }
  .tab-btn { flex: 1; text-align: center; }

  /* Unlock hero */
  .unlock-hero { padding: 2.2rem; }
  .unlock-title { font-size: clamp(1.9rem, 7vw, 2.6rem); }
  .unlock-ctas  { flex-direction: column; }
  .unlock-ctas .btn { width: 100%; justify-content: center; }

  /* Proceso */
  .process-step { padding: 1.2rem 1.25rem; }

  /* Secciones con cabecera en fila */
  .sec-head--row {
    flex-direction: column;
    align-items: flex-start;
  }
  .sec-head--row .body-t { max-width: 100% !important; }

  /* Club VIP form */
  .vip-box { padding: 2.1rem 1.35rem; }

  /* Google CTA */
  .google-cta { padding: 2.1rem 1.5rem; }

  /* Footer */
  .foot-grid { grid-template-columns: 1fr; }
  .foot-brand-col { grid-column: span 1; }
}

/* ─── 480px ─────────────────────────────────────────── */
@media (max-width: 480px) {

  :root {
    --pad-x: 1.1rem;
    --fs-3xl: 2.2rem;
  }

  .hero__title { font-size: clamp(2.6rem, 13vw, 3.8rem); }

  .hero__chips { gap: 0.45rem; }
  .hero__chip  { font-size: 0.68rem; padding: 0.4rem 0.85rem; }

  .stat { padding: 0.75rem 1.25rem; }
  .stat__n { font-size: 2rem; }

  .unlock-hero { padding: 1.6rem; }
  .carriers-grid { gap: 0.55rem; }
  .carrier { min-width: 80px; height: 44px; font-size: 0.92rem; padding: 0.5rem 0.9rem; }

  .svc { padding: 1.6rem; }
  .pay-card { padding: 1.6rem; }
  .process-card { padding: 1.6rem; }

  .rcard { padding: 1.6rem; }
  .vip-box { padding: 1.7rem 1rem; }
  .google-cta { padding: 1.7rem 1rem; }

  .ci { padding: 1.2rem; }
  .contact-cta { padding: 1.6rem; }

  .footer { padding: 3rem 0 1.75rem; }
  .foot-grid { gap: 1.75rem; }
}