/* VS V43 — pulido responsive + CTAs + precarga visual
   Base: v42 estable. Esta capa solo corrige alineación responsive y evita cortes de titulares. */

/* CTAs: en tablet/móvil deben sentirse centrados, no desplazados a la izquierda */
@media screen and (max-width: 980px) {
  .vs-contact-compact .inner,
  .vs-contact-page .inner,
  .vs-about-cta .inner {
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }
  .vs-contact-compact header,
  .vs-contact-page header,
  .vs-about-cta header {
    width: 100% !important;
    max-width: 46rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
  }
  .vs-contact-compact .actions,
  .vs-contact-page .actions,
  .vs-about-cta .actions {
    width: min(24rem, 100%) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* Responsive: evitar titulares cortados o palabras empujadas fuera del viewport */
@media screen and (max-width: 736px) {
  .vs-contact-compact h2,
  .vs-contact-page h2,
  .vs-about-cta h2 {
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: none !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: min(100%, 18rem) !important;
    line-height: 1.12 !important;
    letter-spacing: .025em !important;
  }

  /* Home: “¿Listo para trabajar juntos?” centrado y natural */
  body.landing #contacto.vs-contact-compact h2 {
    font-size: clamp(1.25rem, 6.4vw, 1.85rem) !important;
    max-width: 16rem !important;
  }
  body.landing #contacto.vs-contact-compact p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 20rem !important;
  }

  /* Servicios: mantener “¿Tienes una idea en mente?” en una sola línea */
  .vs-services-cta h2 {
    white-space: nowrap !important;
    font-size: clamp(.95rem, 4.65vw, 1.28rem) !important;
    letter-spacing: .018em !important;
    max-width: 100% !important;
    line-height: 1.14 !important;
  }
  .vs-services-cta p,
  .vs-about-cta p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 22rem !important;
  }

  /* Contacto: permite 2 líneas limpias sin cortar “experiencia” */
  .vs-contact-page h2 {
    font-size: clamp(1.28rem, 6.8vw, 1.95rem) !important;
    max-width: 11.7em !important;
    overflow: visible !important;
  }
  .vs-contact-page p {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 21rem !important;
  }

  .vs-contact-compact .button.fit,
  .vs-contact-page .button.fit,
  .vs-about-cta .button.fit {
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
  }
}

@media screen and (max-width: 380px) {
  .vs-services-cta h2 {
    font-size: clamp(.9rem, 4.45vw, 1.05rem) !important;
    letter-spacing: .01em !important;
  }
  .vs-contact-page h2 {
    font-size: clamp(1.16rem, 6.2vw, 1.6rem) !important;
    max-width: 11.4em !important;
  }
}

/* CTA agregado en Nosotros: mismo lenguaje visual, sin hacer que la página se sienta vacía */
.vs-about-cta {
  border-top: 1px solid rgba(255,255,255,.08) !important;
}
.vs-about-cta h2,
.vs-about-cta p {
  text-align: inherit;
}

/* Evita que las imágenes esperen demasiado al entrar a páginas internas */
.vs-service-editorial-card img,
.vs-about-mini-grid img,
.vs-home-split-image img {
  content-visibility: auto;
}