/* ==========================================================================
   Serie Enlaces: identificadores y ficha de cada sección, como en el libro
   (Londrina Solid para títulos, Mulish para el texto; colores tomados del PDF)
   ========================================================================== */
/* Todas las pestañas con la misma altura de cuerpo (--h) y el mismo tamaño de título */
.enl-id { --h: clamp(48px, 11vw, 84px); position: relative; height: calc(var(--h) / var(--cuerpo, 1)); width: auto; max-width: 100%; aspect-ratio: var(--ar); margin: 30px 0 14px; }
.enl-id-tab { position: absolute; inset: 0 auto auto 0; width: 100%; height: auto; display: block; }
.enl-id-tit {
  position: absolute; left: 3%; right: 17%; top: calc(var(--cuerpo, 1) * 50%); transform: translateY(-54%);
  text-align: center; color: #fff; white-space: nowrap;
  font: 900 calc(var(--h) * .37)/1 "Londrina Solid", "Baloo 2", sans-serif; text-shadow: 2px 2px 0 rgba(0, 0, 0, .22);
}
.enl-ps .enl-id-tit { right: 22%; }
.enl-pf .enl-id-tit { left: 2%; right: 15%; }
.enl-id-pj { position: absolute; height: auto; transform-origin: 50% 100%; animation: enl-pj 7s ease-in-out infinite; }
.enl-id.is-compacto { --h: clamp(42px, 9vw, 60px); margin: 0 auto 14px; }
.enl-sub { margin: -2px 0 16px; font: 400 clamp(1.5rem, 3.2vw, 1.9rem)/1.15 "Londrina Solid", sans-serif; color: var(--enl-c, #283583); letter-spacing: .01em; }
/* Movimiento muy suave: el personaje se balancea y respira; nada más se mueve */
@keyframes enl-pj { 0%, 100% { transform: rotate(0) translateY(0); } 30% { transform: rotate(-1.6deg) translateY(-.6%); } 60% { transform: rotate(1.2deg) translateY(0); } }

/* Colores por sección */
.enl-sec-ed  { --enl-c: #0a4f9e; --enl-t1: #f9b52e; --enl-t2: #f1902a; --enl-borde: #f6a83a; }
.enl-sec-tlc { --enl-c: #283583; --enl-t1: #27a3dd; --enl-t2: #1d8bcd; --enl-borde: #1d8bcd; }
.enl-sec-pf  { --enl-c: #6c2f8e; --enl-t1: #a050c4; --enl-t2: #8a3fae; --enl-borde: #9a4cbf; }
.enl-sec-pe  { --enl-c: #7a4284; --enl-t1: #4fbec8; --enl-t2: #2db4bd; --enl-borde: #3bb8c2; }
.enl-sec-ps  { --enl-c: #ed6e9f; --enl-t1: #e9426f; --enl-t2: #ec5a8e; --enl-borde: #ec6d98; }

/* Tabla de clasificación textual (Categoría · Formato · Secuencia · Tipo · Área) */
.enl-ficha { width: 100%; margin: 0 0 14px; border-collapse: separate; border-spacing: 0; border: 1.5px solid var(--enl-borde); border-radius: 10px; overflow: hidden; table-layout: fixed; }
.enl-ficha th { padding: 4px 6px; background: linear-gradient(90deg, var(--enl-t1), var(--enl-t2)); color: #fff; font: 400 1.02rem/1.1 "Londrina Solid", sans-serif; letter-spacing: .02em; }
.enl-ficha td { padding: 5px 6px; text-align: center; font: 300 .86rem/1.25 "Mulish", sans-serif; color: #111; background: #fff; }
.enl-ficha th + th, .enl-ficha td + td { border-left: 1.5px solid var(--enl-borde); }

/* Lectura con el estilo de la página del libro */
.enl-lectura .ev-texto { font: 300 1.02rem/1.6 "Mulish", sans-serif; color: #111; }
.enl-lectura .ev-texto h3 { font: 400 clamp(1.35rem, 3vw, 1.7rem)/1.15 "Londrina Solid", sans-serif; color: var(--enl-c); letter-spacing: .01em; }
.enl-lectura .ev-texto b, .enl-lectura .ev-texto strong { font-weight: 700; }
.enl-lectura .ev-credito { font: 300 .8rem/1.4 "Mulish", sans-serif; }
.enl-lectura.ev-texto-wrap { border-radius: 16px; box-shadow: inset 0 0 0 1.5px var(--enl-borde); }
/* Proyecto de escritura: cuaderno de espiral */
.enl-sec-pe .ev-texto-wrap, .enl-sec-pe .act-instruction { position: relative; }
.enl-sec-pe.enl-hoja { padding-left: 26px; border-left: 2px solid var(--enl-borde);
  background: radial-gradient(circle at 0 50%, transparent 8px, var(--enl-borde) 8.5px 10px, transparent 10.5px) 0 0 / 24px 34px repeat-y; }
/* Prueba Saber: barra «Responde las preguntas…» */
.enl-sec-ps .ev-rango { padding: 6px 12px; border-radius: 4px; text-align: center; color: #fff; background: linear-gradient(90deg, #e9426f, #ec5a8e);
  font: 600 .74rem/1.3 "Lexend Deca", "Montserrat", sans-serif; letter-spacing: .03em; }
.enl-sec-ps .quiz-q, .enl-sec-ps .ev-num { color: #e9424d; }
.enl-lectura-wrap .quiz-q { font-family: "Mulish", sans-serif; font-weight: 700; }

/* Unidades con los colores del libro (1 verde, 2 naranja, 3 rojo, 4 morado) */
.enl-unidades .act-unidad:nth-child(1) { --u: #93be1e; } .enl-unidades .act-unidad:nth-child(2) { --u: #f39a2b; }
.enl-unidades .act-unidad:nth-child(3) { --u: #e0312f; } .enl-unidades .act-unidad:nth-child(4) { --u: #8e2c6e; }
.enl-unidades .act-unidad b { font: 900 1.25rem/1 "Londrina Solid", sans-serif; color: var(--u); }
.enl-unidades .act-unidad.is-on { background: var(--u); box-shadow: 0 10px 22px -14px var(--u); }
.enl-unidades .act-unidad.is-on b { color: #fff; }

@media (prefers-reduced-motion: reduce) { .enl-id-pj { animation: none; } }

/* Portada de los libros Enlaces: capas animadas sobre la imagen */
.cv-capa { position: absolute; inset: 0; pointer-events: none; border-radius: 3px 8px 8px 3px; }
.cv-cabeza { background-size: 100% 100%; animation: cv-cabeza 9s ease-in-out 1.5s infinite; }
.cv-nota { overflow: hidden; }
.cv-nota::before {
  content: ""; position: absolute; top: -10%; bottom: -10%; width: 30%; left: -40%;
  background: linear-gradient(105deg, transparent, rgba(255,255,255,.5), transparent); animation: cv-brillo 8s ease-in-out 2.5s infinite;
}
.cv-foco { inset: auto; width: 9%; aspect-ratio: 1; margin: -4.5% 0 0 -4.5%; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,240,150,.85), rgba(255,220,80,0) 70%); mix-blend-mode: screen; animation: cv-foco 4s ease-in-out infinite; }
@keyframes cv-cabeza { 0%, 72%, 100% { transform: rotate(0); } 79% { transform: rotate(-3deg); } 87% { transform: rotate(2deg); } 93% { transform: rotate(0); } }
@keyframes cv-brillo { 0%, 60% { left: -40%; } 85%, 100% { left: 120%; } }
@keyframes cv-foco { 0%, 100% { opacity: .15; transform: scale(.8); } 50% { opacity: .9; transform: scale(1.15); } }

@media (prefers-reduced-motion: reduce) {
  .pj *, .cv-capa, .cv-nota::before { animation: none !important; }
}

/* Contenido de la unidad abierta: borde del color de su botón (1 verde, 2 naranja, 3 rojo, 4 morado) */
.enl-unidad-cont { --u: #93be1e; margin-top: 4px; padding: 6px 16px 18px; border: 3px solid var(--u); border-radius: 18px; box-shadow: 0 0 0 5px color-mix(in srgb, var(--u) 14%, transparent); }
.enl-unidad-cont[data-u="2"] { --u: #f39a2b; } .enl-unidad-cont[data-u="3"] { --u: #e0312f; } .enl-unidad-cont[data-u="4"] { --u: #8e2c6e; }
.enl-unidad-cont::before { content: "Unidad " attr(data-u); position: sticky; top: 8px; z-index: 3; display: inline-block; margin: -2px 0 0 -4px; padding: 3px 12px;
  border-radius: 999px; background: var(--u); color: #fff; font: 900 1rem/1.2 "Londrina Solid", sans-serif; letter-spacing: .03em; }
@media (max-width: 640px) { .enl-unidad-cont { padding: 4px 10px 14px; } }