/* v31 · Comunidad Empresa (agente EMPRESA). El comportamiento sigue en v27-empresa.js.
   Una sola pieza propia, «El camino», en dos capítulos:
   1 · El camino (#camino, papel): cinco paradas (los cuatro frentes y la inversión grande) sobre una ruta que se
       recorre; debajo, el financiamiento canónico en tres capas (recursos propios de la 1 a la 5; cooperación y
       convenios desde la 3; Obras por Impuestos en la 5) y la ficha de cada parada con su esquema de lo medido.
       Al pie, como complemento breve, las NIIF S1 y S2 y el tablero de ejemplo, que resalta la parada abierta.
   2 · Obras por Impuestos, paso a paso (#oxi, noche): ocho pasos en una línea con quién lidera cada uno. Sin JS.
   v31 quita los apartados con foto (#apartados) y el capítulo de métricas (#metricas).
   Sin JS todo se lee seguido. Con prefers-reduced-motion no hay animaciones y el contenido está completo. */

.em-cam, .em-oxi{
  --em:var(--cm, #B5BF6E);
  --em-hondo:var(--cm-hondo, color-mix(in oklab, var(--em) 46%, var(--tinta)));
  --em-vidrio:rgba(244,242,238,.045);
  --em-borde:rgba(244,242,238,.12);
  /* Colores de quién lidera cada paso de Obras por Impuestos (sobre noche, contraste ≥ 7:1) */
  --rol-conecta:var(--em);
  --rol-aliado:#8FB4E8;
  --rol-estado:#5FC2B7;
  --rol-empresa:#E2B456;
}
.em-sr{ position:absolute !important; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0 }

/* Cabeceras de capítulo */
.em-cab{ max-width:46rem; margin:0 0 clamp(2rem,4vw,3.25rem) }
.em-cab .antetitulo{ color:var(--em-hondo) }
.em-cab .h2{ margin:0 0 var(--e-sm); text-wrap:balance; max-width:22ch }
.em-cab .entrada{ margin:0; max-width:60ch; text-wrap:pretty }
.em-cab--centro{ margin-inline:auto; text-align:center }
.em-cab--centro .h2, .em-cab--centro .entrada{ margin-inline:auto }
.oscuro .em-cab .antetitulo{ color:var(--em) }
.oscuro .em-cab .h2{ color:var(--papel) }
.oscuro .em-cab .entrada{ color:#C9D4D7 }

.em-fuente{ display:inline; font-family:var(--sans); font-size:.8rem; line-height:1.4; color:var(--t3); text-decoration:underline; text-decoration-color:var(--fl); text-underline-offset:.2em; transition:color .2s var(--curva) }
.em-fuente:hover{ color:var(--t1); text-decoration-color:currentColor }
.em-fuente svg{ display:inline; margin-left:.25em; vertical-align:baseline }

@keyframes em-aparece{ from{ opacity:0 } to{ opacity:1 } }

/* ============================================================ 2 · EL CAMINO (papel) */
.em-cam{ position:relative; overflow:clip }
.em-cam .em-fuente{ --t3:var(--mudo); --t1:var(--tinta); --fl:var(--filete-firme) }
.em-camino{ display:grid; gap:clamp(1.75rem,3.5vw,2.75rem) }

/* v30 · La ruta, rehecha: una sola pieza en cinco columnas iguales. Arriba las paradas sobre una línea recta;
   debajo, en las mismas columnas, las franjas de financiamiento. Con JS la columna elegida se vuelve una pestaña
   blanca que baja hasta la ficha: se lee de un vistazo qué parada está abierta y con qué se financia. */
.em-ruta{ --col:calc(100% / 5); position:relative; z-index:2; isolation:isolate; width:100%;
  padding:1.1rem 0 1.4rem; border-radius:1.4rem 1.4rem 0 0 }
.em-ruta__tab{ display:none; position:absolute; z-index:-1; top:0; bottom:-3px; width:var(--col); left:calc(var(--k, 0) * var(--col));
  background:var(--blanco); border-radius:1.1rem 1.1rem 0 0; box-shadow:0 0 0 1px var(--filete); clip-path:inset(-2px -2px 0 -2px);
  transition:left .45s var(--curva) }
.em-js .em-ruta__tab{ display:block }
.em-ruta__lista{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); position:relative }
.em-ruta__p{ position:relative; display:flex; justify-content:center; min-width:0 }
/* Tramos de la línea: cada parada dibuja la mitad que le toca a cada lado, a la altura del centro del círculo */
.em-ruta__p::before, .em-ruta__p::after{ content:""; position:absolute; z-index:-1; top:calc(1.55rem + 2.1rem); height:2px; margin-top:-1px;
  background:var(--filete-firme); transition:background-color .3s var(--curva) }
.em-ruta__p::before{ left:0; right:50% }
.em-ruta__p::after{ left:50%; right:0 }
.em-ruta__p:first-child::before, .em-ruta__p:last-child::after{ display:none }
.em-ruta__b{ display:grid; grid-template-rows:auto auto auto; justify-items:center; align-content:start; gap:.55rem; width:100%; text-align:center;
  text-decoration:none; color:var(--mudo); padding:0 .4rem .3rem; border-radius:.8rem; min-width:0; min-height:44px }
.em-ruta__num{ font-family:var(--sans); font-size:.78rem; line-height:1; font-weight:600; letter-spacing:.01em; color:var(--mudo); font-variant-numeric:tabular-nums; height:1rem; display:flex; align-items:flex-end }
.em-ruta__n{ display:grid; place-items:center; width:4.2rem; height:4.2rem; border-radius:50%; background:var(--papel);
  box-shadow:inset 0 0 0 1.5px var(--filete-firme);
  transition:background-color .3s var(--curva), box-shadow .3s var(--curva), transform .25s var(--curva) }
.em-ruta__n svg{ width:1.7rem; height:1.7rem; fill:none; stroke:var(--tinta-2); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; transition:stroke .3s var(--curva) }
.em-ruta__v{ font-family:var(--sans); font-size:.98rem; line-height:1.25; font-weight:640; color:var(--tinta-2); max-width:12ch; text-wrap:balance; min-height:2.5em; transition:color .2s var(--curva) }
.em-ruta__b:hover .em-ruta__v{ color:var(--tinta) }
.em-ruta__b:hover .em-ruta__n{ transform:translateY(-2px); box-shadow:inset 0 0 0 1.5px var(--tinta-2) }
.em-ruta__b:focus-visible{ outline:2px solid var(--petroleo); outline-offset:3px }
/* Paradas ya recorridas y tramo recorrido */
.em-ruta__b.em-hecha .em-ruta__n{ background:var(--blanco); box-shadow:inset 0 0 0 2px var(--em-hondo) }
.em-ruta__b.em-hecha .em-ruta__n svg{ stroke:var(--em-hondo) }
.em-ruta__p:has(.em-hecha)::after, .em-ruta__p:has(.em-hecha) + .em-ruta__p::before{ background:var(--em-hondo); height:3px; margin-top:-1.5px }
/* Parada abierta */
.em-ruta__b[aria-selected="true"] .em-ruta__num{ color:var(--em-hondo) }
.em-ruta__b[aria-selected="true"] .em-ruta__v{ color:var(--tinta) }
.em-ruta__b[aria-selected="true"] .em-ruta__n{ background:var(--noche); box-shadow:0 0 0 5px var(--blanco), 0 0 0 7px var(--em), 0 16px 26px -14px rgba(10,26,47,.55) }
.em-ruta__b[aria-selected="true"] .em-ruta__n svg{ stroke:var(--em) }

/* Franjas de financiamiento, en las mismas cinco columnas */

/* v31 · Con qué se financia, en las mismas cinco columnas de la ruta: tres capas que se apilan como en Qué hacemos.
   La base corre de la 1 a la 5; la cooperación y los convenios entran en la 3; Obras por Impuestos, en la 5.
   Con JS, las capas que todavía no entran en la parada abierta se atenúan. */
.em-fin{ position:relative; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); row-gap:.35rem;
  margin:1.5rem 0 0; padding-top:1rem; border-top:1px dashed var(--filete-firme) }
.em-fin p{ margin:0 }
.em-fin__k{ grid-row:1; grid-column:1 / -1; padding:0 .5rem .3rem; font-family:var(--sans); font-size:.78rem; font-weight:650; letter-spacing:.01em; color:var(--mudo) }
.em-fin__capa{ position:relative; display:flex; flex-wrap:wrap; align-items:baseline; gap:.1rem .6rem; min-width:0; margin-inline:.5rem; padding:.55rem .95rem;
  border-radius:.6rem; font-family:var(--sans); color:var(--tinta); transition:opacity .35s var(--curva), filter .35s var(--curva) }
.em-fin__capa b{ font-size:.86rem; line-height:1.3; font-weight:650 }
.em-fin__capa > span{ font-size:.78rem; line-height:1.3; color:var(--tinta-2) }
.em-fin__capa--oxi{ grid-row:2; grid-column:5; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:var(--noche); color:var(--papel);
  box-shadow:0 10px 22px -14px rgba(10,26,47,.7) }
.em-fin__capa--oxi b{ font-size:.82rem; text-wrap:balance }
.em-fin__capa--oxi > span{ color:var(--em); font-size:.74rem }
.em-fin__capa--coop{ grid-row:3; grid-column:3 / -1;
  background:repeating-linear-gradient(135deg, color-mix(in srgb, var(--em) 34%, var(--blanco)) 0 5px, var(--blanco) 5px 10px);
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--em-hondo) 55%, transparent) }
.em-fin__capa--propio{ grid-row:4; grid-column:1 / -1; background:color-mix(in srgb, var(--em) 46%, var(--papel)) }
.em-fin__nota{ grid-row:5; grid-column:1 / -1; padding:.45rem .5rem 0; font-family:var(--sans); font-size:.8rem; line-height:1.45; color:var(--mudo) }
.em-fin__nota a{ color:var(--tinta); font-weight:650; text-decoration:underline; text-decoration-color:var(--em-hondo); text-underline-offset:.22em; white-space:nowrap }
.em-fin__nota a:hover{ text-decoration-thickness:2px }
.em-fin__nota a:focus-visible{ outline:2px solid var(--petroleo); outline-offset:3px; border-radius:2px }
/* Lo que aún no entra en la parada abierta */
.em-js .em-fin[data-k="0"] .em-fin__capa--coop, .em-js .em-fin[data-k="1"] .em-fin__capa--coop,
.em-js .em-fin[data-k="0"] .em-fin__capa--oxi, .em-js .em-fin[data-k="1"] .em-fin__capa--oxi,
.em-js .em-fin[data-k="2"] .em-fin__capa--oxi, .em-js .em-fin[data-k="3"] .em-fin__capa--oxi{ opacity:.38; filter:saturate(.4) }


/* La ficha abierta se pega a la pestaña: la esquina del lado de la pestaña queda recta */
.em-js .em-ruta + .em-paradas{ margin-top:calc(-1 * clamp(1.75rem,3.5vw,2.75rem)) }
.em-js .em-paradas[data-k="0"] .em-parada{ border-top-left-radius:0 }
.em-js .em-paradas[data-k="4"] .em-parada{ border-top-right-radius:0 }

/* Fichas de cada parada: hoja blanca con su esquema */
.em-paradas{ display:grid; gap:clamp(2rem,4vw,3rem) }
.em-parada{ display:grid; align-content:start; gap:clamp(1.75rem,3.5vw,3rem); padding:clamp(1.4rem,3.2vw,2.75rem); border-radius:1.4rem; background:var(--blanco);
  box-shadow:0 0 0 1px var(--filete), 0 30px 60px -40px rgba(14,23,38,.4); scroll-margin-top:calc(var(--alto-nav) + 1rem) }
@media (min-width:58rem){ .em-parada{ grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); align-items:start } }
.em-parada:focus-visible{ outline:2px solid var(--petroleo); outline-offset:4px }
.em-parada__k{ display:flex; align-items:center; gap:.6rem; margin:0 0 .8rem; font-family:var(--sans); font-size:.86rem; font-weight:600; color:var(--mudo) }
.em-parada__ico{ display:grid; place-items:center; width:2.1rem; height:2.1rem; border-radius:50%; background:var(--noche) }
.em-parada__ico svg{ width:1.15rem; height:1.15rem; fill:none; stroke:var(--em); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round }
.em-parada__t{ margin:0 0 var(--e-sm); font-size:clamp(1.55rem,1.15rem + 1.3vw,2.25rem); line-height:1.1; letter-spacing:-.018em; font-weight:650; color:var(--tinta); text-wrap:balance; max-width:20ch }
.em-parada__pasa{ margin:0 0 1.5rem; font-family:var(--lee); font-size:1.05rem; line-height:1.65; color:var(--tinta-2); text-wrap:pretty; max-width:56ch }
.em-parada__dl{ margin:0 0 1.4rem; display:grid; gap:1rem 1.75rem }
@media (min-width:40rem){ .em-parada__dl{ grid-template-columns:1fr 1fr } }
.em-f{ border-top:1px solid var(--filete); padding-top:.75rem }
.em-f dt{ font-family:var(--sans); font-size:.82rem; font-weight:650; color:var(--em-hondo); margin:0 0 .3rem }
.em-f dd{ margin:0; font-family:var(--sans); font-size:.95rem; line-height:1.55; color:var(--tinta); text-wrap:pretty }
.em-parada__paga{ margin:0; display:flex; flex-wrap:wrap; align-items:baseline; gap:.2rem .5rem; font-family:var(--sans); font-size:.9rem; line-height:1.4 }
.em-parada__paga span{ color:var(--mudo) }
.em-parada__paga b{ color:var(--tinta); font-weight:650; text-decoration:underline; text-decoration-color:var(--em); text-decoration-thickness:3px; text-underline-offset:.3em }

/* Ejemplo real con miniatura */
.em-ej{ display:grid; grid-template-columns:5.5rem minmax(0,1fr); gap:1rem; align-items:center; margin-top:1.6rem; padding:.8rem; border-radius:1rem; background:var(--papel) }
.em-ej__foto{ margin:0; aspect-ratio:1; border-radius:.7rem; overflow:hidden }
.em-ej__foto picture{ display:block; height:100% }
.em-ej__img{ width:100%; height:100%; object-fit:cover; display:block }
.em-ej__t{ margin:0; font-family:var(--lee); font-size:.95rem; line-height:1.55; color:var(--tinta-2); text-wrap:pretty }
.em-ej__t b{ font-family:var(--sans); font-weight:650; color:var(--tinta) }
.em-ej__t a{ font-family:var(--sans); font-size:.88rem; font-weight:650; color:var(--tinta); text-decoration:underline; text-decoration-color:var(--em-hondo); text-underline-offset:.22em; white-space:nowrap }
.em-ej__t a:hover{ text-decoration-thickness:2px }
.em-ej__t a:focus-visible{ outline:2px solid var(--petroleo); outline-offset:3px; border-radius:2px }

/* Lo que queda medido: lienzo con retícula */
.em-viz{ margin:0; display:grid; align-content:start; gap:.8rem }
.em-viz__cab{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:.25rem 1rem }
.em-viz__cab b{ font-family:var(--sans); font-size:.92rem; font-weight:650; color:var(--tinta) }
.em-viz__cab span{ font-family:var(--lee); font-style:italic; font-size:.82rem; color:var(--mudo) }
.em-viz__lienzo{ border-radius:1rem; background:var(--papel); padding:clamp(.8rem,2vw,1.4rem) clamp(.6rem,1.6vw,1.2rem) clamp(.5rem,1.2vw,.9rem) }
.em-viz__svg{ width:100%; height:auto; display:block; overflow:visible }
.em-viz__txt{ font-family:var(--sans); font-size:10.5px; font-weight:600; fill:var(--mudo) }
.em-viz__txt--f{ font-family:var(--lee); font-style:italic; font-weight:400; font-size:11px; fill:var(--tinta-2) }
.em-viz__rej{ fill:none; stroke:var(--filete); stroke-width:1; stroke-dasharray:2 4 }
.em-viz__eje{ fill:none; stroke:var(--filete-firme); stroke-width:1.2 }
.em-viz__eje--marca{ stroke:var(--tinta-2); stroke-dasharray:3 4 }
.em-viz__b--1{ fill:color-mix(in srgb, var(--tinta) 18%, var(--papel)) }
.em-viz__b--2{ fill:color-mix(in srgb, var(--tinta) 32%, var(--papel)) }
.em-viz__b--3{ fill:color-mix(in srgb, var(--tinta) 48%, var(--papel)) }
.em-viz__trazo{ fill:none; stroke:var(--em-hondo); stroke-width:3; stroke-linecap:round; stroke-linejoin:round }
.em-viz__trazo--base{ stroke:var(--em-hondo); stroke-width:2.5; stroke-dasharray:.024 .016 !important; stroke-dashoffset:0 !important }
.em-viz__trazo--suave{ stroke:color-mix(in srgb, var(--tinta) 30%, var(--papel)); stroke-width:2 }
.em-viz__marca rect{ fill:var(--blanco); stroke:var(--em-hondo); stroke-width:1.2 }
.em-viz__acta{ fill:var(--blanco); stroke:var(--filete-firme); stroke-width:1.2; stroke-linejoin:round }
.em-viz__acta--si{ fill:color-mix(in srgb, var(--em) 55%, var(--blanco)); stroke:var(--em-hondo) }
.em-viz__pliegue{ fill:none; stroke:var(--filete-firme); stroke-width:1.1; stroke-linejoin:round }
.em-viz__linea{ fill:none; stroke:var(--filete-firme); stroke-width:1.4; stroke-linecap:round }
.em-viz__visto{ fill:none; stroke:var(--tinta); stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round }
.em-viz__puntos circle{ fill:var(--blanco); stroke:color-mix(in srgb, var(--tinta) 40%, var(--papel)); stroke-width:2 }
.em-viz__puntos .em-viz__p{ fill:var(--em-hondo); stroke:var(--blanco); stroke-width:2 }
.em-viz__llave{ fill:none; stroke:var(--tinta-2); stroke-width:1.3; stroke-linejoin:round }
.em-viz__local{ fill:var(--em-hondo) }
.em-viz__fuera{ fill:color-mix(in srgb, var(--tinta) 10%, var(--papel)) }
.em-viz__area{ fill:color-mix(in srgb, var(--em) 28%, transparent) }
.em-viz__zona{ fill:color-mix(in srgb, var(--tinta) 5%, var(--papel)) }
.em-viz__guia{ fill:none; stroke:var(--em-hondo); stroke-width:1.6; stroke-dasharray:3 4; stroke-linecap:round; opacity:.7 }
.em-viz__punto{ fill:var(--em-hondo); stroke:var(--blanco); stroke-width:2 }
.em-viz__flecha{ fill:none; stroke:var(--mudo); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round }
.em-viz__fuera--ley{ stroke:var(--filete-firme); stroke-width:1 }
.em-viz__obra{ fill:var(--blanco); stroke:var(--tinta); stroke-width:1.6; stroke-linejoin:round; stroke-linecap:round }
.em-viz__mide{ margin:.2rem 0 0; font-family:var(--sans); font-size:.98rem; line-height:1.5; font-weight:560; color:var(--tinta); text-wrap:pretty }
.em-viz__ley{ margin:0; font-family:var(--lee); font-size:.92rem; line-height:1.55; color:var(--tinta-2); text-wrap:pretty }
.em-viz__ir{ justify-self:start; font-family:var(--sans); font-size:.9rem; font-weight:650; color:var(--tinta); text-decoration:underline; text-decoration-color:var(--em-hondo); text-underline-offset:.24em; padding:.35rem 0; min-height:44px; display:inline-flex; align-items:center }
.em-viz__ir:hover{ text-decoration-thickness:2px }
.em-viz__ir:focus-visible{ outline:2px solid var(--petroleo); outline-offset:3px; border-radius:2px }

/* Dibujo de los esquemas: una sola vez, cuando la parada entra en pantalla */
.em-js .em-viz__trazo{ stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset .9s var(--curva) calc(.15s + var(--d, 0) * .16s) }
.em-js .em-dibuja .em-viz__trazo{ stroke-dashoffset:0 }
.em-js .em-viz__trazo--base, .em-js .em-viz__marca{ opacity:0; transition:opacity .6s var(--curva) .5s }
.em-js .em-dibuja .em-viz__trazo--base, .em-js .em-dibuja .em-viz__marca{ opacity:1 }
.em-js .em-viz__b, .em-js .em-viz__local, .em-js .em-viz__doc, .em-js .em-viz__puntos circle, .em-js .em-viz__punto, .em-js .em-viz__area{
  transform-box:fill-box; transition:transform .6s var(--curva), opacity .45s var(--curva); transition-delay:calc(var(--d, 0) * .06s) }
.em-js .em-viz__b{ transform-origin:bottom; transform:scaleY(.12) }
.em-js .em-viz__local{ transform-origin:left; transform:scaleX(0) }
.em-js .em-viz__doc, .em-js .em-viz__puntos circle, .em-js .em-viz__punto{ transform-origin:center; opacity:0; transform:scale(.7) }
.em-js .em-viz__area{ opacity:0 }
.em-js .em-dibuja .em-viz__b, .em-js .em-dibuja .em-viz__local, .em-js .em-dibuja .em-viz__doc,
.em-js .em-dibuja .em-viz__puntos circle, .em-js .em-dibuja .em-viz__punto{ transform:none; opacity:1 }
.em-js .em-dibuja .em-viz__area{ opacity:1; transition-delay:.7s }
.em-viz__ley .em-viz__acta, .em-viz__ley .em-viz__local{ opacity:1 !important; transform:none !important }

/* Con JS: las fichas se apilan y se recorren de lado */
.em-js .em-paradas{ display:grid; gap:0; touch-action:pan-y; overflow-x:clip; overflow-clip-margin:24px }
.em-js .em-parada{ grid-area:1 / 1; visibility:hidden; opacity:0; transform:translateX(calc(var(--dir, 1) * 56px));
  transition:opacity .35s var(--curva), transform .45s var(--curva), visibility 0s linear .45s }
.em-js .em-parada.em-sale{ transform:translateX(calc(var(--dir, 1) * -56px)) }
.em-js .em-parada.em-activa{ visibility:visible; opacity:1; transform:none; transition:opacity .35s var(--curva) .05s, transform .45s var(--curva), visibility 0s }

.em-camino__nav{ display:flex; align-items:center; justify-content:space-between; gap:1rem }
.em-camino__btn{ display:inline-flex; align-items:center; gap:.5rem; font:inherit; font-family:var(--sans); font-size:.92rem; font-weight:650; color:var(--tinta);
  background:var(--blanco); border:1px solid var(--filete-firme); border-radius:999px; padding:.6rem 1.15rem; cursor:pointer; min-height:44px;
  transition:background-color .2s var(--curva), border-color .2s var(--curva), color .2s var(--curva), opacity .2s var(--curva) }
.em-camino__btn:hover:not(:disabled){ background:var(--noche); border-color:var(--noche); color:var(--papel) }
.em-camino__btn:disabled{ opacity:.35; cursor:default }
.em-camino__btn:focus-visible{ outline:2px solid var(--petroleo); outline-offset:3px }
.em-camino__pos{ flex:1 1 0; min-width:0; margin:0; font-family:var(--sans); font-size:.86rem; color:var(--mudo); text-align:center; text-wrap:balance }
.em-camino__btn{ flex:none; white-space:nowrap }


/* Parada 5: enlace a Obras por Impuestos, paso a paso */
.em-parada__oxi{ display:inline-flex; align-items:center; gap:.45rem; min-height:44px; font-weight:650; color:var(--tinta); text-decoration:underline; text-decoration-color:var(--em-hondo); text-underline-offset:.24em }
.em-parada__oxi:hover{ text-decoration-thickness:2px }
.em-parada__oxi:focus-visible{ outline:2px solid var(--petroleo); outline-offset:3px; border-radius:2px }

/* ============================================================ 1b · LO QUE QUEDA MEDIDO (complemento breve del camino) */
.em-med{ display:grid; gap:clamp(1.5rem,3vw,2.5rem); margin-top:clamp(3rem,6vw,4.5rem); padding-top:clamp(2.25rem,4.5vw,3.25rem);
  border-top:1px solid var(--filete); scroll-margin-top:calc(var(--alto-nav) + 1rem) }
@media (min-width:62rem){ .em-med{ grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr); align-items:start } }
.em-med__txt{ display:grid; gap:.75rem; align-content:start }
.em-med__txt > p{ margin:0 }
.em-med__k{ font-family:var(--sans); font-size:.86rem; font-weight:650; color:var(--em-hondo) }
.em-med__t{ margin:0; font-family:var(--sans); font-size:clamp(1.45rem,1.15rem + 1vw,2rem); line-height:1.12; letter-spacing:-.018em; font-weight:650; color:var(--tinta); text-wrap:balance; max-width:20ch }
.em-med__d{ font-family:var(--lee); font-size:1.02rem; line-height:1.62; color:var(--tinta-2); text-wrap:pretty; max-width:48ch }

/* NIIF S1 y S2: hoja blanca; el año grande en trazo, al fondo */
.em-niif{ position:relative; isolation:isolate; display:grid; margin-top:.6rem; padding:clamp(1.2rem,2.6vw,1.75rem); border-radius:1.2rem;
  background:var(--blanco); box-shadow:0 0 0 1px var(--filete), 0 24px 50px -36px rgba(14,23,38,.35); overflow:hidden }
.em-niif p{ margin:0 }
.em-niif__ano{ position:absolute; z-index:-1; right:.12em; top:.1em; pointer-events:none;
  font-family:var(--sans); font-weight:700; font-size:clamp(3.4rem,2.6rem + 2vw,4.4rem); line-height:1; letter-spacing:-.055em; font-variant-numeric:tabular-nums;
  color:transparent; -webkit-text-stroke:1.5px color-mix(in srgb, var(--em-hondo) 45%, transparent) }
@supports not (-webkit-text-stroke:1px black){ .em-niif__ano{ color:color-mix(in srgb, var(--em) 22%, transparent) } }
.em-niif__cuerpo{ display:grid; gap:.6rem }
.em-niif__k{ font-family:var(--sans); font-size:.84rem; font-weight:650; color:var(--em-hondo) }
.em-niif__fecha{ font-family:var(--sans); font-size:clamp(1.2rem,1.05rem + .5vw,1.45rem); font-weight:600; line-height:1.2; letter-spacing:-.012em; color:var(--tinta); max-width:12ch }
.em-niif__fecha b{ font-weight:700; text-decoration:underline; text-decoration-color:var(--em); text-decoration-thickness:3px; text-underline-offset:.25em }
.em-niif__d{ font-family:var(--lee); font-size:.94rem; line-height:1.58; color:var(--tinta-2); text-wrap:pretty }
.em-niif .em-fuente{ --t3:var(--mudo); --t1:var(--tinta); --fl:var(--filete-firme) }
.em-plazo{ margin:.35rem 0 .2rem; display:grid; gap:.6rem }
.em-plazo__barra{ position:relative; height:6px; border-radius:3px; background:color-mix(in srgb, var(--tinta) 10%, var(--papel)) }
.em-plazo__hecho{ position:absolute; left:0; top:0; bottom:0; width:var(--hoy, 0%); border-radius:3px; background:var(--em-hondo); transform-origin:left }
.em-plazo__hoy{ position:absolute; top:50%; left:var(--hoy, 0%); width:14px; height:14px; margin:-7px 0 0 -7px; border-radius:50%; background:var(--blanco); box-shadow:0 0 0 3px var(--em-hondo) }
.em-plazo__barra::after{ content:""; position:absolute; right:-1px; top:-6px; width:2px; height:18px; background:var(--em-hondo); border-radius:1px }
.em-plazo__rot{ display:flex; justify-content:space-between; gap:.75rem; font-family:var(--sans); font-size:.74rem; line-height:1.3; color:var(--mudo) }
.em-plazo__rot span:last-child{ text-align:right }
.em-plazo__dif{ text-align:center; color:var(--tinta); font-size:.84rem !important }
.em-plazo__dif b{ font-weight:700 }
.em-js-plazo .em-plazo__hecho{ animation:em-crece 1.2s var(--curva) .2s both }
.em-espera .em-plazo__hecho{ transform:scaleX(0) }
@keyframes em-crece{ from{ transform:scaleX(0) } to{ transform:none } }

/* El tablero, en una ventana de navegador como las capturas del Ecosistema */
.em-tablero{ border-radius:1.1rem; overflow:hidden; background:#0D2038; color:var(--papel);
  box-shadow:inset 0 0 0 1px rgba(244,242,238,.14), 0 40px 80px -44px rgba(10,26,47,.75) }
.em-tablero__barra{ display:flex; align-items:center; gap:1rem; padding:.7rem 1rem; background:#081628; border-bottom:1px solid rgba(244,242,238,.08) }
.em-tablero__luces{ display:flex; gap:.4rem }
.em-tablero__luces i{ width:.62rem; height:.62rem; border-radius:50%; background:rgba(244,242,238,.2) }
.em-tablero__dir{ flex:1; max-width:30rem; padding:.3rem .9rem; border-radius:999px; background:rgba(244,242,238,.06); font-family:var(--sans); font-size:.76rem; color:#A9B9BD; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.em-tablero__main{ padding:clamp(.9rem,2.2vw,1.4rem) clamp(1rem,2.4vw,1.6rem) clamp(1rem,2.2vw,1.3rem); min-width:0 }
.em-tablero__solo{ display:none; margin:.2rem 0 .4rem; font-family:var(--sans); font-size:.82rem; line-height:1.45; color:var(--em) }
.em-tablero__ej{ margin:.6rem 0 0; font-family:var(--lee); font-style:italic; font-size:.86rem; line-height:1.45; color:#A9B9BD }

.em-t{ width:100%; border-collapse:collapse; font-family:var(--sans); font-size:.88rem; line-height:1.4 }
.em-t thead th{ text-align:left; font-size:.74rem; font-weight:650; color:#8FA3A8; padding:.45rem .8rem .55rem 0; border-bottom:1px solid rgba(244,242,238,.14) }
.em-t tbody th, .em-t td{ text-align:left; vertical-align:middle; padding:.5rem .8rem .5rem 0; border-bottom:1px solid rgba(244,242,238,.07) }
.em-t tbody tr:last-child > *{ border-bottom:0 }
.em-t tbody th{ font-weight:600; color:var(--papel) }
.em-t__ind{ display:block }
.em-t__ev{ display:block; margin-top:.15rem; font-family:var(--lee); font-weight:400; font-size:.84rem; line-height:1.4; color:#A9B9BD }
.em-t td{ color:#C9D4D7 }
.em-t__par{ font-size:.8rem; font-weight:600; color:var(--em) !important; white-space:nowrap }
.em-t__sp svg{ width:72px; height:22px; display:block; overflow:visible }
.em-t__sp path{ fill:none; stroke:var(--em); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round }
.em-t__sp .em-t__sp0{ stroke:rgba(244,242,238,.14); stroke-width:1; stroke-dasharray:2 3 }
.em-t__sp circle{ fill:var(--em); stroke:#0D2038; stroke-width:1.5 }
.em-estado{ display:inline-flex; align-items:center; gap:.4rem; font-size:.78rem; font-weight:600; color:var(--papel); white-space:nowrap }
.em-estado svg{ flex:none; width:1rem; height:1rem; fill:none; stroke:var(--em); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round }
.em-estado--seg svg{ stroke:#C9D4D7 }
/* La parada abierta en el camino: sus filas se resaltan; las demás quedan atrás */
.em-t tbody tr > *{ transition:opacity .3s var(--curva), background-color .3s var(--curva) }
.em-tablero[data-p] tbody tr:not(.em-on) > *{ opacity:.5 }
.em-tablero[data-p] tbody tr.em-on > *{ background:rgba(181,191,110,.09) }
.em-tablero[data-p] tbody tr.em-on > :first-child{ box-shadow:inset 3px 0 0 var(--em); padding-left:.8rem }
.em-js-tab .em-t__sp path:not(.em-t__sp0){ stroke-dasharray:1; stroke-dashoffset:1; transition:stroke-dashoffset 1s var(--curva) .2s }
.em-js-tab .em-t__sp circle{ opacity:0; transition:opacity .3s var(--curva) 1.1s }
.em-js-tab.em-visto .em-t__sp circle{ opacity:1 }
.em-js-tab.em-visto .em-t__sp path:not(.em-t__sp0){ stroke-dashoffset:0 }

@media (max-width:47.99rem){
  .em-t thead{ position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%) }
  .em-t thead th{ position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap }
  .em-t, .em-t tbody, .em-t tr, .em-t th, .em-t td{ display:block }
  .em-t tr{ display:grid; grid-template-columns:1fr auto; gap:.35rem 1rem; padding:.85rem 0; border-bottom:1px solid rgba(244,242,238,.1) }
  .em-t tbody tr:last-child{ border-bottom:0 }
  .em-t tbody th, .em-t td{ padding:0; border:0 }
  .em-t tbody th{ grid-column:1 / -1; font-size:.98rem }
  .em-t td[data-r="Parada"]{ grid-row:2 }
  .em-t td[data-r="Estado"]{ grid-row:2; justify-self:end; min-width:0 }
  .em-t__sp{ display:none !important }
  .em-tablero[data-p] tbody tr:not(.em-on){ display:none }
  .em-tablero[data-p] .em-tablero__solo{ display:block }
  .em-viz__ley{ display:none }
  .em-tablero[data-p] tbody tr.em-on{ box-shadow:inset 3px 0 0 var(--em); padding-left:.8rem; background:rgba(181,191,110,.09) }
  .em-tablero[data-p] tbody tr.em-on > *{ background:none; box-shadow:none; padding-left:0 }
}
@media (max-width:30rem){
  .em-niif__ano{ position:static; margin:0 0 .5rem !important; font-size:3rem }
}
@media (max-width:24rem){
  .em-t tr{ grid-template-columns:1fr }
  .em-t td[data-r="Estado"]{ grid-row:auto; justify-self:start }
  .em-tablero__dir{ font-size:.7rem }
}

/* Puente al capítulo siguiente: una línea en cursiva */
.em-puente-l{ margin:clamp(2.5rem,5vw,3.5rem) auto 0; max-width:62ch; text-align:center; font-family:var(--lee); font-size:1.06rem; line-height:1.6; color:var(--tinta-2); text-wrap:balance }
.em-puente-l a{ display:inline-flex; align-items:center; gap:.45rem; min-height:44px; margin-left:.25rem; font-family:var(--sans); font-size:.95rem; font-weight:650; color:var(--tinta);
  text-decoration:underline; text-decoration-color:var(--em-hondo); text-underline-offset:.24em; white-space:nowrap }
.em-puente-l a:hover{ text-decoration-thickness:2px }
.em-puente-l a:focus-visible{ outline:2px solid var(--petroleo); outline-offset:3px; border-radius:2px }

/* ============================================================ 2 · OBRAS POR IMPUESTOS, PASO A PASO (noche) */
.em-oxi{ position:relative; isolation:isolate; overflow:clip; color:var(--papel); padding-block:clamp(4.5rem,8vw,6.5rem) clamp(3rem,6vw,4.5rem);
  background:radial-gradient(110% 70% at 88% 0%, #12304A 0, var(--noche) 58%); scroll-margin-top:var(--alto-nav) }
.em-oxi .em-fuente{ --t3:#A9B9BD; --t1:var(--papel); --fl:rgba(244,242,238,.28) }
.em-oxi__rej{ display:grid; gap:clamp(1.5rem,3vw,3rem); margin-bottom:clamp(2.5rem,5vw,3.75rem) }
@media (min-width:62rem){ .em-oxi__rej{ grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); align-items:end } .em-oxi__cab{ margin-bottom:0 } }
.em-oxi__lado{ display:grid; gap:.8rem; align-content:end }
.em-oxi__lado p{ margin:0 }
.em-oxi__d{ font-family:var(--lee); font-size:1rem; line-height:1.62; color:#C9D4D7; text-wrap:pretty; max-width:48ch }
.em-oxi__k{ margin-top:.4rem !important; font-family:var(--sans); font-size:.8rem; font-weight:650; color:#A9B9BD }
.em-roles{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:.45rem }
.em-rol{ display:inline-flex; align-items:center; gap:.5rem; padding:.38rem .8rem .38rem .6rem; border-radius:999px; font-family:var(--sans); font-size:.82rem; font-weight:600; color:var(--papel);
  background:var(--em-vidrio); box-shadow:inset 0 0 0 1px var(--em-borde) }
.em-rol i{ width:.7rem; height:.7rem; border-radius:50%; background:var(--rol) }
.em-rol--conecta{ --rol:var(--rol-conecta) }
.em-rol--aliado{ --rol:var(--rol-aliado) }
.em-rol--estado{ --rol:var(--rol-estado) }
.em-rol--empresa{ --rol:var(--rol-empresa) }

/* Los ocho pasos: una línea continua. En escritorio, dos tramos de cuatro; en celular, una sola columna. */
.em-ox{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); column-gap:clamp(1rem,2.2vw,1.75rem); row-gap:clamp(2.25rem,4vw,3rem); counter-reset:ox }
.em-ox__p{ position:relative; display:grid; grid-template-rows:auto auto auto 1fr auto; align-content:start; gap:.55rem; min-width:0; padding-top:1.6rem }
.em-ox__p p, .em-ox__p h3{ margin:0 }
/* La línea: cada paso dibuja su tramo; el punto lleva el color de quien lo lidera */
.em-ox__p::before{ content:""; position:absolute; top:0; left:0; right:calc(-1 * clamp(1rem,2.2vw,1.75rem)); height:2px; margin-top:-1px;
  background:linear-gradient(90deg, var(--rol) 0, color-mix(in srgb, var(--rol) 30%, rgba(244,242,238,.16)) 100%); transform-origin:left }
.em-ox__p:nth-child(4n)::before, .em-ox__p:last-child::before{ right:0; background:linear-gradient(90deg, var(--rol) 0, rgba(244,242,238,.0) 100%) }
.em-ox__p::after{ content:""; position:absolute; top:-7px; left:0; width:14px; height:14px; border-radius:50%; background:var(--noche); box-shadow:inset 0 0 0 3px var(--rol), 0 0 0 4px rgba(10,26,47,.9) }
.em-ox__cab{ display:flex; align-items:baseline; justify-content:space-between; gap:.6rem }
.em-ox__n{ font-family:var(--sans); font-weight:700; font-size:clamp(2.4rem,1.8rem + 1.6vw,3.3rem); line-height:.9; letter-spacing:-.05em; font-variant-numeric:tabular-nums;
  color:transparent; -webkit-text-stroke:1.2px var(--rol) }
@supports not (-webkit-text-stroke:1px black){ .em-ox__n{ color:var(--rol) } }
.em-ox__rol{ display:inline-flex; align-items:center; gap:.4rem; font-family:var(--sans); font-size:.76rem; font-weight:650; color:var(--rol); white-space:nowrap }
.em-ox__t{ font-family:var(--sans); font-size:1.14rem; line-height:1.2; font-weight:650; letter-spacing:-.01em; color:var(--papel); text-wrap:balance }
.em-ox__pasa{ font-family:var(--lee); font-size:.94rem; line-height:1.55; color:#C9D4D7; text-wrap:pretty }
.em-ox__queda{ display:grid; grid-template-columns:1.05rem minmax(0,1fr); gap:.45rem; align-items:start; padding-top:.55rem; border-top:1px solid rgba(244,242,238,.1);
  font-family:var(--sans); font-size:.84rem; line-height:1.4; font-weight:560; color:var(--papel) }
.em-ox__queda svg{ width:1.05rem; height:1.05rem; margin-top:.05rem; fill:none; stroke:var(--rol); stroke-width:2; stroke-linecap:round; stroke-linejoin:round }
.em-ox__nota{ font-family:var(--sans); font-size:.76rem; line-height:1.45; color:#98AAB0; text-wrap:pretty }
.em-ox__p.em-rol--conecta .em-ox__queda svg{ stroke:var(--rol) }

/* Aparición: la línea se dibuja paso a paso, una sola vez, solo con JS y sin movimiento reducido */
.em-ox.em-js-ox .em-ox__p{ opacity:0; transform:translateY(12px); transition:opacity .5s var(--curva) calc(var(--i) * .08s), transform .6s var(--curva) calc(var(--i) * .08s) }
.em-ox.em-js-ox .em-ox__p::before{ transform:scaleX(0); transition:transform .5s var(--curva) calc(.1s + var(--i) * .08s) }
.em-ox.em-js-ox.em-visto .em-ox__p{ opacity:1; transform:none }
.em-ox.em-js-ox.em-visto .em-ox__p::before{ transform:none }

.em-oxi__pie{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1rem 2rem; margin-top:clamp(2.75rem,5vw,3.75rem);
  padding-top:clamp(1.5rem,3vw,2rem); border-top:1px solid rgba(244,242,238,.14) }
.em-oxi__obs{ margin:0; display:flex; flex-wrap:wrap; align-items:center; gap:.2rem .6rem; font-family:var(--lee); font-size:1.02rem; line-height:1.5; color:#C9D4D7 }
.em-oxi__obs a{ display:inline-flex; align-items:center; gap:.45rem; min-height:44px; font-family:var(--sans); font-size:.95rem; font-weight:650; color:var(--papel);
  text-decoration:underline; text-decoration-color:var(--em); text-underline-offset:.24em }
.em-oxi__obs a:hover{ text-decoration-thickness:2px }
.em-oxi__obs a:focus-visible{ outline:2px solid var(--papel); outline-offset:3px; border-radius:2px }

@media (max-width:61.99rem){
  .em-ox{ grid-template-columns:repeat(2,minmax(0,1fr)) }
  .em-ox__p:nth-child(4n)::before{ right:calc(-1 * clamp(1rem,2.2vw,1.75rem)); background:linear-gradient(90deg, var(--rol) 0, color-mix(in srgb, var(--rol) 30%, rgba(244,242,238,.16)) 100%) }
  .em-ox__p:nth-child(2n)::before, .em-ox__p:last-child::before{ right:0; background:linear-gradient(90deg, var(--rol) 0, rgba(244,242,238,.0) 100%) }
}
/* Celular: una sola columna; la línea baja por la izquierda */
@media (max-width:39.99rem){
  .em-ox{ grid-template-columns:1fr; row-gap:0 }
  .em-ox__p{ padding:0 0 1.9rem 2.1rem }
  .em-ox__p::before, .em-ox__p:nth-child(2n)::before, .em-ox__p:nth-child(4n)::before{ top:.35rem; bottom:0; left:6px; right:auto; width:2px; height:auto; margin:0;
    background:linear-gradient(180deg, var(--rol) 0, color-mix(in srgb, var(--rol) 30%, rgba(244,242,238,.16)) 100%); transform-origin:top }
  .em-ox__p:last-child::before{ background:linear-gradient(180deg, var(--rol) 0, rgba(244,242,238,0) 100%) }
  .em-ox__p::after{ top:.35rem }
  .em-ox.em-js-ox .em-ox__p::before{ transform:scaleY(0) }
  .em-ox__n{ font-size:2.2rem }
}

/* ============================================================ Celular · el camino */
@media (max-width:39.99rem){
  .em-ruta{ padding:.8rem 0 1.1rem }
  .em-ruta__p::before, .em-ruta__p::after{ top:calc(1.45rem + 1.45rem) }
  .em-ruta__b{ padding:0 .1rem .2rem; gap:.45rem }
  .em-ruta__num{ font-size:.72rem }
  .em-ruta__n{ width:2.9rem; height:2.9rem }
  .em-ruta__n svg{ width:1.25rem; height:1.25rem }
  .em-ruta__b[aria-selected="true"] .em-ruta__n{ box-shadow:0 0 0 3px var(--blanco), 0 0 0 5px var(--em) }
  .em-ruta__v{ font-size:.72rem; line-height:1.2; max-width:none; min-height:3.6em }
  .em-ruta__tab{ border-radius:.8rem .8rem 0 0 }
  .em-fin{ margin-top:1rem; padding-top:.8rem }
  .em-fin__k{ padding-inline:.3rem }
  .em-fin__capa{ margin-inline:.25rem; padding:.45rem .6rem }
  .em-fin__capa b{ font-size:.76rem }
  .em-fin__capa > span{ font-size:.7rem }
  .em-fin__capa--oxi{ padding:.4rem .15rem }
  .em-fin__capa--oxi b{ font-size:.64rem; line-height:1.2; hyphens:manual }
  .em-fin__capa--oxi > span{ display:none }
  .em-fin__nota{ padding-inline:.3rem }
  .em-camino__btn span{ position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%) }
  .em-camino__btn{ padding:.6rem .8rem }
  .em-ej{ grid-template-columns:4.2rem minmax(0,1fr) }
  .em-viz__txt{ font-size:12.5px }
  .em-viz__txt--f{ font-size:12.5px }
}

@media (prefers-reduced-motion:reduce){
  .em-js-plazo .em-plazo__hecho{ animation:none }
  .em-js .em-parada, .em-js .em-parada.em-activa, .em-js .em-parada.em-sale{ transform:none; transition:none }
  .em-js .em-viz__trazo, .em-js-tab .em-t__sp path{ stroke-dashoffset:0; transition:none }
  .em-js-tab .em-t__sp circle{ opacity:1; transition:none }
  .em-js .em-viz__b, .em-js .em-viz__local, .em-js .em-viz__doc, .em-js .em-viz__puntos circle, .em-js .em-viz__punto, .em-js .em-viz__area,
  .em-js .em-viz__trazo--base, .em-js .em-viz__marca{ transform:none; opacity:1; transition:none }
  .em-ruta__tab, .em-ruta__p::before, .em-ruta__p::after, .em-ruta__n, .em-fin__capa, .em-t tbody tr > *{ transition:none }
  .em-ruta__b:hover .em-ruta__n{ transform:none }
  .em-ox.em-js-ox .em-ox__p, .em-ox.em-js-ox .em-ox__p::before{ opacity:1; transform:none; transition:none }
}

/* ============================================================ Fuentes y créditos (plegados) */
.em-fyc{ margin-top:clamp(2rem,4vw,2.75rem); max-width:72ch; font-family:var(--sans); font-size:.84rem; line-height:1.55; color:var(--mudo) }
.em-fyc summary{ display:inline-flex; align-items:center; gap:.55rem; min-height:44px; cursor:pointer; list-style:none; font-weight:600; color:var(--tinta); border-radius:.3rem }
.em-fyc summary::-webkit-details-marker{ display:none }
.em-fyc summary::after{ content:""; width:.45rem; height:.45rem; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-2px); transition:transform .2s var(--curva) }
.em-fyc[open] summary::after{ transform:rotate(-135deg) translateY(-1px) }
.em-fyc summary:focus-visible{ outline:2px solid var(--petroleo); outline-offset:3px }
.em-fyc ul{ list-style:none; margin:.4rem 0 0; padding:0; display:grid; gap:.45rem }
.em-fyc a{ color:inherit; text-decoration:underline; text-decoration-color:var(--filete-firme); text-underline-offset:.2em }
.em-oxi .em-fyc{ color:#A9B9BD }
.em-oxi .em-fyc summary{ color:var(--papel) }
.em-oxi .em-fyc summary:focus-visible{ outline-color:var(--papel) }
.em-oxi .em-fyc a{ text-decoration-color:rgba(244,242,238,.3) }
@media (prefers-reduced-motion:reduce){ .em-fyc summary::after{ transition:none } }
@media (forced-colors:active){
  .em-ruta__b[aria-selected="true"] .em-ruta__n{ outline:2px solid Highlight }
  .em-fin__capa, .em-rol{ border:1px solid CanvasText }
  .em-ox__p::after{ border:2px solid CanvasText }
}
.em-camino__nav[hidden]{ display:none }