/* v26 · Comunidad Educación (agente EDUCACIÓN).
   1) Pieza propia de /educacion/: «El camino del estudiante» (.ed-camino), con «A dónde queremos llegar» dentro (v31).
   2) Subpáginas de presentación: /educacion/conecta-escuela/, /brujula-vocacional/, /conecta-coar/ (.ed-sub).
   Sin puntitos decorativos, sin rótulos en mayúsculas, sin bordes superiores de color.
   v28 · lista negra anti-IA: fuera rayitas laterales, píldoras de estado, cajas tintadas y tarjetas iguales.
   El estado de una iniciativa se dibuja con el mismo trazo que en el camino (continuo, doble, discontinuo, fino).
   v29 · todo en el lenguaje del Ecosistema: fotos a sangre con texto en capas, teléfono fijo que acompaña el recorrido,
   ritmo oscuro y claro y tipografía grande. */

.ed-camino, .ed-sub{
  --ed:var(--cm, var(--ac-escuela));
  --ed-hondo:color-mix(in oklab, var(--ed) 38%, var(--tinta));
  --ed-velo:color-mix(in srgb, var(--ed) 16%, transparent);
}

/* ============================================================ 1 · EL CAMINO (v29: lenguaje del Ecosistema)
   Plano de metro (estaciones + vías) y cinco capítulos con foto a sangre, texto en capas y la cifra en un vidrio. */
.ed-camino{ position:relative; isolation:isolate; overflow:clip; background:var(--noche-hondo); padding-block:clamp(4.5rem, 8vw, 7rem) 0 }
.ed-camino::before{ content:""; position:absolute; inset:0 0 auto; height:46rem; z-index:-1; pointer-events:none;
  background:radial-gradient(42% 40% at 78% 42%, color-mix(in srgb, var(--ed) 12%, transparent), transparent 100%) }
.ed-camino__cab{ max-width:none }
.ed-camino__t{ font-family:var(--sans); font-weight:640; font-size:clamp(2.1rem, 1.3rem + 3vw, 4.1rem); line-height:1.02; letter-spacing:-.03em; color:var(--papel); max-width:18ch; margin-top:var(--e-sm) }
.ed-camino__cab .entrada{ margin-top:var(--e-md); max-width:52ch; color:#C9D4D7 }

/* Plano de metro (v30). Arriba, las cinco estaciones y, al final de la línea, el destino. Debajo, una fila por
   iniciativa: la vía solo une estaciones seguidas que la iniciativa acompaña, nunca cruza una donde no se detiene.
   La leyenda va fuera del plano, para que la columna elegida no la atraviese. */
.ed-metro{ --lab:12.5rem; --fin:11rem; position:relative; margin-top:clamp(2.5rem, 5vw, 4rem); padding:clamp(1.4rem, 2.4vw, 2rem) 0 clamp(1.1rem, 2vw, 1.5rem);
  border-top:1px solid rgba(244,242,238,.1); border-bottom:1px solid rgba(244,242,238,.1) }
.ed-metro__est, .ed-metro__vias, .ed-metro__ley{ list-style:none; margin:0; padding:0 }
.ed-metro__cab{ position:relative; z-index:1; display:grid; grid-template-columns:var(--lab) minmax(0, 1fr) var(--fin); align-items:start }
.ed-metro__est{ grid-column:2; position:relative; display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)) }
.ed-metro__est li{ position:relative; z-index:1; min-width:0 }
/* la línea: de la primera estación al destino; encima, el avance hasta la estación elegida */
.ed-metro__est::before, .ed-metro__est::after{ content:""; position:absolute; top:1.45rem; left:10%; height:4px; margin-top:-2px; border-radius:4px; pointer-events:none }
.ed-metro__est::before{ right:calc(var(--fin) / -2); background:rgba(244,242,238,.16) }
.ed-metro__est::after{ width:calc(20% * var(--k)); background:linear-gradient(90deg, color-mix(in srgb, var(--ed) 55%, transparent), var(--ed)); transition:width .7s var(--curva) }
.ed-est{ display:flex; flex-direction:column; align-items:center; gap:.3rem; padding:0 .35rem .3rem; text-align:center; text-decoration:none; color:var(--t2); border-radius:.8rem }
.ed-est__n{ display:grid; place-items:center; width:2.9rem; height:2.9rem; border-radius:50%; margin-bottom:.55rem;
  font-family:var(--sans); font-weight:700; font-size:.95rem; color:var(--papel); background:var(--noche-hondo);
  box-shadow:inset 0 0 0 2px rgba(244,242,238,.32); transition:background-color .3s var(--curva), box-shadow .3s var(--curva), color .3s, transform .3s var(--curva) }
.ed-est__t{ font-family:var(--sans); font-weight:650; font-size:clamp(.92rem, .84rem + .25vw, 1.06rem); line-height:1.2; color:var(--papel); text-wrap:balance }
.ed-est__corto{ display:none }
.ed-est__e{ font-family:var(--sans); font-size:.78rem; line-height:1.3; color:#A9B9BD; text-wrap:balance }
.ed-est:hover .ed-est__n{ box-shadow:inset 0 0 0 2px var(--ed) }
.ed-est:focus-visible{ outline:2px solid var(--piedra); outline-offset:2px }
.ed-js .ed-est.hecha .ed-est__n{ background:color-mix(in srgb, var(--ed) 30%, var(--noche-hondo)); box-shadow:inset 0 0 0 2px var(--ed) }
.ed-js .ed-est[aria-selected="true"] .ed-est__n{ background:var(--ed); color:var(--tinta); transform:scale(1.12);
  box-shadow:0 0 0 6px color-mix(in srgb, var(--ed) 22%, transparent), 0 0 0 14px color-mix(in srgb, var(--ed) 8%, transparent) }
.ed-js .ed-est[aria-selected="true"] .ed-est__t{ color:var(--ed) }

/* el destino: la estación terminal, un poco más grande y en papel */
.ed-metro__fin{ grid-column:3; display:flex; flex-direction:column; align-items:center; gap:.25rem; padding:0 .4rem .3rem; text-align:center; text-decoration:none; border-radius:.8rem }
.ed-metro__fin-m{ display:grid; place-items:center; width:2.9rem; height:2.9rem; border-radius:50%; margin-bottom:.55rem; background:var(--papel); color:var(--tinta);
  box-shadow:0 0 0 4px var(--noche-hondo), 0 0 0 5px rgba(244,242,238,.35) }
.ed-metro__fin-m svg{ width:1.35rem; height:1.35rem }
.ed-metro__fin-x{ display:flex; flex-direction:column; gap:.25rem }
.ed-metro__fin-k{ font-family:var(--sans); font-size:.76rem; font-weight:650; line-height:1.25; color:var(--ed) }
.ed-metro__fin-t{ font-family:var(--sans); font-size:.86rem; font-weight:600; line-height:1.3; color:var(--papel); text-wrap:balance;
  text-decoration:underline; text-decoration-color:rgba(244,242,238,.28); text-underline-offset:3px }
.ed-metro__fin:hover .ed-metro__fin-t{ text-decoration-color:currentColor }
.ed-metro__fin:focus-visible{ outline:2px solid var(--piedra); outline-offset:2px }

/* la columna elegida: solo dentro del plano (estaciones y vías) */
.ed-js .ed-metro::before{ content:""; position:absolute; top:0; bottom:0; z-index:0; pointer-events:none;
  left:calc(var(--lab) + (100% - var(--lab) - var(--fin)) / 5 * var(--k)); width:calc((100% - var(--lab) - var(--fin)) / 5);
  background:linear-gradient(180deg, color-mix(in srgb, var(--ed) 10%, transparent), color-mix(in srgb, var(--ed) 3%, transparent));
  border-inline:1px solid color-mix(in srgb, var(--ed) 16%, transparent); transition:left .55s var(--curva) }

/* Vías: una fila por iniciativa, cinco celdas (una por estación) */
.ed-metro__vias{ position:relative; z-index:1; margin-top:1.5rem; padding-top:1rem; border-top:1px dashed rgba(244,242,238,.1); display:grid; gap:.15rem }
.ed-via{ display:grid; grid-template-columns:var(--lab) minmax(0, 1fr) var(--fin); align-items:center; min-height:2.75rem; transition:opacity .35s var(--curva) }
.ed-js .ed-via{ opacity:.45 }
.ed-js .ed-via.on{ opacity:1 }
.ed-via__n{ grid-column:1; display:flex; flex-direction:column; gap:.12rem; padding-right:1.2rem; font-family:var(--sans); line-height:1.2; min-width:0 }
.ed-via__n b{ font-size:.88rem; font-weight:650; color:var(--papel) }
.ed-via__n small{ font-size:.72rem; font-weight:500; color:#A9B9BD }
.ed-via__l{ grid-column:2; display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); height:1.5rem }
.ed-via__c{ position:relative }
/* tramo de vía: del centro de esta estación al centro de la siguiente */
.ed-via__c.sig::after{ content:""; position:absolute; left:50%; width:100%; top:50%; height:4px; margin-top:-2px; border-radius:3px; background:var(--li) }
.ed-via--piloto .ed-via__c.sig::after{ height:3px; margin-top:-1.5px; border-radius:0; background:repeating-linear-gradient(90deg, var(--li) 0 9px, transparent 9px 15px) }
.ed-via--entregado .ed-via__c.sig::after{ height:8px; margin-top:-4px; border-radius:0; background:none; border-block:2px solid var(--li) }
.ed-via--diseno .ed-via__c.sig::after{ height:1.5px; margin-top:-.75px }
/* parada: llena en uso y entregado, hueca en piloto, fina en diseño */
.ed-via__c.si::before{ content:""; position:absolute; z-index:1; left:50%; top:50%; width:1rem; height:1rem; margin:-.5rem 0 0 -.5rem; border-radius:50%;
  background:var(--li); box-shadow:0 0 0 3px var(--noche-hondo); transition:transform .3s var(--curva) }
.ed-via--piloto .ed-via__c.si::before{ background:var(--noche-hondo); box-shadow:inset 0 0 0 3px var(--li), 0 0 0 3px var(--noche-hondo) }
.ed-via--diseno .ed-via__c.si::before{ width:.78rem; height:.78rem; margin:-.39rem 0 0 -.39rem; background:var(--noche-hondo); box-shadow:inset 0 0 0 1.5px var(--li), 0 0 0 3px var(--noche-hondo) }
.ed-js .ed-via__c.si.aqui::before{ transform:scale(1.3); outline:2px solid color-mix(in srgb, var(--li) 50%, transparent); outline-offset:3px }

/* Al pie del plano: la leyenda y cómo leerlo */
.ed-metro__pie{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.7rem 2rem; margin-top:1rem }
.ed-metro__ley{ display:flex; flex-wrap:wrap; gap:.5rem 1.6rem; font-family:var(--sans); font-size:.8rem; color:#A9B9BD }
.ed-metro__ayuda{ margin:0; font-family:var(--sans); font-size:.8rem; line-height:1.4; color:#A9B9BD }
.ed-ley{ display:inline-flex; align-items:center; gap:.55rem; white-space:nowrap }
.ed-ley::before{ content:""; width:1.8rem; height:4px; border-radius:2px; background:var(--piedra) }
.ed-ley--piloto::before{ height:3px; background:repeating-linear-gradient(90deg, var(--piedra) 0 7px, transparent 7px 11px) }
.ed-ley--diseno::before{ height:1.5px }
.ed-ley--entregado::before{ height:8px; background:none; border-block:2px solid var(--piedra); border-radius:0 }

/* Mando: anterior, estado, siguiente, recorrer */
.ed-mando[hidden]{ display:none }
.ed-mando{ display:flex; flex-wrap:wrap; align-items:center; gap:.6rem 1rem; margin-top:var(--e-lg) }
.ed-mando__b{ display:inline-grid; place-items:center; width:2.75rem; height:2.75rem; border-radius:50%; border:1px solid var(--filete-piedra);
  background:transparent; color:var(--t1); cursor:pointer; transition:background-color .2s var(--curva), border-color .2s var(--curva), opacity .2s }
.ed-mando__b:hover{ background:rgba(216,203,179,.1); border-color:var(--piedra) }
.ed-mando__b[aria-disabled="true"]{ opacity:.35; cursor:default }
.ed-mando__b:focus-visible, .ed-mando__play:focus-visible{ outline:2px solid var(--piedra); outline-offset:3px }
.ed-mando__estado{ margin:0; min-width:12rem; font-family:var(--sans); font-size:.95rem; font-weight:600; color:var(--t1); font-variant-numeric:tabular-nums }
.ed-mando__play{ position:relative; overflow:hidden; display:inline-flex; align-items:center; gap:.6rem; margin-left:auto; padding:.7rem 1.15rem;
  border-radius:999px; border:1px solid var(--filete-piedra); background:transparent; color:var(--t1);
  font-family:var(--sans); font-weight:600; font-size:.92rem; cursor:pointer; transition:background-color .2s var(--curva), border-color .2s var(--curva) }
.ed-mando__play:hover{ background:rgba(216,203,179,.1); border-color:var(--piedra) }
.ed-mando__ico{ width:0; height:0; border-style:solid; border-width:.38rem 0 .38rem .62rem; border-color:transparent transparent transparent currentColor }
.ed-mando__play[aria-pressed="true"] .ed-mando__ico{ width:.62rem; height:.76rem; border:0; border-left:3px solid; border-right:3px solid }
.ed-mando__barra{ position:absolute; left:0; bottom:0; height:2px; width:100%; background:var(--ed); transform-origin:0 50%; transform:scaleX(0) }
.ed-mando__play[aria-pressed="true"] .ed-mando__barra{ animation:ed-barra var(--ed-paso, 7s) linear both }
@keyframes ed-barra{ to{ transform:scaleX(1) } }
.ed-sin-mov .ed-mando__play{ display:none }

/* Estado: un rótulo de texto con el mismo trazo que las vías (subpáginas) */
.ed-estado{ display:inline-flex; align-items:center; gap:.45rem; font-family:var(--sans); font-size:.8rem; font-weight:600; line-height:1.2; white-space:nowrap; color:var(--mudo) }
.ed-estado::before{ content:""; flex:none; width:1.15rem; border-top:3px solid currentColor; border-radius:2px }
.ed-estado--uso, .ed-estado--entregado{ color:var(--petroleo-hondo, #0E3B3A) }
.ed-estado--entregado::before{ border-top:5px double currentColor; border-radius:0 }
.ed-estado--piloto{ color:#7A4A1D }
.ed-estado--piloto::before{ border-top:2px dashed currentColor; border-radius:0 }
.ed-estado--diseno::before{ border-top-width:1px }
.oscuro .ed-estado--uso, .oscuro .ed-estado--entregado{ color:#A9DCD7 }
.oscuro .ed-estado--piloto{ color:#F6BE8C }
.oscuro .ed-estado--diseno{ color:var(--t2) }

/* Los tramos: capítulos a sangre */
.ed-camino__tramos{ display:grid; margin-top:clamp(2.5rem, 5vw, 4rem) }
.ed-tramo[hidden]{ display:none }
.ed-tramo{ scroll-margin-top:4.5rem }
.ed-tramo:focus{ outline:none }
.ed-tramo__escena{ position:relative; isolation:isolate; overflow:clip; min-height:clamp(34rem, 78vh, 48rem); display:grid; align-items:end }
/* v30 · la foto va debajo del velo y el pie de foto encima (antes el velo lo apagaba) */
.ed-tramo__foto{ position:absolute; inset:0; margin:0 }
.ed-tramo__foto picture{ display:block; position:absolute; inset:0; z-index:-2 }
.ed-tramo__foto figcaption{ z-index:1 }
.ed-tramo__foto img{ width:100%; height:100%; object-fit:cover; object-position:var(--pos, 50% 50%); display:block }
.ed-tramo__foto figcaption{ position:absolute; right:var(--canal); top:1.2rem; max-width:min(30rem, 60%); padding:.28rem .6rem; border-radius:.35rem;
  font-family:var(--sans); font-size:.74rem; line-height:1.35; color:#E7E2D6; background:rgba(6,17,31,.62) }
.ed-tramo__escena::after{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(0deg, var(--noche-hondo) 0, rgba(6,17,31,.72) 22%, rgba(6,17,31,0) 58%),
             linear-gradient(90deg, rgba(6,17,31,.82) 0, rgba(6,17,31,.4) 38%, rgba(6,17,31,0) 62%),
             linear-gradient(180deg, var(--noche-hondo) 0, rgba(6,17,31,0) 18%) }
.ed-tramo__capa{ display:grid; gap:var(--e-lg); align-items:end; padding-block:8rem clamp(2rem, 4vw, 3.2rem) }
.ed-tramo__paso{ display:flex; align-items:center; gap:.8rem; font-family:var(--sans); font-size:.86rem; font-weight:600; color:#E7E2D6; margin:0 }
.ed-tramo__num{ display:grid; place-items:center; width:2.3rem; height:2.3rem; border-radius:50%; background:var(--ed); color:var(--tinta); font-size:.8rem; font-weight:700;
  box-shadow:0 0 0 6px color-mix(in srgb, var(--ed) 22%, transparent) }
.ed-tramo__t{ font-family:var(--sans); font-weight:640; font-size:clamp(2.8rem, 1.6rem + 5vw, 6.2rem); line-height:.95; letter-spacing:-.04em; margin:var(--e-sm) 0 0; color:var(--papel);
  text-shadow:0 2px 24px rgba(6,17,31,.5) }
.ed-tramo__juego{ font-family:var(--lee); font-size:clamp(1.12rem, 1rem + .5vw, 1.45rem); line-height:1.45; color:var(--papel); margin:var(--e-md) 0 0; max-width:34ch;
  text-shadow:0 1px 14px rgba(6,17,31,.6) }
.ed-tramo__dato{ padding:clamp(1.3rem, 2vw, 1.8rem); border-radius:1.1rem; background:rgba(6,17,31,.5); box-shadow:inset 0 0 0 1px rgba(244,242,238,.14);
  -webkit-backdrop-filter:blur(14px) saturate(1.2); backdrop-filter:blur(14px) saturate(1.2); max-width:28rem }
.ed-tramo__cifra{ margin:0; display:grid; gap:.4rem }
.ed-tramo__cifra b{ font-family:var(--sans); font-weight:640; font-size:clamp(2.6rem, 1.9rem + 2.4vw, 4.2rem); line-height:1; letter-spacing:-.03em; color:var(--ed); font-variant-numeric:tabular-nums }
.ed-tramo__cifra span{ font-family:var(--sans); font-size:.95rem; line-height:1.45; color:#DCE3E6 }
.ed-tramo__fuente{ display:inline-block; margin-top:.9rem; font-family:var(--sans); font-size:.76rem; color:#A9B9BD; text-decoration:underline; text-decoration-color:rgba(216,203,179,.35); text-underline-offset:3px }
.ed-tramo__fuente:hover{ color:var(--papel); text-decoration-color:currentColor }
@media (min-width:60rem){
  .ed-tramo__capa{ grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr); column-gap:clamp(3rem, 6vw, 6rem) }
  .ed-tramo__dato{ justify-self:end; width:100% }
}

/* Escala: qué parte de toda la matrícula escolar transita el tramo */
.ed-escala{ margin-top:var(--e-md) }
.ed-escala__barra{ display:flex; gap:3px; height:.7rem; margin-bottom:1.5rem }
.ed-escala__s{ position:relative; flex:0 0 var(--w); max-width:var(--w); border-radius:2px; background:rgba(216,203,179,.2) }
.ed-escala__s.on{ background:var(--ed) }
.ed-escala__s.ed-escala__s--parte{ background:rgba(216,203,179,.2) }
.ed-escala__sub{ position:absolute; right:0; top:0; bottom:0; width:var(--w); border-radius:2px }
.ed-escala__sub.on{ background:var(--ed) }
.ed-escala__n{ position:absolute; top:100%; left:0; margin-top:.4rem; font-family:var(--sans); font-size:.7rem; line-height:1; color:#A9B9BD; white-space:nowrap }
.ed-escala__s.on .ed-escala__n{ color:var(--papel); font-weight:600 }
.ed-escala__t{ margin:0; font-family:var(--sans); font-size:.82rem; line-height:1.45; color:#A9B9BD }
.ed-escala__t b{ font-weight:650; color:var(--papel); font-variant-numeric:tabular-nums }
@media (max-width:30rem){ .ed-escala__s:not(.on) .ed-escala__n{ visibility:hidden } }

/* Al pie del capítulo: quién lo acompaña */
.ed-tramo__cuerpo{ display:grid; gap:var(--e-xl); padding-block:clamp(1.5rem, 3vw, 2.5rem) clamp(3.5rem, 7vw, 5.5rem) }
.ed-tramo__k{ font-family:var(--sans); font-weight:650; font-size:.86rem; color:var(--ed); margin:0 0 .8rem }
.ed-ini__lista{ list-style:none; margin:0; padding:0; display:grid; gap:1.4rem 2.2rem }
.ed-ini{ display:grid; grid-template-columns:2.4rem minmax(0, 1fr); column-gap:.9rem }
.ed-ini__traza{ grid-row:span 2; align-self:start; margin-top:.68rem; height:4px; border-radius:3px; background:var(--li) }
.ed-ini__traza--piloto{ height:3px; background:repeating-linear-gradient(90deg, var(--li) 0 7px, transparent 7px 11px) }
.ed-ini__traza--entregado{ height:7px; margin-top:.5rem; background:none; border-block:2px solid var(--li); border-radius:0 }
.ed-ini__traza--diseno{ height:1.5px }
.ed-ini__cab{ display:flex; flex-wrap:wrap; align-items:baseline; gap:.2rem .7rem; margin:0 0 .25rem }
.ed-ini__cab a{ font-family:var(--sans); font-weight:650; font-size:1.05rem; color:var(--papel); text-decoration:underline; text-decoration-color:rgba(244,242,238,.25);
  text-decoration-thickness:1px; text-underline-offset:4px; transition:text-decoration-color .2s }
.ed-ini__cab a:hover{ text-decoration-color:var(--li) }
.ed-ini__est{ font-family:var(--sans); font-size:.78rem; color:#A9B9BD }
.ed-ini__d{ margin:0; font-size:.96rem; line-height:1.55; color:#C9D4D7; max-width:52ch }
.ed-tramo__alr p{ margin:0; font-family:var(--lee); font-size:1.08rem; line-height:1.6; color:#DCE3E6; max-width:40ch }
@media (min-width:60rem){
  .ed-tramo__cuerpo{ grid-template-columns:minmax(0, 2fr) minmax(0, 1fr); column-gap:clamp(3rem, 6vw, 6rem) }
  .ed-ini__lista{ grid-template-columns:1fr 1fr }
}
.ed-camino__nota{ padding-bottom:clamp(3rem, 6vw, 5rem); font-family:var(--sans); font-size:.82rem; line-height:1.5; color:#A9B9BD; max-width:none }
/* sin JS, cada capítulo se separa del siguiente */
.ed-camino:not(.ed-js) .ed-tramo + .ed-tramo{ border-top:1px solid rgba(244,242,238,.08) }

/* Con JS: un capítulo a la vista, con su entrada */
.ed-js .ed-tramo.ed-entra .ed-tramo__foto img{ animation:ed-zoom 1.2s var(--curva) both }
.ed-js .ed-tramo.ed-entra .ed-tramo__foto{ animation:ed-funde .6s var(--curva) both }
.ed-js .ed-tramo.ed-entra .ed-tramo__texto{ animation:ed-texto .5s .1s var(--curva) both }
.ed-js .ed-tramo.ed-entra .ed-tramo__dato{ animation:ed-texto .5s .2s var(--curva) both }
.ed-js .ed-tramo.ed-entra .ed-escala__s.on:not(.ed-escala__s--parte), .ed-js .ed-tramo.ed-entra .ed-escala__sub.on{ animation:ed-crece .7s .3s var(--curva) both; transform-origin:0 50% }
@keyframes ed-funde{ from{ opacity:0 } to{ opacity:1 } }
@keyframes ed-zoom{ from{ transform:scale(1.07) } to{ transform:none } }
@keyframes ed-texto{ from{ opacity:0; transform:translateY(14px) } to{ opacity:1; transform:none } }
@keyframes ed-crece{ from{ transform:scaleX(0) } to{ transform:none } }
@media (prefers-reduced-motion:reduce){
  .ed-metro__est::after, .ed-js .ed-metro::before, .ed-est__n, .ed-via, .ed-via__c.si::before{ transition:none }
  .ed-js .ed-tramo.ed-entra *, .ed-js .ed-tramo.ed-entra .ed-tramo__foto{ animation:none !important }
}

/* v30 · Por debajo de 62rem el plano se apila: estaciones arriba, una fila por iniciativa con su nombre encima
   de la vía y el destino al final. Celular: foto arriba y texto debajo. */
@media (max-width:61.99rem){
  .ed-metro{ --lab:0rem; --fin:0rem; display:flex; flex-direction:column }
  .ed-metro__cab{ display:contents }
  .ed-metro__est{ order:1 }
  .ed-metro__vias{ order:2 }
  .ed-metro__fin{ order:3 }
  .ed-metro__est::before{ right:10% }
  .ed-via{ grid-template-columns:minmax(0, 1fr); min-height:0; row-gap:.2rem; padding-block:.4rem }
  .ed-via__n{ grid-column:1; flex-direction:row; flex-wrap:wrap; align-items:baseline; column-gap:.6rem; padding:0 }
  .ed-via__l{ grid-column:1; height:1.3rem }
  .ed-js .ed-metro::before{ content:none }
  .ed-metro__fin{ position:relative; z-index:1; flex-direction:row; align-items:center; gap:.9rem; margin-top:1.1rem; padding:1rem 0 0; text-align:left;
    border-top:1px dashed rgba(244,242,238,.14); border-radius:0 }
  .ed-metro__fin-m{ flex:none; margin:0 }
  .ed-metro__fin-t{ text-wrap:pretty }
}
@media (max-width:47.99rem){
  .ed-est{ padding-inline:0 }
  .ed-est__n{ width:2.3rem; height:2.3rem; font-size:.85rem }
  .ed-metro__est::before, .ed-metro__est::after{ top:1.15rem }
  .ed-est__largo, .ed-est__e{ display:none }
  .ed-est__corto{ display:inline; font-size:.74rem }
  .ed-metro__pie{ flex-direction:column; align-items:flex-start }
  .ed-mando__estado{ min-width:0; flex:1; text-align:center; font-size:.88rem }
  .ed-mando__play{ margin-left:0; width:100%; justify-content:center }
  .ed-tramo__escena{ min-height:0; display:block }
  .ed-tramo__foto{ position:relative; inset:auto }
  .ed-tramo__foto picture{ position:relative; aspect-ratio:4 / 3 }
  /* el pie de foto va arriba de la foto: abajo se encimaba con «Tramo 1 de 5» */
  .ed-tramo__foto figcaption{ top:.7rem; bottom:auto; left:auto; right:var(--canal); max-width:calc(100% - 2 * var(--canal)) }
  .ed-tramo__escena::after{ inset:0 0 auto; height:calc(100vw * .75); background:linear-gradient(0deg, var(--noche-hondo) 0, rgba(6,17,31,0) 40%) }
  .ed-tramo__capa{ padding-block:0 1.5rem; margin-top:-3.2rem; position:relative }
  .ed-tramo__dato{ max-width:none }
}

/* ============================================================ 1b · A DÓNDE QUEREMOS LLEGAR (v31: dentro del camino)
   Ya no es una sección aparte. La estación terminal del plano es una pestaña más; su capítulo es la frase que da
   sentido a toda la línea. La meta de cada tramo (en su vida y en su territorio) va al pie de su capítulo. */
.ed-tramo, .ed-tramo--fin{ scroll-margin-top:4.5rem }
/* la terminal elegida: la columna del destino, la línea completa y su marca encendida */
.ed-js .ed-metro__fin[aria-selected="true"] .ed-metro__fin-m{ background:var(--ed); transform:scale(1.1);
  box-shadow:0 0 0 6px color-mix(in srgb, var(--ed) 22%, transparent), 0 0 0 14px color-mix(in srgb, var(--ed) 8%, transparent) }
.ed-js .ed-metro__fin[aria-selected="true"] .ed-metro__fin-t{ color:var(--ed); text-decoration-color:transparent }
.ed-metro__fin-m{ transition:background-color .3s var(--curva), transform .3s var(--curva), box-shadow .3s var(--curva) }
.ed-js .ed-metro--fin::before{ left:calc(100% - var(--fin)); width:var(--fin) }
.ed-metro--fin .ed-metro__est::after{ width:calc(90% + var(--fin) / 2) }
.ed-js .ed-metro--fin .ed-est .ed-est__n{ background:color-mix(in srgb, var(--ed) 30%, var(--noche-hondo)); box-shadow:inset 0 0 0 2px var(--ed) }

/* Meta del tramo */
.ed-meta{ align-self:start; padding:clamp(1.2rem, 2vw, 1.6rem); border-radius:1.1rem; background:rgba(244,242,238,.04); box-shadow:inset 0 0 0 1px rgba(244,242,238,.12) }
.ed-meta .ed-tramo__k{ display:flex; align-items:center; gap:.6rem }
.ed-meta__m{ display:grid; place-items:center; flex:none; width:1.9rem; height:1.9rem; border-radius:50%; background:var(--papel); color:var(--tinta) }
.ed-meta__m svg{ width:1rem; height:1rem }
.ed-meta__dl{ margin:0; display:grid; gap:1rem }
.ed-meta__dl dt{ font-family:var(--sans); font-size:.76rem; font-weight:650; color:#A9B9BD; margin-bottom:.2rem }
.ed-meta__dl dd{ margin:0; font-family:var(--lee); font-size:clamp(1rem, .96rem + .2vw, 1.12rem); line-height:1.5; color:var(--papel) }
.ed-tramo__alr{ margin:1.4rem 0 0; font-size:.95rem; line-height:1.55; color:#C9D4D7; max-width:60ch }
.ed-tramo__alr span{ font-family:var(--sans); font-weight:650; font-size:.86rem; color:var(--ed) }

/* Lo que está en diseño, plegado dentro del tramo */
.ed-dis{ margin-top:1.4rem; border-top:1px dashed rgba(244,242,238,.16) }
.ed-dis summary{ display:flex; align-items:center; gap:.6rem; padding:.9rem 0 .2rem; cursor:pointer; list-style:none;
  font-family:var(--sans); font-size:.88rem; font-weight:600; color:#C9D4D7 }
.ed-dis summary::-webkit-details-marker{ display:none }
.ed-dis summary::before{ content:""; width:.5rem; height:.5rem; border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor; transform:rotate(-45deg); transition:transform .2s var(--curva) }
.ed-dis[open] summary::before{ transform:rotate(45deg) }
.ed-dis summary:hover{ color:var(--papel) }
.ed-dis summary:focus-visible{ outline:2px solid var(--piedra); outline-offset:3px; border-radius:.3rem }
.ed-dis__n{ display:inline-grid; place-items:center; min-width:1.4rem; height:1.4rem; padding:0 .35rem; border-radius:999px; font-size:.74rem; color:var(--papel); box-shadow:inset 0 0 0 1px rgba(244,242,238,.3) }
.ed-ini__lista--dis{ margin-top:1rem }
.ed-ini__lista--dis .ed-ini__cab b{ font-family:var(--sans); font-weight:650; font-size:1rem; color:#DCE3E6 }
.ed-ini__lista--dis .ed-ini__d{ font-size:.92rem }

/* El capítulo del destino */
.ed-tramo--fin .ed-tramo__t{ font-size:clamp(2.1rem, 1.2rem + 3.4vw, 4.4rem); line-height:1.02; letter-spacing:-.035em; max-width:16ch; text-wrap:balance }
.ed-tramo--fin .ed-tramo__juego{ max-width:44ch }
.ed-tramo__num--fin{ background:var(--papel) }
.ed-tramo__num--fin svg{ width:1.1rem; height:1.1rem }
.ed-tramo--fin .ed-tramo__escena{ min-height:clamp(32rem, 74vh, 44rem) }
.ed-fin-k{ margin:0; font-family:var(--sans); font-size:.86rem; font-weight:650; color:var(--ed) }
.ed-fin-p{ margin:.6rem 0 0; font-family:var(--lee); font-size:1.08rem; line-height:1.55; color:#E7ECEE }
.ed-tramo--fin .ed-tramo__fuente{ font-size:.86rem; color:var(--papel) }

/* Pie de la pieza: nota de las cifras y el puente hacia lo que ya funciona */
.ed-camino__pie{ padding-block:clamp(1rem, 2vw, 1.5rem) clamp(3rem, 6vw, 5rem) }
.ed-camino__pie .ed-camino__nota{ padding:0; margin:0 }
.ed-puente{ margin:1rem 0 0; font-family:var(--lee); font-style:italic; font-size:clamp(1.02rem, .98rem + .2vw, 1.15rem); line-height:1.5; color:#DCE3E6 }

@media (max-width:61.99rem){
  .ed-metro--fin .ed-metro__est::after{ width:80% }
  .ed-tramo__cuerpo{ row-gap:var(--e-lg) }
}
@media (max-width:47.99rem){
  .ed-tramo--fin .ed-tramo__escena{ min-height:0 }
}

/* ============================================================ 2 · SUBPÁGINAS (v29: capítulos del Ecosistema)
   Ritmo: apertura a sangre (oscuro) · ficha con foto a sangre (claro) · recorrido con teléfono fijo (oscuro) ·
   capítulos con velo o gráfico · vitrina sobre foto · cierre a sangre (oscuro). */
.ed-sub section{ position:relative }
.ed-h2{ font-family:var(--sans); font-weight:640; font-size:var(--t-h2, clamp(1.7rem, 1.15rem + 1.5vw, 2.6rem)); line-height:1.05; letter-spacing:-.025em; color:var(--t1); text-wrap:balance; margin-top:var(--e-sm) }
.ed-h2--xl{ font-size:clamp(2rem, 1.3rem + 2.6vw, 3.6rem); line-height:1.02; letter-spacing:-.03em }
.ed-sub .entrada{ margin-top:var(--e-md); max-width:46ch }
.ed-sub .oscuro .entrada{ color:#C9D4D7 }

/* Apertura */
.ed-sub .portada--v11.ed-ap{ min-height:min(46rem, 92svh) }
.ed-ap .portada__velo{ background:
  linear-gradient(180deg, rgba(10,26,47,.72) 0, rgba(10,26,47,.35) 48px, rgba(10,26,47,0) 96px),
  linear-gradient(90deg, rgba(10,26,47,.88) 0%, rgba(10,26,47,.62) 42%, rgba(10,26,47,.12) 78%),
  linear-gradient(0deg, rgba(10,26,47,.7) 0%, rgba(10,26,47,0) 40%) }
@media (max-width:47.99rem){
  .ed-ap .portada__velo{ background:linear-gradient(180deg, rgba(10,26,47,.72) 0, rgba(10,26,47,.35) 48px, rgba(10,26,47,0) 96px), linear-gradient(0deg, rgba(10,26,47,.95) 0%, rgba(10,26,47,.9) 66%, rgba(10,26,47,.62) 84%, rgba(10,26,47,.3) 100%) }
  /* v30 · en celular el titular caía sobre la cara de un niño: el velo sube hasta donde empieza el texto */
}
.ed-migas ol{ list-style:none; margin:0 0 var(--e-md); padding:0; display:flex; flex-wrap:wrap; gap:.25rem .5rem; font-family:var(--sans); font-size:.86rem }
.ed-migas li{ display:flex; align-items:center; gap:.5rem; color:#C9D4D7 }
.ed-migas li + li::before{ content:"/"; color:rgba(244,242,238,.4) }
.ed-migas a{ color:#DCE3E6; text-decoration:none; border-bottom:1px solid rgba(244,242,238,.3) }
.ed-migas a:hover{ color:var(--papel); border-color:currentColor }
.ed-migas a[aria-current]{ border-bottom:0; color:var(--papel) }
.ed-ap__origen{ display:inline-flex; align-items:center; gap:.55rem; font-family:var(--sans); font-size:.88rem; color:#DCE3E6 }
.ed-ap__origen b{ color:var(--papel); font-weight:600 }
.ed-ap__marca{ display:inline-grid; place-items:center; width:1.9rem; height:1.9rem; border-radius:.55rem; background:var(--ed); color:var(--tinta) }
.ed-ap__marca svg{ width:1.15rem; height:1.15rem }
.ed-ap .acciones .boton:not(.boton--vidrio), .ed-fin .acciones .boton:not(.boton--vidrio){ background:var(--ed); border-color:var(--ed); color:var(--tinta) }
.ed-ap .acciones .boton:not(.boton--vidrio):hover, .ed-fin .acciones .boton:not(.boton--vidrio):hover{ background:color-mix(in srgb, var(--ed) 82%, white); border-color:transparent }
.ed-ap__dom{ margin-top:var(--e-md); font-family:var(--sans); font-size:.86rem; color:#C9D4D7 }
.ed-ap__dom b{ color:var(--papel); font-weight:600 }

/* Ficha clara: foto a sangre desde la derecha, fundida hacia el papel; lema en grande */
.ed-fic{ isolation:isolate; overflow:clip; background:var(--papel); padding-block:clamp(4.5rem, 9vw, 8rem) }
.ed-fic__foto{ margin:0; position:absolute; z-index:-1; top:0; bottom:0; right:0; width:50vw }
.ed-fic__foto picture{ display:block; position:absolute; inset:0 }
.ed-fic__foto img{ width:100%; height:100%; object-fit:cover; object-position:var(--pos, 50% 50%);
  -webkit-mask-image:linear-gradient(90deg, transparent 0, #000 34%); mask-image:linear-gradient(90deg, transparent 0, #000 34%) }
.ed-fic__foto figcaption{ position:absolute; right:var(--canal); bottom:1rem; max-width:24rem; padding:.45rem .7rem; border-radius:.5rem;
  background:rgba(10,26,47,.6); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); font-family:var(--sans); font-size:.76rem; line-height:1.4; color:#E7E2D6 }
.ed-fic__txt{ max-width:min(44rem, 54%) }
.ed-fic__h{ font-family:var(--sans); font-weight:640; font-size:clamp(1.3rem, 1.1rem + .8vw, 1.8rem); letter-spacing:-.015em; color:var(--ed-hondo); margin-top:var(--e-xs) }
.ed-fic__lema{ margin:var(--e-md) 0 var(--e-xl); font-family:var(--lee); font-size:clamp(1.55rem, 1.15rem + 1.6vw, 2.5rem); line-height:1.25; letter-spacing:-.01em; color:var(--tinta); text-wrap:pretty }
.ed-fic__lista{ margin:0; display:grid }
.ed-fic__fila{ display:grid; grid-template-columns:9rem minmax(0, 1fr); gap:1rem; padding:1.1rem 0; border-top:1px solid var(--filete) }
.ed-fic__fila dt{ font-family:var(--sans); font-weight:650; font-size:.9rem; color:var(--ed-hondo); padding-top:.15rem }
.ed-fic__fila dd{ margin:0; font-size:1.02rem; line-height:1.6; color:var(--tinta-2) }
.ed-fic__fila dd .ed-estado{ margin-right:.5rem; vertical-align:.1em }
@media (max-width:61.99rem){
  .ed-fic{ padding-top:0 }
  .ed-fic__foto{ position:relative; width:auto; z-index:0 }
  .ed-fic__foto picture{ position:relative; aspect-ratio:4 / 3 }
  .ed-fic__foto img{ -webkit-mask-image:linear-gradient(0deg, transparent 0, #000 30%); mask-image:linear-gradient(0deg, transparent 0, #000 30%) }
  .ed-fic__foto figcaption{ bottom:auto; top:1rem }
  .ed-fic__txt{ max-width:none; margin-top:-2rem; position:relative }
  .ed-fic__fila{ grid-template-columns:1fr; gap:.3rem }
}

/* Recorrido con teléfono fijo (como el recorrido del Ecosistema) */
.ed-reco{ isolation:isolate; overflow:clip; background:var(--noche-hondo); padding-block:clamp(4.5rem, 8vw, 7rem) }
.ed-reco__fondo{ position:absolute; inset:0; z-index:-2 }
.ed-reco__fondo picture{ display:block; position:absolute; inset:0 }
.ed-reco__fondo img{ width:100%; height:100%; object-fit:cover; object-position:var(--pos, 50% 50%); opacity:.22 }
.ed-reco::before{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, var(--noche-hondo) 0, rgba(6,17,31,.55) 30%, rgba(6,17,31,.7) 70%, var(--noche-hondo) 100%),
             radial-gradient(45% 50% at 78% 40%, color-mix(in srgb, var(--ed) 14%, transparent), transparent 70%) }
.ed-reco__titulo{ max-width:48rem }
.ed-reco__rej{ display:grid; gap:var(--e-xl); margin-top:clamp(2.5rem, 5vw, 4rem) }
.ed-hitos{ position:relative; list-style:none; margin:0; padding:0 0 0 2.6rem }
.ed-hitos::before, .ed-hitos::after{ content:""; position:absolute; left:.6rem; top:.6rem; width:2px; border-radius:2px }
.ed-hitos::before{ bottom:.6rem; background:rgba(244,242,238,.14) }
.ed-hitos::after{ height:calc((100% - 1.2rem) * var(--p, 0)); background:linear-gradient(180deg, color-mix(in srgb, var(--ed) 40%, transparent), var(--ed)); transition:height .5s var(--curva) }
.ed-hito{ position:relative; padding-bottom:clamp(2.5rem, 5vw, 3.5rem) }
.ed-hito__nodo{ position:absolute; left:-2.6rem; top:.15rem; width:1.25rem; height:1.25rem; border-radius:50%; background:var(--noche-hondo);
  box-shadow:inset 0 0 0 2px rgba(244,242,238,.35); transition:background-color .3s var(--curva), box-shadow .3s var(--curva) }
.ed-hito.on .ed-hito__nodo, .ed-hito.hecho .ed-hito__nodo{ background:var(--ed); box-shadow:0 0 0 5px color-mix(in srgb, var(--ed) 22%, transparent) }
.ed-hito__k{ font-family:var(--sans); font-weight:650; font-size:.95rem; color:var(--ed); font-variant-numeric:tabular-nums }
.ed-hito__t{ font-family:var(--sans); font-weight:640; font-size:clamp(1.6rem, 1.2rem + 1.6vw, 2.6rem); line-height:1.05; letter-spacing:-.025em; color:var(--papel); margin-top:.35rem }
.ed-hito__d{ margin-top:.8rem; font-family:var(--lee); font-size:clamp(1.05rem, 1rem + .25vw, 1.2rem); line-height:1.6; color:#C9D4D7; max-width:38ch }
.ed-hito .ed-tel--mini{ margin-top:var(--e-lg) }
.ed-reco__lado{ display:none }
.ed-vivo__nota{ margin:var(--e-lg) 0 0; font-family:var(--sans); font-size:.84rem; line-height:1.55; color:#A9B9BD; max-width:70ch }
.ed-vivo__nota .liga{ margin-left:.35rem }
@media (min-width:62rem){
  .ed-reco__rej{ grid-template-columns:minmax(0, 1fr) minmax(0, 24rem); column-gap:clamp(3rem, 8vw, 8rem) }
  .ed-js .ed-reco__lado{ display:block }
  .ed-reco__fijo{ position:sticky; top:calc(var(--alto-nav) + 2rem); display:grid; gap:1.2rem; justify-items:center }
  .ed-js .ed-hito{ min-height:clamp(13rem, 34vh, 19rem); padding-bottom:0 }
  .ed-js .ed-hito .ed-tel--mini{ display:none }
  .ed-js .ed-hito{ opacity:.38; transition:opacity .4s var(--curva) }
  .ed-js .ed-hito.on{ opacity:1 }
  .ed-js .ed-hito:last-child{ min-height:auto; padding-bottom:6rem }
}
.ed-reco__cab{ display:flex; align-items:center; gap:1rem; width:min(100%, 19rem) }
.ed-reco__cuenta{ margin-left:auto; font-family:var(--sans); font-size:.9rem; color:#A9B9BD; font-variant-numeric:tabular-nums }
.ed-reco__cuenta b{ font-size:1.6rem; font-weight:650; color:var(--papel) }

/* Reloj del martes */
.ed-reloj{ display:flex; align-items:center; gap:.7rem }
.ed-reloj svg{ width:3.6rem; height:3.6rem }
.ed-reloj__c{ fill:rgba(244,242,238,.04); stroke:rgba(244,242,238,.28); stroke-width:2 }
.ed-reloj__m line{ stroke:rgba(244,242,238,.5); stroke-width:2; stroke-linecap:round }
.ed-reloj__hh, .ed-reloj__mm{ stroke-linecap:round; transform-origin:50px 50px; transition:transform .7s var(--curva) }
.ed-reloj__hh{ stroke:var(--papel); stroke-width:4.5; transform:rotate(var(--h)) }
.ed-reloj__mm{ stroke:var(--ed); stroke-width:3; transform:rotate(var(--m)) }
.ed-reloj__eje{ fill:var(--ed) }
.ed-reloj__dia{ font-family:var(--sans); font-weight:650; font-size:.95rem; color:var(--papel) }

/* Teléfono ilustrado */
.ed-tel{ width:min(100%, 19rem); padding:.6rem; border-radius:2.6rem; background:linear-gradient(160deg, #24384F, #13233A);
  box-shadow:inset 0 0 0 1px rgba(216,203,179,.22), inset 0 0 0 4px #0B1828, 0 50px 80px -40px rgba(0,0,0,.85), 0 0 0 1px rgba(0,0,0,.3) }
.ed-tel__cab{ position:relative; display:flex; justify-content:space-between; align-items:center; padding:1.85rem 1.1rem .55rem; font-family:var(--sans); font-size:.72rem; color:#C9D4D7 }
.ed-tel__isla{ position:absolute; left:50%; top:.55rem; width:4.6rem; height:1.05rem; margin-left:-2.3rem; border-radius:1rem; background:#060E18 }
.ed-tel__marca{ display:inline-flex; align-items:center; gap:.4rem; font-weight:600 }
.ed-tel__marca svg{ width:.95rem; height:.95rem; color:var(--ed) }
.ed-tel__pantalla{ position:relative; height:25rem; overflow:hidden; border-radius:2rem; background:var(--papel); color:var(--tinta); padding:1.15rem 1rem }
.ed-tel--mini{ width:min(100%, 17rem) }
.ed-tel--mini .ed-tel__pantalla{ height:auto; min-height:16rem }
.ed-tel__vista[hidden]{ display:none }
.ed-js .ed-tel__vista.ed-entra{ animation:ed-texto .35s var(--curva) both }

.ed-ui__t{ margin:0; font-family:var(--sans); font-weight:650; font-size:1.02rem; color:var(--tinta) }
.ed-ui__s{ margin:.15rem 0 .9rem; font-family:var(--sans); font-size:.75rem; color:var(--mudo) }
.ed-ui__lista, .ed-ui__marcas, .ed-ui__barras, .ed-ui__mods, .ed-ui__plan{ list-style:none; margin:0; padding:0 }
.ed-ui__fila{ display:grid; grid-template-columns:1.6rem minmax(0, 1fr) auto; align-items:center; gap:.5rem; padding:.48rem 0; border-top:1px solid var(--filete);
  font-family:var(--sans); font-size:.78rem; color:var(--tinta-2) }
.ed-ui__av{ display:grid; place-items:center; width:1.6rem; height:1.6rem; border-radius:50%; background:#E6DCC9; font-size:.66rem; font-weight:650; color:var(--tinta) }
.ed-ui__chip{ font-size:.68rem; font-weight:600; padding:.2rem .45rem; border-radius:999px; background:rgba(20,80,79,.1); color:#0E3B3A; white-space:nowrap }
.ed-ui__fila.falta .ed-ui__chip{ background:#F7DCE1; color:#7C2335 }
.ed-ui__marcas li{ display:flex; justify-content:space-between; gap:.6rem; padding:.7rem 0; border-top:1px solid var(--filete); font-family:var(--sans); font-size:.82rem; color:var(--tinta-2) }
.ed-ui__marcas b{ color:var(--tinta); font-weight:650 }
.ed-ui__ok{ margin:.9rem 0 0; font-family:var(--sans); font-size:.74rem; color:#0E3B3A }
.ed-ui__alerta, .ed-ui__caso{ padding:.85rem .9rem; border-radius:.9rem; background:#fff; box-shadow:0 0 0 1px #F0C3CC, 0 10px 22px -16px rgba(124,35,53,.6) }
.ed-ui__alerta p, .ed-ui__caso p{ margin:0 0 .5rem; font-family:var(--sans); font-size:.8rem; line-height:1.4; color:var(--tinta) }
.ed-ui__alerta p:last-child, .ed-ui__caso p:last-child{ margin:0 }
.ed-ui__k{ font-size:.68rem !important; font-weight:650; color:#7C2335 !important; margin-bottom:.15rem !important }
.ed-ui__caso{ margin-top:.9rem; box-shadow:0 0 0 1px var(--filete) }
.ed-ui__caso .ed-ui__k{ color:var(--mudo) !important }
.ed-ui__msj{ position:relative; padding:.8rem .85rem 1.3rem; border-radius:1rem 1rem 1rem .25rem; background:#fff; box-shadow:0 0 0 1px var(--filete) }
.ed-ui__msj p{ margin:0; font-family:var(--sans); font-size:.8rem; line-height:1.45; color:var(--tinta) }
.ed-ui__msj span{ position:absolute; right:.8rem; bottom:.4rem; font-family:var(--sans); font-size:.64rem; color:var(--mudo) }
.ed-ui__canales{ display:flex; gap:.35rem; margin:.9rem 0 0 }
.ed-ui__canales span{ font-family:var(--sans); font-size:.68rem; padding:.22rem .5rem; border-radius:999px; box-shadow:inset 0 0 0 1px var(--filete-firme); color:var(--tinta-2) }
.ed-ui__barras{ display:grid; gap:.45rem }
.ed-ui__barras li{ position:relative; height:1.5rem; border-radius:.4rem; background:#ECE7DE; overflow:hidden }
.ed-ui__barras li::before{ content:""; position:absolute; inset:0 auto 0 0; width:calc(var(--v) * 100%); background:#CFE2DF }
.ed-ui__barras li.sel::before{ background:#F2C2CB }
.ed-ui__barras span{ position:relative; display:block; padding:.25rem .5rem; font-family:var(--sans); font-size:.72rem; font-weight:600; color:var(--tinta) }
.ed-ui__form{ display:grid; gap:.6rem }
.ed-ui__form label{ display:grid; gap:.25rem; font-family:var(--sans); font-size:.72rem; font-weight:600; color:var(--tinta-2) }
.ed-ui__form label i{ font-style:normal; font-weight:400; color:var(--mudo) }
.ed-ui__form label span{ display:block; min-height:2.1rem; padding:.55rem .65rem; border-radius:.6rem; background:#fff; box-shadow:inset 0 0 0 1px var(--filete-firme); font-weight:400; font-size:.78rem; color:var(--tinta) }
.ed-ui__btn{ margin:.3rem 0 0; padding:.65rem; border-radius:999px; background:var(--ac-brujula); text-align:center; font-family:var(--sans); font-weight:650; font-size:.82rem; color:var(--tinta) }
.ed-ui__mods li{ display:grid; grid-template-columns:minmax(0, 1fr) auto; gap:.2rem .5rem; padding:.42rem 0; border-top:1px solid var(--filete); font-family:var(--sans); font-size:.76rem; color:var(--tinta-2) }
.ed-ui__mods li::after{ content:""; grid-column:1 / -1; height:4px; border-radius:2px; width:calc(var(--m) / 8 * 100%); background:var(--ac-brujula) }
.ed-ui__mods b{ font-weight:600; color:var(--tinta) }
.ed-ui__hex{ display:block; width:100%; height:auto; margin:.2rem 0 .4rem }
.ed-ui__hex .m polygon, .ed-ui__hex .m line{ fill:none; stroke:rgba(14,23,38,.14); stroke-width:1 }
.ed-ui__hex .p{ fill:color-mix(in srgb, var(--ac-brujula) 35%, transparent); stroke:#B5651D; stroke-width:2; stroke-linejoin:round }
.ed-ui__hex text{ font-family:var(--sans); font-size:13px; font-weight:650; fill:var(--tinta); text-anchor:middle }
.ed-ui__nota{ margin:0; font-family:var(--sans); font-size:.74rem; line-height:1.45; color:var(--tinta-2) }
.ed-ui__plan{ display:grid; gap:.6rem }
.ed-ui__plan li{ display:grid; gap:.2rem; padding:.7rem .8rem; border-radius:.8rem; background:#fff; box-shadow:0 0 0 1px var(--filete) }
.ed-ui__plan b{ font-family:var(--sans); font-size:.72rem; color:#9A5414 }
.ed-ui__plan span{ font-family:var(--sans); font-size:.8rem; line-height:1.4; color:var(--tinta) }

/* Capítulo con velo: la foto a sangre desde un borde, fundida hacia el texto */
.ed-velo{ isolation:isolate; overflow:clip; background:var(--noche); padding-block:clamp(4.5rem, 8vw, 7rem) }
.ed-velo--claro{ background:var(--papel) }
.ed-velo__foto{ margin:0; position:relative; z-index:-2 }
.ed-velo__foto picture{ display:block }
.ed-velo__foto img{ display:block; width:100%; height:auto; aspect-ratio:3 / 2; object-fit:cover; object-position:var(--pos, 50% 50%);
  -webkit-mask-image:linear-gradient(180deg, #000 62%, transparent); mask-image:linear-gradient(180deg, #000 62%, transparent) }
.ed-velo__foto figcaption{ font-family:var(--sans); font-size:.76rem; line-height:1.4; color:#C9D4D7; padding:0 var(--canal); margin-top:-1.6rem; position:relative }
.ed-velo--claro .ed-velo__foto figcaption{ color:var(--mudo) }
.ed-velo__txt{ max-width:36rem }
.ed-velo .ed-lista{ margin-top:var(--e-lg) }
.ed-velo .acciones{ margin-top:var(--e-lg) }
@media (max-width:61.99rem){ .ed-velo{ padding-top:0 } .ed-velo__rej{ margin-top:var(--e-lg) } }
@media (min-width:62rem){
  .ed-velo{ display:grid; align-items:center; min-height:min(52rem, 100vh) }
  .ed-velo__foto{ position:absolute; left:0; top:50%; translate:0 -50%; width:56vw; max-width:74rem }
  .ed-velo__foto img{
    -webkit-mask-image:linear-gradient(90deg, #000 72%, transparent), linear-gradient(180deg, transparent, #000 14%, #000 86%, transparent);
    -webkit-mask-composite:source-in;
    mask-image:linear-gradient(90deg, #000 72%, transparent), linear-gradient(180deg, transparent, #000 14%, #000 86%, transparent); mask-composite:intersect }
  .ed-velo__foto figcaption{ position:absolute; left:var(--canal); bottom:.4rem; margin:0; padding:0 }
  .ed-velo__rej{ display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 34rem); width:min(100%, var(--ancho)) }
  .ed-velo__txt{ grid-column:2 }
}

/* Listas sobrias (sin rayitas laterales) */
.ed-lista{ list-style:none; margin:0; padding:0 }
.ed-lista li{ padding:.95rem 0; border-top:1px solid var(--fl); font-size:1.02rem; line-height:1.55; color:var(--t2) }
.ed-lista li:last-child{ border-bottom:1px solid var(--fl) }
.ed-lista a{ color:var(--t1); text-decoration:underline; text-underline-offset:3px }
.ed-lista b{ color:var(--t1); font-weight:650 }
.ed-sale{ display:inline-flex; align-items:center; gap:.4rem }
.ed-sale svg{ flex:none }

/* Conecta Escuela · tres semanas en una línea de tiempo */
.ed-sem{ background:var(--papel); padding-block:clamp(4.5rem, 9vw, 8rem); overflow:clip }
.ed-sem__cab{ max-width:44rem }
.ed-sem__lista{ list-style:none; margin:clamp(2.5rem, 5vw, 4rem) 0 0; padding:0; display:grid; gap:var(--e-lg) }
.ed-sem__i{ position:relative; display:grid; align-content:start; gap:.35rem }
.ed-sem__ico{ display:grid; place-items:center; width:3.4rem; height:3.4rem; border-radius:1rem; background:color-mix(in srgb, var(--ed) 26%, var(--papel)); color:var(--ed-hondo); margin-bottom:.8rem }
.ed-sem__ico svg{ width:1.7rem; height:1.7rem }
.ed-sem__k{ font-family:var(--sans); font-weight:650; font-size:.88rem; color:var(--ed-hondo) }
.ed-sem__t{ font-family:var(--sans); font-weight:640; font-size:clamp(1.35rem, 1.1rem + .9vw, 1.9rem); letter-spacing:-.02em; line-height:1.1 }
.ed-sem__d{ font-size:1rem; line-height:1.55; color:var(--tinta-2); max-width:34ch; margin-top:.3rem }
.ed-sem__eje{ display:none }
@media (min-width:56rem){
  .ed-sem__lista{ grid-template-columns:repeat(3, minmax(0, 1fr)); column-gap:clamp(2rem, 4vw, 4rem) }
  .ed-sem__eje{ display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)) 12rem; column-gap:0; margin-top:var(--e-xl); font-family:var(--sans); font-size:.8rem; color:var(--mudo) }
  .ed-sem__eje span{ position:relative; padding-top:1.4rem }
  .ed-sem__eje span::before{ content:""; position:absolute; left:0; right:.4rem; top:.3rem; height:8px; border-radius:4px; background:var(--ed) }
  .ed-sem__eje span:nth-child(1)::before{ opacity:.45 } .ed-sem__eje span:nth-child(2)::before{ opacity:.7 }
  .ed-sem__eje span::after{ content:""; position:absolute; left:0; top:-.05rem; width:2px; height:15px; background:var(--tinta) }
  .ed-sem__eje .ed-sem__sigue::before{ background:repeating-linear-gradient(90deg, var(--ed) 0 8px, transparent 8px 13px); right:0 }
  .ed-sem__eje .ed-sem__sigue{ color:var(--ed-hondo); font-weight:600 }
}

/* Brújula · el hexágono de Holland */
.ed-bases{ background:var(--papel); padding-block:clamp(4.5rem, 9vw, 8rem) }
.ed-bases__rej{ display:grid; gap:var(--e-xl); align-items:center }
.ed-bases__fig{ margin:0; justify-self:center; width:min(100%, 32rem) }
.ed-hex{ display:block; width:100%; height:auto; overflow:visible }
.ed-hex .m polygon{ fill:none; stroke:rgba(14,23,38,.13); stroke-width:1 }
.ed-hex .m polygon:first-child{ fill:rgba(255,255,255,.65); stroke:rgba(14,23,38,.22); stroke-width:1.5 }
.ed-hex .m line{ stroke:rgba(14,23,38,.12); stroke-width:1 }
.ed-hex .p{ fill:color-mix(in srgb, var(--ac-brujula) 38%, transparent); stroke:#B5651D; stroke-width:2.5; stroke-linejoin:round }
.ed-hex .pt circle{ fill:#B5651D; stroke:var(--papel); stroke-width:2 }
.ed-hex text{ font-family:var(--sans); font-size:15px; font-weight:500; fill:var(--tinta-2) }
.ed-hex .l{ font-weight:700; fill:#9A5414 }
.ed-bases__fig figcaption{ margin-top:1rem; font-family:var(--sans); font-size:.8rem; line-height:1.45; color:var(--mudo); text-align:center }
.ed-bases__p{ margin-top:var(--e-sm); font-size:1rem; line-height:1.6; color:var(--tinta-2); max-width:56ch }
.ed-bases__p a{ color:var(--tinta) }
.rv .ed-bases__fig[data-entra] .p{ transition:transform 1s var(--curva) .2s; transform-origin:210px 200px }
.rv .ed-bases__fig[data-entra]:not(.visto) .p{ transform:scale(.2) }
@media (min-width:62rem){ .ed-bases__rej{ grid-template-columns:minmax(0, 5fr) minmax(0, 6fr); column-gap:clamp(3rem, 7vw, 7rem) } }

/* Brújula · 28 minutos en una sola barra (oscuro, con foto tenue) */
.ed-tiempo{ isolation:isolate; overflow:clip; background:var(--noche-hondo); padding-block:clamp(4.5rem, 8vw, 7rem) }
.ed-tiempo__fondo{ position:absolute; inset:0; z-index:-2 }
.ed-tiempo__fondo picture{ display:block; position:absolute; inset:0 }
.ed-tiempo__fondo img{ width:100%; height:100%; object-fit:cover; object-position:var(--pos, 50% 50%); opacity:.3 }
.ed-tiempo::before{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg, var(--noche-hondo) 0, rgba(6,17,31,.75) 55%, rgba(6,17,31,.55) 100%), linear-gradient(0deg, var(--noche-hondo), rgba(6,17,31,0) 45%) }
.ed-tiempo__cab{ display:grid; gap:var(--e-xl); align-items:end }
@media (min-width:62rem){ .ed-tiempo__cab{ grid-template-columns:minmax(0, 1fr) minmax(0, 1fr); column-gap:clamp(3rem, 7vw, 7rem) } }
.ed-gran{ display:grid; gap:.5rem; margin:0 }
.ed-gran b{ font-family:var(--sans); font-weight:640; font-size:clamp(3.6rem, 2rem + 6vw, 7.5rem); line-height:.9; letter-spacing:-.045em; color:var(--ed); font-variant-numeric:tabular-nums }
.ed-gran span{ font-family:var(--lee); font-size:clamp(1.05rem, 1rem + .3vw, 1.25rem); line-height:1.5; color:#DCE3E6; max-width:36ch }
.ed-gran a{ font-family:var(--sans); font-size:.78rem; color:#A9B9BD }
.ed-tl{ margin-top:clamp(3rem, 6vw, 5rem) }
.ed-tl__lista{ list-style:none; margin:0; padding:0; display:grid; gap:1.3rem }
.ed-tl__lista li{ display:grid; gap:.2rem }
.ed-tl__b{ display:block; height:14px; border-radius:4px; background:var(--ed); width:calc(var(--m) / 8 * 100%); margin-bottom:.45rem; transform-origin:0 50%; transition:transform .9s var(--curva) }
.ed-tl__b i{ display:none }
.ed-tl__lista li:nth-child(even) .ed-tl__b, .ed-tl__barra span:nth-child(even){ background:color-mix(in srgb, var(--ed) 62%, var(--noche)) }
.ed-tl__lista b{ font-family:var(--sans); font-weight:650; font-size:1rem; color:var(--papel) }
.ed-tl__d{ font-size:.92rem; line-height:1.45; color:#C9D4D7 }
.ed-tl__q{ font-family:var(--sans); font-size:.76rem; color:#A9B9BD }
.ed-tl__barra, .ed-tl__eje{ display:none }
.rv .ed-tl[data-entra]:not(.visto) .ed-tl__b, .rv .ed-tl[data-entra]:not(.visto) .ed-tl__barra{ transform:scaleX(0) }
@media (min-width:62rem){
  /* la barra: un tramo por módulo, proporcional a sus minutos, con su número */
  .ed-tl__barra{ display:flex; gap:3px; margin:0; transform-origin:0 50%; transition:transform 1s var(--curva) }
  .ed-tl__barra span{ flex:var(--m) 1 0; display:grid; place-items:center; height:2.6rem; background:var(--ed);
    font-family:var(--sans); font-size:.86rem; font-weight:700; color:var(--tinta) }
  .ed-tl__barra span:first-child{ border-radius:.6rem 0 0 .6rem }
  .ed-tl__barra span:last-child{ border-radius:0 .6rem .6rem 0 }
  .ed-tl__eje{ display:block; position:relative; height:1.5rem; margin:.7rem 0 0; border-top:1px solid rgba(244,242,238,.2); font-family:var(--sans); font-size:.72rem; color:#A9B9BD }
  .ed-tl__eje span{ position:absolute; left:var(--x); top:.35rem; translate:-50% 0; font-variant-numeric:tabular-nums }
  .ed-tl__eje span::before{ content:""; position:absolute; left:50%; top:-.4rem; width:1px; height:.3rem; background:rgba(244,242,238,.4) }
  .ed-tl__eje span:first-child{ translate:0 0 } .ed-tl__eje span:first-child::before{ left:0 }
  .ed-tl__eje span:nth-last-child(2){ translate:-100% 0 } .ed-tl__eje span:nth-last-child(2)::before{ left:auto; right:0 }
  .ed-tl__eje i{ position:absolute; right:0; top:1.5rem; font-style:normal }
  /* los módulos: tres columnas iguales, cada uno con el número y el color de su tramo */
  .ed-tl__lista{ grid-template-columns:repeat(3, minmax(0, 1fr)); gap:2rem clamp(1.5rem, 3vw, 3rem); margin-top:2.6rem }
  .ed-tl__lista li{ grid-template-columns:2.2rem minmax(0, 1fr); column-gap:.8rem; align-content:start }
  .ed-tl__b{ grid-row:span 3; width:2.2rem; height:2.2rem; margin:0; border-radius:.5rem; display:grid; place-items:center; transform:none }
  .ed-tl__b i{ display:block; font-style:normal; font-family:var(--sans); font-size:.86rem; font-weight:700; color:var(--tinta) }
  .ed-tl__lista b, .ed-tl__d, .ed-tl__q{ grid-column:2 }
}

/* Brújula · colegios aliados */
.ed-colegios{ background:var(--niebla); padding-block:clamp(4.5rem, 8vw, 7rem) }
.ed-colegios__rej{ display:grid; gap:var(--e-xl); align-items:start }
.ed-colegios .acciones{ margin-top:var(--e-lg) }
@media (min-width:56rem){ .ed-colegios__rej{ grid-template-columns:minmax(0, 5fr) minmax(0, 6fr); column-gap:clamp(3rem, 7vw, 7rem) } }

/* Conecta COAR · herramientas propias */
.ed-herr{ background:var(--papel); padding-block:0 clamp(4.5rem, 9vw, 8rem) }
.ed-herr__cab{ max-width:44rem; padding-top:clamp(1rem, 3vw, 2rem) }
.ed-herr__lista{ list-style:none; margin:clamp(2rem, 4vw, 3rem) 0 0; padding:0; display:grid; gap:0 }
.ed-herr__i{ display:grid; align-content:start; gap:.4rem; padding:1.3rem 0; border-top:1px solid var(--filete) }
.ed-herr__i h3{ font-family:var(--sans); font-weight:640; font-size:clamp(1.2rem, 1.05rem + .5vw, 1.5rem); letter-spacing:-.015em }
.ed-herr__i p{ font-size:1rem; line-height:1.55; color:var(--tinta-2); max-width:58ch }
.ed-herr__i a{ color:var(--tinta) }
.ed-herr{ padding-top:clamp(4rem, 8vw, 6.5rem) }
.ed-herr__para{ font-family:var(--sans); font-size:.84rem !important; font-weight:600; color:var(--ed-hondo) !important; margin-top:-.1rem }
.ed-herr__dis{ margin-top:var(--e-lg); border-top:1px dashed var(--filete) }
.ed-herr__dis summary{ display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; padding:1.1rem 0 .3rem; cursor:pointer; list-style:none;
  font-family:var(--sans); font-weight:650; font-size:1rem; color:var(--tinta) }
.ed-herr__dis summary::-webkit-details-marker{ display:none }
.ed-herr__dis summary::before{ content:""; width:.5rem; height:.5rem; border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor; transform:rotate(-45deg); transition:transform .2s var(--curva) }
.ed-herr__dis[open] summary::before{ transform:rotate(45deg) }
.ed-herr__dis summary:focus-visible{ outline:2px solid var(--tinta); outline-offset:3px; border-radius:.3rem }
.ed-herr__dis .ed-dis__n{ color:var(--tinta); box-shadow:inset 0 0 0 1px var(--filete) }
.ed-herr__dis-n{ font-weight:500; font-size:.86rem; color:var(--mudo) }
.ed-herr .acciones{ margin-top:var(--e-lg) }
@media (min-width:56rem){
  .ed-herr__lista{ grid-template-columns:repeat(3, minmax(0, 1fr)); column-gap:clamp(2rem, 4vw, 3.5rem) }
}

/* Vitrina (v31): una franja. Texto y botón a un lado; la computadora y el celular al otro, sobre la foto con velo */
.ed-vit{ isolation:isolate; overflow:clip; background:var(--noche-hondo); padding-block:clamp(3.5rem, 6vw, 5rem) }
.ed-vit__fondo{ position:absolute; inset:0; z-index:-2 }
.ed-vit__fondo picture{ display:block; position:absolute; inset:0 }
.ed-vit__fondo img{ width:100%; height:100%; object-fit:cover; object-position:var(--pos, 50% 50%) }
.ed-vit::before{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(90deg, rgba(6,17,31,.94) 0, rgba(6,17,31,.82) 45%, rgba(6,17,31,.6) 100%) }
.ed-vit__rej{ display:grid; gap:var(--e-xl); align-items:center }
.ed-vit__cab .entrada{ text-shadow:0 1px 12px rgba(6,17,31,.75) }
.ed-vit__equipos{ position:relative; width:min(100%, 36rem); padding-right:clamp(2rem, 5vw, 3.5rem); padding-bottom:1.5rem; justify-self:center }
.ed-nav-marco{ margin:0; border-radius:.8rem; overflow:hidden; background:#E9E5DD; box-shadow:0 0 0 1px rgba(244,242,238,.14), 0 50px 80px -40px rgba(0,0,0,.8) }
.ed-nav-marco__barra{ display:flex; align-items:center; gap:.35rem; padding:.5rem .75rem }
.ed-nav-marco__barra i{ width:.55rem; height:.55rem; border-radius:50%; background:#CFC7B8 }
.ed-nav-marco__barra span{ flex:1; max-width:18rem; margin:0 auto; padding:.24rem .7rem; border-radius:999px; background:#fff; font-family:var(--sans); font-size:.7rem; color:var(--mudo); text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.ed-nav-marco img{ display:block; width:100%; height:auto }
.ed-cel-marco{ position:absolute; right:0; bottom:0; width:clamp(5.5rem, 24%, 8.5rem); margin:0; padding:.3rem; border-radius:1.3rem; background:var(--tinta);
  box-shadow:0 30px 50px -24px rgba(0,0,0,.8), 0 0 0 1px rgba(244,242,238,.12) }
.ed-cel-marco img{ display:block; width:100%; height:auto; border-radius:1.05rem }
.ed-vit__pie{ display:flex; flex-wrap:wrap; align-items:center; gap:.6rem 1.2rem; margin-top:var(--e-lg) }
.ed-vit__pie .boton{ background:var(--ed); border-color:var(--ed); color:var(--tinta) }
.ed-vit__dom{ font-family:var(--sans); font-size:.86rem; color:#A9B9BD }
@media (min-width:56rem){ .ed-vit__rej{ grid-template-columns:minmax(0, 1fr) minmax(0, 36rem); column-gap:clamp(3rem, 6vw, 6rem) } }

/* Cierre a sangre, con «Parte de la comunidad Educación» al pie */
.ed-fin{ isolation:isolate; overflow:clip; background:var(--noche-hondo); padding-block:clamp(6rem, 12vw, 10rem) clamp(2.5rem, 5vw, 4rem) }
.ed-fin__foto{ position:absolute; inset:0; z-index:-2 }
.ed-fin__foto picture{ display:block; position:absolute; inset:0 }
.ed-fin__foto img{ width:100%; height:100%; object-fit:cover; object-position:var(--pos, 50% 50%) }
.ed-fin::before{ content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(90deg, rgba(6,17,31,.9) 0, rgba(6,17,31,.62) 50%, rgba(6,17,31,.35) 100%), linear-gradient(0deg, var(--noche-hondo) 0, rgba(6,17,31,.4) 40%, rgba(6,17,31,0) 70%) }
.ed-fin__in{ max-width:none }
.ed-fin__in .ed-h2{ max-width:20ch }
.ed-fin .acciones{ margin-top:var(--e-lg); display:flex; flex-wrap:wrap; gap:.75rem }
.ed-fin__origen{ margin-top:var(--e-lg); font-family:var(--sans); font-size:.88rem; color:#C9D4D7 }
.ed-fin__origen a{ color:var(--papel) }
.ed-fin__encaja{ margin-top:clamp(4rem, 8vw, 7rem) }
.ed-fin__k{ display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:.5rem 1rem; padding-bottom:1rem; border-bottom:1px solid rgba(244,242,238,.16) }
.ed-fin__k h2{ font-family:var(--sans); font-size:.95rem; font-weight:650; color:var(--papel); margin:0 }
.ed-fin__lista{ list-style:none; margin:1.2rem 0 0; padding:0; display:grid; gap:1rem }
.ed-fin__lista a{ height:100%; display:grid; grid-template-columns:auto minmax(0, 1fr); gap:.3rem 1rem; align-items:start; padding:1.2rem 1.3rem; border-radius:1rem; text-decoration:none;
  background:rgba(6,17,31,.45); box-shadow:inset 0 0 0 1px rgba(244,242,238,.14); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  transition:background-color .25s var(--curva), box-shadow .25s var(--curva) }
.ed-fin__lista a:hover{ background:rgba(6,17,31,.62); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--c) 55%, transparent) }
.ed-fin__lista a:focus-visible{ outline:2px solid var(--piedra); outline-offset:3px }
.ed-fin__ico{ grid-row:span 2; display:grid; place-items:center; width:2.4rem; height:2.4rem; border-radius:.7rem; background:color-mix(in srgb, var(--c) 20%, transparent); color:var(--c) }
.ed-fin__ico svg{ width:1.3rem; height:1.3rem }
.ed-fin__lista b{ font-family:var(--sans); font-weight:650; font-size:1.05rem; color:var(--papel) }
/* v31 · anterior, siguiente y su comunidad */
.ed-fin__dir{ display:block; margin-bottom:.15rem; font-size:.76rem; font-weight:600; color:var(--c) }
.ed-fin__sig a{ box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--c) 45%, transparent) }
.ed-fin__lista span:last-child{ font-size:.92rem; line-height:1.5; color:#C9D4D7 }
@media (min-width:56rem){ .ed-fin__lista{ grid-template-columns:repeat(auto-fit, minmax(0, 1fr)) } }
@media (max-width:37.5rem){ .ed-fin .acciones{ flex-direction:column; align-items:stretch } }

/* Estado en la ficha */
.ed-sub .ed-estado{ white-space:nowrap }

/* ============================================================ 3 · MAPA DE LAS 25 SEDES COAR (v29: relieve y rótulos) */
.ed-mapa{ --ed:var(--ac-coar); isolation:isolate; overflow:clip; background:var(--noche-hondo); padding-block:clamp(4.5rem, 8vw, 7rem) }
.ed-mapa::before{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(40% 55% at 28% 60%, rgba(124,196,190,.08), transparent 70%), radial-gradient(35% 40% at 80% 10%, color-mix(in srgb, var(--ac-coar) 10%, transparent), transparent 70%) }
.ed-mapa [data-ed-solo-js][hidden]{ display:none }
.ed-mapa__cab{ display:grid; gap:var(--e-md); align-items:end }
.ed-mapa__gran{ font-family:var(--sans); font-weight:640; font-size:clamp(5rem, 3rem + 9vw, 11rem); line-height:.8; letter-spacing:-.06em; color:var(--ac-coar) }
@media (min-width:56rem){ .ed-mapa__cab{ grid-template-columns:auto minmax(0, 46rem); column-gap:clamp(2rem, 4vw, 3.5rem) } }
.ed-mapa__rej{ display:grid; gap:var(--e-xl); align-items:start; margin-top:clamp(2.5rem, 5vw, 4rem) }
.ed-mapa__lienzo{ position:relative; width:min(100%, 32rem); justify-self:center; aspect-ratio:600 / 871 }
.ed-mapa__svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible }
.ed-mapa__ondas use{ fill:none; stroke:rgba(124,196,190,.1); stroke-linejoin:round }
.ed-mapa__ondas .o1{ stroke-width:14 } .ed-mapa__ondas .o2{ stroke-width:34; stroke:rgba(124,196,190,.06) } .ed-mapa__ondas .o3{ stroke-width:60; stroke:rgba(124,196,190,.035) }
.ed-mapa__dep{ fill:#18304C; stroke:rgba(216,203,179,.32); stroke-width:1; stroke-linejoin:round; transition:fill .3s var(--curva) }
.ed-mapa__dep--s{ fill:#1C3756 }
.ed-mapa__dep.on{ fill:color-mix(in srgb, var(--ac-coar) 42%, #1C3756) }
.ed-mapa__dep.phr{ fill:color-mix(in srgb, var(--ac-coar) 26%, #1C3756) }
.ed-mapa__sedes, .ed-mapa__rots{ position:absolute; inset:0 }
.ed-mapa__rots{ pointer-events:none }
.ed-sede{ position:absolute; left:var(--x); top:var(--y); width:1.6rem; height:1.6rem; margin:-.8rem 0 0 -.8rem; padding:0; border:0; background:none; cursor:pointer; display:grid; place-items:center }
.ed-sede span{ width:.66rem; height:.66rem; border-radius:50%; background:var(--ac-coar); box-shadow:0 0 0 2px var(--noche-hondo), 0 0 0 5px color-mix(in srgb, var(--ac-coar) 18%, transparent); transition:transform .2s var(--curva), box-shadow .2s var(--curva) }
.ed-sede--phr span{ width:.9rem; height:.9rem; background:var(--papel); box-shadow:0 0 0 3px var(--ac-coar), 0 0 0 7px color-mix(in srgb, var(--ac-coar) 25%, transparent) }
.ed-sede:hover span{ transform:scale(1.3) }
.ed-sede.on span{ transform:scale(1.5); box-shadow:0 0 0 2px var(--noche-hondo), 0 0 0 6px color-mix(in srgb, var(--ac-coar) 60%, transparent), 0 0 24px 6px color-mix(in srgb, var(--ac-coar) 35%, transparent) }
.ed-js .ed-mapa__sedes .ed-sede span{ animation:ed-sede .5s var(--curva) both; animation-delay:calc(var(--i) * 35ms) }
@keyframes ed-sede{ from{ transform:scale(0) } }
.ed-mapa__rot{ position:absolute; left:var(--x); top:var(--y); font-family:var(--sans); font-size:.74rem; font-weight:650; color:var(--papel); white-space:nowrap;
  padding:.15rem .45rem; border-radius:.35rem; background:rgba(6,17,31,.72); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ac-coar) 45%, transparent) }
.ed-mapa__rot--der{ translate:1rem -50% } .ed-mapa__rot--izq{ translate:calc(-100% - 1rem) -50% } .ed-mapa__rot--arriba{ translate:-50% calc(-100% - .9rem) }
.ed-mapa__phr-caja{ padding:1.2rem 1.3rem; border-radius:1rem; background:color-mix(in srgb, var(--ac-coar) 8%, rgba(244,242,238,.03)); box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--ac-coar) 28%, transparent) }
.ed-mapa__phr-k{ display:flex; align-items:center; gap:.6rem; font-family:var(--sans); font-weight:650; font-size:.92rem; color:var(--ac-coar) }
.ed-mapa__phr-marca{ width:.9rem; height:.9rem; border-radius:50%; background:var(--papel); box-shadow:0 0 0 3px var(--ac-coar) }
.ed-mapa__phr{ margin-top:.5rem; font-size:.98rem; line-height:1.55; color:#DCE3E6 }
.ed-mapa__ver{ margin-top:.7rem; padding:0; border:0; background:none; font:inherit; font-family:var(--sans); font-weight:600; font-size:.92rem; color:var(--ac-coar);
  text-decoration:underline; text-underline-offset:4px; text-decoration-thickness:1.5px; cursor:pointer }
.ed-mapa__ver[hidden]{ display:none }
.ed-mapa__ver:hover{ color:var(--papel) }
.ed-mapa__ver:focus-visible{ outline:2px solid var(--piedra); outline-offset:3px; border-radius:2px }
.ed-sedes__phr{ font-style:normal; font-weight:600; color:var(--ac-coar) }
.ed-sedes__b .ed-sedes__phr{ font-family:var(--sans); font-size:.74rem; line-height:1.3 }
.ed-phr-on .ed-sede:not(.ed-sede--phr) span{ opacity:.25 }
.ed-mapa__ficha{ margin-top:var(--e-lg) }
.ed-mapa__fphr{ margin:var(--e-sm) 0 0; font-family:var(--sans); font-size:.9rem; font-weight:600; color:var(--ac-coar) }
.ed-mapa__fphr[hidden]{ display:none }
.ed-mapa__ficha.ed-entra .ed-mapa__n, .ed-mapa__ficha.ed-entra .ed-mapa__dl{ animation:ed-texto .3s var(--curva) both }
.ed-mapa__k{ margin:0 0 .35rem; font-family:var(--sans); font-size:.84rem; color:var(--ed) }
.ed-mapa__n{ margin:0; font-family:var(--sans); font-weight:640; font-size:clamp(1.6rem, 1.25rem + 1.2vw, 2.3rem); line-height:1.05; letter-spacing:-.02em }
.ed-mapa__dl{ margin:var(--e-sm) 0 0; display:grid; gap:.5rem }
.ed-mapa__dl div{ display:grid; grid-template-columns:6rem minmax(0, 1fr); gap:.75rem; padding-top:.5rem; border-top:1px solid var(--fl) }
.ed-mapa__dl dt{ font-family:var(--sans); font-size:.84rem; color:var(--t3) }
.ed-mapa__dl dd{ margin:0; font-size:.98rem; line-height:1.45; color:var(--t1) }
.ed-mapa__nav{ display:flex; gap:.5rem; margin-top:var(--e-sm) }
.ed-sedes{ list-style:none; margin:var(--e-md) 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; column-gap:1.25rem }
.ed-sedes li{ border-top:1px solid var(--fl) }
.ed-sedes__b{ display:none }
.ed-sedes__sinjs{ display:block; padding:.5rem 0; font-size:.9rem; line-height:1.35; color:var(--t2) }
.ed-sedes__sinjs b{ font-family:var(--sans); font-weight:600; color:var(--t1) }
.ed-js .ed-sedes__sinjs{ display:none }
.ed-js .ed-sedes__b{ display:grid; gap:.05rem; width:100%; padding:.45rem .5rem; margin:0 -.5rem; border:0; border-radius:.5rem; background:none; text-align:left; cursor:pointer; font:inherit; color:var(--t2);
  transition:background-color .2s var(--curva) }
.ed-sedes__b b{ font-family:var(--sans); font-weight:600; font-size:.9rem; color:var(--t1) }
/* v30 · la ubicación se lee completa (antes se cortaba con puntos suspensivos) */
.ed-sedes__b span{ font-family:var(--sans); font-size:.76rem; line-height:1.35; color:var(--t3) }
.ed-sedes__b:hover{ background:rgba(216,203,179,.07) }
.ed-sedes__b[aria-pressed="true"]{ background:color-mix(in srgb, var(--ac-coar) 16%, transparent) }
.ed-sedes__b[aria-pressed="true"] b{ color:var(--ac-coar) }
.ed-sedes__b:focus-visible{ outline:2px solid var(--piedra); outline-offset:-2px }
.ed-js .ed-sedes{ max-height:20rem; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:rgba(216,203,179,.3) transparent; padding-right:.5rem;
  scroll-snap-type:y proximity; scroll-padding-block:1.25rem;
  -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 1.25rem, #000 calc(100% - 2.5rem), transparent 100%);
  mask-image:linear-gradient(to bottom, transparent 0, #000 1.25rem, #000 calc(100% - 2.5rem), transparent 100%);
  padding-block:1.25rem 2rem }
.ed-js .ed-sedes li{ scroll-snap-align:start }
.ed-mapa__ley{ list-style:none; margin:var(--e-lg) 0 0; padding:0; display:flex; flex-wrap:wrap; gap:.5rem 1.6rem; font-family:var(--sans); font-size:.8rem; color:#A9B9BD }
.ed-mapa__ley li{ display:inline-flex; align-items:center; gap:.55rem }
.ed-mapa__ley li::before{ content:""; width:.62rem; height:.62rem; border-radius:50%; background:var(--ac-coar) }
.ed-mapa__ley .p::before{ width:.8rem; height:.8rem; background:var(--papel); box-shadow:0 0 0 3px var(--ac-coar) }
.ed-mapa__nota{ margin:var(--e-sm) 0 0; font-family:var(--sans); font-size:.84rem; line-height:1.55; color:var(--t3); max-width:72ch }
.ed-mapa__nota a{ color:var(--t2) }
.ed-mapa__cifra{ font-weight:650; color:var(--ac-coar) }
.ed-fuentes{ margin:var(--e-sm) 0 0; font-family:var(--sans); font-size:.84rem; line-height:1.55; color:var(--t3); max-width:72ch }
.ed-fuentes summary{ display:inline-flex; align-items:center; gap:.4rem; cursor:pointer; list-style:none; color:var(--t2); font-weight:600; padding:.3rem 0 }
.ed-fuentes summary::-webkit-details-marker{ display:none }
.ed-fuentes summary::after{ content:""; width:.42rem; height:.42rem; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:translateY(-2px) rotate(45deg); transition:transform .2s var(--curva) }
.ed-fuentes[open] summary::after{ transform:translateY(1px) rotate(-135deg) }
.ed-fuentes summary:hover{ color:var(--t1) }
.ed-fuentes summary:focus-visible{ outline:2px solid var(--piedra); outline-offset:3px; border-radius:2px }
.ed-fuentes ul{ list-style:none; margin:.4rem 0 0; padding:0 }
.ed-fuentes li{ padding:.3rem 0 }
.ed-fuentes a{ color:var(--t2) }
@media (min-width:56rem){
  .ed-mapa__rej{ grid-template-columns:minmax(0, 6fr) minmax(0, 5fr); column-gap:clamp(2.5rem, 5vw, 5rem) }
  .ed-mapa__lienzo{ width:100%; max-width:36rem }
}
@media (max-width:30rem){ .ed-sedes{ grid-template-columns:1fr } .ed-mapa__rot{ font-size:.66rem } }

@media (prefers-reduced-motion:reduce){
  .ed-hitos::after, .ed-hito__nodo, .ed-js .ed-hito, .ed-reloj__hh, .ed-reloj__mm, .ed-mapa__dep, .ed-sede span, .ed-sedes__b, .ed-fin__lista a,
  .ed-tl__b, .ed-fuentes summary::after{ transition:none }
  .ed-js .ed-tel__vista.ed-entra, .ed-js .ed-mapa__sedes .ed-sede span, .ed-mapa__ficha.ed-entra *, .ed-mando__barra{ animation:none !important }
  .ed-tl__barra{ transition:none }
  .rv .ed-tl[data-entra]:not(.visto) .ed-tl__b, .rv .ed-tl[data-entra]:not(.visto) .ed-tl__barra, .rv .ed-bases__fig[data-entra]:not(.visto) .p{ transform:none }
  .ed-mando__play{ display:none }
}
.ed-ap__origen a{ color:var(--papel); text-decoration:underline; text-decoration-color:rgba(244,242,238,.35); text-underline-offset:3px }
.ed-ap__origen a:hover{ text-decoration-color:currentColor }
