/* =========================================================
   AFEU — estilos
   Sistema: los 4 colores de la marca, SINK para títulos y
   Aloevera para texto (con Anton y Outfit como reemplazo).

   Regla de contraste para la web (WCAG AA):
   - Blanco va SOLO sobre ladrillo o navy.
   - Sobre naranja y verde, el texto va en navy.
   (En los afiches se usa blanco sobre verde/naranja: en pantalla
   no llega al contraste mínimo, por eso acá se invierte.)
   ========================================================= */

/* ---------- Tipografías ---------- */
/* Reemplazos libres (OFL), autoalojados. */
@font-face {
  font-family: "Anton AFEU";
  src: url("/assets/fonts/Anton.woff2") format("woff2");
  font-display: swap;
}
@font-face {
  font-family: "Outfit AFEU";
  src: url("/assets/fonts/Outfit.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
/* Fuente de la marca para títulos. */
@font-face {
  font-family: "Sink";
  src: url("/assets/fonts/Sink.woff2") format("woff2");
  font-display: swap;
}
/* Para usar Aloevera: copiar el .woff2 en /assets/fonts/ y descomentar.
@font-face {
  font-family: "Aloevera Display";
  src: url("/assets/fonts/AloeveraDisplay.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}
*/

/* ---------- Tokens ---------- */
:root {
  --ladrillo: #9c4633;
  --ladrillo-osc: #823a29;
  --navy: #241e3c;
  --naranja: #f29346;
  --naranja-claro: #fde6d3;
  --verde: #65af54;
  --verde-claro: #d9ecd4;
  --blanco: #fff;
  --tinta-suave: #57526a;
  --linea: #d6d4dc;

  --f-display: "Sink", "Anton AFEU", Impact, "Arial Narrow", sans-serif;
  --f-texto: "Aloevera Display", "Outfit AFEU", system-ui, sans-serif;

  --radio: 14px;
  --ancho: 74rem;
  --margen: clamp(1rem, 4vw, 2.5rem);
  --foco: var(--navy);
  --alto-cabecera: 4.25rem;

  color-scheme: light;
}

/* ---------- Base ---------- */
*,
*::before,
*::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  font-family: var(--f-texto);
  font-size: 1.0625rem;
  line-height: 1.55;
  color: var(--navy);
  background: var(--blanco);
}

img, svg { display: block; max-width: 100%; }
h1, h2, h3, p, ul, dl { margin: 0; }
ul { padding: 0; }
h1, h2, h3 { text-wrap: balance; line-height: 1.15; }
p { text-wrap: pretty; }

a { color: inherit; text-decoration-thickness: 2px; text-underline-offset: 0.18em; }
a:hover { text-decoration-color: var(--ladrillo); }

:focus-visible { outline: 3px solid var(--foco); outline-offset: 3px; border-radius: 4px; }
main:focus { outline: none; }

.oculto {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden; clip-path: inset(50%);
  white-space: nowrap;
}

.saltar {
  position: absolute; left: 1rem; top: -4rem; z-index: 20;
  background: var(--navy); color: var(--blanco);
  padding: 0.6rem 1rem; border-radius: 0 0 8px 8px;
}
.saltar:focus { top: 0; }

.contenedor { width: min(100% - 2 * var(--margen), var(--ancho)); margin-inline: auto; }

.display {
  font-family: var(--f-display);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.01em;
  line-height: 0.95;
}

/* ---------- Botones ---------- */
.boton {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.4em;
  min-block-size: 2.75rem;
  padding: 0.65em 1.35em;
  border: 2px solid var(--ladrillo);
  border-radius: 999px;
  background: var(--ladrillo);
  color: var(--blanco);
  font: 600 1rem/1.2 var(--f-texto);
  text-decoration: none;
  transition: background-color 0.15s, border-color 0.15s, color 0.15s;
}
.boton:hover { background: var(--ladrillo-osc); border-color: var(--ladrillo-osc); }
.boton--contorno { background: transparent; color: var(--navy); border-color: currentColor; }
.boton--contorno:hover { background: var(--navy); border-color: var(--navy); color: var(--blanco); }
.boton--naranja { background: var(--naranja); border-color: var(--naranja); color: var(--navy); }
.boton--naranja:hover { background: var(--blanco); border-color: var(--blanco); }
.boton--verde { background: var(--verde); border-color: var(--verde); color: var(--navy); }
.boton--verde:hover { background: var(--blanco); border-color: var(--blanco); }
.boton .icono { width: 1.35rem; height: 1.35rem; }
.boton--chico { min-block-size: 2.5rem; padding: 0.45em 1em; font-size: 0.9375rem; }

@media (prefers-reduced-motion: reduce) { .boton { transition: none; } }
@media (pointer: fine) { .solo-tactil { display: none; } }

/* ---------- Cabecera (fija) ---------- */
.cabecera {
  position: sticky; top: 0; z-index: 10;
  background: var(--blanco);
  border-bottom: 1px solid var(--linea);
}
.cabecera__fila {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-block-size: var(--alto-cabecera);
}
.cabecera__logo { flex: none; color: var(--ladrillo); width: 6rem; }
.cabecera__logo svg { width: 100%; height: auto; }
.cabecera__nav ul { display: flex; align-items: center; gap: 0.25rem; list-style: none; }
.cabecera__nav a {
  display: block;
  padding: 0.5rem 0.8rem;
  font-weight: 600;
  text-decoration: none;
  border-bottom: 3px solid transparent;
}
.cabecera__nav a:hover { border-bottom-color: var(--naranja); }
.cabecera__nav a[aria-current="page"] { border-bottom-color: var(--ladrillo); }
.cabecera__red { flex: none; margin-left: 0.5rem; padding-left: 0.75rem; border-left: 1px solid var(--linea); }
.cabecera__red a { display: grid; place-items: center; padding: 0.5rem; border-bottom: 0; color: var(--ladrillo); border-radius: 50%; }
.cabecera__red a:hover { background: var(--naranja-claro); }
.cabecera__red .icono { width: 1.35rem; height: 1.35rem; min-width: 1.35rem; }

/* En celular: una sola fila, más baja, para que la cabecera fija no se coma la pantalla. */
@media (max-width: 44rem) {
  :root { --alto-cabecera: 3.5rem; }
  .cabecera__fila { gap: 0.5rem; }
  .cabecera__logo { width: 3.3rem; }
  .cabecera__nav { margin-right: -0.5rem; }
  .cabecera__nav ul { gap: 0; }
  .cabecera__nav a { padding: 0.9rem 0.4rem 0.75rem; font-size: 0.9375rem; }
  .cabecera__red { margin-left: 0.15rem; padding-left: 0.2rem; }
  .cabecera__red a { padding: 0.5rem; }
}
@media (max-width: 44rem) {
  /* Los ítems nunca se comprimen ni se pisan: si falta lugar, se achica la tipografía (abajo). */
  .cabecera__nav li { flex: none; }
  .cabecera__nav a { white-space: nowrap; }
}
@media (max-width: 26rem) {
  .cabecera__logo { width: 3rem; }
  .cabecera__nav a { padding-inline: 0.32rem; font-size: 0.875rem; }
  .cabecera__red { border-left: 0; margin-left: 0; padding-left: 0; }
  .cabecera__red a { padding: 0.4rem; }
}
@media (max-width: 21rem) {
  .cabecera__logo { width: 2.6rem; }
  .cabecera__nav a { padding-inline: 0.25rem; font-size: 0.8125rem; }
}

/* ---------- Portada (inicio) ---------- */
.portada { position: relative; overflow: hidden; }
.portada__grilla { padding-block: clamp(2.5rem, 7vw, 5.5rem) 14.5rem; }
.portada__texto { max-width: 40rem; position: relative; z-index: 1; }
.portada__titulo {
  color: var(--ladrillo);
  font-size: clamp(3rem, 1rem + 9.5vw, 6rem);
}
.portada__bajada { margin-top: 1.25rem; font-size: clamp(1.15rem, 1rem + 0.6vw, 1.4rem); font-weight: 500; max-width: 32ch; }
.portada__acciones { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 2rem; }
.portada__megafono {
  position: absolute;
  right: 0; bottom: 0;
  width: clamp(9.5rem, 34vw, 25rem);
  height: auto;
}
@media (min-width: 60rem) {
  .portada__grilla { padding-bottom: clamp(3rem, 7vw, 5.5rem); }
  .portada__texto { max-width: calc(100% - clamp(9.5rem, 34vw, 25rem)); }
}

/* ---------- Franjas de color ---------- */
.franja { padding-block: clamp(2.75rem, 6vw, 4.5rem); }
.franja--ladrillo { background: var(--ladrillo); color: var(--blanco); --foco: var(--blanco); }
.franja--verde { background: var(--verde); color: var(--navy); }
.franja__titulo { font-size: clamp(2.1rem, 1.3rem + 3vw, 3.5rem); }
.franja__bajada { margin-top: 0.75rem; max-width: 60ch; font-size: 1.125rem; }

.rubros {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr));
  gap: 0.75rem;
  margin-top: 2rem;
}
.rubro {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 0.9rem;
  align-items: center;
  height: 100%;
  padding: 1rem 1.1rem;
  border-radius: var(--radio);
  background: var(--blanco);
  color: var(--navy);
  text-decoration: none;
  --foco: var(--blanco);
}
.rubro .icono { grid-row: span 2; width: 2.25rem; height: 2.25rem; color: var(--ladrillo); }
.rubro__nombre { font-weight: 700; font-size: 1.0625rem; line-height: 1.2; }
.rubro__cantidad { font-size: 0.875rem; color: var(--tinta-suave); }
.rubro:hover { background: var(--naranja-claro); }
.rubro--cofe { background: var(--verde); }
.rubro--cofe .icono, .rubro--cofe .rubro__cantidad { color: var(--navy); }
.rubro--cofe:hover { background: var(--verde-claro); }
@media (max-width: 34rem) {
  .rubros { grid-template-columns: 1fr 1fr; gap: 0.6rem; }
  .rubro { grid-template-columns: 1fr; grid-template-rows: auto; row-gap: 0.5rem; align-content: start; padding: 0.9rem; }
  .rubro .icono { grid-row: auto; width: 2rem; height: 2rem; }
  .rubro__nombre { font-size: 1rem; hyphens: auto; }
}

/* ---------- Secciones ---------- */
.seccion { padding-block: clamp(3rem, 6vw, 5rem); }
.seccion--linea { border-top: 1px solid var(--linea); }
.seccion h2.display { font-size: clamp(2rem, 1.3rem + 2.6vw, 3.25rem); }

.sindicato-resumen, .dos-columnas { display: grid; gap: 1.25rem 3rem; }
@media (min-width: 52rem) {
  .sindicato-resumen, .dos-columnas { grid-template-columns: minmax(14rem, 1fr) 2fr; align-items: start; }
}
.texto-largo { max-width: 65ch; display: grid; gap: 1rem; }
.texto-largo h3 { margin-top: 0.75rem; font-size: 1.2rem; }
.texto-largo ul { padding-left: 1.2rem; }
.texto-largo li::marker { color: var(--ladrillo); }
.destacado, .sindicato-resumen .texto-largo p:first-child { font-size: clamp(1.2rem, 1rem + 0.7vw, 1.45rem); font-weight: 500; line-height: 1.45; }
.enlace-fuerte { font-weight: 700; color: var(--ladrillo); }

/* ---------- Cabeza de página ---------- */
.cabeza-pagina { padding-block: clamp(2.25rem, 5vw, 4rem); }
.cabeza-pagina h1 { font-size: clamp(2.6rem, 1.4rem + 5vw, 5rem); }
.cabeza-pagina__bajada { margin-top: 1rem; max-width: 60ch; font-size: 1.125rem; }
.cabeza-pagina--ladrillo { background: var(--ladrillo); color: var(--blanco); --foco: var(--blanco); }
.cabeza-pagina__consulta { margin-top: 1.5rem; }
@media (min-width: 44.01rem) {
  /* Con la barra de búsqueda activa (JS), el botón vive en la barra y no se repite arriba. */
  body:has(.filtros:not([hidden])) .cabeza-pagina__consulta { display: none; }
}
@media (max-width: 44rem) { .filtros__consulta { display: none; } }
.cabeza-pagina--naranja { background: var(--naranja); color: var(--navy); }
.cabeza-pagina--verde { background: var(--verde); color: var(--navy); }
.miga { margin-bottom: 0.5rem; font-weight: 600; }

.indice ul { display: flex; flex-wrap: wrap; gap: 0.5rem; list-style: none; margin-top: 1.5rem; }
.indice a {
  display: block; padding: 0.4em 0.95em;
  border: 2px solid currentColor; border-radius: 999px;
  font-weight: 600; text-decoration: none;
}
.indice a:hover { background: var(--navy); border-color: var(--navy); color: var(--blanco); }
[id], .convenios { scroll-margin-top: calc(var(--alto-cabecera) + 1rem); }

/* ---------- Nosotros ---------- */
.valores { list-style: none; display: flex; flex-wrap: wrap; gap: 0.6rem; margin-top: 1.75rem; }
.valores li { background: var(--blanco); padding: 0.55em 1.1em; border-radius: 999px; font-weight: 600; }

.autoridades { display: grid; gap: 2.5rem 4rem; margin-top: 2rem; }
@media (min-width: 52rem) { .autoridades { grid-template-columns: 1fr 1fr; } }
.autoridades h3 { font-size: 1.25rem; padding-bottom: 0.6rem; border-bottom: 4px solid var(--naranja); }
.personas { list-style: none; }
.personas li {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas: "nombre hoja" "cargo hoja";
  column-gap: 1rem;
  padding-block: 0.75rem;
  border-bottom: 1px solid var(--linea);
}
.personas__nombre { grid-area: nombre; font-weight: 600; }
.personas__cargo { grid-area: cargo; font-size: 0.9rem; color: var(--ladrillo); font-weight: 600; }
.personas__hoja { grid-area: hoja; align-self: center; font-size: 0.875rem; color: var(--tinta-suave); }

.comisiones {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr));
  gap: 2rem 1.5rem;
  margin-top: 2rem;
}
.comisiones > li { border-top: 6px solid var(--ladrillo); padding-top: 0.9rem; }
.comisiones h3 { font-size: 1.15rem; margin-bottom: 0.5rem; }
.comisiones ul { list-style: none; color: var(--tinta-suave); }

/* Documentos */
.documentos { display: grid; gap: 2.5rem; margin-top: 2rem; max-width: 60rem; }
.documentos__grupo h3 { font-size: 1.2rem; margin-bottom: 0.75rem; }
.documentos__lista { list-style: none; border-top: 2px solid var(--navy); }
.documento {
  display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0.75rem 1.5rem;
  padding-block: 1rem; border-bottom: 1px solid var(--linea);
}
.documento__texto { display: grid; gap: 0.2rem; }
.documento__titulo { font-weight: 600; }
.documento__norma {
  display: inline-block; margin-left: 0.4rem; padding: 0.05em 0.6em;
  background: var(--naranja-claro); border-radius: 999px;
  font-size: 0.8125rem; font-weight: 600; white-space: nowrap;
}
.documento__desc, .documento__meta { font-size: 0.9375rem; color: var(--tinta-suave); }
.documento .boton { justify-self: end; }
.documento .icono { width: 1.1rem; height: 1.1rem; }
.documento__pendiente { font-size: 0.875rem; color: var(--ladrillo); font-weight: 600; }
@media (max-width: 40rem) {
  .documento { grid-template-columns: 1fr; }
  .documento .boton { justify-self: start; }
}

/* ---------- Convenios: filtros ---------- */
.filtros {
  position: sticky; top: var(--alto-cabecera); z-index: 5;
  background: var(--blanco);
  border-bottom: 1px solid var(--linea);
  padding-block: 0.9rem;
}
.filtros__fila { display: grid; gap: 0.75rem; }
.filtros__arriba { display: flex; align-items: flex-end; gap: 0.75rem; }
.filtros__busqueda { display: grid; gap: 0.25rem; flex: 1; max-width: 30rem; }
.filtros__busqueda label { font-weight: 600; font-size: 0.9375rem; }
.filtros__busqueda input {
  font: inherit;
  min-block-size: 2.75rem;
  padding: 0.55em 1.1em;
  border: 2px solid var(--navy);
  border-radius: 999px;
  color: var(--navy);
  background: var(--blanco);
}
.filtros__busqueda input::placeholder { color: var(--tinta-suave); }
.filtros__chips { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.filtros__etiqueta {
  flex: none; display: inline-flex; align-items: center; gap: 0.35rem;
  font-weight: 600; font-size: 0.9375rem; color: var(--navy);
  padding-right: 0.25rem;
}
.filtros__etiqueta .icono { width: 1.1rem; height: 1.1rem; }
@media (max-width: 44rem) {
  .filtros { padding-block: 0.75rem 0.6rem; }
  .filtros__chips {
    flex-wrap: nowrap; overflow-x: auto;
    margin-inline: calc(-1 * var(--margen)); padding-inline: var(--margen);
    padding-bottom: 0.25rem;
    scrollbar-width: thin;
  }
  .filtros__busqueda label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
}
.chip {
  flex: none;
  min-block-size: 2.5rem;
  padding: 0.35em 1em;
  border: 2px solid var(--navy);
  border-radius: 999px;
  background: var(--blanco);
  color: var(--navy);
  font: 600 0.9375rem/1.2 var(--f-texto);
  cursor: pointer;
}
.chip:hover { background: var(--naranja-claro); }
.chip[aria-pressed="true"] { background: var(--navy); color: var(--blanco); }
.filtros__estado { font-size: 0.875rem; color: var(--tinta-suave); }

.indice-rubros ul { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; list-style: none; padding-top: 1.5rem; }
.indice-rubros a { font-weight: 600; }

/* ---------- Convenios: listado ---------- */
.convenios { padding-bottom: clamp(3rem, 6vw, 5rem); }
.rubro-seccion { padding-top: clamp(2.25rem, 5vw, 3.5rem); scroll-margin-top: calc(var(--alto-cabecera) + 11rem); }
.rubro-seccion__cabeza { display: flex; gap: 1rem; align-items: flex-start; margin-bottom: 1.25rem; }
.rubro-seccion__cabeza .icono {
  flex: none; width: 3rem; height: 3rem; padding: 0.6rem;
  border-radius: 50%; background: var(--naranja); color: var(--navy);
}
.rubro-seccion h2 { font: 400 clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem)/1 var(--f-display); text-transform: uppercase; }
.rubro-seccion__cabeza p { margin-top: 0.35rem; color: var(--tinta-suave); max-width: 60ch; }

.tarjetas {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 21rem), 1fr));
  gap: 1rem;
}
.tarjeta {
  display: flex; flex-direction: column; gap: 0.85rem;
  padding: 1.25rem;
  border: 2px solid var(--navy);
  border-radius: var(--radio);
  background: var(--blanco);
}
.tarjeta__cabeza { display: flex; gap: 0.9rem; align-items: center; }
.tarjeta__logo { flex: none; width: 4rem; height: 4rem; object-fit: contain; border-radius: 10px; border: 1px solid var(--linea); }
.tarjeta__monograma {
  flex: none; display: grid; place-items: center;
  width: 3.25rem; height: 3.25rem; border-radius: 10px;
  background: var(--naranja); color: var(--navy);
  font: 400 1.35rem/1 var(--f-display);
}
.tarjeta__nombre { font-size: 1.2rem; font-weight: 700; line-height: 1.2; }
.tarjeta__desc { font-size: 0.9375rem; color: var(--tinta-suave); margin-top: 0.15rem; }
.tarjeta__para {
  align-self: flex-start;
  padding: 0.3em 0.8em;
  border-radius: 8px;
  background: var(--verde-claro);
  font-size: 0.9375rem;
}
.tarjeta__para strong { font-weight: 700; }
.tarjeta__beneficios { padding-left: 1.15rem; display: grid; gap: 0.3rem; }
.tarjeta__beneficios li::marker { color: var(--ladrillo); }
.tarjeta__nota-chica { font-size: 0.9rem; color: var(--tinta-suave); }
.tarjeta__datos { display: grid; gap: 0.4rem; font-size: 0.9375rem; padding-top: 0.85rem; border-top: 1px solid var(--linea); }
.tarjeta__datos > div { display: grid; grid-template-columns: 6.25rem 1fr; gap: 0.75rem; }
.tarjeta__datos dt { color: var(--tinta-suave); font-weight: 600; }
.tarjeta__datos dd { margin: 0; overflow-wrap: anywhere; }
.tarjeta__acciones { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: auto; }
.tarjeta__acciones:empty { display: none; }
.tarjeta__revision {
  font-size: 0.875rem; padding: 0.6rem 0.8rem;
  border-left: 4px solid var(--naranja); background: #fff4e6;
}

.sin-resultados {
  margin-top: 2.5rem; padding: 2rem;
  border: 2px dashed var(--navy); border-radius: var(--radio);
  display: grid; gap: 0.75rem; justify-items: start;
}
.sin-resultados h2 { font-size: 1.35rem; }

.aviso-cofe {
  display: grid; gap: 1rem 1.25rem; align-items: center;
  margin-top: clamp(2.5rem, 5vw, 4rem);
  padding: 1.5rem;
  border-radius: var(--radio);
  background: var(--verde);
}
.aviso-cofe .icono { width: 2.75rem; height: 2.75rem; }
.aviso-cofe h2 { font-size: 1.35rem; }
.aviso-cofe p { margin-top: 0.25rem; max-width: 60ch; }
@media (min-width: 52rem) { .aviso-cofe { grid-template-columns: auto 1fr auto; } }

/* ---------- Prosa (COFE) ---------- */
.prosa > * { max-width: 46rem; }
.prosa > * + * { margin-top: 1rem; }
.prosa h2 { margin-top: 2.75rem; font: 400 clamp(1.6rem, 1.3rem + 1vw, 2rem)/1 var(--f-display); text-transform: uppercase; color: var(--ladrillo); }
.prosa h2:first-child { margin-top: 0; }
.prosa ul { padding-left: 1.2rem; display: grid; gap: 0.35rem; }
.prosa li::marker { color: var(--ladrillo); }
.prosa table { display: block; overflow-x: auto; border-collapse: collapse; font-size: 0.9375rem; }
.prosa th, .prosa td { padding: 0.55rem 0.9rem; text-align: left; border-bottom: 1px solid var(--linea); white-space: nowrap; }
.prosa th { background: var(--navy); color: var(--blanco); font-weight: 600; }
.prosa td:not(:first-child), .prosa th:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }

/* ---------- Pie ---------- */
.pie { background: var(--navy); color: var(--blanco); --foco: var(--blanco); }
.pie__grilla { display: grid; gap: 2rem 4rem; padding-block: clamp(2.75rem, 6vw, 4rem); }
@media (min-width: 52rem) { .pie__grilla { grid-template-columns: 1fr 1fr; align-items: end; } }
.pie h2 { font-size: clamp(2.1rem, 1.3rem + 3vw, 3.25rem); margin-bottom: 1rem; }
.pie address { font-style: normal; display: grid; gap: 0.35rem; font-size: 1.125rem; }
.pie__canal { display: grid; gap: 1.25rem; justify-items: start; max-width: 30rem; }
.pie .pie__canal-titulo { font: 400 clamp(1.6rem, 1.2rem + 1.4vw, 2.1rem)/1.05 var(--f-display); text-transform: uppercase; color: var(--naranja); margin: 0; }
.pie__franja { background: var(--ladrillo); padding-block: 1.1rem; }
.pie__franja-fila { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; }
.pie__logos { display: flex; align-items: center; gap: 1.5rem; color: var(--blanco); }
.pie__logo-afeu { width: 5.5rem; }
.pie__logos img { height: 2.25rem; width: auto; }
.pie__logo-pit { width: 3.25rem; }
.pie__logos svg { width: 100%; height: auto; }
.pie__logos a { display: block; color: inherit; border-radius: 4px; transition: opacity 0.15s; }
.pie__logos a:hover { opacity: 0.75; }
.pie__franja p { font-size: 0.875rem; }

/* ---------- Íconos ---------- */
.icono { width: 1.5rem; height: 1.5rem; flex: none; }

/* ---------- Modo de alto contraste ---------- */
@media (forced-colors: active) {
  .chip[aria-pressed="true"] { outline: 3px solid Highlight; }
  .tarjeta__monograma, .rubro { border: 1px solid CanvasText; }
}

/* ---------- Impresión ---------- */
@media print {
  .cabecera { position: static; }
  .cabecera__nav, .filtros, .cabeza-pagina__consulta, .portada__megafono, .tarjeta__acciones { display: none !important; }
  .tarjeta { break-inside: avoid; border-width: 1px; }
}