/* =========================================================
   V31 — CORRECCIONES GLOBALES 11-08-2026
   Alcance: nitidez/encuadre de imágenes, espaciado de títulos,
   cabecera móvil en legales, miga de pan y acciones flotantes.
   ========================================================= */

/* 1) Evitar palabras visualmente pegadas en títulos destacados. */
.subrayado-tu-empresa,
.subrayado-tu-negocio {
  word-spacing: .12em !important;
}

/* Si el destacado viene inmediatamente después de texto, conserva una separación visual real. */
.equipo-cabecera h2 .subrayado-tu-empresa,
.problemas-cabecera h2 .subrayado-tu-negocio {
  margin-inline-start: .12em !important;
}

/* 2) Servicios: render limpio y sin filtros/transformaciones que suavicen las fotos. */
.servicio-imagen {
  image-rendering: auto !important;
  transform: none !important;
  filter: none !important;
  background-repeat: no-repeat !important;
}
.servicio-imagen-financiera,
.servicio-imagen-contable,
.servicio-imagen-digital {
  background-size: cover !important;
}
.servicio-imagen-digital {
  background-image: url('../imagenes/servicios/sistema-facturacion-web-v31.webp') !important;
}

/* 3) Sección Problemas: en móvil se muestra la fotografía completa, sin recorte de cabeza/manos/documentos. */
@media (max-width: 720px) {
  .problemas-imagen {
    width: 100% !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: 3 / 2 !important;
    background: #eef2f0 !important;
  }
  .problemas-imagen img {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
  }
}

/* 4) Miga de pan: legibilidad reforzada en todos los tamaños. */
.miga-global .miga-pan,
.hero-interior .miga-pan {
  font-size: 16px !important;
  line-height: 1.45 !important;
  gap: 9px !important;
}
.miga-global .miga-pan a,
.miga-global .miga-pan span,
.hero-interior .miga-pan a,
.hero-interior .miga-pan span {
  font-size: inherit !important;
}
@media (max-width: 720px) {
  .miga-global .miga-pan,
  .hero-interior .miga-pan {
    font-size: 15px !important;
    gap: 8px !important;
  }
  .miga-global h1,
  .hero-interior h1 {
    font-size: clamp(27px, 8vw, 34px) !important;
  }
}

/* 5) Páginas legales: encabezado visible y estable durante todo el scroll en móvil. */
@media (max-width: 720px) {
  body.pagina-legal .encabezado,
  body.pagina-legal .encabezado.fijo {
    position: sticky !important;
    top: 0 !important;
    z-index: 6000 !important;
    width: 100% !important;
    padding-bottom: 0 !important;
    background: #fff !important;
  }
  body.pagina-legal .encabezado .menu-envuelto,
  body.pagina-legal .encabezado.fijo .menu-envuelto {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    box-shadow: 0 5px 18px rgba(3,58,53,.10) !important;
  }
  body.pagina-legal .franja-contenedor {
    display: none !important;
  }
}

/* 6) WhatsApp y Volver arriba: disponibles también en páginas interiores. */
.acciones-flotantes {
  position: fixed !important;
  right: 18px !important;
  bottom: 18px !important;
  z-index: 6500 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 10px !important;
}
.acciones-flotantes .whatsapp-flotante {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.acciones-flotantes .volver-arriba.visible {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
}
@media (max-width: 720px) {
  .acciones-flotantes {
    right: 14px !important;
    bottom: 14px !important;
    gap: 9px !important;
  }
}

/* 7) Nosotros: usa exactamente el comportamiento global del header/footer. */
body.pagina-nosotros .encabezado,
body.pagina-nosotros .footer-gael {
  width: 100%;
}
@media (max-width: 1120px) {
  body.pagina-nosotros .menu-zona {
    top: var(--menu-panel-top, 88px) !important;
  }
}
