/* =====================================================================
   APARTADO "INTEGRIDAD INSTITUCIONAL" (.mcna-int)
   Se carga solo en las páginas que usan el shortcode [mcna_integridad].
   Paleta y tipografía tomadas del resto del sitio (azules institucionales
   #0b3d8c / #1e54a7 / #0f2c5c) para que no se sienta un cuerpo extraño.
   ===================================================================== */

.mcna-int {
  --azul: #0b3d8c;
  --azul-2: #1e54a7;
  --azul-osc: #0f2c5c;
  --tinta: #16233a;
  --gris: #5a6b80;
  --linea: #e3eaf4;
  --fondo: #f4f7fb;
  --fondo-2: #eaf1fb;
  --amarillo: #f0a91e;
  --verde: #1f9d57;

  color: var(--tinta);
  font-size: 17px;
  line-height: 1.7;

  /* El apartado se inserta en una sección fullwidth de Divi, que ocupa todo el
     viewport. El ancho de lectura se acota aquí. */
  max-width: 1240px;
  margin: 0 auto;
  padding: 30px 26px 56px;
}

.mcna-int *,
.mcna-int *::before,
.mcna-int *::after { box-sizing: border-box; }

.mcna-int__ico { width: 24px; height: 24px; flex: 0 0 auto; }

/* ------------------------------ Portada ------------------------------ */
.mcna-int__hero {
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  padding: 72px 40px;
  color: #fff;
  background:
    radial-gradient(1100px 420px at 82% -10%, rgba(255, 255, 255, .16), transparent 60%),
    linear-gradient(135deg, var(--azul-osc) 0%, var(--azul) 55%, var(--azul-2) 100%);
}
/* Fotografía de fondo (mirador del Cristo Blanco). Va detrás del degradado,
   con opacidad baja y mezcla luminosa, de modo que aporte textura sin restar
   contraste al texto: el título mantiene su legibilidad sobre el azul. */
.mcna-int__hero-bg {
  position: absolute; inset: 0;
  z-index: 0;
  pointer-events: none;
}
.mcna-int__hero-bg img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 42%;
  display: block;
}
/* Velo degradado: opaco donde se apoya el texto y más transparente hacia la
   derecha, para que la fotografía se lea sin comprometer el contraste del
   título. Los valores están ajustados para superar 4.5:1 en el texto. */
.mcna-int__hero::before {
  content: "";
  position: absolute; inset: 0;
  z-index: 1;
  background: linear-gradient(100deg,
    rgba(11, 32, 68, .95) 0%,
    rgba(12, 40, 88, .88) 38%,
    rgba(13, 55, 122, .68) 66%,
    rgba(20, 74, 150, .50) 100%);
  pointer-events: none;
}
/* Trama sutil para que el bloque no quede plano */
.mcna-int__hero::after {
  content: "";
  position: absolute; inset: 0;
  z-index: 2;
  background-image: radial-gradient(rgba(255, 255, 255, .10) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity: .5;
  pointer-events: none;
}
.mcna-int__hero-in { position: relative; z-index: 3; }

.mcna-int__eyebrow {
  margin: 0 0 10px;
  font-size: 13px; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase;
  color: #a9c8f5;
}
.mcna-int__title {
  margin: 0 0 16px;
  font-size: clamp(32px, 5vw, 52px);
  line-height: 1.1; font-weight: 800; letter-spacing: -.02em;
  color: #fff;
  /* Sombra tenue: la línea larga llega hasta la zona donde la fotografía
     aclara, y así el texto mantiene contraste suficiente en todo el ancho. */
  text-shadow: 0 2px 12px rgba(6, 20, 44, .55);
}
.mcna-int__lead {
  margin: 0 0 28px;
  font-size: clamp(16px, 2vw, 19px);
  color: #e8f0fc;
  text-shadow: 0 1px 8px rgba(6, 20, 44, .6);
}
.mcna-int__eyebrow { text-shadow: 0 1px 6px rgba(6, 20, 44, .5); }
.mcna-int__hero-cta { display: flex; flex-wrap: wrap; gap: 12px; }

/* ------------------------------ Botones ------------------------------ */
.mcna-int__btn {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 13px 22px;
  border-radius: 10px;
  font-size: 15px; font-weight: 700; line-height: 1.2;
  text-decoration: none;
  transition: transform .18s ease, background .18s ease, box-shadow .18s ease, color .18s ease;
}
.mcna-int__btn .mcna-int__ico { width: 19px; height: 19px; }
.mcna-int__btn:hover { transform: translateY(-2px); text-decoration: none; }
.mcna-int__btn:focus-visible { outline: 3px solid var(--amarillo); outline-offset: 3px; }

.mcna-int__btn--primary { background: var(--azul); color: #fff; box-shadow: 0 6px 18px rgba(11, 61, 140, .22); }
.mcna-int__btn--primary:hover { background: var(--azul-2); color: #fff; box-shadow: 0 10px 24px rgba(11, 61, 140, .3); }
.mcna-int__btn--light { background: #fff; color: var(--azul-osc); }
.mcna-int__btn--light:hover { background: #eaf1fb; color: var(--azul-osc); }
.mcna-int__btn--ghost { background: rgba(255, 255, 255, .12); color: #fff; box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .5); }
.mcna-int__btn--ghost:hover { background: rgba(255, 255, 255, .22); color: #fff; }

/* --------------------------- Navegación ----------------------------- */
.mcna-int__nav {
  /* --mcna-int-nav-top lo calcula el JS del shortcode con el borde inferior
     del header sticky de Divi. Sin JS cae a 0 y sigue siendo utilizable.
     El z-index queda por debajo del header (Divi usa valores muy altos)
     para que, ante cualquier desajuste, la nav pase por detrás y no encima. */
  position: sticky;
  /* El valor por defecto (132px) es la altura real del header sticky de Divi
     en escritorio. Así la nav queda bien colocada aunque el JS no llegue a
     ejecutarse o se sirva una copia cacheada del HTML sin él; el JS solo
     afina el valor cuando el header cambia de alto. */
  top: var(--mcna-int-nav-top, 132px);
  z-index: 5;
  margin: 26px 0 10px;
  background: rgba(255, 255, 255, .92);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
  border: 1px solid var(--linea);
  border-radius: 14px;
  box-shadow: 0 4px 16px rgba(16, 38, 74, .06);
}
.mcna-int__nav ul {
  display: flex; flex-wrap: wrap; gap: 4px;
  margin: 0; padding: 7px; list-style: none;
}
.mcna-int__nav li { margin: 0; flex: 1 1 auto; }
.mcna-int__nav a {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  padding: 12px 14px;
  border-radius: 9px;
  color: var(--azul-osc); font-size: 14.5px; font-weight: 700;
  text-decoration: none; text-align: center;
  transition: background .18s ease, color .18s ease;
}
.mcna-int__nav a:hover { background: var(--fondo-2); color: var(--azul); text-decoration: none; }
.mcna-int__nav a:focus-visible { outline: 3px solid var(--amarillo); outline-offset: -2px; }
.mcna-int__nav .mcna-int__ico { width: 19px; height: 19px; color: var(--azul-2); }

/* ---------------------------- Secciones ----------------------------- */
.mcna-int__sec {
  margin: 30px 0;
  padding: 46px 40px;
  border: 1px solid var(--linea);
  border-radius: 18px;
  background: #fff;
  /* Compensa la nav sticky al saltar por ancla */
  scroll-margin-top: var(--mcna-int-anchor, 96px);
}
.mcna-int__sec--alt { background: var(--fondo); }

.mcna-int__head {
  display: flex; align-items: center; gap: 16px;
  margin-bottom: 26px;
  padding-bottom: 18px;
  border-bottom: 2px solid var(--linea);
}
.mcna-int__num {
  flex: 0 0 auto;
  display: grid; place-items: center;
  width: 46px; height: 46px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--azul-osc), var(--azul-2));
  color: #fff; font-size: 16px; font-weight: 800; letter-spacing: .02em;
}
.mcna-int__h2 {
  margin: 0;
  font-size: clamp(21px, 3vw, 28px);
  line-height: 1.25; font-weight: 800; color: var(--azul-osc);
}
.mcna-int__h3 {
  margin: 38px 0 16px;
  font-size: 20px; font-weight: 800; color: var(--azul-osc);
}

.mcna-int__grid2 { display: grid; grid-template-columns: 1.45fr 1fr; gap: 30px; align-items: start; }
.mcna-int__prose p { margin: 0 0 15px; }
.mcna-int__prose p:last-child { margin-bottom: 0; }
.mcna-int__intro { margin: 0 0 26px; font-size: 18px; max-width: 80ch; }

.mcna-int__hint {
  margin-top: 18px !important;
  padding: 14px 18px;
  border-left: 4px solid var(--azul-2);
  border-radius: 0 10px 10px 0;
  background: var(--fondo-2);
  color: var(--azul-osc); font-size: 16px;
}

/* ------------------------------ Tarjetas ---------------------------- */
.mcna-int__card {
  padding: 26px;
  border: 1px solid var(--linea);
  border-radius: 14px;
  background: var(--fondo);
}
.mcna-int__sec--alt .mcna-int__card { background: #fff; }
.mcna-int__card h3 {
  display: flex; align-items: center; gap: 10px;
  margin: 0 0 16px;
  font-size: 17px; font-weight: 800; color: var(--azul-osc);
}
.mcna-int__card .mcna-int__ico { color: var(--azul-2); }

.mcna-int__legal { margin: 0; padding: 0; list-style: none; }
.mcna-int__legal li {
  margin: 0 0 13px; padding: 0 0 13px 0;
  border-bottom: 1px dashed var(--linea);
  font-size: 15px; line-height: 1.6; color: var(--gris);
}
.mcna-int__legal li:last-child { margin: 0; padding-bottom: 0; border-bottom: 0; }
.mcna-int__legal strong { display: block; color: var(--azul-osc); }

.mcna-int__card--cta { text-align: center; }
.mcna-int__card--cta .mcna-int__ico { width: 40px; height: 40px; margin: 0 auto 12px; color: var(--azul-2); display: block; }
.mcna-int__card--cta h3 { justify-content: center; }
.mcna-int__card--cta p { margin: 0 0 20px; font-size: 15.5px; color: var(--gris); }

/* -------------------------- Objetivos ------------------------------- */
.mcna-int__callout {
  padding: 22px 26px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--azul-osc), var(--azul-2));
  color: #fff;
}
.mcna-int__tag {
  display: inline-block; margin-bottom: 8px;
  font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
  color: #a9c8f5;
}
.mcna-int__callout p { margin: 0; font-size: 17px; }

.mcna-int__checks { margin: 20px 0 0; padding: 0; list-style: none; }
.mcna-int__checks li {
  position: relative;
  margin: 0 0 13px; padding-left: 36px;
  font-size: 16px; color: var(--tinta);
}
.mcna-int__checks li::before {
  content: "";
  position: absolute; left: 0; top: 4px;
  width: 22px; height: 22px;
  border-radius: 50%;
  background: var(--verde) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center / 13px 13px no-repeat;
}

/* -------------------------- Funciones ------------------------------- */
.mcna-int__funcs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(268px, 1fr));
  gap: 18px;
}
.mcna-int__func {
  padding: 24px;
  border: 1px solid var(--linea);
  border-radius: 14px;
  background: var(--fondo);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.mcna-int__sec--alt .mcna-int__func { background: #fff; }
.mcna-int__func:hover {
  transform: translateY(-3px);
  border-color: #c8dbf5;
  box-shadow: 0 12px 26px rgba(16, 38, 74, .08);
}
.mcna-int__func .mcna-int__ico { width: 30px; height: 30px; margin-bottom: 12px; color: var(--azul-2); }
.mcna-int__func h4 { margin: 0 0 8px; font-size: 16.5px; font-weight: 800; color: var(--azul-osc); }
.mcna-int__func p { margin: 0; font-size: 15px; line-height: 1.62; color: var(--gris); }

/* --------------------- Canales de denuncia -------------------------- */
/* Columnas explícitas (no auto-fit): con 4 canales, auto-fit dejaba una
   tarjeta huérfana en una fila propia según el ancho disponible. */
.mcna-int__canales {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
@media (max-width: 1180px) { .mcna-int__canales { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 680px)  { .mcna-int__canales { grid-template-columns: 1fr; } }
.mcna-int__canal {
  position: relative;
  display: flex; flex-direction: column;
  padding: 28px 26px 26px;
  border: 1px solid var(--linea);
  border-top: 4px solid var(--azul-2);
  border-radius: 14px;
  background: #fff;
  transition: transform .2s ease, box-shadow .2s ease;
}
.mcna-int__canal:hover { transform: translateY(-3px); box-shadow: 0 14px 30px rgba(16, 38, 74, .1); }
.mcna-int__canal-n {
  position: absolute; top: 18px; right: 20px;
  font-size: 40px; font-weight: 800; line-height: 1;
  color: var(--fondo-2);
}
.mcna-int__canal .mcna-int__ico { width: 32px; height: 32px; margin-bottom: 14px; color: var(--azul-2); }
.mcna-int__canal h3 { margin: 0 0 10px; font-size: 17.5px; font-weight: 800; color: var(--azul-osc); }
.mcna-int__canal p { margin: 0 0 20px; font-size: 15px; line-height: 1.62; color: var(--gris); }
/* El botón se empuja al pie para que todas las tarjetas lo alineen, ocupa el
   ancho completo y centra su contenido. */
.mcna-int__canal .mcna-int__btn {
  margin-top: auto;
  align-self: stretch;
  width: 100%;
  justify-content: center;
  text-align: center;
  word-break: break-word;
}

/* Los iconos grandes de las tarjetas (32-40px, en azul y con margen) no deben
   alcanzar al icono que va dentro de un botón. Con tres clases esta regla gana
   a las de tarjeta sin recurrir a !important. `color: inherit` hace que tome
   el color del propio botón: blanco en los azules, azul en los claros. */
.mcna-int .mcna-int__btn .mcna-int__ico {
  width: 19px;
  height: 19px;
  margin: 0;
  display: inline-block;
  color: inherit;
}

/* ------------------------------ Aviso ------------------------------- */
.mcna-int__aviso {
  display: flex; gap: 18px;
  margin-top: 30px; padding: 26px;
  border: 1px solid #f6d9a8;
  border-left: 5px solid var(--amarillo);
  border-radius: 14px;
  background: #fffaf0;
}
.mcna-int__aviso .mcna-int__ico { width: 28px; height: 28px; color: #c47f0d; }
.mcna-int__aviso h3 { margin: 0 0 10px; font-size: 17px; font-weight: 800; color: #8a5a06; }
.mcna-int__aviso p { margin: 0 0 10px; font-size: 15.5px; color: #6b4b12; }
.mcna-int__aviso p:last-child { margin: 0; }

/* ---------------------------- Descargas ----------------------------- */
.mcna-int__descargas { margin-top: 34px; }
.mcna-int__descargas h3 { margin: 0 0 16px; font-size: 19px; font-weight: 800; color: var(--azul-osc); }
.mcna-int__docs { display: grid; grid-template-columns: repeat(auto-fit, minmax(285px, 1fr)); gap: 16px; }
.mcna-int__doc {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-areas: "ico titulo" "ico desc" "ico meta";
  gap: 2px 16px;
  padding: 20px 22px;
  border: 1px solid var(--linea);
  border-radius: 13px;
  background: #fff;
  text-decoration: none;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.mcna-int__doc:hover {
  transform: translateY(-2px);
  border-color: var(--azul-2);
  box-shadow: 0 10px 24px rgba(16, 38, 74, .1);
  text-decoration: none;
}
.mcna-int__doc:focus-visible { outline: 3px solid var(--amarillo); outline-offset: 2px; }
.mcna-int__doc .mcna-int__ico { grid-area: ico; align-self: center; width: 32px; height: 32px; color: var(--azul-2); }
.mcna-int__doc-t { grid-area: titulo; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--azul-2); }
.mcna-int__doc-d { grid-area: desc; font-size: 15.5px; font-weight: 700; line-height: 1.4; color: var(--azul-osc); }
.mcna-int__doc-m { grid-area: meta; font-size: 13px; color: var(--gris); }

.mcna-int__nota {
  margin: 18px 0 0; padding: 15px 18px;
  border-left: 4px solid #d9492f;
  border-radius: 0 10px 10px 0;
  background: #fdf1ef;
  font-size: 14.5px; line-height: 1.6; color: #7d2c1c;
}

/* --------------------- Sección sin contenido ------------------------ */
.mcna-int__vacio {
  padding: 46px 30px;
  border: 2px dashed #cfdcee;
  border-radius: 14px;
  background: #fff;
  text-align: center;
}
.mcna-int__vacio .mcna-int__ico { width: 42px; height: 42px; margin: 0 auto 14px; color: #9db4d4; display: block; }
.mcna-int__vacio h3 { margin: 0 0 10px; font-size: 19px; font-weight: 800; color: var(--azul-osc); }
.mcna-int__vacio p { margin: 0 auto; max-width: 62ch; font-size: 15.5px; color: var(--gris); }

/* ------------------------------ Cierre ------------------------------ */
.mcna-int__cierre {
  margin-top: 30px;
  padding: 52px 40px;
  border-radius: 18px;
  text-align: center;
  color: #fff;
  background: linear-gradient(135deg, var(--azul-osc) 0%, var(--azul) 100%);
}
.mcna-int__cierre h2 { margin: 0 0 10px; font-size: clamp(22px, 3vw, 30px); font-weight: 800; color: #fff; }
.mcna-int__cierre p { margin: 0 0 26px; font-size: 17px; color: #dbe7fa; }
.mcna-int__cierre-cta { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }

/* Solo para lectores de pantalla (por si el tema no lo define) */
.mcna-int .screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}

/* ---------------------------- Responsive ---------------------------- */
@media (max-width: 980px) {
  .mcna-int__hero { padding: 56px 30px; border-radius: 16px; }
  .mcna-int__sec { padding: 36px 28px; border-radius: 16px; }
  .mcna-int__grid2 { grid-template-columns: 1fr; gap: 24px; }
  .mcna-int__cierre { padding: 44px 28px; }
}

@media (max-width: 767px) {
  .mcna-int { font-size: 16px; }
  .mcna-int__hero { padding: 42px 22px; }
  .mcna-int__sec { padding: 30px 20px; margin: 22px 0; scroll-margin-top: var(--mcna-int-anchor, 80px); }
  .mcna-int__cierre { padding: 38px 22px; }

  /* La nav pasa a rejilla 2x2: con carrusel horizontal las dos últimas
     opciones quedaban fuera de pantalla y no se veía que hubiera más. */
  .mcna-int__nav { border-radius: 12px; }
  .mcna-int__nav ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    padding: 6px;
    overflow: visible;
  }
  .mcna-int__nav li { flex: none; }
  .mcna-int__nav a {
    justify-content: flex-start;
    gap: 8px;
    padding: 11px 10px;
    font-size: 13.5px;
    line-height: 1.3;
    text-align: left;
    background: var(--fondo);
  }
  .mcna-int__nav .mcna-int__ico { width: 17px; height: 17px; }
  /* Con 5 secciones, el ultimo elemento ocupa las dos columnas para que no
     quede una celda huerfana en la ultima fila. */
  .mcna-int__nav li:last-child { grid-column: 1 / -1; }
  .mcna-int__nav li:last-child a { justify-content: center; }

  .mcna-int__head { gap: 12px; margin-bottom: 20px; }
  .mcna-int__num { width: 38px; height: 38px; font-size: 14px; border-radius: 10px; }
  .mcna-int__aviso { flex-direction: column; gap: 12px; padding: 22px; }
  .mcna-int__hero-cta .mcna-int__btn,
  .mcna-int__cierre-cta .mcna-int__btn { width: 100%; justify-content: center; }
  .mcna-int__canal-n { font-size: 34px; top: 16px; right: 16px; }
}

@media (max-width: 420px) {
  .mcna-int__doc {
    grid-template-columns: 1fr;
    grid-template-areas: "ico" "titulo" "desc" "meta";
    gap: 6px;
  }
  .mcna-int__doc .mcna-int__ico { margin-bottom: 4px; }
}

/* Respeta a quien pide menos animación */
@media (prefers-reduced-motion: reduce) {
  .mcna-int__btn,
  .mcna-int__func,
  .mcna-int__canal,
  .mcna-int__doc { transition: none; }
  .mcna-int__btn:hover,
  .mcna-int__func:hover,
  .mcna-int__canal:hover,
  .mcna-int__doc:hover { transform: none; }
}

/* Impresión: que el ciudadano pueda imprimir la información limpia */
@media print {
  .mcna-int__nav { display: none; }
  .mcna-int__hero,
  .mcna-int__cierre,
  .mcna-int__callout,
  .mcna-int__num { background: #fff !important; color: #000 !important; }
  .mcna-int__title,
  .mcna-int__lead,
  .mcna-int__cierre h2,
  .mcna-int__cierre p { color: #000 !important; }
  .mcna-int__sec { break-inside: avoid; border-color: #999; }
}


/* =====================================================================
   NEUTRALIZACIÓN DE ESTILOS DE DIVI
   Divi aplica `.entry-content ul { list-style: disc }` y paddings propios,
   con más especificidad que una clase suelta. Estas reglas usan doble
   clase para ganar sin recurrir a !important.
   ===================================================================== */
.mcna-int ul,
.mcna-int ol {
  margin: 0;
  padding: 0;
  list-style: none;
}
.mcna-int .mcna-int__checks,
.mcna-int .mcna-int__legal,
.mcna-int .mcna-int__nav ul { list-style: none; padding: 0; }
.mcna-int .mcna-int__checks li,
.mcna-int .mcna-int__legal li { list-style: none; }
.mcna-int .mcna-int__nav ul { padding: 7px; }
.mcna-int .mcna-int__checks li { padding-left: 36px; }

/* Divi fuerza color y tamaño en los encabezados del contenido */
.mcna-int h1, .mcna-int h2, .mcna-int h3, .mcna-int h4 { padding: 0; }
.mcna-int__hero .mcna-int__title,
.mcna-int__cierre h2 { color: #fff; }

/* Los enlaces del apartado no heredan el subrayado de Divi */
.mcna-int a { text-decoration: none; }

/* Márgenes laterales del apartado en pantallas menores */
@media (max-width: 980px) { .mcna-int { padding: 22px 18px 44px; } }
@media (max-width: 767px) { .mcna-int { padding: 14px 12px 34px; } }

/* =====================================================================
   JUSTIFICACIÓN DEL TEXTO
   Todo el texto de lectura del apartado va justificado, tanto en
   escritorio como en móvil, y ocupa el ancho completo de su contenedor.
   No se usa separación silábica: partir palabras con guion al final de
   la línea se lee mal; la palabra completa baja al renglón siguiente.
   ===================================================================== */
.mcna-int__lead,
.mcna-int__prose p,
.mcna-int__intro,
.mcna-int__hint,
.mcna-int__callout p,
.mcna-int__checks li,
.mcna-int__legal li,
.mcna-int__func p,
.mcna-int__canal p,
.mcna-int__aviso p,
.mcna-int__nota,
.mcna-int__vacio p {
  text-align: justify;
  /* La última línea no se estira de margen a margen */
  text-align-last: left;
}

/* Ninguna palabra se parte con guion; las muy largas (correos, URLs) sí
   se quiebran antes que desbordar su tarjeta. */
.mcna-int,
.mcna-int p,
.mcna-int li,
.mcna-int h1,
.mcna-int h2,
.mcna-int h3,
.mcna-int h4 {
  -webkit-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
  overflow-wrap: break-word;
}

/* Se liberan los topes de medida para que el texto llegue de borde a
   borde de su contenedor, en lugar de cortarse antes. */
.mcna-int__hero-in,
.mcna-int__lead,
.mcna-int__intro,
.mcna-int__vacio p { max-width: none; }

/* Altura del header sticky por tramo, como respaldo del valor que calcula el
   JS. Medido en el sitio: 132 px en escritorio y 82 px cuando la barra
   superior se oculta (≤980 px). */
@media (max-width: 980px) {
  .mcna-int__nav { top: var(--mcna-int-nav-top, 82px); }
  .mcna-int__sec { scroll-margin-top: var(--mcna-int-anchor, 150px); }
}