/* ============================================================
   ZUVEXA TECH — responsive.css
   Breakpoint principal: max-width 960px
   ============================================================ */

/* ══════════════════════════════════════════════════════════
   ACCESIBILIDAD — Reduce motion
   ══════════════════════════════════════════════════════════ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration:        .01ms !important;
    animation-iteration-count: 1     !important;
    transition-duration:       .01ms !important;
  }
}

/* ══════════════════════════════════════════════════════════
   COMPARTIDO — Nav y footer (aplica a todas las páginas)
   ══════════════════════════════════════════════════════════ */
@media (max-width: 960px) {
  nav { padding: 14px 24px; }
  .nav-links { display: none; }
  .hamburger { display: flex; }

  footer {
    padding: 28px 24px;
    flex-direction: column;
    text-align: center;
  }
  .f-links { justify-content: center; }

  .cta-banner { padding: 60px 24px; }

  /* Lista de espera compartida */
  .le-row      { grid-template-columns: 1fr; }
  .le-form-wrap { padding: 24px; }
}

/* ══════════════════════════════════════════════════════════
   INDEX.HTML — Secciones específicas
   ══════════════════════════════════════════════════════════ */
@media (max-width: 960px) {
  #hero         { padding: 100px 24px 60px; }
  .hero-inner   { grid-template-columns: 1fr; gap: 40px; }
  .hero-visual  { display: none; }

  #trust        { padding: 24px; }
  .trust-divider { display: none; }

  #problemas,
  #quick-links,
  #cta-final,
  #cta-launch,
  #lista-espera { padding: 60px 24px; }

  .ql-grid      { grid-template-columns: 1fr; }
  .slider-wrap, .slider-nav { padding: 0 24px !important; }

  #zt-chat-btn    { right: 16px; bottom: 20px; }
  #zt-chat-window { right: 12px; bottom: 86px; width: calc(100vw - 24px); }

  #lanzamiento,
  #lista-espera,
  #cta-launch      { padding: 70px 24px; }
  .lz-grid         { grid-template-columns: 1fr; gap: 40px; }
  #lanzamiento .le-inner,
  #lanzamiento .le-form-wrap { padding-left: 24px !important; padding-right: 24px !important; }
}

/* ══════════════════════════════════════════════════════════
   SERVICIOS.HTML — Secciones específicas
   ══════════════════════════════════════════════════════════ */
@media (max-width: 960px) {
  .page-hero     { padding: 120px 24px 60px; }
  .srv-section   { padding: 60px 24px; }
  .srv-full-card { grid-template-columns: 1fr; }

  .launch-banner       { padding: 44px 24px; }
  .lb-inner            { grid-template-columns: 1fr; gap: 28px; }
  .lb-right            { align-items: flex-start; }
  .launch-cta-bottom,
  .le-section-srv      { padding: 60px 24px; }
}

/* ══════════════════════════════════════════════════════════
   CASOS.HTML — Secciones específicas
   ══════════════════════════════════════════════════════════ */
@media (max-width: 960px) {
  .casos-section  { padding: 60px 24px; }
  .casos-grid     { grid-template-columns: 1fr; }

  .zt-modal-header { padding: 28px 24px 22px; }
  .zt-modal-body   { padding: 20px 18px 28px; }
  .zt-compare      { grid-template-columns: 1fr; }
  .zt-stats        { grid-template-columns: repeat(2, 1fr); }
  .zt-visual-inner { flex-direction: column; align-items: center; }
  .zt-phone        { width: 80px; }
  .zt-dash         { min-width: unset; width: 100%; }
}

/* ══════════════════════════════════════════════════════════
   NOSOTROS.HTML — Secciones específicas
   ══════════════════════════════════════════════════════════ */
@media (max-width: 960px) {
  .perfil-section,
  .mvv-section,
  .diff-section  { padding: 70px 24px; }

  .perfil-grid   { grid-template-columns: 1fr; }
  .perfil-card   { position: static; }
  .mvv-grid      { grid-template-columns: 1fr; }
  .diff-grid     { grid-template-columns: 1fr; }
}

/* ══════════════════════════════════════════════════════════
   CONTACTO.HTML — Secciones específicas
   ══════════════════════════════════════════════════════════ */
@media (max-width: 960px) {
  .contact-section,
  .faq-section    { padding: 70px 24px; }

  .contact-grid   { grid-template-columns: 1fr; gap: 36px; }
  .faq-grid       { grid-template-columns: 1fr; }
  .f-row          { grid-template-columns: 1fr; }
  .contact-form-wrap { padding: 24px; }
}