/* ═══════════════════════════════════════════════════════════
   HIMPULSA — responsive.css (GLOBAL)
   Solo controla contenido de páginas.
   Nav y hamburguesa viven en nav.css.
   ═══════════════════════════════════════════════════════════ */

/* === TABLET ≤860px === */
@media (max-width: 860px) {

  /* -- Heros (quiénes somos + qué hacemos) -- */
  .qs-hero-inner,
  .qh-hero-inner { grid-template-columns: 1fr !important; gap: 40px; text-align: center; }
  .qs-hero-card { order: -1; }
  .qh-hero-sub, .qs-hero-sub { margin-left: auto; margin-right: auto; }
  .qh-hero-visual { max-width: 500px; margin: 0 auto; }
  .qh-btns, .qs-btns { justify-content: center; }

  /* -- Homepage hero: vive en hero.css (única fuente de verdad) -- */

  /* -- Trust strip -- */
  .qs-trust-inner { grid-template-columns: repeat(2, 1fr); gap: 24px; }

  /* -- Splits -- */
  .qs-split { grid-template-columns: 1fr; padding: 72px 24px; gap: 40px; }

  /* -- Bento grids -- */
  .qs-bento, .qh-bento { grid-template-columns: 1fr 1fr; }
  .qs-bento-item.qs-bento-hero,
  .qh-bento-item.qh-bento-main { grid-row: auto; grid-column: 1 / -1; border-right: none; }

  /* -- Pasos -- */
  .qh-paso { grid-template-columns: 1fr !important; gap: 32px; }
  .qh-paso:nth-child(even) { direction: ltr !important; }
  .qh-paso-img { max-width: 500px; margin: 0 auto; }

  /* -- Para quién -- */
  .qh-pq-list { grid-template-columns: 1fr; }

  /* -- Futuro -- */
  .qh-futuro-inner { grid-template-columns: 1fr; gap: 0; }
  .qh-futuro-line { display: none; }

  /* -- Blog -- */
  .bl-featured a { grid-template-columns: 1fr; }
  .bl-grid { grid-template-columns: 1fr 1fr; }

  /* -- Video -- */
  .qh-video-wrap { border-radius: 14px; }

  /* -- Hero card stats -- */
  .qs-hero-card-stats { grid-template-columns: repeat(3, 1fr); gap: 12px; }
}


/* === MÓVIL ≤480px === */
@media (max-width: 480px) {

  .qs-hero, .qh-hero { padding: 110px 16px 48px; }
  .qs-hero h1, .qh-hero h1 { font-size: 28px; line-height: 1.12; }

  .qh-btns, .qs-btns,
  .qh-cta .qh-btns, .qs-cta .qs-btns,
  .bl-cta-btns { flex-direction: column; }
  .btn-primary, .btn-ghost { width: 100%; text-align: center; }

  .qh-hero-badge { left: 12px; bottom: 12px; padding: 10px 14px; }

  .qh-video-section { padding: 48px 16px 56px; }
  .qh-recibes, .qs-pilares-section { padding: 56px 16px; }
  .qh-proceso, .qh-para-quien, .qh-futuro { padding: 56px 16px; }
  .qh-cta, .qs-cta { padding: 72px 16px; }

  .qh-section-title, .qs-pilares-titulo { font-size: 24px; }

  .qs-bento, .qh-bento { grid-template-columns: 1fr; }
  .qs-bento-item, .qh-bento-item { padding: 28px 20px; }

  .qh-pasos { gap: 48px; }
  .qh-paso-num { font-size: 48px; }
  .qh-pq-card { padding: 28px 20px; }

  .qh-futuro-chips { gap: 6px; }
  .qh-futuro-chip { font-size: 10px; padding: 5px 10px; }

  .qs-trust-inner { grid-template-columns: repeat(2, 1fr); }
  .qs-hero-card { padding: 28px 20px; }
  .qs-hero-card-stats { grid-template-columns: 1fr; gap: 12px; }

  .qh-video-wrap { border-radius: 12px; }

  .bl-hero { padding: 110px 16px 40px; }
  .bl-grid { grid-template-columns: 1fr; }
}


/* === iPhone SE ≤380px === */
@media (max-width: 380px) {
  .qs-hero, .qh-hero { padding: 100px 12px 40px; }
  .qs-hero h1, .qh-hero h1 { font-size: 24px; }
}