/* Mejoras de usabilidad de enteleqqia.com (Alacacom, 11-2026). Acompaña a enteleqqia-ux.js. */
:root {
  --ent-verde: #41c379;      /* verde de botones del sitio */
  --ent-verde-texto: #1e7a46; /* mismo tono, oscurecido para texto sobre blanco (5,4:1) */
  --ent-lima: #8fbf21;       /* menú */
  --ent-azul: #00215b;       /* azul de la marca (15:1 sobre blanco) */
  --ent-gris: #5f6368;
}

/* Foco visible para quien navega con teclado (no cambia nada con el mouse). Dos tonos: el anillo blanco se ve
   sobre los fondos oscuros del sitio (pie, cabeceras con foto, bloque de contacto) y el azul sobre los claros. */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 3px solid var(--ent-azul) !important;
  outline-offset: 3px;
  box-shadow: 0 0 0 3px #fff !important;
}
.ent-oculto { display: none !important; }
/* Sin desplazamiento lateral: la fila del pie (y una caja del inicio) sobresalían 12 a 32 px de la pantalla.
   Se recorta lo que sobra, sin mover nada: el pie se ve igual que antes. «hidden» es el respaldo de Safari < 16. */
app-footer { display: block; overflow-x: hidden; overflow-x: clip; }
body { overflow-x: hidden; overflow-x: clip; }
.ent-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- decisiones de Enteleqqia (ENT-WEB-004-R, 09-11-2026) ---------- */
/* §3.1: el teléfono fijo no se publica. El script borra el número de los textos; esto lo oculta desde el comienzo,
   antes de que el script corra, en el pie y en los bloques de teléfonos del inicio y de contacto. */
a[href="tel:+56224944562"], p:has(> a[href="tel:+56224944562"]:only-child) { display: none !important; }
/* §5: íconos de redes sin dirección (apuntan a «#»): ocultos. El script muestra los que tengan dirección. */
app-footer .social-links li:has(> a[href="#"]) { display: none !important; }
/* §5: texto azul marino sobre los fondos verdes en todo el sitio (antes blanco: 2,2:1 sobre el lima y 2,3:1 sobre
   el verde de los botones; ahora 7,0:1 y 6,8:1). Son los textos sobre verde que se encontraron recorriendo cada vista. */
app-home a.btn.btn-secondary, app-home a.btn.btn-primary, app-home .soluciones-personalizadas-texto a.btn,
#calculate h2.color-text, app-home .bg-img-2.bg-secondary .pad, app-home .bg-img-2.bg-secondary .pad *,
app-blog #pageintro footer a.btn, .btn.inverse:hover, #backtotop, .pagination .current * {
  color: var(--ent-azul) !important;
}

/* ---------- menú fijo (apagado: MENU_FIJO en el script) ---------- */
html.ent-menu-fijo { scroll-padding-top: 72px; } /* las anclas (#features, #noticias) no quedan bajo la barra fija */
.ent-nav-hueco { height: 0; }
nav.navbar.ent-nav-fija { position: fixed !important; top: 0; left: 0; right: 0; width: auto !important; min-width: 0 !important; z-index: 1030; padding: 6px 16px !important; background: rgba(0, 33, 91, .97) !important; box-shadow: 0 2px 12px rgba(0, 0, 0, .25); animation: ent-baja .2s ease-out; }
nav.navbar.ent-nav-fija .navbar-brand { padding-top: 0 !important; padding-bottom: 0 !important; }
nav.navbar.ent-nav-fija .navbar-brand img { height: 40px; width: auto; }
nav.navbar.ent-nav-fija .navbar-collapse.show, nav.navbar.ent-nav-fija .navbar-collapse.collapsing { max-height: calc(100vh - 64px); overflow-y: auto; }
@keyframes ent-baja { from { transform: translateY(-100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { nav.navbar.ent-nav-fija { animation: none; } }
/* Botón del menú del celular: las líneas eran oscuras sobre la foto oscura y casi no se veían. */
nav.navbar .navbar-toggler { border-color: rgba(255, 255, 255, .7); }
nav.navbar .navbar-toggler-icon { filter: invert(1) brightness(2); }

/* ---------- /blog ---------- */
/* La lista por categorías de Angular se oculta desde el comienzo (sin destello). Si la lista nueva no se puede
   dibujar, el script quita la clase ent-ux y vuelve la de Angular con el paginador del shim. */
html.ent-ux app-blog .wrapper.row3:not(.ent-blog) { display: none !important; }
.ent-blog { padding: 64px 0 72px; background: #fff; }
.ent-blog .container { max-width: 1170px; }
.ent-blog__cabecera { text-align: center; margin-bottom: 32px; }
.ent-blog__antetitulo { margin: 0 0 6px; font-family: Kanit, sans-serif; font-size: 15px; color: var(--ent-gris); }
.ent-blog__titulo { margin: 0; font-family: Kanit, sans-serif; font-weight: 600; font-size: 32px; line-height: 1.2; color: #000; text-transform: none; }
.ent-blog__barra { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid #e6e6e6; }
.ent-blog__resumen { margin: 0; font-size: 15px; color: var(--ent-gris); }
.ent-blog__vacio { text-align: center; color: var(--ent-gris); }
.ent-blog__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 32px; }
.ent-card { margin: 0; padding: 0; }
.ent-card article { position: relative; height: 100%; display: flex; flex-direction: column; background: #fff; border: 1px solid #e6e6e6; border-radius: 8px; overflow: hidden; transition: box-shadow .2s, transform .2s; }
.ent-card article:hover, .ent-card article:focus-within { box-shadow: 0 10px 28px rgba(0, 33, 91, .12); transform: translateY(-2px); }
.ent-card__img { aspect-ratio: 3 / 2; background: #eef2f7; overflow: hidden; }
.ent-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ent-card__cuerpo { display: flex; flex-direction: column; flex: 1; padding: 20px 22px 22px; }
.ent-card__meta { margin: 0 0 8px; font-size: 13px; color: var(--ent-gris); }
.ent-card__fecha { display: inline-block; padding: 2px 8px; border-radius: 4px; background: #eef7f1; color: var(--ent-verde-texto); font-weight: 600; text-transform: uppercase; letter-spacing: .02em; }
.ent-card__titulo { margin: 0 0 10px; font-family: Kanit, sans-serif; font-size: 19px; line-height: 1.3; font-weight: 600; text-transform: none; }
.ent-card__titulo a { color: var(--ent-azul); text-decoration: none; }
.ent-card__titulo a::after { content: ""; position: absolute; inset: 0; } /* toda la tarjeta es clicable, con un solo enlace */
.ent-card__titulo a:hover { text-decoration: underline; }
.ent-card__extracto { margin: 0 0 16px; font-size: 15px; line-height: 1.55; color: #3c4043; text-align: left; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.ent-card__mas { margin-top: auto; font-weight: 600; color: var(--ent-verde-texto); }

/* Paginador */
.ent-pag { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin-top: 40px; font-family: Kanit, sans-serif; }
.ent-pag--compacto { margin: 0; gap: 12px; font-size: 15px; }
.ent-pag a, .ent-pag__num { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-width: 44px; min-height: 44px; padding: 0 14px; border: 1px solid var(--ent-verde); border-radius: 6px; color: var(--ent-verde-texto); text-decoration: none; font-weight: 600; background: #fff; }
.ent-pag a:hover { background: #eef7f1; }
.ent-pag__num[aria-current="page"] { background: var(--ent-azul); border-color: var(--ent-azul); color: #fff; }
.ent-pag__estado { color: var(--ent-gris); }
.ent-pag__hueco { min-width: 24px; text-align: center; color: var(--ent-gris); }
.ent-pag--compacto a { min-height: 40px; }

@media (max-width: 991px) { .ent-blog__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } }
@media (max-width: 640px) {
  .ent-blog { padding: 40px 0 48px; }
  .ent-blog .container { padding-left: 16px; padding-right: 16px; }
  .ent-blog__titulo { font-size: 26px; }
  .ent-blog__lista { grid-template-columns: 1fr; gap: 20px; }
  .ent-blog__barra { justify-content: center; text-align: center; }
  .ent-pag--compacto { display: none; } /* en el celular basta el paginador del final */
}

/* ---------- pie de página ---------- */
app-footer .col-lg-8[style*="9B9B9B" i] { background-color: #4a4a4a !important; }
app-footer .col-lg-8[style*="9B9B9B" i] a, app-footer .col-lg-8[style*="9B9B9B" i] p, app-footer .col-lg-8[style*="9B9B9B" i] li { color: #f1f1f1 !important; }
app-footer .col-lg-8[style*="9B9B9B" i] a:hover { color: #fff !important; text-decoration: underline; }
app-footer .copyright-area p { color: var(--ent-azul) !important; font-weight: 500; }
.ent-ultimas { list-style: none; margin: 0; padding: 0; }
.ent-ultimas li { margin: 0 0 14px; line-height: 1.4; }
.ent-ultimas a { display: block; padding: 2px 0; text-decoration: none; }
.ent-ultimas__fecha { display: block; font-size: 13px; opacity: .85; text-transform: uppercase; }
.ent-ultimas__todas { font-weight: 600; }

/* ---------- detalle de blog ---------- */
.ent-detalle-fin { clear: both; padding: 40px 0 72px; }
.ent-volver { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; font-weight: 600; color: var(--ent-verde-texto); text-decoration: none; }
.ent-volver:hover { text-decoration: underline; }
.ent-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px 32px; margin-top: 24px; padding: 28px 32px; border-radius: 8px; background: var(--ent-azul); color: #fff; }
.ent-cta p { margin: 0; color: #fff; }
.ent-cta__titulo { font-family: Kanit, sans-serif; font-size: 22px; font-weight: 600; margin-bottom: 4px !important; }
.ent-boton { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 28px; border-radius: 6px; background: var(--ent-verde); color: var(--ent-azul) !important; font-family: Kanit, sans-serif; font-weight: 600; text-decoration: none; }
.ent-boton:hover { background: #5fd192; }
app-details .sidebar a[href$="#calculate"] { color: var(--ent-verde-texto) !important; } /* «Novedades»: verde legible */
@media (max-width: 768px) {
  app-details .content p, app-details .content h2, app-details .content h3 { text-align: left !important; } /* sin «ríos» de texto justificado */
  .ent-cta { padding: 24px 20px; }
}

/* ---------- avisos (contacto y calculadoras) ---------- */
.ent-alerta { display: block; margin: 16px 0 0; padding: 12px 16px; border-radius: 6px; border-left: 4px solid; font-size: 15px; line-height: 1.45; text-align: left; }
.ent-alerta[hidden] { display: none; }
/* !important: el aviso de contacto es un div.error-msg de Angular, cuya regla con atributo pinta el texto en blanco. */
.ent-alerta.ent-alerta--ok { background: #eaf7ef !important; border-color: var(--ent-verde-texto) !important; color: #14532d !important; }
.ent-alerta.ent-alerta--error { background: #fdecec !important; border-color: #b42318 !important; color: #7a1c14 !important; }
.ent-alerta a { color: inherit; font-weight: 600; text-decoration: underline; }
.ent-faltan { margin: 6px 0 0; padding: 8px 16px; border-radius: 6px; background: #fdecec; color: #7a1c14; font-size: 15px; text-align: left; }
.ent-faltan[hidden] { display: none; }

/* ---------- calculadoras ---------- */
#calculate .center-div { flex-wrap: wrap; gap: 12px; } /* fila de botones: el aviso va debajo, a todo el ancho */
#calculate .center-div > .ent-salto { flex-basis: 100%; height: 0; }
#calculate .center-div > .ent-alerta { max-width: 640px; margin: 4px auto 0; }
.ent-boton-ejemplo { margin: 0; padding: 6px 16px; min-height: 44px; border: 1px solid var(--ent-azul); border-radius: 6px; background: #fff; color: var(--ent-azul); font-weight: 500; cursor: pointer; }
.ent-boton-ejemplo:hover { background: #eef2f7; }
.ent-sin-datos > :not(.ent-sin-calculo) { display: none !important; }
.ent-sin-calculo { max-width: 640px; margin: 120px auto; padding: 40px 32px; text-align: center; border: 1px solid #e6e6e6; border-radius: 8px; background: #fff; font-family: Kanit, sans-serif; }
.ent-sin-calculo h1 { font-size: 28px; color: var(--ent-azul); margin: 0 0 12px; }
.ent-sin-calculo p { color: #3c4043; margin: 0 0 24px; font-size: 17px; }
@media (max-width: 640px) { .ent-sin-calculo { margin: 48px 16px; padding: 28px 20px; } }