/* ==========================================================================
   Animal Libre — v22
   ========================================================================== */

/* ---------- Galgos: la ley como una línea que se abre (reemplaza al óvalo) ---------- */
.al-ley { --pos: calc(var(--ahora) / var(--n) * 100% + 6px); position: relative; margin-top: 14px; }
.al-ley-frase { margin: 0 0 34px; max-width: 24em; font-family: var(--display); font-weight: 500; font-size: clamp(1.4rem, 1.1rem + 1vw, 2.1rem); line-height: 1.15; letter-spacing: -0.02em; color: #fff; }
.al-ley-frase em { font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--lila); }
.al-ley-riel { position: relative; height: 110px; }
.al-ley-pista { position: absolute; left: 0; right: 0; bottom: 14px; height: 2px; background-image: linear-gradient(90deg, rgba(244,239,233,.35) 0 4px, transparent 4px 12px); background-size: 12px 2px; }
.al-ley-hecho { position: absolute; left: 0; top: -1px; height: 4px; width: var(--pos); border-radius: 4px; background: linear-gradient(90deg, #7E17BE, #cfa8ef 70%, #f05c40); box-shadow: 0 0 18px rgba(207,168,239,.55); transform: scaleX(0); transform-origin: 0 50%; transition: transform 2.2s cubic-bezier(.65,0,.25,1) .2s; }
.al-ley.al-on .al-ley-hecho { transform: scaleX(1); }
.al-ley-galgo { position: absolute; bottom: 16px; left: var(--pos); width: 190px; height: 120px; transform: translateX(-50%); pointer-events: none; opacity: 0; transition: opacity .8s ease 1.6s; }
.al-ley.al-on .al-ley-galgo { opacity: 1; }
.al-ley-etapas { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n), 1fr); gap: 0 14px; }
.al-ley-et { position: relative; padding-top: 22px; opacity: 0; transform: translateY(10px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); transition-delay: calc(.35s + var(--i) * .22s); }
.al-ley.al-on .al-ley-et { opacity: 1; transform: none; }
.al-ley-et > i { position: absolute; left: 0; top: -22px; width: 12px; height: 12px; border-radius: 50%; background: #120c18; box-shadow: inset 0 0 0 2px rgba(244,239,233,.45); }
.al-ley-et b { display: block; margin-bottom: 6px; font-family: var(--display); font-weight: 500; font-size: 1.05rem; letter-spacing: -0.01em; color: #fff; }
.al-ley-et span { display: block; font-size: .86rem; line-height: 1.5; color: rgba(244,239,233,.7); }
.al-ley-et--hecho > i { background: var(--lila); box-shadow: 0 0 0 4px rgba(207,168,239,.18); }
.al-ley-et--ahora > i { background: #f05c40; box-shadow: 0 0 0 5px rgba(240,92,64,.22); animation: al-ley-late 1.8s ease-in-out infinite; }
.al-ley-et--ahora b { color: #f05c40; }
.al-ley-et--futuro b { color: rgba(244,239,233,.75); }
.al-ley-et--futuro span { color: rgba(244,239,233,.5); }
@keyframes al-ley-late { 50% { box-shadow: 0 0 0 10px rgba(240,92,64,.06); } }
@media (max-width: 991px) {
  .al-ley-riel { display: none; }
  .al-ley-etapas { grid-template-columns: 1fr; gap: 0; border-left: 2px dashed rgba(244,239,233,.25); margin-left: 6px; }
  .al-ley-et { padding: 0 0 26px 26px; }
  .al-ley-et > i { left: -8px; top: 4px; }
  .al-ley-et:last-child { padding-bottom: 0; }
}
@media (prefers-reduced-motion: reduce) { .al-ley-hecho, .al-ley-et, .al-ley-galgo { transition: none; } }

/* ---------- AVA São Paulo ---------- */
.al-ava-sp { grid-column: 1 / -1; display: grid; grid-template-columns: 1.5fr 1fr; gap: 26px; align-items: center; margin: 16px 0 0; padding: 14px; border-radius: 22px; background: var(--papel, #FAF7F3); border: 1px solid rgba(43,37,37,.08); }
.al-ava-sp .al-foto { aspect-ratio: 3 / 2; border-radius: 14px; }
.al-ava-sp figcaption { padding-right: 16px; font-size: 1rem; line-height: 1.6; color: rgba(43,37,37,.75); }
.al-ava-sp figcaption b { display: block; margin-bottom: 6px; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 1.6rem; color: var(--texto, #2B2525); }
@media (max-width: 767px) { .al-ava-sp { grid-template-columns: 1fr; gap: 14px; } .al-ava-sp figcaption { padding: 0 6px 6px; } }

/* ---------- La fuente de «Por qué Animal Libre», dentro de su tarjeta ---------- */
.al-razon-fuente { display: block; margin-top: 14px; font-size: .72rem; line-height: 1.45; color: rgba(244,239,233,.42); }
.al-razon-fuente sup { color: var(--lila); }
:not(.al-oscura) > .al-razon .al-razon-fuente { color: inherit; opacity: .55; }

/* ---------- Cinta de medios viva ---------- */
.al-cinta { position: relative; margin: 6px 0 40px; }
.al-cinta-fila { position: relative; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.al-cinta-pista { display: flex; width: max-content; align-items: center; gap: 30px; will-change: transform; }
.al-cinta-fila--medios { padding: 6px 0; }
.al-cinta-fila--titulares { margin-top: 6px; padding: 10px 0; border-top: 1px solid rgba(244,239,233,.08); border-bottom: 1px solid rgba(244,239,233,.08); }
.al-cinta-medio { position: relative; display: inline-flex; align-items: baseline; gap: 10px; padding: 0; border: 0; background: none; cursor: pointer; white-space: nowrap; }
.al-cinta-medio span { font-family: var(--serif); font-style: italic; font-size: clamp(2.4rem, 1.4rem + 3.4vw, 4.8rem); line-height: 1.1; color: transparent; -webkit-text-stroke: 1px rgba(244,239,233,.38);
  background: linear-gradient(100deg, #cfa8ef, #e07ad0 50%, #f05c40) no-repeat 0 0 / 0% 100%; -webkit-background-clip: text; background-clip: text; transition: background-size .7s cubic-bezier(.2,.8,.2,1), -webkit-text-stroke-color .4s ease; }
.al-cinta-medio small { font-size: .66rem; letter-spacing: .16em; text-transform: uppercase; color: rgba(244,239,233,.35); transition: color .4s ease; }
.al-cinta-medio:hover span, .al-cinta-medio:focus-visible span, .al-cinta-medio.al-activo span { background-size: 100% 100%; -webkit-text-stroke-color: transparent; }
.al-cinta-medio:hover small, .al-cinta-medio.al-activo small { color: var(--lila); }
.al-cinta-medio.al-activo::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 2px; background: #f05c40; }
.al-cinta-fila--medios .al-cinta-pista > i { font-style: normal; color: #f05c40; font-size: 1.1rem; }
.al-cinta-titular { display: inline-flex; align-items: baseline; gap: 12px; white-space: nowrap; font-size: .95rem; color: rgba(244,239,233,.6); text-decoration: none; transition: color .3s ease; }
.al-cinta-titular b { font-size: .66rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: var(--lila); }
.al-cinta-titular:hover { color: #fff; }
.al-cinta-fila--titulares .al-cinta-pista > i { font-style: normal; color: rgba(244,239,233,.25); }
.al-cinta-ayuda { display: flex; align-items: center; justify-content: center; gap: 16px; margin: 14px 0 0; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(244,239,233,.4); }
.al-cinta-todos { padding: 6px 14px; border-radius: 99px; border: 1px solid rgba(244,239,233,.3); background: none; color: #fff; font: inherit; letter-spacing: .1em; cursor: pointer; }
.al-cinta-todos:hover { border-color: var(--lila); color: var(--lila); }
.al-cinta--quieta .al-cinta-fila { overflow-x: auto; scrollbar-width: none; }
:not(.al-oscura) > .al-ancho + .al-cinta .al-cinta-medio span { -webkit-text-stroke-color: rgba(43,37,37,.3); }

/* ---------- El sobre del pie: un sobrecito de puntos que aparece al llegar al final ---------- */
.al-sobre-pie { display: flex; justify-content: center; margin: 0 0 14px; }
.al-sobre { position: relative; display: flex; flex-direction: column; align-items: center; gap: 0; padding: 0; border: 0; background: none; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.al-sobre-puntos { display: block; width: 170px; height: 128px; }
.al-sobre-tip { margin-top: -6px; font-family: var(--serif); font-style: italic; font-size: 1.05rem; line-height: 1; color: rgba(244,239,233,.0); transform: translateY(6px); transition: color .7s ease, transform .9s cubic-bezier(.2,.8,.2,1); white-space: nowrap; }
.al-sobre:hover .al-sobre-tip, .al-sobre:focus-visible .al-sobre-tip { color: rgba(244,239,233,.85); transform: none; }
.al-sobre:focus-visible { outline: none; }
@media (hover: none) { .al-sobre.al-llego .al-sobre-tip { color: rgba(244,239,233,.6); transform: none; transition-delay: 1.4s; } }

/* ---------- Adentro del sobre: un prado de dieciséis voces ---------- */
html.al-sx-abierto { overflow: hidden; }
.al-sx { position: fixed; inset: 0; z-index: 1200; overflow: hidden; color: #f4efe9; background: radial-gradient(70% 80% at 50% 40%, #100c20 0%, #080711 58%, #030309 100%); opacity: 0; transition: opacity 1s ease; -webkit-user-select: none; user-select: none; }
.al-sx.al-visible { opacity: 1; }
.al-sx[hidden] { display: none; }
.al-sx::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(38% 48% at 70% 48%, rgba(126,23,190,.26), transparent 70%); opacity: 0; transition: opacity 1.6s ease; }
.al-sx--foco::before { opacity: 1; }
@media (max-width: 991px) { .al-sx::before { background: radial-gradient(60% 30% at 50% 25%, rgba(126,23,190,.3), transparent 70%); } }
.al-sx-lienzo { position: absolute; inset: 0; width: 100%; height: 100%; }
.al-sx-x { position: absolute; top: 22px; right: 22px; z-index: 6; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(244,239,233,.18); background: rgba(7,4,11,.35); color: #f4efe9; cursor: pointer; transition: border-color .3s ease; }
.al-sx-x svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.al-sx-x:hover { border-color: var(--lila); }
.al-sx-voces { position: absolute; top: 36px; left: clamp(22px, 5vw, 70px); z-index: 4; margin: 0; font-family: var(--serif); font-style: italic; font-size: 1.05rem; color: rgba(244,239,233,.5); transition: opacity .8s ease; }
.al-sx--intro .al-sx-voces, .al-sx--abriendo .al-sx-voces, .al-sx--responder .al-sx-voces, .al-sx--enviando .al-sx-voces, .al-sx--final .al-sx-voces { opacity: 0; }

/* intro */
.al-sx-intro { position: absolute; left: 0; right: 0; bottom: clamp(40px, 14vh, 150px); z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 12px; padding: 0 24px; text-align: center; transition: opacity 1s ease, transform 1.2s cubic-bezier(.2,.8,.2,1); }
.al-sx:not(.al-sx--intro) .al-sx-intro { opacity: 0; pointer-events: none; transform: translateY(20px); }
.al-sx-l1 { margin: 0; max-width: 18em; font-family: var(--serif); font-style: italic; font-size: clamp(1.7rem, 1.1rem + 2vw, 2.8rem); line-height: 1.1; color: #fff; animation: al-sx-sube 1.6s cubic-bezier(.2,.8,.2,1) .4s both; }
.al-sx-l2 { margin: 0; max-width: 30em; font-size: 1rem; line-height: 1.6; color: rgba(244,239,233,.65); animation: al-sx-sube 1.6s cubic-bezier(.2,.8,.2,1) .9s both; }
.al-sx-abrir { margin-top: 14px; padding: 0 0 6px; border: 0; border-bottom: 1px solid rgba(207,168,239,.5); background: none; color: #fff; font-family: var(--serif); font-style: italic; font-size: 1.5rem; cursor: pointer; animation: al-sx-sube 1.6s cubic-bezier(.2,.8,.2,1) 1.4s both; transition: border-color .4s ease, color .4s ease; }
.al-sx-abrir:hover, .al-sx-abrir:focus-visible { color: var(--lila); border-color: #f05c40; outline: none; }
@keyframes al-sx-sube { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }

/* guía del prado */
.al-sx-guia { position: absolute; left: 50%; bottom: clamp(24px, 5vh, 46px); z-index: 3; margin: 0; transform: translateX(-50%); font-family: var(--serif); font-style: italic; font-size: clamp(1.15rem, .9rem + .8vw, 1.5rem); color: rgba(244,239,233,.7); white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity 1.4s ease; }
.al-sx--campo .al-sx-guia { opacity: 1; transition-delay: 1.2s; }
.al-sx--campo:not(.al-sx--primera) .al-sx-guia { opacity: .45; }
.al-sx-nombre { position: absolute; left: 0; top: 0; z-index: 4; margin: 0; font-family: var(--serif); font-style: italic; font-size: 1.15rem; color: #fff; white-space: nowrap; pointer-events: none; opacity: 0; transition: opacity .35s ease; text-shadow: 0 0 18px rgba(126,23,190,.9); }
.al-sx-nombre.al-ver { opacity: 1; }
.al-sx-lista { position: absolute; left: 0; top: 0; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }

/* la carta: el polvo dibuja cada palabra y la palabra aparece debajo, con una luz que la recorre */
.al-sx-carta { position: absolute; z-index: 3; left: clamp(26px, 7vw, 120px); top: 50%; width: min(520px, 38vw); transform: translateY(-50%); opacity: 0; pointer-events: none; transition: opacity 1.2s ease; }
.al-sx--foco .al-sx-carta { opacity: 1; pointer-events: auto; }
.al-sx-carta.al-sx-sale { opacity: 0 !important; transition: opacity .7s ease; }
.al-sx-k { margin: 0 0 28px; font-size: .7rem; letter-spacing: .22em; text-transform: uppercase; color: rgba(207,168,239,.75); }
.al-sx-carta .al-sx-k { opacity: 0; transition: opacity 2s ease .4s; }
.al-sx--foco .al-sx-carta:not(.al-sx-sale) .al-sx-k { opacity: 1; }
.al-sx-k b { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 1.5rem; letter-spacing: 0; text-transform: none; color: #fff; margin-left: 6px; }
.al-sx-renglon { margin: 0 0 .5em; font-family: var(--serif); font-style: italic; font-size: clamp(1.4rem, 1rem + 1.2vw, 2.2rem); line-height: 1.26; color: rgba(255,255,255,.92); }
.al-sx-renglon span { --p: 0; display: inline-block; opacity: var(--p); filter: blur(calc((1 - var(--p)) * 3px)); transform: translateY(calc((1 - var(--p)) * 3px));
  -webkit-mask-image: linear-gradient(90deg, #000 calc(var(--p) * 240% - 140%), transparent calc(var(--p) * 240%)); mask-image: linear-gradient(90deg, #000 calc(var(--p) * 240% - 140%), transparent calc(var(--p) * 240%)); }
.al-sx-renglon--pide { margin-top: .8em; }
.al-sx-firma { margin: 28px 0 0; font-family: var(--serif); font-style: italic; font-size: 1.1rem; color: rgba(244,239,233,.5); opacity: 0; transition: opacity 2.4s ease .3s; }
.al-sx-soltar { margin-top: 30px; padding: 0 0 4px; border: 0; border-bottom: 1px solid rgba(244,239,233,.22); background: none; color: rgba(244,239,233,.5); font: inherit; font-size: .84rem; cursor: pointer; opacity: 0; transition: opacity 2.4s ease 1.2s, color .3s ease, border-color .3s ease; }
.al-sx-leida .al-sx-firma, .al-sx-leida .al-sx-soltar { opacity: 1; }
.al-sx-soltar:hover, .al-sx-soltar:focus-visible { color: #fff; border-color: var(--lila); outline: none; }
@keyframes al-sx-aparece { to { opacity: 1; } }

/* la invitación: aparece solo cuando ya escuchaste a los dieciséis */
.al-sx-invita { position: absolute; left: 50%; bottom: clamp(22px, 5vh, 46px); z-index: 4; display: flex; flex-direction: column; align-items: center; gap: 10px; transform: translateX(-50%); text-align: center; opacity: 0; pointer-events: none; transition: opacity 2.4s ease; }
.al-sx--campo.al-sx--completo .al-sx-invita { opacity: 1; pointer-events: auto; transition-delay: 1.6s; }
.al-sx--campo.al-sx--completo .al-sx-guia { opacity: 0 !important; }
.al-sx-invita p { margin: 0; font-family: var(--serif); font-style: italic; font-size: clamp(1.2rem, .95rem + .8vw, 1.6rem); color: rgba(244,239,233,.85); white-space: nowrap; }
.al-sx-invita button { padding: 0 0 4px; border: 0; border-bottom: 1px solid #f05c40; background: none; color: #fff; font: inherit; font-size: .9rem; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; }
.al-sx-invita button:hover, .al-sx-invita button:focus-visible { color: var(--lila); outline: none; }

/* la carta número diecisiete: la escribe quien estuvo escuchando */
.al-sx-responder { position: absolute; z-index: 4; left: 50%; top: 50%; width: min(620px, 86vw); transform: translate(-50%, -46%); text-align: center; opacity: 0; pointer-events: none; transition: opacity 2s ease, transform 2s cubic-bezier(.2,.8,.2,1); }
.al-sx--responder .al-sx-responder { opacity: 1; transform: translate(-50%, -50%); pointer-events: auto; transition-delay: 1s; }
.al-sx-responder .al-sx-k { margin-bottom: 18px; }
.al-sx-responder h2 { margin: 0 0 34px; font-family: var(--display); font-weight: 500; font-size: clamp(1.9rem, 1.2rem + 2.2vw, 3.2rem); line-height: 1.05; letter-spacing: -0.03em; color: #fff; }
.al-sx-responder h2 em { display: block; font-family: var(--serif); font-style: italic; font-weight: 400; letter-spacing: -0.01em; color: var(--lila); }
.al-sx-campo-p { display: flex; flex-direction: column; gap: 10px; }
.al-sx-campo-p span { font-family: var(--serif); font-style: italic; font-size: 1.3rem; color: rgba(244,239,233,.75); }
.al-sx-campo-p textarea { width: 100%; resize: none; padding: 10px 4px 14px; border: 0; border-bottom: 1px solid rgba(207,168,239,.35); background: transparent; color: #fff; font-family: var(--serif); font-style: italic; font-size: clamp(1.4rem, 1rem + 1.2vw, 2rem); line-height: 1.25; text-align: center; outline: none; transition: border-color .5s ease; }
.al-sx-campo-p textarea::placeholder { color: rgba(244,239,233,.25); transition: color .6s ease; }
.al-sx-campo-p textarea:focus { border-bottom-color: #f05c40; }
.al-sx-resp-pie { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 14px 22px; margin-top: 26px; }
.al-sx-resp-pie input { width: 220px; padding: 6px 2px; border: 0; border-bottom: 1px solid rgba(244,239,233,.18); background: transparent; color: #fff; font: inherit; font-size: .95rem; text-align: center; outline: none; }
.al-sx-resp-pie input::placeholder { color: rgba(244,239,233,.3); }
.al-sx-resp-pie button { padding: 13px 26px; border-radius: 99px; border: 0; background: linear-gradient(100deg, #7E17BE, #B42A9A 60%, #E93B24); color: #fff; font: inherit; font-size: .88rem; letter-spacing: .04em; cursor: pointer; box-shadow: 0 16px 34px -16px rgba(180,42,154,.8); transition: opacity .5s ease, filter .5s ease; }
.al-sx-resp-pie button:disabled { opacity: .35; filter: saturate(.4); cursor: default; }
.al-sx--enviando .al-sx-responder { opacity: 0; pointer-events: none; transition-delay: 0s; transition-duration: .9s; }

/* el final: amanece, todos están encendidos, y la promesa queda guardada */
.al-sx--final::before { opacity: 1; background: radial-gradient(70% 50% at 50% 90%, rgba(38,44,91,.12), transparent 70%); }
.al-sx-final { position: absolute; z-index: 3; left: 50%; bottom: clamp(26px, 6vh, 60px); width: min(720px, 90vw); transform: translateX(-50%); text-align: center; pointer-events: none; }
.al-sx--final .al-sx-final { pointer-events: auto; }
.al-sx-final > * { opacity: 0; transition: opacity 2.6s ease; }
.al-sx--final .al-sx-final > * { opacity: 1; }
.al-sx--final .al-sx-final-k { transition-delay: .6s; } .al-sx--final .al-sx-promesa { transition-delay: 1.6s; } .al-sx--final .al-sx-final h2 { transition-delay: 3.4s; }
.al-sx--final .al-sx-f1 { transition-delay: 5.2s; } .al-sx--final .al-sx-fin-acc { transition-delay: 6.2s; } .al-sx--final .al-sx-susurros { transition-delay: 6.8s; }
.al-sx-final-k { margin: 0 0 12px; font-size: .7rem; letter-spacing: .22em; text-transform: uppercase; color: #c4b0e6; }
.al-sx-promesa { margin: 0 0 22px; padding: 0; border: 0; }
.al-sx-promesa p { margin: 0; font-family: var(--serif); font-style: italic; font-size: clamp(1.5rem, 1rem + 1.6vw, 2.4rem); line-height: 1.2; color: #fff; }
.al-sx-promesa cite { display: block; margin-top: 8px; font-family: var(--serif); font-style: italic; font-size: 1.05rem; color: rgba(244,239,233,.55); }
.al-sx-final h2 { margin: 0 0 12px; font-family: var(--display); font-weight: 500; font-size: clamp(1.3rem, 1rem + 1vw, 1.9rem); line-height: 1.2; letter-spacing: -0.02em; color: rgba(255,255,255,.92); }
.al-sx-final h2 em { display: block; font-family: var(--serif); font-style: italic; font-weight: 400; letter-spacing: 0; color: var(--lila); font-size: 1.15em; }
.al-sx-f1 { margin: 0 auto; max-width: 34em; font-size: .98rem; line-height: 1.6; color: rgba(244,239,233,.7); }
.al-sx-fin-acc { display: flex; justify-content: center; margin-top: 22px; }
.al-sx-susurros { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px 12px; margin: 16px 0 0; color: rgba(244,239,233,.3); }
.al-sx-susurros button { padding: 0; border: 0; background: none; font-family: var(--serif); font-style: italic; font-size: 1rem; color: rgba(244,239,233,.6); cursor: pointer; transition: color .3s ease; }
.al-sx-susurros button:hover, .al-sx-susurros button:focus-visible { color: #fff; outline: none; }

@media (max-width: 991px) {
  .al-sx-voces { top: 34px; font-size: .95rem; }
  .al-sx--foco .al-sx-voces, .al-sx--responder .al-sx-voces, .al-sx--enviando .al-sx-voces, .al-sx--final .al-sx-voces { opacity: 0; }
  .al-sx-carta { left: 24px; right: 24px; width: auto; top: auto; bottom: 30px; transform: none; }
  .al-sx-k { margin-bottom: 14px; }
  .al-sx-k b { font-size: 1.25rem; }
  .al-sx-renglon { font-size: clamp(1.12rem, .85rem + 2.3vw, 1.5rem); margin-bottom: .35em; }
  .al-sx-firma { margin-top: 12px; font-size: 1rem; }
  .al-sx-soltar { margin-top: 14px; }
  .al-sx-guia, .al-sx-invita p { white-space: normal; width: 86vw; text-align: center; }
  .al-sx-intro { bottom: 12vh; }
  .al-sx-responder h2 { margin-bottom: 22px; }
  .al-sx-final { bottom: calc(80px + env(safe-area-inset-bottom, 0px)); }
  .al-sx-promesa p { font-size: 1.35rem; }
}

/* ---------- Diccionario ---------- */
.al-dic-cta { display: inline-flex; align-items: center; gap: 12px; grid-column: 1 / -1; justify-self: start; margin-top: 28px; padding: 14px 22px; border-radius: 99px; background: var(--texto, #2B2525); color: #fff !important; font-weight: 500; text-decoration: none; transition: background .4s ease; }
.al-dic-cta .al-icono { width: 18px; height: 18px; transition: transform .35s ease; }
.al-dic-cta:hover { background: var(--violeta, #7E17BE); }
.al-dic-cta:hover .al-icono { transform: translateX(4px); }
.al-dic-portada { min-height: 78vh; display: flex; align-items: flex-end; }
.al-dic-lienzo { position: absolute; inset: 0; width: 100%; height: 100%; }
.al-dic-portada .al-ancho { position: relative; z-index: 1; width: 100%; }
.al-dic-h1 { max-width: 9em; }
.al-dic-ahora { display: flex; align-items: baseline; gap: 14px; margin: 26px 0 0; font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: rgba(244,239,233,.45); }
.al-dic-ahora b { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 1.4rem; letter-spacing: 0; text-transform: none; color: var(--lila); }
.al-sec.al-dic { overflow: visible; }
.al-dic-barra { position: relative; z-index: 2; margin: 0 0 26px; }
.al-dic-barra .al-dic-az { display: none; }
.al-dic-temas { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 10px; }
.al-dic-tema { padding: 8px 16px; border-radius: 99px; border: 1px solid rgba(43,37,37,.15); background: transparent; font: inherit; font-size: .86rem; color: var(--texto); cursor: pointer; transition: border-color .3s ease, background .3s ease, color .3s ease; }
.al-dic-tema:hover { border-color: var(--violeta); }
.al-dic-tema.al-activa { background: var(--texto, #2B2525); border-color: var(--texto, #2B2525); color: #fff; }
.al-dic-az { display: flex; flex-wrap: wrap; gap: 2px; margin-bottom: 6px; }
.al-dic-letra { display: grid; place-items: center; min-width: 30px; height: 30px; border-radius: 8px; font-family: var(--display); font-weight: 500; font-size: .9rem; color: var(--texto); text-decoration: none; transition: background .25s ease, color .25s ease; }
.al-dic-letra:hover { background: var(--violeta); color: #fff; }
.al-dic-letra.al-sin { opacity: .25; pointer-events: none; }
.al-dic-al-azar { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin: 0 0 40px; }
.al-dic-al-azar p { margin: 0; color: rgba(43,37,37,.6); }
.al-dic-cuerpo { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(26px, 4vw, 70px); align-items: start; }
.al-dic-panel { position: sticky; top: 104px; }
.al-dic-az--panel { margin-top: 16px; }
.al-dic-panel-in { position: relative; padding: 26px; border-radius: 26px; background: var(--hueso, #F3F3F3); overflow: hidden; }
.al-dic-panel-k { margin: 0; font-size: .7rem; letter-spacing: .18em; text-transform: uppercase; color: var(--violeta); }
.al-dic-mini { display: block; width: 100%; aspect-ratio: 1.6; }
.al-dic-panel-p { margin: 0 0 10px; font-family: var(--serif); font-style: italic; font-size: 2rem; line-height: 1; color: var(--texto); }
.al-dic-panel-c { margin: 0; font-size: .98rem; line-height: 1.55; color: rgba(43,37,37,.75); }
.al-dic-grupo { scroll-margin-top: 110px; }
.al-dic-grupo + .al-dic-grupo { margin-top: 40px; }
.al-dic-L { display: flex; align-items: center; gap: 18px; margin: 0 0 16px; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(3.4rem, 2.4rem + 3vw, 5.4rem); line-height: .9; color: var(--violeta); }
.al-dic-L::after { content: ""; flex: 1; height: 1px; background: rgba(43,37,37,.12); }
.al-dic-lista { display: grid; gap: 14px; }
.al-dic-t { position: relative; padding: 24px 26px 18px; border-radius: 22px; border: 1px solid rgba(43,37,37,.1); background: #fff; scroll-margin-top: 140px; transition: border-color .4s ease, box-shadow .5s ease, transform .5s cubic-bezier(.2,.8,.2,1); }
.al-dic-t:hover, .al-dic-t:focus-within { border-color: rgba(126,23,190,.35); box-shadow: 0 26px 50px -36px rgba(43,37,37,.45); transform: translateY(-2px); }
.al-dic-t header { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 14px; margin-bottom: 10px; }
.al-dic-t h3 { margin: 0; font-family: var(--display); font-weight: 500; font-size: clamp(1.5rem, 1.2rem + .8vw, 2rem); letter-spacing: -0.025em; color: var(--texto); }
.al-dic-cat { font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; color: var(--violeta); }
.al-dic-def { margin: 0 0 14px; font-size: 1.04rem; line-height: 1.6; color: rgba(43,37,37,.85); }
.al-dic-mejor { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; margin: 0 0 14px; font-family: var(--serif); font-style: italic; font-size: 1.15rem; color: var(--texto); }
.al-dic-mejor span { font-family: var(--texto-f, inherit); font-style: normal; font-size: .66rem; letter-spacing: .16em; text-transform: uppercase; color: #E93B24; }
.al-dic-consejo { position: relative; padding: 14px 16px 14px 18px; border-radius: 14px; background: linear-gradient(110deg, rgba(126,23,190,.08), rgba(233,59,36,.05)); border-left: 3px solid var(--violeta); }
.al-dic-consejo p { margin: 0; font-size: .96rem; line-height: 1.55; color: rgba(43,37,37,.85); }
.al-dic-consejo-k { display: flex; align-items: center; gap: 8px; margin-bottom: 6px !important; font-size: .66rem !important; letter-spacing: .16em; text-transform: uppercase; color: var(--violeta) !important; }
.al-dic-consejo-k svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.al-dic-t footer { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 14px; }
.al-dic-leer { display: inline-flex; align-items: center; gap: 8px; margin-right: auto; font-weight: 500; font-size: .9rem; color: var(--texto); text-decoration: none; border-bottom: 1px solid rgba(43,37,37,.25); padding-bottom: 2px; }
.al-dic-leer .al-icono { width: 14px; height: 14px; }
.al-dic-leer:hover { color: var(--violeta); border-color: var(--violeta); }
.al-dic-comp, .al-dic-copia { padding: 6px 12px; border-radius: 99px; border: 1px solid rgba(43,37,37,.15); background: none; font: inherit; font-size: .8rem; color: rgba(43,37,37,.75); cursor: pointer; transition: border-color .3s ease, color .3s ease; }
.al-dic-comp:hover, .al-dic-copia:hover { border-color: var(--violeta); color: var(--violeta); }
.al-dic-copia.al-ok { border-color: #2f9e5f; color: #2f9e5f; }
.al-dic-t.al-destello { animation: al-dic-destello 1.6s ease; }
@keyframes al-dic-destello { 0% { box-shadow: 0 0 0 0 rgba(126,23,190,.5); } 40% { box-shadow: 0 0 0 10px rgba(126,23,190,.12); } 100% { box-shadow: 0 0 0 0 rgba(126,23,190,0); } }
@media (max-width: 991px) {
  .al-dic-cuerpo { grid-template-columns: 1fr; }
  .al-dic-panel { display: none; }
  .al-dic-barra .al-dic-az { display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .al-dic-temas { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .al-dic-tema { flex: none; }
  .al-dic-portada { min-height: 70vh; }
  .al-dic-grupo, .al-dic-t { scroll-margin-top: 200px; }
}
/* el formulario de la carta diecisiete no hereda los estilos de los formularios del sitio */
.al-sx-responder textarea, .al-sx-responder input { height: auto !important; min-height: 0 !important; margin: 0 !important; box-shadow: none !important; border-radius: 0 !important; border-top: 0 !important; border-left: 0 !important; border-right: 0 !important; text-transform: none !important; letter-spacing: 0 !important; background: transparent !important; color: #fff !important; }
.al-sx-responder textarea { padding: 10px 4px 14px !important; font-family: var(--serif) !important; font-style: italic !important; font-size: clamp(1.4rem, 1rem + 1.2vw, 2rem) !important; line-height: 1.25 !important; }
.al-sx-responder input { padding: 6px 2px !important; font-family: var(--serif) !important; font-style: italic !important; font-size: 1.15rem !important; }
.al-sx-responder textarea:focus, .al-sx-responder input:focus { outline: none !important; border-bottom-color: #f05c40 !important; }
.al-sx-responder input { border-bottom: 1px solid rgba(244,239,233,.18) !important; }

/* v27 · contador de cartas */
.al-sx-voces { display: flex; flex-direction: column; gap: 9px; }
.al-sx-pips { display: flex; gap: 6px; }
.al-sx-pips i { width: 6px; height: 6px; border-radius: 50%; border: 1px solid rgba(207,168,239,.5); transition: background .8s ease, border-color .8s ease, box-shadow .8s ease; }
.al-sx-pips i.al-on { background: #f08c78; border-color: #f08c78; box-shadow: 0 0 8px rgba(240,140,120,.7); }
.al-sx-cuenta { color: rgba(244,239,233,.66); }
@media (max-width: 700px) { .al-sx-pips { gap: 4px; } .al-sx-pips i { width: 5px; height: 5px; } }

/* v27 · los números del recorrido ya no se cortan */
.al-rec-esc { overflow: visible !important; }
.al-rec-num { top: -0.5em; }

/* v27 · velo del encabezado más liviano: solo el ancho de la pantalla y menos desenfoque */
.mil-frame .mil-frame-top::before, .mil-frame .mil-frame-top::after { left: var(--al-izq, -100vw); right: var(--al-der, -100vw); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }

/* v27 · el preloader con el degradé oficial del isotipo */
.al-pre-carga b { background: linear-gradient(90deg, #8A00C6 0%, #A105A0 28%, #BD0C6F 48%, #D3114B 66%, #F21727 84%, #F61D05 100%); }
.al-pre-carga .al-pre-num { background: linear-gradient(180deg, #A105A0, #F21727); -webkit-background-clip: text; background-clip: text; color: transparent; }

/* v27 · aviso del kit (no bloquea la página) */
.al-kit-aviso { position: fixed; left: 24px; bottom: 24px; z-index: 60; display: flex; gap: 16px; align-items: flex-start; width: min(380px, calc(100vw - 32px)); padding: 20px 22px; border-radius: 18px;
  background: rgba(16,10,22,.94); color: #f4efe9; box-shadow: 0 24px 60px -24px rgba(0,0,0,.6), inset 0 0 0 1px rgba(207,168,239,.16);
  opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .7s cubic-bezier(.2,.8,.2,1); }
.al-kit-aviso.al-visible { opacity: 1; transform: none; }
.al-kit-aviso-golo { flex: none; width: 30px; height: 50px; fill: url(#al-grad-marca); }
.al-kit-aviso p { margin: 0; font-size: .95rem; line-height: 1.5; color: rgba(244,239,233,.78); }
.al-kit-aviso .al-kit-aviso-k { margin-bottom: 6px; font-family: var(--serif); font-style: italic; font-size: 1.2rem; color: #fff; }
.al-kit-aviso-a { display: flex; gap: 18px; align-items: center; margin-top: 14px; }
.al-kit-aviso-a button { border: 0; background: none; padding: 0; font: inherit; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(244,239,233,.6); cursor: pointer; }
.al-kit-aviso-a .al-kit-aviso-si { padding: 10px 18px; border-radius: 999px; background: linear-gradient(90deg, #8A00C6, #D3114B); color: #fff; }
.al-kit-aviso-a button:focus-visible { outline: 2px solid #cfa8ef; outline-offset: 3px; }
html.al-sx-abierto .al-kit-aviso, html.al-menu-abierto .al-kit-aviso { display: none; }
@media (max-width: 700px) { .al-kit-aviso { left: 16px; bottom: 16px; padding: 16px 18px; } .al-kit-aviso-golo { display: none; } }

/* v27 · el «16» del kit, hecho de partículas */
.al-kit-sello.al-kit-sello--puntos { width: 200px; height: 176px; border-radius: 0; background: none; box-shadow: none; transform: none; animation: none; display: block; top: 22px; left: 22px; }
.al-kit-sello--puntos canvas { position: absolute; left: 0; top: 0; width: 100%; height: calc(100% - 26px); }
.al-kit-sello--puntos span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.al-kit-sello--puntos em { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; transform: none; font-size: 1.15rem; color: rgba(255,255,255,.88); text-align: center; letter-spacing: .02em; }
@media (max-width: 700px) { .al-kit-sello.al-kit-sello--puntos { width: 120px; height: 104px; top: 10px; left: 10px; } .al-kit-sello--puntos em { font-size: .95rem; } }

/* v27 · índice lateral del inicio */
.al-lado { position: fixed; right: 26px; top: 50%; z-index: 40; transform: translateY(-50%); transition: opacity .6s ease, transform .6s ease; --c: rgba(43,37,37,.42); --c2: #2B2525; }
.al-lado--oscuro { --c: rgba(244,239,233,.42); --c2: #fff; }
.al-lado--fuera { opacity: 0; pointer-events: none; transform: translate(14px, -50%); }
.al-lado ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.al-lado a { position: relative; display: flex; align-items: center; justify-content: flex-end; gap: 12px; height: 18px; color: var(--c2); text-decoration: none; }
.al-lado i { display: block; width: 10px; height: 1px; background: var(--c); transition: width .5s cubic-bezier(.2,.8,.2,1), background .4s ease, height .4s ease; }
.al-lado span { font-family: var(--serif); font-style: italic; font-size: .98rem; white-space: nowrap; opacity: 0; transform: translateX(6px); transition: opacity .35s ease, transform .45s ease; pointer-events: none; }
.al-lado a.al-aqui i { width: 26px; height: 2px; background: linear-gradient(90deg, #8A00C6, #D3114B); }
.al-lado a.al-aqui span { opacity: .9; transform: none; }
.al-lado:hover span, .al-lado:focus-within span { opacity: .55; transform: none; pointer-events: auto; }
.al-lado:hover a.al-aqui span, .al-lado a:hover span, .al-lado a:focus-visible span { opacity: 1; }
.al-lado a:hover i { width: 18px; background: var(--c2); }
.al-lado a:focus-visible { outline: none; } .al-lado a:focus-visible i { width: 18px; background: #cfa8ef; }
html.al-sx-abierto .al-lado, html.al-menu-abierto .al-lado, html.al-cu-abierto .al-lado, html.al-pxp-abierta .al-lado, html.al-kit-abierto .al-lado { opacity: 0; pointer-events: none; }
@media (max-width: 1100px) { .al-lado { display: none; } }
@media (prefers-reduced-motion: reduce) { .al-lado, .al-lado i, .al-lado span { transition: none; } }
.al-lado::before { content: ""; position: absolute; inset: -18px -16px -18px -40px; z-index: -1; border-radius: 18px; background: rgba(250,247,243,.9); box-shadow: 0 20px 50px -30px rgba(0,0,0,.3); opacity: 0; transition: opacity .4s ease; pointer-events: none; }
.al-lado--oscuro::before { background: rgba(11,7,16,.86); }
.al-lado:hover::before, .al-lado:focus-within::before { opacity: 1; }

/* ==========================================================================
   v27 · El ciclo del cambio: ocho proyectos en una rueda
   ========================================================================== */
.al-ciclo { --tx: var(--texto); --tx2: var(--texto-2); --ln: rgba(27,22,32,.12); --w: min(540px, 40vw);
  display: grid; grid-template-columns: minmax(300px, 1fr) auto; gap: clamp(30px, 4vw, 70px); align-items: center; margin-top: clamp(40px, 5vw, 70px); }
.al-ciclo--oscuro { --tx: #fff; --tx2: rgba(244,239,233,.66); --ln: rgba(244,239,233,.14); }
.al-ciclo-sec .al-ciclo-intro p { color: rgba(244,239,233,.7); }
.al-ciclo-etapas { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--ln); }
.al-ciclo-etapas > li { display: grid; grid-template-columns: 46px 1fr; gap: 10px; padding: 20px 0; border-bottom: 1px solid var(--ln); transition: opacity .5s ease; opacity: .5; }
.al-ciclo-etapas > li.al-on { opacity: 1; }
.al-ciclo-n { font-family: var(--serif); font-style: italic; font-size: 1.15rem; color: var(--tx2); padding-top: 2px; }
.al-ciclo-etapas b { display: block; font-family: var(--display); font-weight: 600; font-size: 1.35rem; letter-spacing: -0.02em; color: var(--tx); }
.al-ciclo-etapas p { margin: 4px 0 10px; font-size: .98rem; color: var(--tx2); }
.al-ciclo-proy { display: flex; flex-wrap: wrap; gap: 8px; }
.al-ciclo-proy a { padding: 6px 14px; border-radius: 999px; border: 1px solid var(--ln); font-size: .88rem; color: var(--tx); text-decoration: none; transition: background .3s ease, border-color .3s ease, color .3s ease; }
.al-ciclo-proy a:hover, .al-ciclo-proy a:focus-visible, .al-ciclo-proy a.al-on { border-color: transparent; background: linear-gradient(90deg, #8A00C6, #D3114B); color: #fff; outline: none; }

.al-ciclo-rueda { position: relative; width: var(--w); height: var(--w); margin: 40px clamp(60px, 8vw, 140px); }
.al-ciclo-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.al-ciclo-base { fill: none; stroke: var(--ln); stroke-width: 1; }
.al-ciclo-arco { fill: none; stroke: url(#al-ciclo-grad); stroke-width: 2; stroke-linecap: round; opacity: .22; transition: opacity .6s ease, stroke-width .6s ease; }
.al-ciclo-arco.al-on { opacity: 1; stroke-width: 3; }
.al-ciclo-et { font-family: var(--texto-f); font-size: 10px; letter-spacing: .24em; text-transform: uppercase; fill: var(--tx2); transition: fill .5s ease; }
.al-ciclo-et.al-on { fill: var(--tx); }
.al-ciclo-luz { fill: #fff; filter: drop-shadow(0 0 6px #cfa8ef) drop-shadow(0 0 14px #BD0C6F); }
.al-ciclo:not(.al-ciclo--oscuro) .al-ciclo-luz { fill: #BD0C6F; filter: drop-shadow(0 0 6px rgba(189,12,111,.6)); }
.al-ciclo-luz--2 { opacity: .55; }
.al-ciclo-centro { position: absolute; left: 50%; top: 50%; width: 66%; height: 66%; transform: translate(-50%, -50%); border-radius: 50%; overflow: hidden; background: #0b0710; box-shadow: 0 40px 90px -40px rgba(43,8,60,.6); isolation: isolate; }
.al-ciclo-foto { position: absolute; inset: 0; margin: 0; opacity: 0; transform: scale(1.08); transition: opacity 1s ease, transform 6s ease; }
.al-ciclo-foto.al-on { opacity: 1; transform: scale(1); }
.al-ciclo-foto img { width: 100%; height: 100%; object-fit: cover; }
.al-ciclo-foto--tipo { display: grid; place-items: center; background: radial-gradient(80% 70% at 30% 20%, rgba(138,0,198,.75), transparent 70%), radial-gradient(70% 60% at 80% 90%, rgba(242,23,39,.55), transparent 70%), #0b0710; }
.al-ciclo-foto--tipo[data-etapa="0"] { background: radial-gradient(80% 70% at 30% 20%, rgba(40,90,140,.65), transparent 70%), radial-gradient(70% 60% at 80% 90%, rgba(138,0,198,.5), transparent 70%), #070b12; }
.al-ciclo-foto--tipo span { font-family: var(--serif); font-style: italic; font-size: 2.6rem; color: rgba(255,255,255,.12); transform: translateY(-30%); }
.al-ciclo-centro::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, rgba(11,7,16,.15) 0%, rgba(11,7,16,.55) 45%, rgba(11,7,16,.92) 100%); pointer-events: none; }
.al-ciclo-infos { position: absolute; inset: 0; z-index: 2; }
.al-ciclo-info { position: absolute; left: 12%; right: 12%; bottom: 14%; text-align: center; color: #fff; opacity: 0; visibility: hidden; transform: translateY(14px); transition: opacity .7s ease, transform .8s cubic-bezier(.2,.8,.2,1), visibility 0s linear .7s; }
.al-ciclo-info.al-on { opacity: 1; visibility: visible; transform: none; transition-delay: .15s, .15s, 0s; }
.al-ciclo-k { margin: 0 0 8px; font-size: .7rem; letter-spacing: .24em; text-transform: uppercase; color: #cfa8ef; }
.al-ciclo-info h3 { margin: 0; font-family: var(--display); font-weight: 600; font-size: clamp(1.3rem, .9rem + 1.1vw, 1.9rem); line-height: 1.05; letter-spacing: -0.02em; color: #fff; }
.al-ciclo-info h3 em { display: block; font-family: var(--serif); font-weight: 400; color: #cfa8ef; letter-spacing: 0; }
.al-ciclo-r { margin: 10px auto 14px; max-width: 28ch; font-size: .9rem; line-height: 1.45; color: rgba(255,255,255,.75); }
.al-ciclo-ir { display: inline-flex; align-items: center; gap: 10px; font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: #fff; text-decoration: none; }
.al-ciclo-ir .al-icono { width: 26px; height: 26px; padding: 6px; border-radius: 50%; background: linear-gradient(135deg, #8A00C6, #D3114B); transition: transform .4s ease; }
.al-ciclo-ir:hover .al-icono, .al-ciclo-ir:focus-visible .al-icono { transform: translateX(4px); }
.al-ciclo-nodos { list-style: none; margin: 0; padding: 0; position: absolute; inset: 0; pointer-events: none; }
.al-ciclo-nodos li { position: absolute; left: 50%; top: 50%; width: 0; height: 0; transform: rotate(var(--a)) translateX(calc(var(--w) * .4167)) rotate(calc(-1 * var(--a))); }
.al-ciclo-nodos a { position: absolute; left: 0; top: 0; display: block; pointer-events: auto; color: var(--tx); text-decoration: none; }
.al-ciclo-nodos i { position: absolute; left: -9px; top: -9px; width: 18px; height: 18px; border-radius: 50%; background: var(--papel); border: 1.5px solid rgba(189,12,111,.55); transition: transform .4s cubic-bezier(.2,.8,.2,1), background .4s ease, box-shadow .4s ease; }
.al-ciclo--oscuro .al-ciclo-nodos i { background: var(--tinta); border-color: rgba(207,168,239,.55); }
.al-ciclo-nodos a.al-on i, .al-ciclo-nodos a:hover i, .al-ciclo-nodos a:focus-visible i { transform: scale(1.25); background: linear-gradient(135deg, #8A00C6, #D3114B); border-color: transparent; box-shadow: 0 0 0 6px rgba(189,12,111,.14), 0 0 22px rgba(189,12,111,.5); }
.al-ciclo-nodos span { position: absolute; top: -.7em; white-space: nowrap; font-family: var(--serif); font-style: italic; font-size: 1.2rem; line-height: 1.4; color: var(--tx2); transition: color .4s ease; }
.al-ciclo-nodos a.al-on span, .al-ciclo-nodos a:hover span, .al-ciclo-nodos a:focus-visible span { color: var(--tx); }
.al-ciclo-nodos a:focus-visible { outline: none; }
.al-ciclo-nodos .al-der span { left: 20px; } .al-ciclo-nodos .al-izq span { right: 20px; }
.al-ciclo-nodos .al-arriba span { left: 50%; top: -2.3em; transform: translateX(-50%); } .al-ciclo-nodos .al-abajo span { left: 50%; top: 1em; transform: translateX(-50%); }
.al-ciclo-sec .al-ciclo-intro .al-titulo-xl { color: #fff; }
@media (max-width: 1100px) {
  .al-ciclo { grid-template-columns: 1fr; --w: min(560px, 82vw); }
  .al-ciclo-rueda { margin: 30px auto 0; order: -1; }
  .al-ciclo-sec .al-ciclo-rueda { order: 0; }
}
@media (max-width: 700px) {
  .al-ciclo { --w: min(420px, calc(100vw - 48px)); }
  .al-ciclo-nodos span { display: none; }
  .al-ciclo-nodos i { left: -11px; top: -11px; width: 22px; height: 22px; }
  .al-ciclo-et { display: none; }
  .al-ciclo-centro { width: 70%; height: 70%; }
  .al-ciclo-r { display: none; }
  .al-ciclo-info { bottom: 16%; left: 10%; right: 10%; }
  .al-ciclo-info h3 { font-size: 1.15rem; }
}
@media (prefers-reduced-motion: reduce) { .al-ciclo-luz { display: none; } .al-ciclo-foto { transition: opacity .3s ease; transform: none; } }

/* ==========================================================================
   v27 · Página de cada proyecto
   ========================================================================== */
.al-pp-etapa { display: flex; align-items: center; gap: 14px; margin: 0 0 22px; font-size: .74rem; letter-spacing: .22em; text-transform: uppercase; color: #cfa8ef; }
.al-pp-etapa span { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg, #8A00C6, #D3114B); color: #fff; letter-spacing: 0; font-family: var(--serif); font-style: italic; font-size: .95rem; text-transform: none; }
.al-pp-que-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(40px, 7vw, 120px); align-items: start; }
.al-pp-que-texto p { max-width: 58ch; margin-top: 22px; font-size: 1.08rem; line-height: 1.7; color: var(--texto-2); }
.al-pp-que-texto .al-titulo-xl { margin-top: 14px; }
.al-pp-lado { position: sticky; top: 120px; }
.al-pp-foto { aspect-ratio: 4 / 3; border-radius: var(--radio); overflow: hidden; margin-bottom: 26px; }
.al-pp-foto .al-foto, .al-pp-foto img { width: 100%; height: 100%; object-fit: cover; }
.al-pp-foto--tipo { display: flex; flex-direction: column; justify-content: flex-end; padding: 28px; color: #fff; background: radial-gradient(80% 70% at 20% 10%, rgba(138,0,198,.8), transparent 70%), radial-gradient(70% 60% at 90% 100%, rgba(242,23,39,.6), transparent 70%), #0b0710; }
.al-pp-foto--tipo[data-etapa="0"] { background: radial-gradient(80% 70% at 20% 10%, rgba(40,90,140,.75), transparent 70%), radial-gradient(70% 60% at 90% 100%, rgba(138,0,198,.55), transparent 70%), #070b12; }
.al-pp-foto--tipo span { font-family: var(--display); font-weight: 600; font-size: 2rem; letter-spacing: -0.03em; }
.al-pp-foto--tipo em { font-family: var(--serif); font-size: 1.4rem; color: #cfa8ef; }
.al-pp-ficha { margin: 0; border-top: 1px solid var(--linea); }
.al-pp-ficha > div { display: grid; grid-template-columns: 42% 1fr; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--linea); }
.al-pp-ficha dt { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--texto-3); padding-top: 3px; }
.al-pp-ficha dd { margin: 0; font-size: .98rem; color: var(--texto); }
.al-pc { padding: 1px 8px; border-radius: 6px; border: 1px dashed rgba(189,12,111,.5); color: #9C3733; font-style: normal; background: rgba(233,59,36,.05); }
.al-oscura .al-pc { color: #f0a090; border-color: rgba(240,140,120,.5); }
.al-pp-datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; margin-top: clamp(40px, 5vw, 70px); }
.al-pp-datos figure { margin: 0; padding: 28px; border-radius: var(--radio); background: var(--papel); box-shadow: inset 0 0 0 1px var(--linea); }
.al-pp-datos b { display: block; font-family: var(--display); font-weight: 600; font-size: clamp(2.6rem, 1.6rem + 2.6vw, 4rem); line-height: 1; letter-spacing: -0.04em; background: linear-gradient(120deg, #8A00C6, #D3114B 70%, #F21727); -webkit-background-clip: text; background-clip: text; color: transparent; }
.al-pp-datos figcaption { margin-top: 14px; font-size: 1rem; line-height: 1.5; color: var(--texto); }
.al-pp-datos small { display: block; margin-top: 12px; font-size: .78rem; color: var(--texto-3); }
.al-pp-pasos { list-style: none; margin: clamp(40px, 5vw, 70px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; counter-reset: p; }
.al-pp-pasos li { position: relative; padding: 30px 26px 10px 0; border-top: 1px solid var(--linea); }
.al-pp-pasos li::before { content: ""; position: absolute; left: 0; top: -4px; width: 7px; height: 7px; border-radius: 50%; background: linear-gradient(135deg, #8A00C6, #D3114B); }
.al-pp-pasos span { font-family: var(--serif); font-style: italic; font-size: 1.1rem; color: var(--texto-3); }
.al-pp-pasos h3 { margin: 10px 0 10px; font-family: var(--display); font-weight: 600; font-size: 1.35rem; letter-spacing: -0.02em; }
.al-pp-pasos p { margin: 0; color: var(--texto-2); line-height: 1.6; }
.al-pp-vs { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: clamp(40px, 5vw, 70px); }
.al-pp-v { padding: 34px 30px; border-radius: var(--radio); background: rgba(255,255,255,.035); box-shadow: inset 0 0 0 1px var(--linea-o); }
.al-pp-v-n { font-family: var(--serif); font-style: italic; font-size: 1.4rem; color: #cfa8ef; }
.al-pp-v h3 { margin: 16px 0 12px; font-family: var(--display); font-weight: 600; font-size: 1.4rem; color: #fff; letter-spacing: -0.02em; }
.al-pp-v p { margin: 0; color: rgba(244,239,233,.7); line-height: 1.65; }
.al-pp-valor .al-titulo-xl, .al-pp-sumate .al-titulo-xl { color: #fff; }
.al-pp-linea { list-style: none; margin: clamp(40px, 5vw, 70px) 0 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(200px, 1fr); gap: 0; overflow-x: auto; scrollbar-width: thin; }
.al-pp-linea li { position: relative; padding: 34px 28px 6px 0; border-top: 2px solid transparent; border-image: linear-gradient(90deg, #8A00C6, #D3114B) 1; }
.al-pp-linea li.al-pp-pc { border-image: repeating-linear-gradient(90deg, rgba(189,12,111,.5) 0 8px, transparent 8px 14px) 1; }
.al-pp-linea li::before { content: ""; position: absolute; left: 0; top: -8px; width: 14px; height: 14px; border-radius: 50%; background: var(--papel); border: 2px solid #BD0C6F; }
.al-pp-linea b { display: block; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 1.6rem; color: var(--texto); }
.al-pp-linea p { margin: 8px 0 0; color: var(--texto-2); line-height: 1.55; }
.al-pp-cifras { display: flex; flex-wrap: wrap; gap: clamp(30px, 6vw, 90px); margin-top: clamp(50px, 6vw, 80px); padding-top: 30px; border-top: 1px solid var(--linea); }
.al-pp-cifras p { margin: 0; } .al-pp-cifras b { display: block; font-family: var(--display); font-weight: 600; font-size: clamp(2.4rem, 1.4rem + 2.4vw, 3.6rem); letter-spacing: -0.04em; line-height: 1; color: var(--texto); }
.al-pp-cifras span { display: block; margin-top: 8px; font-size: .9rem; color: var(--texto-2); }
.al-pp-etapas { list-style: none; margin: clamp(40px, 5vw, 70px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.al-pp-etapas li { position: relative; padding: 26px 24px; border-radius: var(--radio); background: var(--papel); box-shadow: inset 0 0 0 1px var(--linea); opacity: .72; }
.al-pp-etapas li.al-on { opacity: 1; background: #0b0710; color: #fff; box-shadow: 0 30px 60px -30px rgba(43,8,60,.5); }
.al-pp-etapas span { font-family: var(--serif); font-style: italic; color: var(--texto-3); }
.al-pp-etapas b { display: block; margin-top: 6px; font-family: var(--display); font-weight: 600; font-size: 1.3rem; }
.al-pp-etapas p { margin: 6px 0 14px; font-size: .92rem; color: var(--texto-2); }
.al-pp-etapas li.al-on p, .al-pp-etapas li.al-on span { color: rgba(244,239,233,.66); }
.al-pp-etapas div { display: flex; flex-direction: column; gap: 6px; }
.al-pp-etapas a { color: inherit; font-size: .95rem; text-decoration: none; border-bottom: 1px solid transparent; align-self: flex-start; }
.al-pp-etapas a:hover { border-color: currentColor; }
.al-pp-etapas a[aria-current] { color: #cfa8ef; }
.al-pp-etapas i { position: absolute; top: 18px; right: 18px; font-style: normal; font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; padding: 5px 10px; border-radius: 999px; background: linear-gradient(90deg, #8A00C6, #D3114B); color: #fff; }
.al-pp-sigue { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 50px; }
.al-pp-sigue a { display: block; padding: 26px 28px; border-radius: var(--radio); box-shadow: inset 0 0 0 1px var(--linea); text-decoration: none; color: var(--texto); transition: background .3s ease; }
.al-pp-sigue a:hover { background: var(--papel); }
.al-pp-sigue span { display: block; font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: var(--texto-3); }
.al-pp-sigue b { display: block; margin-top: 8px; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 1.7rem; }
.al-pp-sig { text-align: right; }
.al-pp-sumate-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); gap: clamp(40px, 7vw, 110px); align-items: center; }
.al-pp-sumate p { max-width: 50ch; margin-top: 20px; color: rgba(244,239,233,.72); font-size: 1.08rem; }
.al-pp-sumate .al-acciones { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 26px; align-items: center; }
.al-pp-fund { padding: 34px; border-radius: var(--radio); background: rgba(255,255,255,.04); box-shadow: inset 0 0 0 1px var(--linea-o); }
.al-pp-fund-golo { width: 30px; height: 50px; fill: url(#al-grad-marca); }
.al-pp-fund h3 { margin: 16px 0 10px; font-family: var(--display); font-weight: 600; font-size: 1.3rem; color: #fff; letter-spacing: -0.02em; }
.al-pp-fund p { margin: 0 0 20px !important; font-size: .98rem !important; }
@media (max-width: 1000px) {
  .al-pp-que-grid, .al-pp-sumate-grid { grid-template-columns: 1fr; }
  .al-pp-lado { position: static; }
  .al-pp-pasos, .al-pp-etapas { grid-template-columns: 1fr 1fr; gap: 12px; }
  .al-pp-pasos { gap: 0 24px; }
  .al-pp-vs { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .al-pp-pasos, .al-pp-etapas, .al-pp-sigue { grid-template-columns: 1fr; }
  .al-pp-sig { text-align: left; }
  .al-pp-linea { grid-auto-flow: row; grid-auto-columns: auto; border-left: 2px solid rgba(189,12,111,.4); padding-left: 0; }
  .al-pp-linea li { border: 0; padding: 0 0 26px 26px; }
  .al-pp-linea li::before { left: -8px; top: 6px; }
  .al-pp-ficha > div { grid-template-columns: 1fr; gap: 4px; }
}

/* v27 · metas regionales hacia 2042 */
.al-mas-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: clamp(40px, 5vw, 70px); }
.al-mas-meta { display: flex; flex-direction: column; padding: 32px 30px; border-radius: var(--radio); background: var(--papel); box-shadow: inset 0 0 0 1px var(--linea); }
.al-mas-meta span { font-family: var(--serif); font-style: italic; font-size: 1.3rem; background: linear-gradient(120deg, #8A00C6, #D3114B); -webkit-background-clip: text; background-clip: text; color: transparent; }
.al-mas-meta h3 { margin: 14px 0 10px; font-family: var(--display); font-weight: 600; font-size: 1.45rem; letter-spacing: -0.02em; line-height: 1.1; }
.al-mas-meta p { margin: 0; color: var(--texto-2); line-height: 1.6; }
.al-mas-meta .al-mas-ind { margin-top: auto; padding-top: 22px; font-size: .88rem; color: var(--texto-3); }
.al-mas-ind b { display: block; margin-bottom: 4px; font-weight: 500; font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; color: var(--texto-2); }
.al-mas .al-nota-fuente { margin-top: 30px; }
@media (max-width: 1000px) { .al-mas-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .al-mas-grid { grid-template-columns: 1fr; } }

/* ==========================================================================
   v28 · Razones que se dan vuelta
   ========================================================================== */
.al-razones-ayuda { margin: -10px 0 18px; font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; color: var(--texto-3); }
.al-razon3[data-gira] { display: grid; padding: 0; background: none !important; min-height: 380px; cursor: pointer; perspective: 1400px; outline: none; }
.al-razon3-cara, .al-razon3-dorso { grid-area: 1 / 1; display: flex; flex-direction: column; gap: 14px; padding: clamp(28px, 3vw, 40px); border-radius: 22px; backface-visibility: hidden; -webkit-backface-visibility: hidden; transition: transform .9s cubic-bezier(.6,0,.2,1); }
.al-razon3-cara { background: var(--papel); transform: perspective(1400px) rotateY(0deg); }
.al-razon3.al-oscura .al-razon3-cara { background: var(--tinta); }
.al-razon3-dorso { background: linear-gradient(160deg, #1a0d24, #0b0710 70%); color: #fff; transform: perspective(1400px) rotateY(-180deg); overflow: hidden; position: relative; }
.al-razon3.al-girada .al-razon3-cara { transform: perspective(1400px) rotateY(180deg); }
.al-razon3.al-girada .al-razon3-dorso { transform: perspective(1400px) rotateY(0deg); }
.al-razon3[data-gira]:focus-visible .al-razon3-cara, .al-razon3[data-gira]:focus-visible .al-razon3-dorso { outline: 2px solid var(--violeta); outline-offset: 4px; }
/* íconos alineados y con vida */
.al-razon3-cara .al-picto { width: 58px; height: 58px; margin: 18px 0 6px !important; }
.al-razon3-cara h3 { margin-top: 0; }
.al-razon3-cara .al-picto circle { transform-box: fill-box; transform-origin: center; animation: al-picto-latido 3.2s ease-in-out infinite; animation-delay: calc(var(--d) * .12s); }
@keyframes al-picto-latido { 0%, 70%, 100% { opacity: 1; transform: scale(1); } 35% { opacity: .35; transform: scale(.55); } }
.al-razon3[data-gira]:hover .al-razon3-cara .al-picto circle { animation-duration: 1.4s; }
.al-dorso-k { font-size: .7rem; letter-spacing: .22em; text-transform: uppercase; color: #cfa8ef; }
.al-dorso-n { font-family: var(--display); font-weight: 600; font-size: clamp(2.6rem, 1.8rem + 2vw, 3.6rem); line-height: 1; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; background: linear-gradient(120deg, #fff, #f0a090); -webkit-background-clip: text; background-clip: text; color: transparent; }
.al-dorso-t { font-size: 1rem; line-height: 1.55; color: rgba(244,239,233,.82); position: relative; z-index: 1; }
.al-razon3-dorso small { margin-top: auto; font-size: .75rem; color: rgba(244,239,233,.5); position: relative; z-index: 1; }
.al-dorso-lluvia { position: absolute; inset: 0; pointer-events: none; }
.al-dorso-lluvia i { position: absolute; top: -10px; left: calc(var(--x) * 1%); width: 3px; height: 3px; border-radius: 50%; background: #f08c78; opacity: 0; }
.al-razon3.al-girada .al-dorso-lluvia i { animation: al-lluvia 2s linear infinite; animation-delay: var(--d); }
@keyframes al-lluvia { 0% { transform: translateY(0); opacity: 0; } 15% { opacity: .55; } 100% { transform: translateY(420px); opacity: 0; } }
.al-dorso-barras { display: flex; flex-direction: column; gap: 16px; margin: 8px 0 4px; }
.al-dorso-barras p { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; margin: 0; align-items: end; }
.al-dorso-barras span { font-size: .85rem; color: rgba(244,239,233,.7); }
.al-dorso-barras b { font-family: var(--display); font-weight: 600; font-size: 1.5rem; color: #fff; }
.al-dorso-barras i { grid-column: 1 / -1; height: 10px; border-radius: 99px; background: rgba(255,255,255,.08); position: relative; overflow: hidden; }
.al-dorso-barras i::after { content: ""; position: absolute; inset: 0; width: calc(var(--v) * 1%); border-radius: inherit; background: linear-gradient(90deg, #8A00C6, #D3114B); transform: scaleX(0); transform-origin: left; transition: transform 1.6s cubic-bezier(.2,.8,.2,1) .5s; }
.al-razon3.al-girada .al-dorso-barras i::after { transform: scaleX(1); }
.al-dorso-vida { list-style: none; margin: 4px 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.al-dorso-vida li { padding: 6px 12px; border-radius: 99px; font-size: .85rem; border: 1px solid rgba(207,168,239,.25); color: rgba(244,239,233,.5); transition: background .5s ease, color .5s ease, border-color .5s ease; }
.al-razon3.al-girada .al-dorso-vida li { background: linear-gradient(90deg, rgba(138,0,198,.55), rgba(211,17,75,.55)); border-color: transparent; color: #fff; }
.al-razon3.al-girada .al-dorso-vida li:nth-child(1) { transition-delay: .5s; } .al-razon3.al-girada .al-dorso-vida li:nth-child(2) { transition-delay: .75s; } .al-razon3.al-girada .al-dorso-vida li:nth-child(3) { transition-delay: 1s; }
.al-razon3.al-girada .al-dorso-vida li:nth-child(4) { transition-delay: 1.25s; } .al-razon3.al-girada .al-dorso-vida li:nth-child(5) { transition-delay: 1.5s; } .al-razon3.al-girada .al-dorso-vida li:nth-child(6) { transition-delay: 1.75s; } .al-razon3.al-girada .al-dorso-vida li:nth-child(7) { transition-delay: 2s; }
@media (prefers-reduced-motion: reduce) { .al-razon3-cara .al-picto circle, .al-dorso-lluvia i { animation: none !important; } }

/* v28 · mitos: más juntos y nueve */
.al-mitos--9 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.al-mitos--9 .al-mito { min-height: 230px; }
.al-mito-dorso small { margin-top: auto; font-size: .72rem; color: rgba(244,239,233,.5); }
.al-mito-dorso b { font-size: .98rem; }
@media (max-width: 991px) { .al-mitos--9 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .al-mitos--9 { grid-template-columns: 1fr; } .al-mitos--9 .al-mito { min-height: 200px; } }

/* v28 · glosario: el botón vive con el título */
.al-glosario-grid > div:first-child .al-dic-cta { grid-column: auto; margin-top: 36px; }

/* ==========================================================================
   v28 · Por qué formar personas
   ========================================================================== */
.al-edu .al-titulo-xl { color: #fff; }
.al-edu-grid { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 16px; margin-top: clamp(40px, 5vw, 70px); }
.al-edu-grid article { display: flex; flex-direction: column; gap: 14px; padding: clamp(26px, 3vw, 38px); border-radius: 22px; background: rgba(255,255,255,.035); box-shadow: inset 0 0 0 1px rgba(244,239,233,.1); }
.al-edu-c { background: linear-gradient(160deg, rgba(138,0,198,.35), rgba(211,17,75,.18)) !important; }
.al-edu-puntos { display: grid; grid-template-columns: repeat(20, 1fr); gap: 6px; }
.al-edu-puntos i { aspect-ratio: 1; border-radius: 50%; background: #cfa8ef; opacity: .95; transition: opacity .6s ease, background .6s ease, transform .6s ease; transition-delay: calc(var(--i) * 18ms); }
.al-ver .al-edu-puntos i { opacity: .16; transform: scale(.7); }
.al-ver .al-edu-puntos i.al-sost { opacity: 1; transform: scale(1.1); background: #f08c78; box-shadow: 0 0 10px rgba(240,140,120,.6); }
.al-edu-ley { display: flex; gap: 18px; font-size: .75rem; color: rgba(244,239,233,.55); }
.al-edu-ley span { display: inline-flex; align-items: center; gap: 6px; }
.al-edu-ley i { width: 8px; height: 8px; border-radius: 50%; background: #cfa8ef; opacity: .35; } .al-edu-ley i.al-sost { background: #f08c78; opacity: 1; }
.al-edu-n { margin: 6px 0 0; display: flex; align-items: baseline; gap: 10px; }
.al-edu-n b { font-family: var(--display); font-weight: 600; font-size: clamp(3rem, 2rem + 3vw, 4.6rem); line-height: .95; letter-spacing: -0.045em; color: #fff; font-variant-numeric: tabular-nums; }
.al-edu-n span { font-family: var(--serif); font-style: italic; font-size: 1.5rem; color: #cfa8ef; }
.al-edu-t { margin: 0; font-size: 1.02rem; line-height: 1.55; color: rgba(244,239,233,.86); }
.al-edu-t2 { margin: 0; font-size: .95rem; line-height: 1.55; color: rgba(244,239,233,.6); }
.al-edu-grid small { margin-top: auto; padding-top: 10px; font-size: .74rem; color: rgba(244,239,233,.45); }
.al-edu-barra { position: relative; height: 14px; border-radius: 99px; background: rgba(255,255,255,.07); margin-top: 6px; }
.al-edu-real { position: absolute; left: 0; top: 0; bottom: 0; width: 78.4%; border-radius: inherit; background: linear-gradient(90deg, #8A00C6, #D3114B); transform: scaleX(0); transform-origin: left; transition: transform 1.8s cubic-bezier(.2,.8,.2,1) .4s; }
.al-ver .al-edu-real { transform: scaleX(1); }
.al-edu-meta { position: absolute; right: 0; top: -6px; bottom: -6px; width: 2px; background: #fff; border-radius: 2px; }
.al-edu-eje { display: flex; justify-content: space-between; font-size: .72rem; color: rgba(244,239,233,.5); }
.al-edu-golo { width: 34px; height: 56px; fill: url(#al-grad-marca); }
@media (max-width: 1000px) { .al-edu-grid { grid-template-columns: 1fr; } }

/* v28 · universidades */
.al-uni-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 100px); align-items: start; }
.al-uni-p { margin-top: 22px; max-width: 52ch; font-size: 1.06rem; line-height: 1.7; color: var(--texto-2); }
.al-uni-lt { margin: 30px 0 12px; font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--texto-3); }
.al-uni-lista { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--linea); }
.al-uni-lista li { position: relative; padding: 14px 0 14px 26px; border-bottom: 1px solid var(--linea); color: var(--texto); }
.al-uni-lista li::before { content: ""; position: absolute; left: 4px; top: 22px; width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(135deg, #8A00C6, #D3114B); }
.al-uni-form { padding: clamp(26px, 3vw, 40px); border-radius: 24px; background: var(--papel); box-shadow: 0 40px 80px -50px rgba(43,8,60,.35), inset 0 0 0 1px var(--linea); }
.al-uni-quien { display: flex; align-items: center; gap: 16px; }
.al-uni-quien img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }
.al-uni-quien b { display: block; font-family: var(--display); font-weight: 600; font-size: 1.15rem; }
.al-uni-quien span { font-size: .88rem; color: var(--texto-2); }
.al-uni-directo { margin: 14px 0 22px; font-family: var(--serif); font-style: italic; font-size: 1.15rem; color: var(--texto); }
.al-uni-campos { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-bottom: 22px; }
.al-uni-campos label { display: flex; flex-direction: column; gap: 6px; font-size: .8rem; color: var(--texto-2); }
.al-uni-campos .al-uni-ancho { grid-column: 1 / -1; }
.al-uni-campos input, .al-uni-campos textarea { width: 100%; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--linea); background: #fff; font: inherit; font-size: .98rem; color: var(--texto); text-transform: none !important; letter-spacing: 0 !important; }
.al-uni-campos input:focus, .al-uni-campos textarea:focus { outline: none; border-color: var(--violeta); box-shadow: 0 0 0 3px rgba(126,23,190,.12); }
.al-uni-campos .al-falta input { border-color: #E93B24; }
.al-uni-nota { margin: 14px 0 0; font-size: .82rem; color: var(--texto-3); }
.al-uni-nota a { color: var(--violeta); }
.al-cv-uni { margin-top: 22px; font-size: .95rem; color: var(--texto-2); }
.al-cv-uni a { display: inline-flex; align-items: center; gap: 6px; color: var(--violeta); font-weight: 500; text-decoration: none; border-bottom: 1px solid rgba(126,23,190,.3); }
.al-cv-uni .al-icono { width: 14px; height: 14px; }
@media (max-width: 1000px) { .al-uni-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .al-uni-campos { grid-template-columns: 1fr; } }

/* v28 · transparencia: líneas de libro contable en vez de nebulosa */
.al-trans2 { overflow: hidden; }
.al-trans-lineas { position: absolute; inset: 0; display: flex; justify-content: space-around; pointer-events: none; }
.al-trans-lineas i { position: relative; width: 1px; height: 100%; background: rgba(244,239,233,.05); overflow: hidden; }
.al-trans-lineas i::after { content: ""; position: absolute; left: 0; top: -30%; width: 1px; height: 30%; background: linear-gradient(180deg, transparent, rgba(207,168,239,.55), transparent); animation: al-trans-cae 9s linear infinite; }
.al-trans-lineas i:nth-child(2)::after { animation-delay: -3s; } .al-trans-lineas i:nth-child(3)::after { animation-delay: -6s; } .al-trans-lineas i:nth-child(4)::after { animation-delay: -1.5s; } .al-trans-lineas i:nth-child(5)::after { animation-delay: -4.5s; } .al-trans-lineas i:nth-child(6)::after { animation-delay: -7.5s; }
@keyframes al-trans-cae { to { transform: translateY(440%); } }
.al-trans-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(40px, 6vw, 100px); align-items: start; }
.al-trans-frase { margin-top: 40px; font-family: var(--serif); font-style: italic; font-size: clamp(1.4rem, 1rem + 1.2vw, 2rem); line-height: 1.3; color: #fff; }
.al-trans-lista { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(244,239,233,.12); }
.al-trans-lista li { display: grid; grid-template-columns: 44px 1fr; gap: 12px; padding: 22px 0; border-bottom: 1px solid rgba(244,239,233,.12); }
.al-trans-lista li > span { font-family: var(--serif); font-style: italic; font-size: 1.2rem; color: #cfa8ef; }
.al-trans-lista b { display: block; font-family: var(--display); font-weight: 600; font-size: 1.2rem; color: #fff; letter-spacing: -0.01em; }
.al-trans-lista p { margin: 6px 0 0; color: rgba(244,239,233,.66); line-height: 1.55; }
@media (max-width: 1000px) { .al-trans-grid { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .al-trans-lineas i::after { animation: none; } }

/* v28 · artículo → proyecto relacionado */
.al-art-proy { margin: 50px 0 10px; }
.al-art-proy a { display: block; margin-top: 12px; padding: 28px 30px; border-radius: 20px; background: #0b0710; color: #fff; text-decoration: none; transition: transform .4s ease; }
.al-art-proy a:hover { transform: translateY(-3px); }
.al-art-proy b { display: block; font-family: var(--display); font-weight: 600; font-size: 1.5rem; letter-spacing: -0.02em; }
.al-art-proy b em { font-family: var(--serif); font-weight: 400; color: #cfa8ef; letter-spacing: 0; }
.al-art-proy span:not(.al-kicker) { display: block; margin-top: 8px; color: rgba(244,239,233,.7); }
.al-art-proy i { display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; font-style: normal; font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; }
.al-art-proy .al-icono { width: 14px; height: 14px; }
/* v28 · mitos: ambas caras se apilan en la misma celda (sin huecos) */
.al-mito { display: grid !important; }
.al-mito > .al-mito-cara, .al-mito > .al-mito-dorso { position: relative !important; inset: auto !important; grid-area: 1 / 1; min-height: 100%; }

/* v29 · notas de confianza */
.al-dona-nota { margin: 12px 0 0; font-size: .8rem; line-height: 1.5; color: var(--texto-2); max-width: 46ch; }
.al-b-fuente { margin: 8px 0 0; font-size: .72rem; line-height: 1.4; opacity: .7; }
.al-legal-fecha { font-size: .82rem; letter-spacing: .04em; color: var(--texto-2); margin-bottom: 28px; }
.al-legal ul { padding-left: 1.2em; } .al-legal li { margin-bottom: .6em; }

/* v30 · galerías de proyecto con fotos reales */
.al-pp-gal-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: 14px; margin-top: clamp(40px, 5vw, 64px); }
.al-pp-gal-f { margin: 0; grid-column: span 4; }
.al-pp-gal-f .al-foto { aspect-ratio: 4 / 5; border-radius: 18px; overflow: hidden; }
.al-pp-gal-f img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.8,.2,1); }
.al-pp-gal-f:hover img { transform: scale(1.04); }
.al-pp-gal-f figcaption { margin-top: 10px; font-size: .86rem; line-height: 1.45; color: var(--texto-2); }
.al-pp-gal--1 .al-pp-gal-f { grid-column: 1 / -1; } .al-pp-gal--1 .al-foto { aspect-ratio: 16 / 9; }
.al-pp-gal--2 .al-pp-gal-f { grid-column: span 6; }
.al-pp-gal--7 .al-pp-gal-f:nth-child(1), .al-pp-gal--7 .al-pp-gal-f:nth-child(4) { grid-column: span 8; } .al-pp-gal--7 .al-pp-gal-f:nth-child(1) .al-foto, .al-pp-gal--7 .al-pp-gal-f:nth-child(4) .al-foto { aspect-ratio: auto; height: 100%; max-height: 520px; }
.al-pp-gal--3 .al-pp-gal-f:first-child { grid-column: span 4; }
@media (max-width: 800px) { .al-pp-gal-f, .al-pp-gal--7 .al-pp-gal-f:nth-child(n) { grid-column: span 6; } .al-pp-gal--1 .al-pp-gal-f { grid-column: 1 / -1; } }
@media (max-width: 520px) { .al-pp-gal-f, .al-pp-gal--7 .al-pp-gal-f:nth-child(n), .al-pp-gal--2 .al-pp-gal-f { grid-column: 1 / -1; } }
.al-red-lush-fotos { grid-template-columns: repeat(3, 1fr) !important; }

/* =====================================================================
   v31 · nueva arquitectura
   ===================================================================== */
:root { --texto-3: #6c6573; }
.al-oscura, .al-cierre, .mil-menu-frame { --texto-3: #a49cad; }

/* menú por grupos: cinco puertas, con sus páginas debajo */
.al-menu-nav > ol > li { display: grid; grid-template-columns: minmax(0, auto) minmax(0, 1fr); align-items: baseline; column-gap: 28px; }
.al-menu-nav > ol > li > a { padding: 10px 0; font-size: clamp(1.7rem, 1.05rem + 2vw, 2.9rem); }
.al-menu-sub { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px 18px; margin: 0; padding: 0 0 6px; list-style: none; }
.al-menu-nav .al-menu-sub li { counter-increment: none; overflow: visible; border: 0; }
.al-menu-nav .al-menu-sub a, .al-menu-nav .mil-active .al-menu-sub a { display: inline; padding: 0; font-family: var(--texto-f); font-style: normal; font-weight: 400; font-size: .9rem; letter-spacing: .01em; color: rgba(244,239,233,.6); }
.al-menu-nav .al-menu-sub a::before { content: none; }
.al-menu-nav .al-menu-sub a:hover, .al-menu-nav .al-menu-sub a[aria-current] { color: var(--lila); padding-left: 0; }
@media (max-width: 991px) {
  .al-menu-nav > ol > li { grid-template-columns: 1fr; }
  .al-menu-nav > ol > li > a { padding: 8px 0 4px; font-size: clamp(1.55rem, 1.1rem + 2.4vw, 2.2rem); }
  .al-menu-sub { justify-content: flex-start; padding: 0 0 10px 34px; gap: 2px 14px; }
  .al-menu-nav .al-menu-sub a { font-size: .84rem; }
}

/* pie en cuatro grupos */
.al-pie2-nav--g { display: grid; grid-template-columns: repeat(4, minmax(0, auto)); gap: 24px clamp(20px, 3vw, 44px); }
.al-pie2-nav--g ul { display: flex; flex-direction: column; gap: 9px; grid-template-columns: none; }
.al-pie2-g b { display: block; margin-bottom: 14px; font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 500; color: rgba(244,239,233,.42); }
.al-pie2-nav--g a { font-size: .9rem; }
@media (max-width: 1199px) { .al-pie2-nav--g { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* portada del inicio: tres logros */
.al-portada-datos--logros { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.al-portada-datos--logros span { line-height: 1.45; max-width: 30ch; }
@media (max-width: 767px) { .al-portada-datos--logros { grid-template-columns: 1fr; gap: 0; } .al-portada-datos--logros span { padding: 12px 0; } .al-portada-datos--logros strong { display: inline; font-size: 1.15rem; margin-right: 6px; } }

/* «Una vida» dentro de Alguien, no algo */
.al-una-vida { margin: -10px 0 34px; }
.al-pxp-abrir--linea { margin: 0; color: var(--texto); border-color: var(--linea); background: rgba(126,23,190,.05); }
.al-pxp-abrir--linea:hover { background: rgba(126,23,190,.1); border-color: rgba(126,23,190,.35); }
.al-pxp-abrir--linea small { color: var(--texto-2); }

/* ahora mismo: galgos */
.al-ahora-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(36px, 6vw, 96px); align-items: center; }
.al-ahora-foto { position: relative; margin: 0; }
.al-ahora-foto .al-foto { aspect-ratio: 4 / 5; border-radius: 22px; overflow: hidden; }
.al-ahora-foto img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); }
.al-ahora-golo { position: absolute; right: -18px; bottom: -18px; width: 96px; height: 96px; fill: var(--lila); opacity: .9; }
.al-ahora-k { display: inline-flex; align-items: center; gap: 10px; }
.al-ahora-k i { width: 8px; height: 8px; border-radius: 50%; background: var(--rojo); box-shadow: 0 0 0 0 rgba(233,59,36,.6); animation: alLatido 2s infinite; }
@keyframes alLatido { 70% { box-shadow: 0 0 0 10px rgba(233,59,36,0); } 100% { box-shadow: 0 0 0 0 rgba(233,59,36,0); } }
.al-ah-linea { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 34px 0 18px; padding: 0; list-style: none; }
.al-ah-p { position: relative; padding: 22px 10px 0 0; border-top: 2px solid rgba(244,239,233,.16); font-size: .82rem; line-height: 1.35; color: rgba(244,239,233,.55); }
.al-ah-p::before { content: ""; position: absolute; top: -7px; left: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--tinta); border: 2px solid rgba(244,239,233,.3); }
.al-ah-p time { display: block; margin-bottom: 4px; font-family: var(--display); font-size: .95rem; color: rgba(244,239,233,.8); }
.al-ah-p--hecho { border-top-color: var(--violeta); color: rgba(244,239,233,.75); }
.al-ah-p--hecho::before { background: var(--violeta); border-color: var(--violeta); }
.al-ah-p--ahora { border-top-color: transparent; border-image: linear-gradient(90deg, var(--rojo), rgba(244,239,233,.16)) 1; color: #fff; }
.al-ah-p--ahora::before { background: var(--rojo); border-color: var(--rojo); animation: alLatido 2s infinite; }
.al-ah-falta { font-size: .9rem; color: rgba(244,239,233,.62); }
.al-ah-falta a { color: inherit; text-decoration: underline; text-underline-offset: .2em; }
.al-ah-falta a:hover, .al-ah-falta a:focus-visible { color: #fff; }
@media (max-width: 991px) {
  .al-ahora-grid { grid-template-columns: 1fr; }
  .al-ahora-foto { max-width: 420px; }
  .al-ah-linea { grid-template-columns: 1fr; margin-top: 26px; }
  .al-ah-p { border-top: 0; border-left: 2px solid rgba(244,239,233,.16); padding: 0 0 16px 22px; }
  .al-ah-p--hecho { border-left-color: var(--violeta); } .al-ah-p--ahora { border-image: none; border-left-color: var(--rojo); }
  .al-ah-p::before { top: 2px; left: -7px; }
}

/* qué hacemos: un ejemplo con el corto */
.al-hacemos-cc { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(24px, 4vw, 56px); align-items: center; margin-top: clamp(40px, 5vw, 64px); padding-top: clamp(30px, 4vw, 48px); border-top: 1px solid var(--linea); }
.al-hacemos-cc .al-cc-video { margin: 0; }
.al-hacemos-cc-t p { font-size: clamp(1.15rem, 1rem + .5vw, 1.45rem); line-height: 1.4; color: var(--texto); }
@media (max-width: 991px) { .al-hacemos-cc { grid-template-columns: 1fr; } }

/* hitos: fecha, hecho y fuente */
.al-logros-l { margin: 0; padding: 0; list-style: none; }
.al-logro { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: 4px 28px; padding: 22px 0; border-top: 1px solid var(--linea); }
.al-logro time { grid-row: span 2; font-family: var(--display); font-weight: 500; font-size: 1.05rem; letter-spacing: -0.01em; color: var(--violeta); }
.al-logro p { margin: 0; font-size: 1.05rem; line-height: 1.45; color: var(--texto); }
.al-logro small { font-size: .78rem; color: var(--texto-3); } .al-logro small a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.al-logros-l--home { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 28px; }
.al-logros-l--home .al-logro { grid-template-columns: 1fr; border-top: 2px solid var(--violeta); }
.al-logros-l--home .al-logro time { grid-row: auto; }
.al-logros-l--pagina .al-logro { position: relative; padding-left: 26px; }
.al-logros-l--pagina .al-logro::before { content: ""; position: absolute; left: 0; top: 30px; width: 9px; height: 9px; border-radius: 50%; background: var(--violeta); }
.al-logros-l--pagina .al-logro[data-k="rodeo"]::before { background: var(--rojo); } .al-logros-l--pagina .al-logro[data-k="galgos"]::before { background: #9C3733; }
@media (max-width: 991px) { .al-logros-l--home { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .al-logros-l--home { grid-template-columns: 1fr; } .al-logro { grid-template-columns: 1fr; } .al-logro time { grid-row: auto; } }
.al-logros-alc { margin-top: 18px; }

/* para empezar: tres puertas y un mito que rota */
.al-empezar-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: clamp(24px, 3vw, 40px); align-items: stretch; }
.al-puertas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.al-puerta { display: flex; flex-direction: column; gap: 10px; min-height: 260px; padding: 26px 24px; border: 1px solid var(--linea); border-radius: 18px 18px 90px 18px; color: var(--texto); text-decoration: none; transition: background-color .35s ease, transform .45s cubic-bezier(.2,.8,.2,1), border-color .35s ease; }
.al-puerta:hover { background: rgba(126,23,190,.05); border-color: rgba(126,23,190,.3); transform: translateY(-4px); }
.al-puerta-n { font-family: var(--serif); font-style: italic; color: var(--texto-3); }
.al-puerta h3 { margin: auto 0 0; font-size: 1.5rem; letter-spacing: -0.02em; }
.al-puerta p { margin: 0; font-size: .92rem; color: var(--texto-2); }
.al-puerta-ir { display: inline-flex; align-items: center; gap: 8px; font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--violeta); }
.al-puerta-ir .al-icono { width: 14px; height: 14px; }
.al-mito-home { display: flex; flex-direction: column; gap: 14px; padding: 28px 26px; border-radius: 18px; background: var(--tinta); color: var(--hueso); }
.al-mito-home .al-kicker { color: rgba(244,239,233,.55); }
.al-mh-pista { display: grid; flex: 1; }
.al-mh { grid-area: 1 / 1; opacity: 0; transform: translateY(10px); transition: opacity .7s ease, transform .7s ease; }
.al-mh.al-on { opacity: 1; transform: none; }
.al-mh b { display: block; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 1.7rem; line-height: 1.1; color: var(--lila); }
.al-mh p { margin: 12px 0 0; font-size: .95rem; color: rgba(244,239,233,.78); }
.al-mito-home .mil-link { color: var(--hueso); }
@media (max-width: 991px) { .al-empezar-grid { grid-template-columns: 1fr; } .al-puertas { grid-template-columns: 1fr; } .al-puerta { min-height: 0; border-radius: 18px 18px 60px 18px; } .al-puerta h3 { margin-top: 6px; } }

/* súmate en el inicio */
.al-caminos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.al-camino { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 28px 26px 30px; min-height: 230px; border: 1px solid var(--linea-o); border-radius: 18px; background: rgba(244,239,233,.03); color: var(--hueso); font: inherit; text-align: left; text-decoration: none; cursor: pointer; transition: background-color .35s ease, border-color .35s ease, transform .45s cubic-bezier(.2,.8,.2,1); }
.al-camino:hover { background: rgba(126,23,190,.18); border-color: rgba(207,168,239,.4); transform: translateY(-4px); }
.al-camino > span { font-family: var(--serif); font-style: italic; color: rgba(244,239,233,.45); }
.al-camino h3 { margin: auto 0 0; font-size: 1.7rem; letter-spacing: -0.02em; color: #fff; }
.al-camino p { margin: 0; font-size: .95rem; color: rgba(244,239,233,.7); }
.al-camino .al-icono { position: absolute; right: 24px; top: 26px; width: 18px; height: 18px; color: var(--lila); }
@media (max-width: 991px) { .al-caminos { grid-template-columns: 1fr; } .al-camino { min-height: 0; } .al-camino h3 { margin-top: 4px; } }

/* proyectos en tres niveles */
.al-nv { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, .8fr); gap: clamp(18px, 2.4vw, 32px); align-items: start; }
.al-nv-cab { padding-bottom: 18px; margin-bottom: 18px; border-bottom: 2px solid var(--texto); }
.al-nv-col[data-nivel="programa"] .al-nv-cab { border-color: var(--violeta); } .al-nv-col[data-nivel="campana"] .al-nv-cab { border-color: var(--rojo); } .al-nv-col[data-nivel="pieza"] .al-nv-cab { border-color: #9C3733; }
.al-nv-cab b { font-family: var(--display); font-weight: 500; font-size: 1.5rem; letter-spacing: -0.02em; }
.al-nv-cab span { margin-left: 8px; font-family: var(--serif); font-style: italic; color: var(--texto-3); }
.al-nv-cab p { margin: 8px 0 0; font-size: .9rem; color: var(--texto-2); }
.al-nv-cards { display: grid; gap: 14px; }
.al-nv-card { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 16px; padding: 14px; border-radius: 16px; background: #fff; border: 1px solid var(--linea); color: var(--texto); text-decoration: none; transition: transform .4s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease; }
a.al-nv-card:hover { transform: translateY(-3px); box-shadow: 0 18px 40px -24px rgba(43,37,37,.45); }
.al-nv-foto { aspect-ratio: 4 / 5; border-radius: 10px; overflow: hidden; background: var(--tinta); }
.al-nv-foto img { width: 100%; height: 100%; object-fit: cover; }
.al-nv-foto--tipo { display: flex; align-items: flex-end; padding: 8px; background: linear-gradient(160deg, #8A00C6, #F21727); color: #fff; font-family: var(--serif); font-style: italic; font-size: .85rem; line-height: 1.05; }
.al-nv-et { display: block; font-size: .64rem; letter-spacing: .18em; text-transform: uppercase; color: var(--texto-3); }
.al-nv-txt h4 { margin: 6px 0 4px; font-family: var(--display); font-weight: 500; font-size: 1.15rem; letter-spacing: -0.01em; }
.al-nv-txt h4 em { display: block; font-family: var(--serif); font-weight: 400; font-size: 1rem; color: var(--violeta); }
.al-nv-txt p { margin: 0; font-size: .85rem; line-height: 1.45; color: var(--texto-2); }
.al-nv-ir { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: var(--violeta); }
.al-nv-ir .al-icono { width: 12px; height: 12px; }
.al-nv-card--grupo { grid-template-columns: 1fr; }
.al-nv-card--grupo ul { margin: 12px 0 0; padding: 0; list-style: none; }
.al-nv-card--grupo li a { display: flex; align-items: baseline; gap: 8px; padding: 10px 0; border-top: 1px solid var(--linea); color: var(--texto); text-decoration: none; font-weight: 500; }
.al-nv-card--grupo li a em { font-family: var(--serif); font-weight: 400; color: var(--violeta); }
.al-nv-card--grupo li a .al-icono { margin-left: auto; width: 14px; height: 14px; color: var(--violeta); }
@media (max-width: 1199px) { .al-nv { grid-template-columns: 1fr 1fr; } .al-nv-col[data-nivel="programa"] { grid-column: 1 / -1; } .al-nv-col[data-nivel="programa"] .al-nv-cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 767px) { .al-nv, .al-nv-col[data-nivel="programa"] .al-nv-cards { grid-template-columns: 1fr; } }

/* ficha de proyecto: responsable y qué financia */
.al-pp-resp-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(30px, 5vw, 80px); align-items: start; }
.al-pp-quien-c { display: flex; gap: 18px; align-items: center; margin-top: 16px; }
.al-pp-quien-c img { width: 84px; height: 84px; border-radius: 50%; object-fit: cover; }
.al-pp-quien-c b { display: block; font-size: 1.15rem; } .al-pp-quien-c span { display: block; margin: 2px 0 8px; font-size: .88rem; color: var(--texto-2); }
.al-pp-financia p { margin: 12px 0 14px; color: var(--texto-2); }
.al-pp-financia ol { margin: 0 0 24px; padding: 0; list-style: none; }
.al-pp-financia li { display: flex; gap: 16px; padding: 12px 0; border-top: 1px solid var(--linea); font-size: 1.02rem; }
.al-pp-financia li span { font-family: var(--serif); font-style: italic; color: var(--texto-3); }
@media (max-width: 767px) { .al-pp-resp-grid { grid-template-columns: 1fr; } }

/* 2042: metas propias y de contribución */
.al-mas-ley { max-width: 70ch; margin: 0 0 28px; font-size: .95rem; color: var(--texto-2); }
.al-mas-tipo { display: inline-block; margin: 0 0 8px 10px; padding: 3px 10px; border-radius: 99px; background: rgba(126,23,190,.08); font-style: normal; font-size: .64rem; letter-spacing: .16em; text-transform: uppercase; color: var(--violeta); vertical-align: middle; }

/* fundaciones */
.al-fund-mirada { margin-top: 18px; }
.al-fund-mirada b { font-size: clamp(2rem, 1.3rem + 2vw, 3rem); }
.al-fund-etapas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 24px; margin: 30px 0 0; padding: 0; list-style: none; }
.al-fund-etapas li { padding-top: 18px; border-top: 2px solid var(--lila); }
.al-fund-etapas span { font-family: var(--serif); font-style: italic; color: var(--lila); }
.al-fund-etapas b { display: block; margin: 6px 0; font-size: 1.25rem; color: #fff; }
.al-fund-etapas p { margin: 0; font-size: .9rem; color: rgba(244,239,233,.68); }
.al-fin-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.al-fin-card { padding: 24px; border: 1px solid var(--linea); border-radius: 18px; background: #fff; }
.al-fin-card h3 { margin: 8px 0 12px; font-size: 1.35rem; } .al-fin-card h3 a { color: inherit; text-decoration: none; } .al-fin-card h3 a:hover { color: var(--violeta); }
.al-fin-card ul { margin: 0; padding-left: 18px; font-size: .92rem; color: var(--texto-2); } .al-fin-card li { margin-bottom: 6px; }
.al-fin-resp { margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--linea); font-size: .82rem; color: var(--texto-3); }
.al-fund-mail { font-size: .92rem; } .al-fund-mail a { color: inherit; }
@media (max-width: 991px) { .al-fund-etapas, .al-fin-grid { grid-template-columns: 1fr 1fr; gap: 20px; } }
@media (max-width: 600px) { .al-fund-etapas, .al-fin-grid { grid-template-columns: 1fr; } }

/* prensa */
.al-prensa-cto { display: flex; gap: 24px; align-items: center; }
.al-prensa-cto img { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; flex: none; }
.al-prensa-cto b { display: block; font-size: 1.3rem; } .al-prensa-cto span:not(.al-kicker) { display: block; color: var(--texto-2); font-size: .9rem; }
.al-prensa-cto p { margin: 8px 0; }
.al-kp-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 34px; }
.al-kp-b { padding: 28px; border: 1px solid var(--linea); border-radius: 18px; }
.al-kp-b h3 { margin: 0 0 14px; font-size: 1.15rem; }
.al-kp-b--ancho { grid-column: 1 / -1; }
.al-kp-cifras { margin-top: 0; padding-top: 0; border: 0; gap: 22px 36px; } .al-kp-cifras b { font-size: 2rem; } .al-kp-cifras p { flex: 1 1 40%; }
.al-kp-logos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.al-logo-dl { display: flex; flex-direction: column; gap: 10px; padding: 16px; border-radius: 12px; background: #f6f2ee; color: var(--texto); text-decoration: none; font-size: .75rem; }
.al-logo-dl.al-oscura { background: var(--tinta); color: var(--hueso); }
.al-logo-dl img { height: 56px; width: 100%; object-fit: contain; }
.al-kp-paleta { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; font-size: .72rem; }
.al-kp-paleta i { display: block; aspect-ratio: 1; border-radius: 10px; background: var(--c); border: 1px solid var(--linea); margin-bottom: 6px; }
.al-kp-paleta b { display: block; font-weight: 500; } .al-kp-paleta span { color: var(--texto-3); }
.al-kp-voceros { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin: 0; padding: 0; list-style: none; }
.al-kp-voceros li { display: flex; gap: 12px; align-items: flex-start; }
.al-kp-voceros img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; flex: none; }
.al-kp-voceros b { display: block; } .al-kp-voceros span { display: block; font-size: .82rem; color: var(--texto-2); } .al-kp-voceros a { font-size: .8rem; color: var(--violeta); word-break: break-all; }
@media (max-width: 991px) { .al-kp-grid { grid-template-columns: 1fr; } .al-kp-voceros { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .al-kp-voceros, .al-kp-logos { grid-template-columns: 1fr; } .al-kp-paleta { grid-template-columns: repeat(3, 1fr); } .al-prensa-cto { flex-direction: column; align-items: flex-start; } }

/* súmate */
.al-formas--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
@media (max-width: 1199px) { .al-formas--4 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 767px) { .al-formas--4 { grid-template-columns: 1fr; } }
.al-vol-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(30px, 5vw, 80px); align-items: start; }
.al-vol-areas { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; }
.al-vol-areas li { padding: 7px 14px; border: 1px solid var(--linea); border-radius: 99px; font-size: .85rem; }
.al-vol-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; border: 0; }
.al-vol-chips legend { width: 100%; margin-bottom: 8px; font-size: .78rem; color: var(--texto-2); }
.al-chip { position: relative; cursor: pointer; }
.al-chip input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.al-chip span { display: inline-block; padding: 7px 14px; border: 1px solid var(--linea); border-radius: 99px; font-size: .84rem; transition: background-color .25s ease, color .25s ease, border-color .25s ease; }
.al-chip input:checked + span { background: var(--violeta); border-color: var(--violeta); color: #fff; }
.al-chip input:focus-visible + span { outline: 2px solid var(--violeta); outline-offset: 2px; }
.al-vol-form select { width: 100%; }
@media (max-width: 991px) { .al-vol-grid { grid-template-columns: 1fr; } }
.al-rec-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(36px, 6vw, 96px); }
.al-rec-lista, .al-cal { margin: 26px 0 0; padding: 0; list-style: none; }
.al-rec-lista a { display: flex; align-items: center; gap: 10px; padding: 14px 0; border-top: 1px solid var(--linea); color: var(--texto); text-decoration: none; font-size: 1.05rem; }
.al-rec-lista a:hover { color: var(--violeta); } .al-rec-lista small { color: var(--texto-3); } .al-rec-lista .al-icono { margin-left: auto; width: 14px; height: 14px; color: var(--violeta); flex: none; }
.al-cal li { display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: 2px 18px; padding: 14px 0; border-top: 1px solid var(--linea); }
.al-cal time { grid-row: span 2; font-family: var(--serif); font-style: italic; font-size: 1.1rem; color: var(--violeta); }
.al-cal b { font-weight: 500; } .al-cal p { margin: 0; font-size: .9rem; color: var(--texto-2); }
@media (max-width: 991px) { .al-rec-grid { grid-template-columns: 1fr; } .al-cal li { grid-template-columns: 1fr; } .al-cal time { grid-row: auto; } }
.al-kit-sec-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px, 4vw, 64px); align-items: end; }
.al-kit-sec-grid p { color: rgba(244,239,233,.75); }
@media (max-width: 767px) { .al-kit-sec-grid { grid-template-columns: 1fr; } }
.al-tienda2-envios { margin: -6px 0 22px; font-size: .88rem; color: var(--texto-2); }

/* contacto: maltrato */
.al-mal-paises { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 34px 0 18px; padding: 0; list-style: none; }
.al-mal-paises li { padding: 24px; border: 1px solid var(--linea-o); border-radius: 18px; }
.al-mal-paises h3 { margin: 0 0 10px; font-size: 1.4rem; color: #fff; }
.al-mal-tel { font-size: 1.05rem; color: var(--hueso); } .al-mal-tel b { font-family: var(--display); font-size: 1.5rem; color: var(--lila); }
.al-mal-paises p:last-child { margin: 0; font-size: .88rem; color: rgba(244,239,233,.65); }
@media (max-width: 767px) { .al-mal-paises { grid-template-columns: 1fr; } }

/* documentales y veganismo */
.al-docs-proy { margin-top: 16px; font-size: .92rem; color: rgba(244,239,233,.72); } .al-docs-proy a { color: var(--lila); }
.al-recetas-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.al-receta { padding: 26px; border-radius: 18px; background: #fbf7f2; border: 1px solid var(--linea); }
.al-receta span { font-family: var(--serif); font-style: italic; color: var(--rojo); }
.al-receta h3 { margin: 8px 0; font-size: 1.35rem; } .al-receta p { margin: 0; font-size: .92rem; color: var(--texto-2); }
@media (max-width: 767px) { .al-recetas-grid { grid-template-columns: 1fr; } }
.al-dorso-n--fijo { font-size: clamp(1.9rem, 1.4rem + 1.4vw, 2.6rem); }

/* una-vida.html y el-sobre.html */
.al-exp { min-height: 88vh; display: flex; align-items: center; }
.al-exp-grid { padding-top: 120px; padding-bottom: 80px; max-width: 900px; }
.al-exp h1 { margin: 18px 0; }
.al-exp .al-pxp-abrir { margin-top: 0; }
.al-prensa-linea .al-red-franja { margin: 0; }
.al-ahora-k::before { display: none !important; }
.al-ahora-txt h2 { font-size: clamp(2.2rem, 1.4rem + 2.6vw, 3.9rem); margin-bottom: 22px; }
.al-menu-sub { gap: 4px 14px; } .al-menu-nav .al-menu-sub a, .al-menu-nav .mil-active .al-menu-sub a { font-size: .84rem; }
.al-logro time { font-variant-numeric: tabular-nums; }
.al-pie2:has(.al-pie2-nav--g) { grid-template-columns: minmax(0, .7fr) minmax(0, 2.2fr) auto; }
.al-pie2-nav--g { grid-template-columns: repeat(4, max-content); justify-content: start; }
.al-pie2-nav--g .al-pie2-gt { display: block; margin-bottom: 14px; font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; font-weight: 500; color: rgba(244,239,233,.5); white-space: nowrap; }
.al-pie2-nav--g .al-pie2-gt:hover { color: #fff; }
.al-pie2-nav--g a { white-space: nowrap; }
@media (max-width: 1199px) { .al-pie2:has(.al-pie2-nav--g) { grid-template-columns: 1fr; } .al-pie2-nav--g { grid-template-columns: repeat(4, max-content); gap: 24px 40px; } }
@media (max-width: 767px) { .al-pie2-nav--g { grid-template-columns: repeat(2, minmax(0, 1fr)); } .al-pie2-nav--g a { white-space: normal; } }
.al-kp-b .al-nota-fuente { font-size: .8rem; margin-top: 14px; }
.al-kp-b h3.al-mt-s { margin-top: 28px; }
.al-uni-campos select { width: 100%; height: auto; padding: 12px 40px 12px 14px; border-radius: 12px; border: 1px solid var(--linea); background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%237E17BE' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 14px center; font: inherit; font-size: .98rem; color: var(--texto); -webkit-appearance: none; appearance: none; }
.al-vol-form .al-uni-campos input { height: 48px; }
.al-vol-form .al-uni-campos textarea { height: 120px; min-height: 0; }
.al-vol-form p.al-uni-nota { font-size: .82rem; line-height: 1.5; }
.al-vol-form .al-uni-campos { row-gap: 18px; }
@media (max-width: 991px) { .al-ahora-foto .al-foto { aspect-ratio: 4 / 3; } .al-ahora-golo { width: 64px; height: 64px; right: -8px; bottom: -12px; } }

/* =====================================================================
   v32 · calculadora, estudios, evidencia, equipo y galería
   ===================================================================== */
/* tu mes */
.al-calc-mes-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(24px, 4vw, 64px); align-items: center; }
.al-calc-lab { margin: 0 0 12px; font-size: .78rem; letter-spacing: .16em; text-transform: uppercase; color: var(--texto-2); }
.al-calc-step { display: inline-flex; align-items: center; gap: 6px; padding: 6px; border-radius: 99px; background: #fff; border: 1px solid var(--linea); }
.al-calc-step button { width: 48px; height: 48px; border-radius: 50%; border: 0; background: var(--tinta); color: #fff; font-size: 1.4rem; line-height: 1; cursor: pointer; transition: background-color .25s ease, transform .25s ease; }
.al-calc-step button:hover { background: var(--violeta); transform: scale(1.05); }
.al-calc-step output { min-width: 64px; text-align: center; font-family: var(--display); font-size: 2.2rem; font-weight: 500; }
.al-calc-sw { display: flex; align-items: center; gap: 12px; margin-top: 22px; font-size: .95rem; cursor: pointer; }
.al-calc-sw input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.al-calc-sw > span { position: relative; flex: none; width: 46px; height: 26px; border-radius: 99px; background: rgba(43,37,37,.18); transition: background-color .25s ease; }
.al-calc-sw > span::after { content: ""; position: absolute; left: 3px; top: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: transform .3s cubic-bezier(.2,.8,.2,1); }
.al-calc-sw input:checked + span { background: var(--violeta); } .al-calc-sw input:checked + span::after { transform: translateX(20px); }
.al-calc-sw input:focus-visible + span { outline: 2px solid var(--violeta); outline-offset: 3px; }
.al-calc-res { display: grid; gap: 0; }
.al-calc-fila { display: flex; justify-content: space-between; align-items: baseline; gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--linea); font-size: .95rem; color: var(--texto-2); }
.al-calc-fila b { font-family: var(--display); font-weight: 500; font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.3rem); letter-spacing: -0.02em; color: var(--texto); white-space: nowrap; }
.al-calc-fila--v b { color: var(--violeta); }
.al-calc-ahorro { display: flex; justify-content: space-between; align-items: baseline; gap: 18px; margin-top: 18px; padding: 18px 22px; border-radius: 16px; background: var(--tinta); color: var(--hueso); }
.al-calc-ahorro b { font-family: var(--display); font-weight: 500; font-size: clamp(1.8rem, 1.3rem + 1.6vw, 2.8rem); color: var(--lila); white-space: nowrap; }
.al-calc-puntos { display: grid; gap: 10px; margin-top: 36px; }
.al-calc-pv, .al-calc-po { display: flex; flex-wrap: wrap; gap: 5px; }
.al-calc-pv i, .al-calc-po i { width: 9px; height: 9px; border-radius: 50%; background: var(--violeta); animation: alPunto .5s both; }
.al-calc-po i { background: rgba(43,37,37,.28); } .al-calc-po i.al-d { background: var(--rojo); }
@keyframes alPunto { from { transform: scale(0); } to { transform: scale(1); } }
.al-calc-ley { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-top: 14px; font-size: .8rem; color: var(--texto-2); }
.al-calc-ley i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-left: 8px; }
.al-calc-ley-v { background: var(--violeta); } .al-calc-ley-o { background: rgba(43,37,37,.28); } .al-calc-ley-d { background: var(--rojo); }
@media (max-width: 991px) { .al-calc-mes-grid { grid-template-columns: 1fr; } .al-calc-pv i, .al-calc-po i { width: 7px; height: 7px; } }
/* arma tu plato */
.al-calc-plato-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.al-calc-plato { margin: 0; }
.al-calc-plato svg { width: 100%; max-width: 520px; display: block; margin: 0 auto; overflow: visible; }
.al-calc-borde { fill: rgba(244,239,233,.03); stroke: rgba(244,239,233,.14); stroke-width: 1; }
.al-calc-p { cursor: pointer; transition: r .45s cubic-bezier(.2,.8,.2,1), opacity .3s ease; outline: none; }
.al-calc-p:hover, .al-calc-p:focus { stroke: #fff; stroke-width: 2; }
.al-calc-plato figcaption { min-height: 2.6em; margin-top: 16px; text-align: center; font-size: .92rem; color: rgba(244,239,233,.75); }
.al-calc-plato figcaption b { color: #fff; font-weight: 500; }
.al-calc-kcal { display: flex; align-items: center; gap: 20px; }
.al-calc-kcal svg { width: 120px; height: 120px; flex: none; transform: rotate(-90deg); }
.al-calc-kcal circle { fill: none; stroke-width: 8; stroke: rgba(244,239,233,.12); }
.al-calc-kcal circle[data-calc-anillo] { stroke: var(--lila); stroke-linecap: round; transition: stroke-dashoffset .5s cubic-bezier(.2,.8,.2,1), stroke .3s ease; }
.al-calc-pasa .al-calc-kcal circle[data-calc-anillo], .al-calc-falta .al-calc-kcal circle[data-calc-anillo] { stroke: var(--rojo); }
.al-calc-kcal b { display: block; font-family: var(--display); font-weight: 500; font-size: 2.6rem; line-height: 1; color: #fff; }
.al-calc-kcal span { display: block; color: rgba(244,239,233,.7); } .al-calc-kcal small { color: rgba(244,239,233,.5); }
.al-calc-costos { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 24px; margin: 26px 0 22px; }
.al-calc-costos p { margin: 0; } .al-calc-costos span { display: block; font-size: .78rem; color: rgba(244,239,233,.6); }
.al-calc-costos b { font-family: var(--display); font-weight: 500; font-size: 1.7rem; color: #fff; }
.al-calc-bajo [data-calc-cm] { color: var(--lila); }
.al-calc-vs { grid-column: 1 / -1; font-size: .88rem; } .al-calc-vs span { display: inline; } .al-calc-vs b { font-size: 1rem; color: rgba(244,239,233,.85); }
.al-calc-gs { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 22px; }
.al-calc-g span { display: flex; align-items: center; gap: 8px; font-size: .85rem; color: rgba(244,239,233,.82); }
.al-calc-g span i { width: 10px; height: 10px; border-radius: 50%; background: var(--c); }
.al-calc-g span b { margin-left: auto; font-weight: 500; font-variant-numeric: tabular-nums; color: #fff; }
.al-calc-g input[type=range] { width: 100%; margin-top: 6px; accent-color: var(--c); }
.al-calc-reset { margin-top: 22px; background: none; border: 0; padding: 0; cursor: pointer; }
@media (max-width: 991px) { .al-calc-plato-grid { grid-template-columns: 1fr; } .al-calc-gs { grid-template-columns: 1fr; } }
.al-calc-hs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.al-calc-h { padding: 26px; border: 1px solid var(--linea); border-radius: 18px; display: flex; flex-direction: column; gap: 10px; }
.al-calc-h time { font-family: var(--serif); font-style: italic; color: var(--violeta); }
.al-calc-h h3 { margin: 0; font-size: 1.15rem; } .al-calc-h p { margin: 0 0 auto; color: var(--texto-2); font-size: .95rem; }
@media (max-width: 991px) { .al-calc-hs { grid-template-columns: 1fr; } }

/* estudios */
.al-est-cab { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 30px; }
.al-est-n { margin: 0; font-size: 1rem; color: var(--texto-2); } .al-est-n b { font-family: var(--display); font-size: 2.6rem; font-weight: 500; color: var(--texto); margin-right: 6px; }
.al-est-chips, .al-eq-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.al-est-chip, .al-eq-chip { padding: 9px 16px; border: 1px solid var(--linea); border-radius: 99px; background: transparent; font: inherit; font-size: .86rem; color: var(--texto); cursor: pointer; transition: background-color .25s ease, color .25s ease, border-color .25s ease; }
.al-est-chip:hover, .al-eq-chip:hover { border-color: var(--violeta); }
.al-est-chip.al-on, .al-eq-chip.al-on { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.al-est-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.al-est { display: flex; flex-direction: column; gap: 12px; padding: 26px; border-radius: 18px; background: #fff; border: 1px solid var(--linea); scroll-margin-top: 110px; transition: opacity .35s ease, transform .35s ease; }
.al-est:target { box-shadow: 0 0 0 2px var(--violeta); }
.al-est.al-fuera { display: none; }
.al-est header { display: flex; flex-direction: column; gap: 2px; }
.al-est time { font-family: var(--serif); font-style: italic; font-size: 1.1rem; color: var(--violeta); }
.al-est header span { font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: var(--texto-3); }
.al-est[data-tema="rodeo"] time { color: var(--rojo); } .al-est[data-tema="salud"] time { color: #9C3733; }
.al-est h3 { margin: 0; font-size: 1.2rem; line-height: 1.25; }
.al-est p { margin: 0; font-size: .95rem; line-height: 1.5; color: var(--texto-2); }
.al-est dl { margin: auto 0 0; padding-top: 12px; border-top: 1px solid var(--linea); font-size: .8rem; }
.al-est dl div { display: flex; gap: 8px; } .al-est dt { color: var(--texto-3); } .al-est dd { margin: 0; }
.al-est-pdf { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; padding: 9px 16px; border-radius: 99px; background: var(--tinta); color: #fff; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; transition: background-color .25s ease; }
.al-est-pdf:hover { background: var(--violeta); } .al-est-pdf .al-icono { width: 14px; height: 14px; }
@media (max-width: 1199px) { .al-est-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 700px) { .al-est-grid { grid-template-columns: 1fr; } }

/* evidencia en proyectos */
.al-evid-grid { display: grid; gap: 16px; margin-top: 18px; }
.al-evid-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .al-evid-grid--1 { grid-template-columns: minmax(0, 720px); }
.al-evid article { display: flex; flex-direction: column; gap: 10px; padding: 26px; border-radius: 18px; border: 1px solid var(--linea); background: #fff; }
.al-evid b { font-family: var(--display); font-weight: 600; font-size: clamp(2.2rem, 1.5rem + 2vw, 3.2rem); line-height: 1; letter-spacing: -0.04em; background: linear-gradient(120deg, #8A00C6, #F21727); -webkit-background-clip: text; background-clip: text; color: transparent; }
.al-evid p { margin: 0 0 auto; color: var(--texto-2); }
.al-evid a { display: inline-flex; align-items: center; gap: 6px; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--violeta); text-decoration: none; }
.al-evid a .al-icono { width: 12px; height: 12px; }
@media (max-width: 991px) { .al-evid-grid--3 { grid-template-columns: 1fr; } }

/* equipo: la bandada */
.al-eq-chips { margin-bottom: 28px; }
.al-eq-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 34px 22px; }
.al-eq { transition: opacity .4s ease, transform .5s cubic-bezier(.2,.8,.2,1); }
.al-eq:nth-child(4n+2) { transform: translateY(36px); } .al-eq:nth-child(4n+4) { transform: translateY(18px); }
.al-eq.al-fuera { opacity: .15; filter: grayscale(1); }
.al-eq-foto { position: relative; margin: 0; aspect-ratio: 4 / 5; border-radius: 120px 120px 22px 22px; overflow: hidden; background: linear-gradient(160deg, #8A00C6, #BD0C6F 55%, #F21727); isolation: isolate; }
.al-eq:nth-child(3n+2) .al-eq-foto { border-radius: 22px 120px 22px 120px; }
.al-eq:nth-child(3n+3) .al-eq-foto { border-radius: 22px 22px 120px 120px; }
.al-eq-foto img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.08); mix-blend-mode: luminosity; opacity: .92; transition: filter .6s ease, opacity .6s ease, transform .9s cubic-bezier(.2,.8,.2,1), mix-blend-mode 0s .3s; }
.al-eq:hover .al-eq-foto img, .al-eq:focus-within .al-eq-foto img { filter: none; mix-blend-mode: normal; opacity: 1; transform: scale(1.04); }
.al-eq-area { position: absolute; left: 12px; bottom: 12px; padding: 5px 11px; border-radius: 99px; background: rgba(11,7,16,.72); color: #fff; font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; backdrop-filter: blur(6px); }
.al-eq-info { padding: 14px 4px 0; }
.al-eq-info h3 { margin: 0; font-size: 1.15rem; } .al-eq-info p { margin: 2px 0 6px; font-size: .88rem; color: var(--texto-2); }
.al-eq-info a { font-size: .8rem; color: var(--violeta); text-decoration: none; word-break: break-all; }
@media (max-width: 1199px) { .al-eq-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .al-eq:nth-child(n) { transform: none; } .al-eq:nth-child(3n+2) { transform: translateY(28px); } }
@media (max-width: 767px) { .al-eq-grid { grid-template-columns: 1fr 1fr; gap: 26px 14px; } .al-eq:nth-child(n) { transform: none; } .al-eq:nth-child(2n) { transform: translateY(24px); } .al-eq-foto { border-radius: 80px 80px 18px 18px !important; } }

/* galería en cinta */
.al-cinta { display: grid; gap: 14px; margin-top: 10px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.al-cinta-fila { overflow: hidden; }
.al-cinta-pista { display: flex; width: max-content; animation: alCinta 70s linear infinite; }
.al-cinta-fila--inv .al-cinta-pista { animation-direction: reverse; animation-duration: 80s; }
.al-cinta:hover .al-cinta-pista { animation-play-state: paused; }
.al-cinta-set { display: flex; gap: 14px; padding-right: 14px; }
.al-cinta-f { position: relative; flex: none; height: clamp(220px, 26vw, 340px); margin: 0; border-radius: 18px; overflow: hidden; background: var(--tinta); }
.al-cinta-f img { height: 100%; width: auto; display: block; transition: transform .8s cubic-bezier(.2,.8,.2,1), filter .5s ease; }
.al-cinta-f:hover img { transform: scale(1.05); }
.al-cinta-f figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 30px 16px 14px; background: linear-gradient(transparent, rgba(11,7,16,.85)); color: #fff; font-size: .82rem; line-height: 1.35; opacity: 0; transform: translateY(8px); transition: opacity .35s ease, transform .35s ease; }
.al-cinta-f:hover figcaption { opacity: 1; transform: none; }
@keyframes alCinta { to { transform: translateX(-50%); } }
@media (hover: none) { .al-cinta-f figcaption { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .al-cinta-pista { animation: none; } .al-cinta-fila { overflow-x: auto; } }

/* prensa por país */
.al-pr-intro { max-width: 60ch; margin: 10px 0 26px; color: var(--texto-2); }
.al-pr-paises { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.al-pr-pais { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 26px; border-radius: 18px; background: #fff; border: 1px solid var(--linea); }
.al-pr-p { position: absolute; top: 22px; right: 22px; font-family: var(--serif); font-style: italic; font-size: 1.5rem; color: var(--violeta); }
.al-pr-pais img { width: 88px; height: 88px; border-radius: 50%; object-fit: cover; margin-bottom: 12px; }
.al-pr-pais b { font-size: 1.2rem; } .al-pr-pais > span:not(.al-pr-p) { font-size: .88rem; color: var(--texto-2); margin-bottom: 8px; }
@media (max-width: 991px) { .al-pr-paises { grid-template-columns: 1fr; } }
.al-kp-voceros { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.al-calc-ctrl p.al-calc-lab { font-size: .78rem; line-height: 1.4; }
.al-eq-foto { background: linear-gradient(165deg, #7E17BE, #9C3733); }
.al-eq-foto img { opacity: .78; }
.al-eq-area { position: static; display: inline-block; margin-bottom: 6px; padding: 0; background: none; backdrop-filter: none; color: var(--violeta); font-size: .64rem; }
.al-eq-sec .al-acciones { margin-top: 70px; }
.al-w { padding-top: .14em; margin-top: -.14em; }
.al-calc-g input[type=range] { height: 22px; margin: 6px 0 0; padding: 0; border: 0; background: transparent; } .al-calc-gs { row-gap: 10px; }

/* v33 · arma tu plato */
.al-pl-pasos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 28px; margin: 0 0 44px; padding: 0; list-style: none; counter-reset: none; }
.al-pl-pasos li { display: flex; gap: 14px; padding-top: 16px; border-top: 1px solid rgba(244,239,233,.16); }
.al-pl-pasos span { font-family: var(--serif); font-style: italic; font-size: 1.4rem; line-height: 1; color: var(--lila); }
.al-pl-pasos p { margin: 0; font-size: .95rem; color: rgba(244,239,233,.78); }
.al-pl-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.al-pl-fig { margin: 0; }
.al-pl-lienzo { position: relative; width: 100%; max-width: 560px; margin: 0 auto; aspect-ratio: 1; }
.al-pl-lienzo canvas { width: 100%; height: 100%; display: block; cursor: crosshair; touch-action: manipulation; }
.al-pl-centro { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; justify-content: center; width: 30%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(11,7,16,.92) 55%, rgba(11,7,16,0) 72%); pointer-events: none; }
.al-pl-centro b { font-family: var(--display); font-weight: 500; font-size: clamp(1.4rem, 1rem + 1.6vw, 2.4rem); line-height: 1; color: #fff; }
.al-pl-centro span { font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: rgba(244,239,233,.6); }
.al-pl-falta .al-pl-centro b, .al-pl-sobra .al-pl-centro b { color: #ff9a76; }
.al-pl-fig figcaption { min-height: 3em; margin: 14px auto 0; max-width: 560px; text-align: center; font-size: .9rem; line-height: 1.5; color: rgba(244,239,233,.72); }
.al-pl-fig figcaption b { color: #fff; font-weight: 500; }
.al-pl-lab { margin: 0 0 10px; font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: rgba(244,239,233,.55); }
.al-pl-presets { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 26px; }
.al-pl-pre { padding: 9px 15px; border-radius: 99px; border: 1px solid rgba(244,239,233,.2); background: transparent; color: rgba(244,239,233,.85); font: inherit; font-size: .85rem; cursor: pointer; transition: background-color .25s ease, color .25s ease, border-color .25s ease; }
.al-pl-pre:hover { border-color: var(--lila); }
.al-pl-pre.al-on { background: var(--hueso); color: var(--tinta); border-color: var(--hueso); }
.al-pl-gs { display: grid; gap: 2px; }
.al-pl-g { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 10px 0; border-bottom: 1px solid rgba(244,239,233,.1); }
.al-pl-g-n { display: flex; align-items: baseline; gap: 10px; font-size: .95rem; color: #fff; }
.al-pl-g-n i { flex: none; width: 11px; height: 11px; border-radius: 50%; background: var(--c); box-shadow: 0 0 10px var(--c); align-self: center; }
.al-pl-g-n small { font-size: .75rem; color: rgba(244,239,233,.5); }
.al-pl-step { display: inline-flex; align-items: center; gap: 4px; padding: 3px; border-radius: 99px; background: rgba(244,239,233,.06); }
.al-pl-step button { width: 32px; height: 32px; border-radius: 50%; border: 0; background: transparent; color: #fff; font-size: 1.15rem; line-height: 1; cursor: pointer; transition: background-color .2s ease; }
.al-pl-step button:hover:not(:disabled) { background: var(--c); color: var(--tinta); }
.al-pl-step button:disabled { opacity: .25; cursor: default; }
.al-pl-step b { min-width: 52px; text-align: center; font-weight: 500; font-size: .85rem; font-variant-numeric: tabular-nums; color: #fff; }
.al-pl-res { margin-top: 26px; }
.al-pl-barra { position: relative; height: 6px; border-radius: 99px; background: rgba(244,239,233,.1); margin-bottom: 30px; }
.al-pl-barra i { position: absolute; inset: 0 auto 0 0; border-radius: 99px; background: linear-gradient(90deg, #8A00C6, #cfa8ef); transition: width .5s cubic-bezier(.2,.8,.2,1); }
.al-pl-falta .al-pl-barra i, .al-pl-sobra .al-pl-barra i { background: linear-gradient(90deg, #E93B24, #ff9a76); }
.al-pl-meta { position: absolute; left: var(--m); top: -4px; height: 14px; border-left: 2px solid #fff; }
.al-pl-meta { padding: 16px 0 0 6px; font-size: .7rem; line-height: 1; white-space: nowrap; color: rgba(244,239,233,.6); }
.al-pl-frase { margin: 0 0 18px; font-family: var(--serif); font-style: italic; font-size: clamp(1.2rem, 1rem + .6vw, 1.5rem); line-height: 1.35; color: #fff; }
.al-pl-nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.al-pl-nums p { margin: 0; } .al-pl-nums span { display: block; font-size: .74rem; color: rgba(244,239,233,.55); }
.al-pl-nums b { font-family: var(--display); font-weight: 500; font-size: 1.35rem; color: #fff; }
.al-pl-nums p:nth-child(2) b { color: var(--lila); }
@media (max-width: 991px) { .al-pl-pasos { grid-template-columns: 1fr; gap: 12px; } .al-pl-grid { grid-template-columns: 1fr; } .al-pl-nums { grid-template-columns: 1fr 1fr; } }

/* v33 · sonido de fondo de las experiencias */
.al-son { position: fixed; left: 22px; bottom: 22px; z-index: 2147483000; display: none; align-items: center; gap: 10px; padding: 9px 16px 9px 12px; border-radius: 99px; border: 1px solid rgba(244,239,233,.2); background: rgba(11,7,16,.55); color: rgba(244,239,233,.75); font: inherit; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; cursor: pointer; backdrop-filter: blur(8px); transition: border-color .3s ease, color .3s ease; }
html.al-son-visible .al-son { display: inline-flex; }
.al-son:hover { border-color: var(--lila); color: #fff; }
.al-son:focus-visible { outline: 2px solid var(--lila); outline-offset: 3px; }
.al-son-ondas { display: inline-flex; align-items: center; gap: 2px; height: 14px; }
.al-son-ondas i { width: 2px; height: 3px; border-radius: 2px; background: currentColor; transition: height .3s ease; }
.al-son.al-on { color: #fff; border-color: rgba(207,168,239,.5); }
.al-son.al-on .al-son-ondas i { animation: alOnda 1.6s ease-in-out infinite; }
.al-son.al-on .al-son-ondas i:nth-child(2) { animation-delay: .2s; } .al-son.al-on .al-son-ondas i:nth-child(3) { animation-delay: .45s; } .al-son.al-on .al-son-ondas i:nth-child(4) { animation-delay: .7s; }
@keyframes alOnda { 0%, 100% { height: 3px; } 50% { height: 13px; } }
@media (prefers-reduced-motion: reduce) { .al-son.al-on .al-son-ondas i { animation: none; height: 9px; } }

/* v40 · tienda solidaria mejorada */
.al-ti-cab { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 80px); align-items: end; margin-bottom: 30px; }
.al-ti-cab .al-tienda2-pasos { margin: 18px 0 10px; }
.al-ti-barra-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; margin-bottom: 28px; }
.al-ti-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; }
.al-ti-chip { display: inline-flex; align-items: center; gap: 7px; padding: 9px 16px; border: 1px solid var(--linea); border-radius: 99px; background: transparent; font: inherit; font-size: .86rem; color: var(--texto); cursor: pointer; transition: background-color .25s ease, color .25s ease, border-color .25s ease, transform .2s ease; }
.al-ti-chip small { font-size: .72rem; padding: 1px 7px; border-radius: 99px; background: rgba(43,37,37,.07); color: var(--texto-2); font-variant-numeric: tabular-nums; transition: background-color .25s ease, color .25s ease; }
.al-ti-chip:hover { border-color: var(--violeta); transform: translateY(-1px); }
.al-ti-chip.al-on { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.al-ti-chip.al-on small { background: rgba(255,255,255,.18); color: #fff; }
.al-ti-leyenda { display: inline-flex; align-items: center; gap: 8px; margin: 0; font-size: .8rem; color: var(--texto-2); }
.al-ti-leyenda i { width: 7px; height: 7px; border-radius: 50%; background: var(--violeta); opacity: .75; }
.al-ti-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 20px; }
.al-ti-grid.al-ti-filtrado { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.al-ti { position: relative; display: flex; flex-direction: column; transition: opacity .35s ease, transform .35s cubic-bezier(.2,.8,.2,1); }
.al-ti.al-fuera { display: none; }
.al-ti.al-ti-entra { animation: alTiEntra .42s cubic-bezier(.2,.8,.2,1) both; }
@keyframes alTiEntra { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
.al-ti--dest { grid-column: span 2; grid-row: span 2; }
.al-ti-grid.al-ti-filtrado .al-ti--dest { grid-column: span 1; grid-row: span 1; }
.al-ti-foto { position: relative; aspect-ratio: 4 / 5; border-radius: 22px; overflow: hidden; background: #ece6df; cursor: pointer; box-shadow: 0 14px 34px -22px rgba(11,7,16,.28); }
.al-ti--dest .al-ti-foto { aspect-ratio: auto; flex: 1; min-height: 440px; }
.al-ti-grid.al-ti-filtrado .al-ti--dest .al-ti-foto { aspect-ratio: 4 / 5; min-height: 0; flex: none; }
.al-ti-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.03); transition: opacity .55s ease, transform 1s cubic-bezier(.2,.8,.2,1); }
.al-ti-foto img.al-on { opacity: 1; transform: none; }
.al-ti:hover .al-ti-foto img.al-on { transform: scale(1.045); }
.al-ti-dest { position: absolute; left: 14px; top: 14px; z-index: 2; padding: 6px 12px; border-radius: 99px; background: var(--tinta); color: #fff; font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; pointer-events: none; }
.al-ti-oficio-tag { position: absolute; right: 12px; top: 12px; z-index: 2; padding: 5px 10px; border-radius: 99px; background: rgba(244,239,233,.88); backdrop-filter: blur(6px); border: 1px solid rgba(43,37,37,.1); color: var(--tinta); font-size: .66rem; letter-spacing: .06em; text-transform: uppercase; pointer-events: none; }
.al-ti-puntos { position: absolute; left: 14px; bottom: 14px; z-index: 3; display: inline-flex; align-items: center; gap: 6px; padding: 5px 8px; border-radius: 99px; background: rgba(18,13,24,.62); backdrop-filter: blur(6px); }
.al-ti-pto { width: 8px; height: 8px; padding: 0; border-radius: 99px; border: 0; background: rgba(255,255,255,.45); cursor: pointer; transition: width .25s ease, background-color .25s ease; }
.al-ti-pto.al-on { width: 18px; background: #fff; }
.al-ti-zoom { position: absolute; right: 12px; bottom: 12px; z-index: 3; display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px; border-radius: 99px; border: 1px solid rgba(255,255,255,.22); background: rgba(18,13,24,.7); backdrop-filter: blur(6px); color: #fff; font: inherit; font-size: .7rem; letter-spacing: .04em; cursor: pointer; opacity: 0; transform: translateY(4px); transition: opacity .25s ease, transform .25s ease, background-color .2s ease; }
.al-ti-zoom svg { width: 14px; height: 14px; }
.al-ti-foto:hover .al-ti-zoom, .al-ti-zoom:focus-visible { opacity: 1; transform: none; }
.al-ti-zoom:hover { background: var(--violeta); border-color: var(--violeta); }
.al-ti-txt { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 14px 4px 0; overflow: hidden; }
.al-ti-marca { position: absolute; right: -6px; top: 8px; width: 64px; height: 64px; fill: var(--tinta); opacity: .055; pointer-events: none; transform: rotate(-6deg); transition: opacity .35s ease, transform .35s ease; }
.al-ti:hover .al-ti-marca { opacity: .11; transform: rotate(0deg) scale(1.05); fill: var(--violeta); }
.al-ti-fin { font-size: .72rem; color: var(--texto-2); padding-right: 48px; }
.al-ti-fin i { font-style: normal; margin-right: 6px; letter-spacing: .14em; text-transform: uppercase; color: var(--violeta); font-weight: 600; }
.al-ti h3 { margin: 0; font-size: 1.14rem; letter-spacing: -0.015em; }
.al-ti--dest h3 { font-size: 1.55rem; }
.al-ti-grid.al-ti-filtrado .al-ti--dest h3 { font-size: 1.14rem; }
.al-ti p { margin: 0; font-size: .9rem; line-height: 1.45; color: var(--texto-2); }
.al-ti-colores, .al-ti-tallas { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.al-ti-var-l { font-size: .7rem; letter-spacing: .1em; text-transform: uppercase; color: var(--texto-2); margin-right: 4px; }
.al-ti-col { width: 22px; height: 22px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px var(--linea); background: var(--sw); cursor: pointer; transition: box-shadow .2s ease, transform .2s ease; }
.al-ti-col:hover { transform: scale(1.1); }
.al-ti-col.al-on { box-shadow: 0 0 0 2px var(--violeta); }
.al-ti-talla { min-width: 30px; height: 26px; padding: 0 8px; border-radius: 99px; border: 1px solid var(--linea); background: rgba(255,255,255,.55); color: var(--texto); font: inherit; font-size: .72rem; font-weight: 600; cursor: pointer; transition: background-color .2s ease, color .2s ease, border-color .2s ease; }
.al-ti-talla:hover { border-color: var(--violeta); }
.al-ti-talla.al-on { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.al-ti-acc { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 10px; }
.al-ti-sumar { display: inline-flex; align-items: center; gap: 8px; padding: 9px 16px; border-radius: 99px; border: 1px solid var(--tinta); background: transparent; color: var(--tinta); font: inherit; font-size: .76rem; font-weight: 500; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; transition: background-color .25s ease, color .25s ease, border-color .25s ease, transform .2s ease; }
.al-ti-sumar:hover { background: var(--tinta); color: #fff; transform: translateY(-1px); }
.al-ti-sumar .al-ti-s2 { display: none; }
.al-en-bolsa .al-ti-sumar, .al-ti-modal.al-en-bolsa .al-ti-modal-sumar { background: var(--violeta); border-color: var(--violeta); color: #fff; }
.al-en-bolsa .al-ti-s1, .al-ti-modal.al-en-bolsa .al-ti-s1 { display: none; }
.al-en-bolsa .al-ti-s2, .al-ti-modal.al-en-bolsa .al-ti-s2 { display: inline; }
.al-en-bolsa .al-ti-s2::before, .al-ti-modal.al-en-bolsa .al-ti-s2::before { content: "✓ "; }
.al-ti-ver { font-size: .78rem; color: var(--violeta); text-decoration: underline; text-underline-offset: 3px; }
/* Bolsa solidaria interactiva */
.al-ti-bolsa { position: sticky; bottom: 16px; z-index: 15; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 20px; margin-top: 40px; padding: 16px 20px; border-radius: 22px; background: var(--tinta); color: var(--hueso); box-shadow: 0 24px 60px -20px rgba(11,7,16,.68); border: 1px solid rgba(244,239,233,.12); transition: transform .35s cubic-bezier(.2,.8,.2,1), opacity .35s ease; }
.al-ti-bolsa:not(.al-llena) { opacity: .94; }
.al-ti-bolsa-cab { display: flex; align-items: center; gap: 14px; min-width: 240px; flex: 1; }
.al-ti-bolsa-ico { position: relative; flex: none; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: rgba(244,239,233,.1); }
.al-ti-bolsa-ico .al-icono { width: 20px; height: 20px; }
.al-ti-bolsa-ico b { position: absolute; right: -4px; top: -4px; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 99px; background: var(--rojo); color: #fff; font-size: .72rem; line-height: 20px; text-align: center; font-variant-numeric: tabular-nums; }
.al-ti-bolsa:not(.al-llena) .al-ti-bolsa-ico b { background: rgba(244,239,233,.25); }
.al-ti-bolsa-txt { flex: 1; min-width: 0; }
.al-ti-bolsa-txt b { display: block; font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(244,239,233,.6); font-weight: 500; }
.al-ti-bolsa-txt span { display: block; font-size: .88rem; color: rgba(244,239,233,.9); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-top: 2px; }
.al-ti-bolsa-txt span em { font-style: normal; color: #c58af9; font-weight: 500; }
.al-ti-bolsa-items { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; flex: 2; justify-content: flex-start; }
.al-ti-bolsa:not(.al-llena) .al-ti-bolsa-items { display: none; }
.al-ti-bitem { display: inline-flex; align-items: center; gap: 8px; padding: 5px 8px 5px 6px; border-radius: 14px; background: rgba(244,239,233,.08); border: 1px solid rgba(244,239,233,.12); color: #fff; font-size: .78rem; }
.al-ti-bitem img { width: 32px; height: 38px; object-fit: cover; border-radius: 8px; flex: none; }
.al-ti-bitem-t { display: flex; flex-direction: column; line-height: 1.15; max-width: 150px; }
.al-ti-bitem-t b { font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: #fff; }
.al-ti-bitem-t small { font-size: .68rem; color: rgba(244,239,233,.65); }
.al-ti-bitem-q { display: inline-flex; align-items: center; gap: 4px; background: rgba(0,0,0,.28); border-radius: 99px; padding: 2px 5px; }
.al-ti-bitem-q button { width: 18px; height: 18px; border: 0; border-radius: 50%; background: transparent; color: #fff; font: inherit; font-size: .82rem; line-height: 1; cursor: pointer; display: grid; place-items: center; }
.al-ti-bitem-q button:hover { background: rgba(255,255,255,.18); }
.al-ti-bitem-q span { font-size: .74rem; min-width: 12px; text-align: center; font-variant-numeric: tabular-nums; }
.al-ti-bitem-x { width: 20px; height: 20px; border: 0; border-radius: 50%; background: transparent; color: rgba(244,239,233,.55); font-size: .95rem; line-height: 1; cursor: pointer; display: grid; place-items: center; }
.al-ti-bitem-x:hover { background: var(--rojo); color: #fff; }
.al-ti-bolsa-cta { display: flex; align-items: center; gap: 14px; flex: none; }
.al-ti-vaciar { border: 0; background: none; color: rgba(244,239,233,.6); font: inherit; font-size: .8rem; cursor: pointer; text-decoration: underline; }
.al-ti-vaciar:hover { color: #fff; }
.al-ti-bolsa:not(.al-llena) .al-ti-vaciar { display: none; }
.al-ti-bolsa:not(.al-llena) .al-ti-pedir { opacity: .45; pointer-events: none; }
/* Modal de Vista Rápida (Quick View) */
.al-ti-modal { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: clamp(16px, 3vw, 40px); background: rgba(11, 7, 16, .78); backdrop-filter: blur(12px); opacity: 0; pointer-events: none; transition: opacity .3s ease; }
.al-ti-modal.al-abierto { opacity: 1; pointer-events: auto; }
.al-ti-modal-caja { position: relative; width: min(920px, 100%); max-height: 90vh; overflow-y: auto; display: grid; grid-template-columns: 1.05fr 1fr; border-radius: 26px; background: var(--hueso, #f4efe9); color: var(--texto, #2b2525); box-shadow: 0 36px 90px -20px rgba(0,0,0,.7); border: 1px solid rgba(255,255,255,.25); transform: translateY(14px) scale(.98); transition: transform .35s cubic-bezier(.2,.8,.2,1); }
.al-ti-modal.al-abierto .al-ti-modal-caja { transform: none; }
.al-ti-modal-x { position: absolute; right: 16px; top: 16px; z-index: 4; width: 38px; height: 38px; border-radius: 50%; border: 1px solid var(--linea); background: rgba(255,255,255,.85); color: var(--tinta); font-size: 1.35rem; line-height: 1; cursor: pointer; display: grid; place-items: center; transition: background-color .2s ease, color .2s ease; }
.al-ti-modal-x:hover { background: var(--tinta); color: #fff; }
.al-ti-modal-gal { padding: 20px; display: flex; flex-direction: column; gap: 12px; background: #e8e1d8; }
.al-ti-modal-visor { position: relative; aspect-ratio: 4 / 5; border-radius: 18px; overflow: hidden; background: #ded6cc; }
.al-ti-modal-visor img { width: 100%; height: 100%; object-fit: cover; display: block; }
.al-ti-modal-thumbs { display: flex; gap: 10px; justify-content: center; }
.al-ti-mthumb { width: 58px; height: 70px; padding: 0; border-radius: 10px; overflow: hidden; border: 2px solid transparent; opacity: .6; cursor: pointer; transition: opacity .2s ease, border-color .2s ease; background: none; }
.al-ti-mthumb.al-on, .al-ti-mthumb:hover { opacity: 1; border-color: var(--violeta); }
.al-ti-mthumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.al-ti-modal-info { position: relative; padding: clamp(24px, 3.5vw, 40px); display: flex; flex-direction: column; justify-content: center; gap: 12px; overflow: hidden; }
.al-ti-modal-marca { position: absolute; right: -16px; bottom: -16px; width: 170px; height: 170px; fill: var(--tinta); opacity: .05; pointer-events: none; }
.al-ti-modal-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding-right: 36px; }
.al-ti-modal-oficio { font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; padding: 4px 10px; border-radius: 99px; background: rgba(43,37,37,.08); color: var(--texto-2); }
.al-ti-modal-info h3 { margin: 2px 0 0; font-family: var(--display); font-size: clamp(1.5rem, 1.2rem + 1vw, 2.1rem); letter-spacing: -0.025em; color: var(--tinta); }
.al-ti-modal-desc { margin: 0; font-size: 1rem; line-height: 1.5; color: var(--texto); font-weight: 500; }
.al-ti-modal-hist { margin: 0; font-size: .92rem; line-height: 1.6; color: var(--texto-2); padding-top: 8px; border-top: 1px dashed var(--linea); }
.al-ti-modal-vars { margin-top: 4px; }
.al-ti-modal-acc { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 10px; }
.al-ti-modal-envio { margin: auto 0 0; padding-top: 14px; font-size: .78rem; color: var(--texto-2); }
@media (max-width: 1199px) { .al-ti-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 991px) { .al-ti-cab { grid-template-columns: 1fr; } .al-ti-grid { grid-template-columns: 1fr 1fr; } .al-ti--dest { grid-column: 1 / -1; grid-row: auto; } .al-ti--dest .al-ti-foto { min-height: 0; aspect-ratio: 4 / 5; } .al-ti-zoom { opacity: 1; transform: none; } }
@media (max-width: 720px) { .al-ti-modal-caja { grid-template-columns: 1fr; max-height: 92vh; } .al-ti-modal-visor { aspect-ratio: 1 / 1; max-height: 300px; } }
@media (max-width: 600px) { .al-ti-grid { gap: 22px 12px; } .al-ti h3 { font-size: 1rem; } .al-ti-acc { flex-direction: column; align-items: flex-start; gap: 8px; } .al-ti-sumar { font-size: .7rem; padding: 8px 12px; } .al-ti-bolsa { flex-direction: column; align-items: stretch; gap: 12px; padding: 14px 16px; } .al-ti-bolsa-cta { width: 100%; justify-content: space-between; } .al-ti-pedir { flex: 1; justify-content: center; } .al-ti-zoom span { display: none; } }
.al-pl-panel p.al-pl-lab { font-size: .72rem; line-height: 1.4; }

/* =====================================================================
   v34 · modelo, verbos, recetario
   ===================================================================== */
.al-visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
/* cómo cambiamos el sistema: un solo recorrido */
.al-modelo { position: relative; margin-top: 30px; }
.al-modelo-lista { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(18px, 2.4vw, 36px); margin: 0; padding: 0; list-style: none; }
.al-modelo-lista::before { content: ""; position: absolute; left: 6%; right: 6%; top: 32px; height: 2px; background: linear-gradient(90deg, var(--violeta), var(--rojo)); transform-origin: left; transform: scaleX(0); transition: transform 1.6s cubic-bezier(.2,.8,.2,1); }
.al-ver-modelo .al-modelo-lista::before { transform: scaleX(1); }
.al-modelo-p { position: relative; display: flex; flex-direction: column; align-items: flex-start; opacity: 0; transform: translateY(14px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.8,.2,1); transition-delay: calc(var(--i) * .25s + .2s); }
.al-ver-modelo .al-modelo-p { opacity: 1; transform: none; }
.al-modelo-p .al-etapa-icono { position: relative; z-index: 1; display: grid; place-items: center; width: 66px; height: 66px; border-radius: 50%; background: var(--violeta); box-shadow: 0 0 0 8px var(--hueso); }
.al-modelo-p:nth-child(4) .al-etapa-icono { background: var(--rojo); }
.al-modelo-p .al-etapa-icono svg { width: 34px; height: 34px; }
.al-modelo-p .al-etapa-icono .al-picto circle { fill: rgba(255,255,255,.18); } .al-modelo-p .al-etapa-icono .al-picto circle.on { fill: #fff; }
.al-modelo-p .al-etapa-num { margin-top: 22px; font-family: var(--serif); font-style: italic; font-size: 1.3rem; color: var(--violeta); }
.al-modelo-p h3 { margin: 4px 0 10px; font-size: 1.6rem; letter-spacing: -0.02em; }
.al-modelo-p p { margin: 0 0 14px; font-size: .95rem; color: var(--texto-2); }
.al-modelo-p ul { display: flex; flex-wrap: wrap; gap: 6px; margin: auto 0 0; padding: 0; list-style: none; }
.al-modelo-p li { padding: 5px 11px; border-radius: 99px; background: #fff; border: 1px solid var(--linea); font-size: .78rem; }
.al-modelo-vuelta-svg { position: absolute; left: 0; right: 0; bottom: 18px; width: 100%; height: 90px; pointer-events: none; }
.al-modelo-vuelta-svg path { fill: none; stroke: rgba(126,23,190,.35); stroke-width: 1.5; stroke-dasharray: 5 7; vector-effect: non-scaling-stroke; }
.al-modelo-vuelta { position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; margin: 70px 0 0; font-family: var(--serif); font-style: italic; font-size: 1.15rem; color: var(--violeta); text-align: center; }
.al-modelo-vuelta span { font-style: normal; font-size: 1.3rem; }
@media (max-width: 991px) {
  .al-modelo-lista { grid-template-columns: 1fr; gap: 30px; padding-left: 0; }
  .al-modelo-lista::before { left: 32px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; background: linear-gradient(180deg, var(--violeta), var(--rojo)); transform: scaleY(0); transform-origin: top; }
  .al-ver-modelo .al-modelo-lista::before { transform: scaleY(1); }
  .al-modelo-p { padding-left: 90px; } .al-modelo-p .al-etapa-icono { position: absolute; left: 0; top: 0; }
  .al-modelo-p .al-etapa-num { margin-top: 0; }
  .al-modelo-vuelta-svg { display: none; } .al-modelo-vuelta { margin-top: 30px; justify-content: flex-start; text-align: left; }
}
/* lo que hacemos, en verbos */
.al-vb-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
.al-vb-lista { margin: 0; padding: 0; list-style: none; }
.al-vb-v { display: flex; align-items: baseline; gap: 16px; width: 100%; padding: 12px 0; border: 0; border-bottom: 1px solid var(--linea); background: none; font-family: var(--display); font-size: clamp(1.7rem, 1.1rem + 1.8vw, 2.8rem); letter-spacing: -0.03em; color: rgba(43,37,37,.32); text-align: left; cursor: pointer; transition: color .4s ease, padding .5s cubic-bezier(.2,.8,.2,1); }
.al-vb-v span { font-family: var(--texto-f); font-size: .72rem; letter-spacing: .14em; color: var(--texto-3); }
.al-vb-v:hover { color: rgba(43,37,37,.6); }
.al-vb-v.al-on { color: var(--texto); padding-left: 10px; font-family: var(--serif); font-style: italic; }
.al-vb-v.al-on span { color: var(--violeta); }
.al-vb-escena { position: relative; min-height: clamp(380px, 46vw, 560px); }
.al-vb-panel { position: absolute; inset: 0; display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 22px; opacity: 0; visibility: hidden; transition: opacity .6s ease, visibility 0s linear .6s; }
.al-vb-panel.al-on { opacity: 1; visibility: visible; transition: opacity .6s ease; }
.al-vb-fotos { position: relative; cursor: pointer; }
.al-vb-f { position: absolute; left: 50%; top: 50%; width: min(78%, 520px); margin: 0; padding: 10px 10px 40px; background: #fff; box-shadow: 0 26px 50px -24px rgba(43,37,37,.45); transform: translate(calc(-50% + var(--x)), -50%) rotate(var(--r)) scale(.96); z-index: var(--z); transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.al-vb-panel.al-on .al-vb-f { transform: translate(calc(-50% + var(--x)), -50%) rotate(var(--r)); }
.al-vb-f:last-child { z-index: 9; }
.al-vb-f img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.al-vb-f figcaption { position: absolute; left: 12px; right: 12px; bottom: 10px; font-family: var(--serif); font-style: italic; font-size: .9rem; color: var(--texto-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.al-vb-txt { margin: 0; max-width: 46ch; font-size: 1.05rem; line-height: 1.55; color: var(--texto); }
.al-vb-barra { position: absolute; left: 0; right: 0; bottom: -18px; height: 2px; background: var(--linea); overflow: hidden; }
.al-vb-barra i { display: block; height: 100%; background: var(--violeta); transform-origin: left; transform: scaleX(0); }
@media (max-width: 991px) { .al-vb-grid { grid-template-columns: 1fr; } .al-vb-lista { display: flex; flex-wrap: wrap; gap: 4px 14px; } .al-vb-lista li { flex: none; } .al-vb-v { border: 0; padding: 4px 0; font-size: 1.35rem; } .al-vb-v span { display: none; } .al-vb-escena { min-height: 460px; } .al-vb-f { width: 86%; } }
/* recetario */
.al-rc-ctrl { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 10px 0 14px; }
.al-rc-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.al-rc-chip { padding: 9px 16px; border: 1px solid var(--linea); border-radius: 99px; background: transparent; font: inherit; font-size: .86rem; color: var(--texto); cursor: pointer; }
.al-rc-chip.al-on { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.al-rc-buscar { flex: 1 1 260px; }
.al-rc-buscar input { width: 100%; padding: 12px 18px; border-radius: 99px; border: 1px solid var(--linea); background: #fff; font: inherit; font-size: .95rem; }
.al-rc-buscar input:focus { outline: none; border-color: var(--violeta); box-shadow: 0 0 0 3px rgba(126,23,190,.12); }
.al-rc-cuenta { margin: 0 0 18px; font-size: .85rem; color: var(--texto-2); }
.al-rc-carta { padding: clamp(24px, 3vw, 40px); border-radius: 24px; background: #fff; border: 1px solid var(--linea); box-shadow: 0 30px 60px -40px rgba(43,37,37,.4); }
.al-entra-rc { animation: alRc .6s cubic-bezier(.2,.8,.2,1); }
@keyframes alRc { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.al-rc-k { font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--violeta); }
.al-rc-carta h3, .al-rc-mini h3 { margin: 8px 0 10px; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(1.7rem, 1.2rem + 1.5vw, 2.6rem); line-height: 1.1; }
.al-rc-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0 0 22px; font-size: .9rem; color: var(--texto-2); } .al-rc-meta b { color: var(--texto); font-weight: 500; margin-right: 4px; }
.al-rc-cols { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(20px, 4vw, 56px); }
.al-rc-cols h4 { margin: 0 0 12px; font-size: .75rem; letter-spacing: .16em; text-transform: uppercase; color: var(--texto-3); }
.al-rc-ing { margin: 0; padding: 0; list-style: none; } .al-rc-ing li { padding: 7px 0 7px 22px; border-bottom: 1px dashed var(--linea); font-size: .93rem; position: relative; }
.al-rc-ing li::before { content: ""; position: absolute; left: 4px; top: 15px; width: 7px; height: 7px; border-radius: 50%; background: var(--violeta); }
.al-rc-prep { margin: 0; padding: 0; list-style: none; counter-reset: rp; } .al-rc-prep li { counter-increment: rp; position: relative; padding: 0 0 14px 40px; font-size: .95rem; line-height: 1.55; }
.al-rc-prep li::before { content: counter(rp); position: absolute; left: 0; top: -2px; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--tinta); color: #fff; font-size: .75rem; }
.al-rc-acc { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
.al-rc-copiar, .al-rc-wa { padding: 9px 16px; border-radius: 99px; border: 1px solid var(--tinta); background: transparent; color: var(--tinta); font: inherit; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; cursor: pointer; }
.al-rc-copiar:hover, .al-rc-wa:hover { background: var(--tinta); color: #fff; }
.al-rc-cal { display: grid; gap: 18px; }
.al-rc-semana p { margin: 0 0 8px; font-size: .72rem; letter-spacing: .16em; text-transform: uppercase; color: var(--texto-3); }
.al-rc-dias { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.al-rc-dia { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; min-height: 120px; padding: 12px; border-radius: 16px; border: 1px solid var(--linea); background: #fff; text-align: left; font: inherit; color: var(--texto); cursor: pointer; transition: transform .3s ease, border-color .3s ease, background-color .3s ease; }
.al-rc-dia:hover { transform: translateY(-3px); border-color: var(--violeta); }
.al-rc-dia.al-on { background: var(--tinta); border-color: var(--tinta); color: #fff; }
.al-rc-dn { font-size: .68rem; letter-spacing: .14em; text-transform: uppercase; color: var(--texto-3); } .al-rc-dia.al-on .al-rc-dn { color: rgba(244,239,233,.6); }
.al-rc-dia b { font-family: var(--display); font-weight: 500; font-size: 1.5rem; line-height: 1; }
.al-rc-dt { font-size: .74rem; line-height: 1.3; color: var(--texto-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .al-rc-dia.al-on .al-rc-dt { color: rgba(244,239,233,.8); }
.al-rc-dia i { display: flex; gap: 3px; margin-top: auto; } .al-rc-dia i em { width: 6px; height: 6px; border-radius: 50%; background: var(--violeta); } .al-rc-dia i em:nth-child(2) { background: var(--rojo); } .al-rc-dia i em:nth-child(3) { background: #ff9a76; } .al-rc-dia i em:nth-child(4) { background: #9C3733; }
.al-rc-dia-cartas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 22px; }
.al-rc-mini { padding: 20px; border-radius: 18px; background: #fff; border: 1px solid var(--linea); }
.al-rc-mini h3 { font-size: 1.3rem; } .al-rc-mini .al-rc-meta { margin-bottom: 10px; font-size: .8rem; }
.al-rc-mas summary { cursor: pointer; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--violeta); }
.al-rc-mas[open] .al-rc-cols { grid-template-columns: 1fr; margin-top: 12px; }
.al-rc-cta { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 24px; }
.al-rc-cta p { color: rgba(244,239,233,.75); max-width: 56ch; }
@media (max-width: 991px) { .al-rc-cols { grid-template-columns: 1fr; } .al-rc-dias { grid-template-columns: repeat(4, minmax(0, 1fr)); } .al-rc-dia-cartas { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .al-rc-dias { grid-template-columns: repeat(3, minmax(0, 1fr)); } .al-rc-dia { min-height: 92px; } .al-rc-dt { display: none; } .al-rc-dia-cartas { grid-template-columns: 1fr; } }
.al-rc-dt { margin-bottom: 10px; }
@media (min-width: 992px) { .al-modelo-lista::before { left: 33px; right: calc(25% - 33px); } }

/* v34 · listas y enlaces en los artículos reescritos */
.al-art-sec ul{margin:.4em 0 1.3em;padding-left:1.35em;list-style:none}
.al-art-sec ul li{position:relative;margin:.55em 0;padding-left:.2em;line-height:1.65}
.al-art-sec ul li::before{content:"";position:absolute;left:-1.05em;top:.68em;width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,#8A00C6,#D3114B 60%,#F61D05)}
.al-art-sec p a,.al-art-sec li a{color:#7E17BE;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.al-art-sec p a:hover,.al-art-sec li a:hover{color:#E93B24}
/* v34 · siluetas temáticas en las tarjetas del blog */
.al-bb-animal [data-trazo]{fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round}
.al-bb-animal [data-trazo="13"]{stroke-width:13}.al-bb-animal [data-trazo="5"]{stroke-width:5}.al-bb-animal [data-trazo="4"]{stroke-width:4}

/* v34 · portadas de proyecto provisorias: un color por proyecto y su nombre */
[data-p="tras-la-carne"] { --pc1: #9C3733; --pc2: #3a1414; }
[data-p="bajo-las-jaulas"] { --pc1: #1f4f7a; --pc2: #0d1b2e; }
[data-p="choose-cruelty"] { --pc1: #E93B24; --pc2: #7E17BE; }
[data-p="vistete-sin-animales"] { --pc1: #A105A0; --pc2: #2B2525; }
[data-p="cursos-veganos"] { --pc1: #7E17BE; --pc2: #D3114B; }
[data-p="vegalendario"] { --pc1: #F61D05; --pc2: #BD0C6F; }
[data-p="no-es-deporte"] { --pc1: #D3114B; --pc2: #9C3733; }
[data-p="mi-menu-vegano"] { --pc1: #8A00C6; --pc2: #F21727; }
[data-p="galgos"] { --pc1: #4a2fa0; --pc2: #7E17BE; }
.al-nv-foto--tipo[data-p], .al-ciclo-foto--tipo[data-p], .al-pp-foto--tipo[data-p], .al-acc-foto--tipo[data-p] {
  background: radial-gradient(90% 80% at 15% 10%, var(--pc1), transparent 72%), radial-gradient(85% 75% at 95% 100%, var(--pc2), transparent 72%), linear-gradient(160deg, #1a0f22, #0b0710) !important; }
.al-acc-foto--tipo { position: absolute; inset: 0; }
.al-ciclo-foto--tipo[data-p] span { color: rgba(255, 255, 255, .9); font-size: clamp(1.8rem, 3vw, 2.6rem); transform: none; text-align: center; padding: 0 18px; line-height: 1.05; }
.al-nv-foto--tipo[data-p] { font-size: .95rem; padding: 10px; }
.al-pp-resp-grid--solo { grid-template-columns: 1fr !important; max-width: 760px; }

/* v35 · verbos: las fotos completas, en mosaico, sin recortes ni clics */
.al-vb-escena { display: grid; min-height: 0; }
.al-vb-panel { position: relative; inset: auto; grid-area: 1 / 1; grid-template-rows: auto auto; align-content: start; }
.al-vb-mosaico { display: flex; justify-content: center; }
.al-vb-m-raiz { width: 100%; max-width: min(100%, calc(var(--ar) * 64vh)); }
.al-vb-m-h { display: flex; gap: 10px; align-items: flex-start; }
.al-vb-m-h > * { flex: var(--ar) 1 0; min-width: 0; }
.al-vb-m-v { display: flex; flex-direction: column; gap: 10px; }
.al-vb-m { position: relative; margin: 0; border-radius: 14px; overflow: hidden; background: var(--linea); transform: translateY(14px); opacity: 0; transition: transform .8s cubic-bezier(.2,.8,.2,1), opacity .6s ease; }
.al-vb-panel.al-on .al-vb-m { transform: none; opacity: 1; }
.al-vb-panel.al-on .al-vb-m:nth-of-type(2), .al-vb-panel.al-on .al-vb-m-h > :nth-child(2) .al-vb-m, .al-vb-panel.al-on .al-vb-m-v > :nth-child(2) { transition-delay: .08s; }
.al-vb-m img { display: block; width: 100%; height: auto; aspect-ratio: var(--ar); }
.al-vb-m figcaption { position: absolute; left: 10px; bottom: 10px; max-width: calc(100% - 20px); padding: 5px 10px; border-radius: 99px; background: rgba(20,14,22,.62); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); color: #fff; font-size: .74rem; line-height: 1.3; }
@media (max-width: 700px) { .al-vb-m figcaption { font-size: .68rem; left: 6px; bottom: 6px; } .al-vb-m-h, .al-vb-m-v { gap: 6px; } .al-vb-m { border-radius: 10px; } }
@media (prefers-reduced-motion: reduce) { .al-vb-m { transform: none; opacity: 1; transition: none; } }

/* v35 · fichas del cuaderno, narradas */
.al-cu-relato { display: grid; gap: 16px; padding-top: 22px; border-top: 1px solid rgba(244,239,233,.1); }
.al-cu-relato p { margin: 0; font-size: 1.02rem; line-height: 1.65; color: rgba(244,239,233,.8); }
.al-cu-relato p:first-child { font-size: 1.2rem; line-height: 1.5; color: #fff; }
.al-cu-relato p.al-cu-giro { padding-left: 16px; border-left: 2px solid #f05c40; color: #fff; }
.al-cu-cierre { margin: 28px 0 0; font-family: var(--serif); font-style: italic; font-weight: 400; font-size: clamp(1.5rem, 1.15rem + 1.1vw, 2.1rem); line-height: 1.2; color: #fff; text-wrap: balance; }
.al-cu-ficha.al-cu-entra > *:nth-child(6) { animation-delay: .3s; }
/* v35 · el cuaderno no se desborda en pantallas angostas */
.al-cu-cuerpo > * { min-width: 0; }
.al-cu-cuerpo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
@media (max-width: 991px) { .al-cu-cuerpo { grid-template-columns: minmax(0, 1fr); } }
.al-cuaderno { grid-template-columns: minmax(0, 1fr); } .al-cuaderno > * { min-width: 0; }
.al-fin-desc { margin: 0; font-size: .92rem; line-height: 1.55; color: var(--texto-2); }
/* v36 · portada fotográfica de cada artículo y página de créditos */
.al-art-foto { margin: clamp(-60px, -4vw, -28px) auto 0; position: relative; z-index: 2; }
.al-art-foto-m { border-radius: 22px; overflow: hidden; aspect-ratio: 16 / 7; max-width: 100%; background: var(--linea); box-shadow: 0 30px 60px -36px rgba(20, 10, 30, .5); }
.al-art-foto-m img { width: 100%; height: 100%; object-fit: cover; display: block; }
.al-art-foto figcaption { margin-top: 10px; font-size: .74rem; line-height: 1.4; color: var(--texto-3); }
.al-art-foto figcaption a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
@media (max-width: 700px) { .al-art-foto-m { aspect-ratio: 4 / 3; border-radius: 16px; } }
.al-cr .al-titulo-l { margin: 10px 0 18px; }
.al-cr-lista { list-style: none; margin: 0 0 48px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 14px 28px; }
.al-cr-lista li { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 14px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--linea); }
.al-cr-img img { width: 96px; height: 64px; object-fit: cover; border-radius: 8px; display: block; }
.al-cr-lista b { display: block; font-size: .92rem; line-height: 1.3; }
.al-cr-autor { margin: 4px 0 0; font-size: .8rem; color: var(--texto-2); }
.al-cr-lic { margin: 2px 0 0; font-size: .76rem; } .al-cr-lic a { color: var(--violeta); }
/* v37 · inicio más claro: portada sin rótulo, a dónde ir y quiénes somos */
.al-portada--clara .al-protagonista { display: none; }
.al-rutas { padding-block: clamp(36px, 5vw, 64px); background: var(--papel, #fbf9f6); border-bottom: 1px solid var(--linea); }
.al-rutas-t { margin: 0 0 18px; font-family: var(--display); font-weight: 500; font-size: clamp(1.3rem, 1rem + 1vw, 1.8rem); letter-spacing: -.01em; }
.al-rutas-l { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.al-rutas-l a { position: relative; display: grid; gap: 6px; height: 100%; padding: 18px 40px 18px 18px; border: 1px solid var(--linea); border-radius: 16px; background: #fff; color: var(--texto); text-decoration: none; transition: border-color .25s, transform .25s, box-shadow .25s; }
.al-rutas-l a:hover, .al-rutas-l a:focus-visible { border-color: var(--violeta); transform: translateY(-2px); box-shadow: 0 14px 30px -20px rgba(126, 23, 190, .45); }
.al-rutas-l b { font-weight: 600; font-size: .98rem; line-height: 1.25; }
.al-rutas-l span { font-size: .84rem; line-height: 1.45; color: var(--texto-2); }
.al-rutas-l i { position: absolute; right: 16px; top: 18px; font-style: normal; color: var(--violeta); }
@media (max-width: 1100px) { .al-rutas-l { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .al-rutas-l { grid-template-columns: minmax(0, 1fr); } .al-rutas-l a { padding: 14px 40px 14px 16px; } }
.al-qs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px 32px; margin-top: 34px; padding-top: 26px; border-top: 1px solid var(--linea); }
.al-qs-col h3 { margin: 0 0 8px; font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; font-weight: 600; color: var(--violeta); }
.al-qs-col p { margin: 0; font-size: 1rem; line-height: 1.55; color: var(--texto); }
.al-qs-etapas { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.al-qs-etapas li { display: grid; grid-template-columns: 26px minmax(0, 1fr); column-gap: 6px; }
.al-qs-etapas span { grid-row: span 2; font-size: .7rem; color: var(--texto-3); padding-top: 3px; }
.al-qs-etapas b { font-size: .95rem; }
.al-qs-etapas small { font-size: .82rem; color: var(--texto-2); line-height: 1.4; }
.al-qs-link { margin-top: 26px; }
@media (max-width: 900px) { .al-qs { grid-template-columns: minmax(0, 1fr); } }
/* v39 · crédito en galerías de proyecto */
.al-pp-gal-cr { display: block; margin-top: 4px; font-size: .72rem; opacity: .7; }
.al-pp-gal-cr a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.al-pp-gal--4 .al-pp-gal-f { grid-column: span 3; }
@media (max-width: 900px) { .al-pp-gal--4 .al-pp-gal-f { grid-column: span 6; } }
@media (max-width: 520px) { .al-pp-gal--4 .al-pp-gal-f { grid-column: 1 / -1; } }
/* v39 / v40 · contador: la salida aparece sutil y elegante */
.al-contador { position: relative; overflow: hidden; transition: padding .8s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .8s ease; }
.al-contador-n { transition: filter .7s cubic-bezier(0.16, 1, 0.3, 1), opacity .7s ease; }
.al-contador.al-con-sale .al-contador-n { filter: blur(2px); opacity: .42; }

.al-con-salida {
  flex: 1 1 100%;
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows 1.1s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: grid-template-rows, opacity;
}
.al-contador.al-con-abierto .al-con-salida {
  grid-template-rows: 1fr;
  opacity: 1;
}

.al-con-salida-in {
  min-height: 0;
  overflow: hidden;
  padding: 0;
  margin: 0;
}

.al-con-salida-inner {
  position: relative;
  padding-top: clamp(18px, 2.2vw, 26px);
  margin-top: clamp(14px, 1.6vw, 20px);
}

.al-con-salida-inner::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, rgba(243,243,243,.18) 18%, rgba(243,243,243,.18) 82%, transparent 100%);
  opacity: 0;
  transition: opacity .8s ease .15s;
}
.al-contador.al-con-abierto .al-con-salida-inner::before {
  opacity: 1;
}

/* Revelado sutil, unificado y escalonado */
.al-con-salida-inner > *,
.al-con-salida-in > * {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .7s cubic-bezier(0.16, 1, 0.3, 1), transform .7s cubic-bezier(0.16, 1, 0.3, 1);
}
.al-con-abierto .al-con-salida-inner > *,
.al-con-abierto .al-con-salida-in > * {
  opacity: 1;
  transform: none;
}
.al-con-abierto .al-con-salida-inner > :nth-child(1),
.al-con-abierto .al-con-salida-in > :nth-child(1) { transition-delay: .14s; }
.al-con-abierto .al-con-salida-inner > :nth-child(2),
.al-con-abierto .al-con-salida-in > :nth-child(2) { transition-delay: .24s; }
.al-con-abierto .al-con-salida-inner > :nth-child(3),
.al-con-abierto .al-con-salida-in > :nth-child(3) { transition-delay: .34s; }
.al-con-abierto .al-con-salida-inner > :nth-child(4),
.al-con-abierto .al-con-salida-in > :nth-child(4) { transition-delay: .42s; }

.al-con-k {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 10px !important;
  font-size: .8rem !important;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(243,243,243,.72) !important;
}
.al-con-k i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #E93B24;
  box-shadow: 0 0 0 0 rgba(233,59,36,.55);
  animation: al-con-pulso 2.4s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
@keyframes al-con-pulso {
  0% { box-shadow: 0 0 0 0 rgba(233,59,36,.55); }
  65% { box-shadow: 0 0 0 9px rgba(233,59,36,0); }
  100% { box-shadow: 0 0 0 0 rgba(233,59,36,0); }
}

.al-con-t {
  margin: 0 !important;
  font-family: var(--display);
  font-size: clamp(1.4rem, 1.1rem + 1.4vw, 2.2rem) !important;
  line-height: 1.16 !important;
  letter-spacing: -0.02em;
  color: #F3F3F3 !important;
}
.al-con-t em {
  font-family: "Instrument Serif", serif;
  font-style: italic;
  font-weight: 400;
  background: linear-gradient(90deg, #D49CFB, #FA7968);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  padding-right: .08em;
}

.al-con-acc {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 26px;
  margin-top: 20px;
}
.al-con-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 14px 26px;
  border-radius: 999px;
  background: linear-gradient(100deg, #7E17BE 0%, #B65CF0 55%, #E93B24 100%);
  background-size: 180% auto;
  color: #fff !important;
  font-weight: 600;
  font-size: .95rem;
  text-decoration: none;
  box-shadow: 0 8px 24px -6px rgba(126,23,190,.42), 0 2px 6px -2px rgba(233,59,36,.25);
  transition: transform .35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow .35s ease, background-position .6s ease;
}
.al-con-btn:hover,
.al-con-btn:focus-visible {
  background-position: right center;
  transform: translateY(-2px);
  box-shadow: 0 14px 32px -8px rgba(126,23,190,.55), 0 4px 10px -2px rgba(233,59,36,.35);
}
.al-con-btn .al-icono {
  width: 16px;
  height: 16px;
  transition: transform .3s ease;
}
.al-con-btn:hover .al-icono {
  transform: translateX(4px);
}

.al-con-sec {
  color: rgba(243,243,243,.75) !important;
  text-decoration: none;
  border-bottom: 1px solid rgba(243,243,243,.3);
  padding-bottom: 2px;
  font-size: .95rem;
  transition: color .3s ease, border-color .3s ease;
}
.al-con-sec:hover {
  color: #fff !important;
  border-color: #fff;
}

.al-con-nota {
  margin: 14px 0 2px !important;
  font-size: .82rem !important;
  color: rgba(243,243,243,.72) !important;
  letter-spacing: .01em;
}

@media (max-width: 560px) {
  .al-con-btn { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .al-con-salida,
  .al-con-salida-inner > *,
  .al-con-salida-in > *,
  .al-contador-n {
    transition: none !important;
  }
  .al-con-k i {
    animation: none;
  }
}
/* v39 · Programa formativo interdisciplinar */
.al-pfi { --pfi-i: 0; }
.al-pfi-cab { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(24px, 4vw, 70px); align-items: end; }
.al-pfi-cab .al-lead { margin: 0; }
.al-pfi-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(20px, 3vw, 40px); margin-top: clamp(40px, 5vw, 70px); align-items: start; }
.al-pfi-ficha { position: sticky; top: 110px; padding: clamp(22px, 2.6vw, 34px); border-radius: 22px; background: rgba(243,243,243,.05); border: 1px solid rgba(243,243,243,.12); }
.al-pfi-ficha-k, .al-pfi-plan-k { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(243,243,243,.6); }
.al-pfi-ficha-k i { width: 22px; height: 2px; background: linear-gradient(90deg, #7E17BE, #E93B24); }
.al-pfi-ficha dl { margin: 0; }
.al-pfi-ficha dl > div { display: grid; grid-template-columns: 9.5em 1fr; gap: 12px; padding: 13px 0; border-top: 1px dashed rgba(243,243,243,.16); }
.al-pfi-ficha dt { font-size: .82rem; color: rgba(243,243,243,.72); }
.al-pfi-ficha dd { margin: 0; color: #F3F3F3; font-size: .98rem; line-height: 1.4; }
.al-pfi-acc { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: 24px; }
.al-pfi-pdf { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: 0; background: none; color: rgba(243,243,243,.75); font: inherit; font-size: .88rem; cursor: pointer; text-decoration: underline; text-underline-offset: 4px; }
.al-pfi-pdf svg { width: 16px; height: 16px; }
.al-pfi-pdf:hover { color: #fff; }
.al-pfi-plan { padding: clamp(22px, 2.6vw, 34px); border-radius: 22px; background: #F3F3F3; color: #2B2525; }
.al-pfi-plan-k { color: #7E17BE; }
.al-pfi-plan-p { margin: -8px 0 18px; font-size: .9rem; color: rgba(43,37,37,.65); }
.al-pfi-barra { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
.al-pfi-tramo { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: 14px 14px 16px; border: 0; border-radius: 14px; background: rgba(43,37,37,.06); color: #2B2525; font: inherit; text-align: left; cursor: pointer; overflow: hidden; transition: background .4s ease, color .4s ease, transform .3s ease; }
.al-pfi-tramo::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: linear-gradient(90deg, #7E17BE, #E93B24); transform: scaleX(0); transform-origin: left; transition: transform .6s cubic-bezier(.2,.8,.2,1); }
.al-pfi-tramo:hover { transform: translateY(-2px); }
.al-pfi-tramo[aria-selected="true"] { background: #2B2525; color: #F3F3F3; }
.al-pfi-tramo[aria-selected="true"]::after { transform: scaleX(1); }
.al-pfi-tramo b { font-family: var(--display); font-weight: 500; font-size: 1.9rem; line-height: 1; letter-spacing: -0.03em; }
.al-pfi-tramo-h { font-size: .72rem; letter-spacing: .06em; opacity: .65; }
.al-pfi-tramo-n { font-size: .86rem; line-height: 1.25; }
.al-pfi-mods { margin-top: 22px; min-height: 250px; }
.al-pfi-mod { animation: al-pfi-in .55s cubic-bezier(.2,.8,.2,1); }
@keyframes al-pfi-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.al-pfi-mod-k { margin: 0 0 6px; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: #9C3733; }
.al-pfi-mod h3 { margin: 0 0 12px; font-family: var(--display); font-weight: 500; font-size: clamp(1.5rem, 1.1rem + 1.2vw, 2.1rem); letter-spacing: -0.02em; line-height: 1.1; color: #2B2525; }
.al-pfi-doc { display: inline-flex; align-items: baseline; gap: 10px; margin: 0 0 16px; padding: 7px 14px; border-radius: 999px; background: rgba(126,23,190,.08); font-family: "Instrument Serif", serif; font-style: italic; font-size: 1.12rem; color: #7E17BE; }
.al-pfi-doc span { font-family: var(--cuerpo, inherit); font-style: normal; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(43,37,37,.55); }
.al-pfi-mod ul { margin: 0; padding: 0; list-style: none; }
.al-pfi-mod li { position: relative; padding: 11px 0 11px 26px; border-top: 1px solid rgba(43,37,37,.1); font-size: 1rem; line-height: 1.45; color: #2B2525; }
.al-pfi-mod li::before { content: ""; position: absolute; left: 4px; top: 19px; width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(135deg, #7E17BE, #E93B24); }
.al-pfi-uni { margin-top: clamp(56px, 7vw, 100px); }
.al-pfi-uni-t { margin: 0 0 26px; font-family: "Instrument Serif", serif; font-style: italic; font-weight: 400; font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.6rem); color: #F3F3F3; }
.al-pfi-uni-l { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.al-pfi-uni-l li { display: flex; flex-direction: column; padding: 22px; border-radius: 18px; border: 1px solid rgba(243,243,243,.12); background: rgba(243,243,243,.03); }
.al-pfi-uni-n { font-size: .78rem; color: #E93B24; letter-spacing: .08em; }
.al-pfi-uni-l h3 { margin: 10px 0 8px; font-family: var(--display); font-weight: 500; font-size: 1.18rem; line-height: 1.2; color: #F3F3F3; }
.al-pfi-uni-l p { margin: 0; font-size: .92rem; line-height: 1.5; color: rgba(243,243,243,.72); }
.al-pfi-uni-a { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 14px; font-size: .85rem; color: #F3F3F3 !important; text-decoration: underline; text-underline-offset: 4px; }
.al-pfi-uni-a .al-icono { width: 14px; height: 14px; }
.al-pfi-comp { margin-top: clamp(28px, 3vw, 44px); border-top: 1px solid rgba(243,243,243,.14); border-bottom: 1px solid rgba(243,243,243,.14); }
.al-pfi-comp summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 0; cursor: pointer; list-style: none; font-family: var(--display); font-size: clamp(1.15rem, 1rem + .6vw, 1.5rem); color: #F3F3F3; }
.al-pfi-comp summary::-webkit-details-marker { display: none; }
.al-pfi-comp summary i { position: relative; flex: 0 0 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(243,243,243,.3); transition: transform .4s ease, background .4s ease; }
.al-pfi-comp summary i::before, .al-pfi-comp summary i::after { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 1.6px; background: currentColor; transform: translate(-50%, -50%); }
.al-pfi-comp summary i::after { transform: translate(-50%, -50%) rotate(90deg); transition: transform .4s ease; }
.al-pfi-comp[open] summary i { background: linear-gradient(135deg, #7E17BE, #E93B24); border-color: transparent; }
.al-pfi-comp[open] summary i::after { transform: translate(-50%, -50%) rotate(0); }
.al-pfi-comp-in { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 44px); padding: 4px 0 30px; }
.al-pfi-comp-b h4 { margin: 0 0 10px; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(243,243,243,.72); font-weight: 500; }
.al-pfi-comp-b p, .al-pfi-comp-b li { font-size: .98rem; line-height: 1.55; color: rgba(243,243,243,.85); }
.al-pfi-comp-b ul, .al-pfi-comp-b ol { margin: 0; padding-left: 1.2em; }
.al-pfi-comp-b li { margin-bottom: 8px; }
.al-pfi-pie { grid-column: 1 / -1; margin: 0; font-size: .8rem; color: rgba(243,243,243,.72); }
.al-pfi-pie a { color: inherit; }
@media (max-width: 1100px) { .al-pfi-uni-l { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) { .al-pfi-cab, .al-pfi-grid, .al-pfi-comp-in { grid-template-columns: 1fr; } .al-pfi-ficha { position: static; } }
@media (max-width: 560px) { .al-pfi-uni-l { grid-template-columns: 1fr; } .al-pfi-ficha dl > div { grid-template-columns: 1fr; gap: 2px; } .al-pfi-barra { gap: 4px; } .al-pfi-tramo { padding: 12px 10px 14px; } .al-pfi-tramo b { font-size: 1.5rem; } .al-pfi-tramo-n { font-size: .76rem; } }
/* ficha imprimible: solo el programa, en claro */
@media print {
  .al-imprime-pfi body * { visibility: hidden !important; }
  .al-imprime-pfi .al-pfi, .al-imprime-pfi .al-pfi * { visibility: visible !important; }
  .al-imprime-pfi .al-pfi { position: absolute; left: 0; top: 0; width: 100%; background: #fff !important; color: #2B2525 !important; padding: 0 !important; }
  .al-imprime-pfi .al-pfi * { color: #2B2525 !important; -webkit-text-fill-color: #2B2525 !important; box-shadow: none !important; animation: none !important; opacity: 1 !important; transform: none !important; }
  .al-imprime-pfi .al-pfi-mod[hidden] { display: block !important; }
  .al-imprime-pfi .al-pfi-mod { margin-bottom: 14px; break-inside: avoid; }
  .al-imprime-pfi .al-pfi-barra, .al-imprime-pfi .al-pfi-plan-p, .al-imprime-pfi .al-pfi-acc, .al-imprime-pfi .al-pfi-comp summary i, .al-imprime-pfi .al-pfi-uni-a { display: none !important; }
  .al-imprime-pfi .al-pfi-ficha { position: static; border: 1px solid #ccc; background: none; }
  .al-imprime-pfi .al-pfi-plan, .al-imprime-pfi .al-pfi-uni-l li { background: none !important; border: 1px solid #ddd; }
  .al-imprime-pfi .al-pfi-grid, .al-imprime-pfi .al-pfi-cab { grid-template-columns: 1fr; }
  .al-imprime-pfi .al-pfi-uni-l { grid-template-columns: repeat(2, 1fr); }
  .al-imprime-pfi .al-pfi-comp-in { grid-template-columns: 1fr; }
}
/* v39 · la tarjeta clara dentro de la sección oscura: colores propios */
.al-oscura .al-pfi-plan p.al-pfi-plan-k { color: #7E17BE !important; }
.al-oscura .al-pfi-plan p.al-pfi-plan-p { color: rgba(43,37,37,.65) !important; }
.al-oscura .al-pfi-plan p.al-pfi-mod-k { color: #9C3733 !important; }
.al-oscura .al-pfi-plan p.al-pfi-doc { color: #7E17BE !important; }
.al-oscura .al-pfi-plan p.al-pfi-doc span { color: rgba(43,37,37,.6) !important; }
.al-oscura .al-pfi-plan h3, .al-oscura .al-pfi-plan li { color: #2B2525 !important; }
.al-pfi-doc span { font-family: "Outfit", system-ui, sans-serif !important; }
/* v40 · Bajo las jaulas (inmersión) y fichas de documentales */
.al-bj { --prof: 0; position: relative; background: linear-gradient(180deg, #2B2525 0%, #1d1717 30%, #120d0d 70%, #080606 100%); color: #F3F3F3; }
.al-bj-sec { position: relative; padding: clamp(80px, 11vw, 160px) 0; }
.al-bj .al-kicker { color: rgba(243,243,243,.6); }
.al-bj h2, .al-bj h3 { color: #F3F3F3; }
.al-bj h2 em, .al-bj h1 em { font-family: "Instrument Serif", serif; font-style: italic; font-weight: 400; background: linear-gradient(90deg, #B65CF0, #E93B24); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .08em; }
.al-bj-sup { min-height: 100vh; display: flex; align-items: center; overflow: hidden; padding-top: 140px; position: relative; }
.al-bj-hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: hidden; z-index: 0; pointer-events: none; }
.al-bj-hero-bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; opacity: .32; filter: contrast(1.15) brightness(.72) saturate(.85); transform: scale(1.05); }
.al-bj-jaula-cv { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; }
.al-bj-hero-velo { position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, rgba(11,8,8,.95) 0%, rgba(11,8,8,.84) 42%, rgba(11,8,8,.32) 72%, rgba(11,8,8,.62) 100%); pointer-events: none; }
.al-bj-hero { position: relative; z-index: 3; max-width: 1400px; }
.al-bj-h1 { font-family: var(--display); font-weight: 500; font-size: clamp(3.2rem, 1.8rem + 7vw, 8.5rem); line-height: .92; letter-spacing: -0.045em; margin: 14px 0 18px; color: #F3F3F3; }
.al-bj-lema { font-family: "Instrument Serif", serif; font-style: italic; font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.6rem); color: #F3F3F3; margin: 0 0 18px; }
.al-bj-bajada { max-width: 34rem; font-size: 1.08rem; line-height: 1.6; color: rgba(243,243,243,.8) !important; }
.al-bj-hash { margin-top: 16px; font-weight: 600; letter-spacing: .04em; color: #E93B24 !important; }
.al-bj-baja { position: absolute; left: 50%; bottom: 28px; transform: translateX(-50%); z-index: 4; display: flex; flex-direction: column; align-items: center; gap: 10px; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(243,243,243,.7) !important; text-decoration: none; }
.al-bj-baja i { width: 1px; height: 46px; background: linear-gradient(#F3F3F3, transparent); animation: al-bj-baja 2s ease-in-out infinite; }
@keyframes al-bj-baja { 0% { transform: scaleY(0); transform-origin: top; } 50% { transform: scaleY(1); transform-origin: top; } 51% { transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }
.al-bj-linea-agua { position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(243,243,243,.5), transparent); }
.al-bj-riel { position: fixed; right: 18px; top: 50%; transform: translateY(-50%); z-index: 40; opacity: 0; pointer-events: none; transition: opacity .5s; }
.al-bj-dentro .al-bj-riel { opacity: 1; pointer-events: auto; }
.al-bj-riel-m { text-align: right; margin-bottom: 10px; font-family: var(--display); color: #F3F3F3; } .al-bj-riel-m b { font-size: 1.3rem; } .al-bj-riel-m span { font-size: .7rem; opacity: .6; margin-left: 2px; }
.al-bj-riel ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; align-items: flex-end; }
.al-bj-riel a { display: flex; align-items: center; gap: 8px; color: rgba(243,243,243,.72) !important; text-decoration: none; font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; }
.al-bj-riel a span { opacity: 0; transform: translateX(6px); transition: .3s; } .al-bj-riel:hover a span, .al-bj-riel a.al-activo span { opacity: 1; transform: none; }
.al-bj-riel a i { width: 14px; height: 2px; background: currentColor; transition: .3s; } .al-bj-riel a.al-activo { color: #F3F3F3 !important; } .al-bj-riel a.al-activo i { width: 26px; background: #E93B24; }
@media (max-width: 900px) { .al-bj-riel { display: none; } }
.al-bj-p { max-width: 40rem; font-size: 1.05rem; line-height: 1.65; color: rgba(243,243,243,.8) !important; margin: 18px 0 0; }
.al-bj-p--ancho { max-width: 52rem; }
.al-bj-nota { font-size: .8rem; color: rgba(243,243,243,.72) !important; margin-top: 12px; }
.al-bj-ref { font-size: .72rem; color: #E93B24 !important; text-decoration: none; vertical-align: super; }
.al-bj-cita { margin: 30px 0 0; padding-left: 22px; border-left: 2px solid #E93B24; }
.al-bj-cita p { font-family: "Instrument Serif", serif; font-style: italic; font-size: clamp(1.3rem, 1rem + 1vw, 1.9rem); line-height: 1.3; color: #F3F3F3 !important; margin: 0; }
.al-bj-cita cite { display: block; margin-top: 10px; font-style: normal; font-size: .82rem; color: rgba(243,243,243,.72); }
.al-bj-cab { margin-bottom: 40px; }
.al-bj-estreno { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 28px; align-items: stretch; }
.al-bj-player { position: relative; aspect-ratio: 16 / 9; border-radius: 22px; overflow: hidden; background: #000; box-shadow: 0 40px 90px -30px rgba(0,0,0,.8); }
.al-bj-player img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.5) brightness(.55); transform: scale(1.04); }
.al-bj-player-velo { position: absolute; inset: 0; background: radial-gradient(circle at 50% 50%, transparent 0, rgba(0,0,0,.55) 70%), linear-gradient(transparent 60%, rgba(0,0,0,.7)); }
.al-bj-player-estado { position: absolute; left: 22px; top: 20px; display: flex; align-items: center; gap: 8px; font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: #F3F3F3; }
.al-bj-player-estado i { width: 8px; height: 8px; border-radius: 50%; background: #E93B24; animation: al-con-pulso 1.6s ease-out infinite; }
.al-bj-player-play { position: absolute; left: 50%; top: 50%; width: 92px; height: 92px; margin: -46px 0 0 -46px; border-radius: 50%; border: 1px solid rgba(243,243,243,.5); background: rgba(243,243,243,.08); backdrop-filter: blur(6px); color: #fff; cursor: pointer; transition: transform .3s, background .3s; }
.al-bj-player-play svg { width: 34px; height: 34px; margin-left: 4px; }
.al-bj-player-play:hover { transform: scale(1.08); background: linear-gradient(135deg, #7E17BE, #E93B24); border-color: transparent; }
.al-bj-player-msg { position: absolute; left: 0; right: 0; top: calc(50% + 62px); text-align: center; margin: 0; font-size: .92rem; color: rgba(243,243,243,.75) !important; }
.al-bj-player--aviso .al-bj-player-msg { animation: al-bj-aviso 1.2s ease; color: #fff !important; }
@keyframes al-bj-aviso { 0%, 100% { transform: none; } 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
.al-bj-player-marca { position: absolute; left: 22px; bottom: 18px; font-family: var(--display); font-size: clamp(1.2rem, 1rem + 1vw, 2rem); letter-spacing: -0.02em; color: #F3F3F3; }
.al-bj-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; z-index: 3; }
.al-bj-ficha { padding: 26px; border-radius: 22px; border: 1px solid rgba(243,243,243,.14); background: rgba(243,243,243,.04); }
.al-bj-ficha-k { font-size: .76rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(243,243,243,.6) !important; margin: 0 0 10px; }
.al-bj-ficha dl { margin: 0; } .al-bj-ficha dl > div { padding: 9px 0; border-top: 1px dashed rgba(243,243,243,.15); }
.al-bj-ficha dt { font-size: .74rem; color: rgba(243,243,243,.72); } .al-bj-ficha dd { margin: 2px 0 0; font-size: .95rem; color: #F3F3F3; }
.al-bj-ficha-acc { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; margin-top: 18px; }
.al-bj-postal-grid { display: grid; grid-template-columns: 1fr 1.08fr; gap: clamp(28px, 4vw, 70px); align-items: center; }
.al-bj-postal { --agua: .42; position: relative; margin: 0; aspect-ratio: 4 / 5; border-radius: 22px; overflow: hidden; background: #0d0909; box-shadow: 0 36px 80px -28px rgba(0,0,0,.85); border: 1px solid rgba(243,243,243,.14); user-select: none; }
.al-bj-postal img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1.01); }
.al-bj-postal-bajo { position: absolute; inset: 0; width: 100%; height: 100%; background: none; border: 0; pointer-events: none; z-index: 2; }
.al-bj-postal-bajo canvas { width: 100%; height: 100%; display: block; }
.al-bj-postal-linea { position: absolute; left: 0; right: 0; top: 0; height: 0; pointer-events: none; z-index: 3; will-change: transform; }
.al-bj-postal-Tirador { position: absolute; right: 16px; top: -15px; display: inline-flex; align-items: center; gap: 8px; padding: 5px 13px; border-radius: 999px; background: rgba(15, 11, 11, .88); border: 1px solid rgba(233, 59, 36, .7); backdrop-filter: blur(8px); color: #F3F3F3; font-size: .74rem; letter-spacing: .06em; box-shadow: 0 8px 24px rgba(0,0,0,.55), 0 0 14px rgba(233,59,36,.28); transition: border-color .3s ease, box-shadow .3s ease; }
.al-bj-postal-Tirador::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #E93B24; box-shadow: 0 0 8px #E93B24; animation: al-bj-latido 2.2s ease-in-out infinite; }
.al-bj-postal-Tirador i { font-style: normal; color: #E93B24; font-weight: 700; }
.al-bj-postal-Tirador b { font-family: var(--display); font-weight: 500; font-variant-numeric: tabular-nums; color: #fff; }
.al-bj-postal-l { position: absolute; left: 18px; z-index: 3; pointer-events: none; font-size: .72rem; letter-spacing: .09em; text-transform: uppercase; color: #fff; padding: 4px 10px; border-radius: 999px; background: rgba(11, 8, 8, .55); backdrop-filter: blur(4px); border: 1px solid rgba(243,243,243,.14); }
.al-bj-postal-l--a { top: 16px; } .al-bj-postal-l--b { bottom: 16px; }
.al-bj-postal input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ns-resize; z-index: 4; }
.al-bj-postal figcaption { position: absolute; right: 16px; bottom: 16px; z-index: 3; pointer-events: none; font-size: .72rem; color: rgba(243,243,243,.65); text-shadow: 0 1px 6px rgba(0,0,0,.85); }
.al-bj-uno-cab { max-width: 52rem; } .al-bj-uno-sub { font-size: 1.15rem; color: rgba(243,243,243,.75) !important; }
.al-bj-uno { position: relative; height: clamp(400px, 56vw, 620px); margin: 36px 0; border-radius: 24px; overflow: hidden; background: radial-gradient(circle at 50% 50%, #211714 0%, #0b0808 85%); border: 1px solid rgba(243, 243, 243, 0.14); cursor: crosshair; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.7), inset 0 0 100px rgba(0, 0, 0, 0.85); }
.al-bj-uno canvas { width: 100%; height: 100%; display: block; }
.al-bj-zoom-hud { position: absolute; top: 18px; left: 18px; right: 18px; display: flex; justify-content: space-between; align-items: center; gap: 12px; pointer-events: none; z-index: 10; }
.al-bj-zoom-pill { padding: 6px 14px; border-radius: 999px; background: rgba(14, 10, 10, 0.82); border: 1px solid rgba(243, 243, 243, 0.16); backdrop-filter: blur(8px); font-size: 0.76rem; letter-spacing: 0.08em; text-transform: uppercase; color: #E9786A; font-weight: 600; box-shadow: 0 4px 16px rgba(0,0,0,0.4); }
.al-bj-zoom-pill span { color: rgba(243, 243, 243, 0.65); font-weight: 400; }
.al-bj-zoom-pill--cifra { color: #ffffff; font-family: var(--display, inherit); letter-spacing: 0.04em; }
.al-bj-zoom-ctrls { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); width: calc(100% - 36px); max-width: 660px; background: rgba(14, 10, 10, 0.88); border: 1px solid rgba(243, 243, 243, 0.16); border-radius: 20px; padding: 12px 18px 14px; backdrop-filter: blur(12px); z-index: 10; box-shadow: 0 20px 50px rgba(0, 0, 0, 0.7); box-sizing: border-box; }
.al-bj-zoom-tabs { display: flex; justify-content: space-between; gap: 6px; margin-bottom: 10px; }
.al-bj-zoom-btn { flex: 1; background: transparent; border: 1px solid transparent; border-radius: 12px; color: rgba(243, 243, 243, 0.68); font: inherit; font-size: 0.75rem; letter-spacing: 0.03em; padding: 7px 8px; cursor: pointer; transition: all 0.25s cubic-bezier(0.2, 0.8, 0.2, 1); text-align: center; white-space: nowrap; }
.al-bj-zoom-btn:hover { color: #ffffff; background: rgba(255, 255, 255, 0.06); }
.al-bj-zoom-btn.al-on { background: linear-gradient(135deg, rgba(233, 59, 36, 0.85), rgba(233, 120, 106, 0.45)); border-color: rgba(233, 120, 106, 0.45); color: #ffffff; font-weight: 600; box-shadow: 0 0 16px rgba(233, 59, 36, 0.4); }
.al-bj-zoom-slider-wrap { position: relative; display: flex; align-items: center; padding: 2px 0 4px; }
.al-bj-zoom-range { width: 100%; height: 6px; -webkit-appearance: none; appearance: none; background: linear-gradient(90deg, rgba(243,243,243,0.18) 0%, rgba(233,59,36,0.5) 50%, #E9786A 100%); border-radius: 999px; outline: none; margin: 0; cursor: ew-resize; }
.al-bj-zoom-range::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 22px; height: 22px; border-radius: 50%; background: #ffffff; border: 2px solid #E9786A; box-shadow: 0 0 12px #E9786A, 0 0 22px rgba(233, 59, 36, 0.85); cursor: ew-resize; transition: transform 0.15s ease; }
.al-bj-zoom-range::-webkit-slider-thumb:hover { transform: scale(1.22); }
.al-bj-zoom-range::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: #ffffff; border: 2px solid #E9786A; box-shadow: 0 0 12px #E9786A, 0 0 22px rgba(233, 59, 36, 0.85); cursor: ew-resize; }
.al-bj-zoom-sub { margin: 8px 0 0; font-size: 0.82rem; line-height: 1.45; color: rgba(243, 243, 243, 0.78) !important; text-align: center; transition: opacity 0.3s ease; }
.al-bj-zoom-sub em { color: #E9786A; font-style: normal; font-weight: 600; }
.al-bj-uno-tag { position: absolute; left: 0; top: 0; z-index: 12; font-family: "Instrument Serif", Georgia, serif; font-style: italic; font-size: 1.75rem; color: #ffffff; text-shadow: 0 2px 14px rgba(0, 0, 0, 0.95), 0 0 22px #E9786A; pointer-events: none; opacity: 0; transform: translate(-50%, -100%); transition: opacity 0.35s ease, transform 0.35s ease; }
.al-bj-uno-tag.al-visible { opacity: 1; transform: translate(-50%, -115%); }
.al-bj-uno-pista { position: absolute; left: 20px; bottom: 8px; z-index: 2; pointer-events: none; margin: 0; font-size: 0.75rem; color: rgba(243, 243, 243, 0.72) !important; }
@media (max-width: 680px) {
  .al-bj-zoom-hud { flex-direction: column; align-items: flex-start; gap: 6px; top: 12px; left: 12px; right: 12px; }
  .al-bj-zoom-ctrls { bottom: 12px; width: calc(100% - 24px); padding: 10px 14px 12px; }
  .al-bj-zoom-btn { font-size: 0.68rem; padding: 5px 4px; }
  .al-bj-zoom-sub { font-size: 0.75rem; }
}
.al-bj-uno-datos { display: grid; grid-template-columns: 1fr 1.2fr 1fr; gap: 30px; align-items: center; }
.al-bj-dato b { display: block; font-family: var(--display); font-weight: 500; font-size: clamp(2.4rem, 1.6rem + 3vw, 4.6rem); line-height: 1; letter-spacing: -0.04em; color: #F3F3F3; font-variant-numeric: tabular-nums; }
.al-bj-dato span { display: block; font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; color: #E93B24; margin-top: 4px; }
.al-bj-dato p { margin: 10px 0 0; font-size: .95rem; line-height: 1.5; color: rgba(243,243,243,.72) !important; }
.al-bj-frase { font-family: "Instrument Serif", serif; font-style: italic; font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.4rem); line-height: 1.2; text-align: center; color: #F3F3F3 !important; margin: 0; }
.al-bj-vida { display: grid; grid-template-columns: 1.45fr 1fr; gap: 24px; margin: 40px 0 10px; align-items: stretch; }
.al-bj-vida figure { margin: 0; padding: 24px 26px; border-radius: 22px; border: 1px solid rgba(243,243,243,.12); background: rgba(243,243,243,.03); display: flex; flex-direction: column; justify-content: space-between; }
.al-bj-vida-jaula { background: radial-gradient(circle at 50% 42%, rgba(233,59,36,.08), rgba(243,243,243,.02) 70%) !important; border-color: rgba(233,59,36,.24) !important; }
.al-bj-vida-top { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 8px; padding-bottom: 12px; border-bottom: 1px dashed rgba(243,243,243,.14); margin-bottom: 8px; }
.al-bj-vida-top span { font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(243,243,243,.72); }
.al-bj-vida-top b { font-family: var(--display); font-size: 1.05rem; color: #F3F3F3; font-weight: 500; }
.al-bj-vida-jaula .al-bj-vida-top b { color: #E93B24; }
.al-bj-vida svg { width: 100%; height: 210px; display: block; overflow: visible; }
.al-bj-ruta { fill: none; stroke: rgba(243,243,243,.55); stroke-width: 2; stroke-dasharray: 4 6; }
.al-bj-ruta-jaula { fill: none; stroke: rgba(233,59,36,.5); stroke-width: 1.6; stroke-dasharray: 3 5; }
.al-bj-pez { fill: #E93B24; offset-path: path("M16 190 C 95 182, 130 120, 205 130 S 310 195, 360 120 S 445 32, 515 58 S 582 115, 586 38"); animation: al-bj-nada 9s linear infinite; }
.al-bj-pez-jaula { fill: #E93B24; offset-path: path("M 104 92 L 214 70 L 262 92 L 152 114 Z"); offset-rotate: 0deg; animation: al-bj-nada 4s linear infinite; }
@keyframes al-bj-nada { from { offset-distance: 0%; } to { offset-distance: 100%; } }
.al-bj-vida figcaption { font-size: .95rem; line-height: 1.5; color: rgba(243,243,243,.75); margin-top: 8px; } .al-bj-vida figcaption b { display: block; color: #F3F3F3; font-size: 1.1rem; margin-bottom: 4px; }
.al-bj-etapas { list-style: none; padding: 0; margin: 34px 0 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; counter-reset: none; }
.al-bj-etapas li { padding: 20px; border-top: 2px solid rgba(243,243,243,.2); } .al-bj-etapas li:last-child { border-top-color: #E93B24; }
.al-bj-etapas span { font-size: .78rem; color: #E93B24; } .al-bj-etapas h3 { margin: 8px 0; font-size: 1.15rem; } .al-bj-etapas p { margin: 0; font-size: .92rem; line-height: 1.5; color: rgba(243,243,243,.72) !important; }
.al-bj-ab { display: grid; grid-template-columns: 1.2fr 1fr; gap: 40px; align-items: end; margin-top: 36px; }
.al-bj-barras { display: flex; flex-direction: column; gap: 14px; }
.al-bj-barra { display: grid; grid-template-columns: 54px 1fr auto; gap: 14px; align-items: center; } .al-bj-barra span { color: rgba(243,243,243,.6); }
.al-bj-barra i { height: 34px; border-radius: 6px; background: linear-gradient(90deg, #7E17BE, #E93B24); transform: scaleX(0); transform-origin: left; transition: transform 1.4s cubic-bezier(.2,.8,.2,1); }
.al-bj-barras.al-on .al-bj-barra i { transform: scaleX(var(--v)); }
.al-bj-barra b { font-family: var(--display); font-size: 1.4rem; color: #F3F3F3; }
.al-bj-nor { display: grid; grid-template-columns: 1fr 1.4fr; gap: 40px; margin-top: 80px; align-items: center; }
.al-bj-nor-txt h3 { font-size: 1.6rem; margin: 0 0 10px; } .al-bj-nor-txt p { color: rgba(243,243,243,.78) !important; line-height: 1.6; }
.al-bj-nor-x b { font-family: var(--display); font-size: clamp(2.2rem, 1.6rem + 2.4vw, 3.8rem); background: linear-gradient(90deg, #B65CF0, #E93B24); -webkit-background-clip: text; background-clip: text; color: transparent; }
.al-bj-nor-ley { display: flex; align-items: center; gap: 8px; font-size: .82rem; color: rgba(243,243,243,.72) !important; } .al-bj-nor-ley i { width: 10px; height: 10px; background: #F3F3F3; }
.al-bj-nor-viz { display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: end; }
.al-bj-nor-viz span { display: block; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(243,243,243,.6); margin-bottom: 8px; }
.al-bj-nor-grid { display: grid; grid-template-columns: repeat(24, 1fr); gap: 3px; }
.al-bj-nor-grid i { aspect-ratio: 1; background: #E93B24; opacity: 0; transform: scale(.4); transition: opacity .35s, transform .35s; transition-delay: calc(var(--fila, 0) * 24ms); }
.al-on .al-bj-nor-grid i { opacity: .9; transform: none; }
.al-bj-nor-no i { display: block; width: 14px; height: 14px; background: #F3F3F3; }
.al-bj-proa { display: grid; grid-template-columns: 1fr 1.2fr; gap: 40px; margin-top: 80px; align-items: center; }
.al-bj-proa h3 { font-size: 1.6rem; margin: 0 0 10px; } .al-bj-proa p { color: rgba(243,243,243,.78) !important; line-height: 1.6; }
.al-bj-proa-b { display: grid; grid-template-columns: 1fr auto; gap: 6px 14px; margin-bottom: 18px; }
.al-bj-proa-b i { grid-column: 1 / -1; height: 26px; border-radius: 6px; background: rgba(243,243,243,.25); transform: scaleX(0); transform-origin: left; transition: transform 1.4s cubic-bezier(.2,.8,.2,1); }
.al-bj-proa-b--b i { background: linear-gradient(90deg, #7E17BE, #E93B24); min-width: 6px; }
.al-on .al-bj-proa-b i { transform: scaleX(var(--v)); } .al-bj-proa-b span { color: rgba(243,243,243,.7); font-size: .9rem; } .al-bj-proa-b b { color: #F3F3F3; }
.al-bj-salud { max-width: 52rem; margin-top: 60px; padding: 24px 28px; border-radius: 18px; background: rgba(233,59,36,.08); border: 1px solid rgba(233,59,36,.3); line-height: 1.6; color: rgba(243,243,243,.85) !important; }
.al-bj-fondo { display: grid; grid-template-columns: 1.15fr .95fr; gap: 50px; margin-top: 40px; align-items: start; }
.al-bj-cadena { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.al-bj-cadena li { position: relative; display: grid; grid-template-columns: 8.5rem 1fr auto; gap: 14px; align-items: center; padding: 14px 18px; border-radius: 12px; background: rgba(243,243,243,calc(.09 - var(--i) * .01)); border-left: 3px solid rgba(233,59,36,calc(.25 + var(--i) * .12)); opacity: 0; transform: translateY(-10px); transition: opacity .5s, transform .5s; transition-delay: calc(var(--i) * 110ms); color: #F3F3F3; }
.al-bj-cadena li small { font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: rgba(243,243,243,.72); font-variant-numeric: tabular-nums; }
.al-bj-cadena li span { font-size: .95rem; line-height: 1.4; color: #F3F3F3; }
.al-bj-cadena li b { font-family: var(--display); font-weight: 500; font-size: .82rem; letter-spacing: .03em; padding: 4px 10px; border-radius: 999px; background: rgba(11, 8, 8, .55); border: 1px solid rgba(243,243,243,.12); color: rgba(243,243,243,.8); font-variant-numeric: tabular-nums; white-space: nowrap; }
.al-bj-cadena li:last-child { background: rgba(233,59,36,.18); border-left-color: #E93B24; }
.al-bj-cadena li:last-child b { background: rgba(233,59,36,.28); border-color: rgba(233,59,36,.6); color: #fff; }
.al-bj-cadena.al-on li { opacity: 1; transform: none; }
.al-bj-matiz { margin-top: 28px; padding: 22px; border-radius: 16px; border: 1px dashed rgba(243,243,243,.25); } .al-bj-matiz h3 { margin: 0 0 6px; font-size: 1.05rem; } .al-bj-matiz p { margin: 0; color: rgba(243,243,243,.75) !important; line-height: 1.55; }
.al-bj-comau { margin-top: 80px; padding: clamp(24px, 3vw, 44px); border-radius: 24px; background: linear-gradient(135deg, rgba(126,23,190,.14), rgba(233,59,36,.08)); border: 1px solid rgba(243,243,243,.12); }
.al-bj-comau-cab h3 { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.4rem); margin: 6px 0 24px; }
.al-bj-comau-datos { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.al-bj-comau-datos b { font-family: var(--display); font-size: 2.2rem; color: #F3F3F3; } .al-bj-comau-datos p { margin: 6px 0 0; font-size: .9rem; line-height: 1.45; color: rgba(243,243,243,.72) !important; }
.al-bj-esc { display: grid; grid-template-columns: 1fr 1.1fr; gap: 40px; align-items: center; }
.al-bj-esc-datos { display: flex; flex-wrap: wrap; gap: 30px; margin-top: 26px; }
.al-bj-esc-viz { height: clamp(320px, 40vw, 480px); border-radius: 22px; overflow: hidden; background: radial-gradient(circle at 30% 50%, rgba(233,59,36,.08), rgba(11,8,8,.65) 75%); border: 1px solid rgba(243,243,243,.1); }
.al-bj-esc-viz canvas { width: 100%; height: 100%; display: block; }
.al-bj-mapa-layout { display: grid; grid-template-columns: minmax(260px, 330px) 1fr; gap: 36px; align-items: end; margin-top: 40px; }
.al-bj-carto { padding: 20px 22px; border-radius: 22px; background: rgba(243,243,243,.03); border: 1px solid rgba(243,243,243,.12); display: flex; flex-direction: column; justify-content: space-between; align-self: stretch; }
.al-bj-carto-cab { display: flex; justify-content: space-between; align-items: center; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(243,243,243,.72); padding-bottom: 10px; border-bottom: 1px dashed rgba(243,243,243,.14); }
.al-bj-carto-cab b { color: #E93B24; font-weight: 600; font-family: var(--display); font-size: 1rem; }
.al-bj-carto-svg { width: 100%; height: 340px; margin: 10px 0; display: block; }
.al-bj-carto-nodo { cursor: pointer; transition: opacity .25s ease; outline: none; }
.al-bj-carto-halo { transition: opacity .35s ease, transform .35s ease; transform-origin: center; }
.al-bj-carto-aro { transition: fill .3s ease, stroke .3s ease, stroke-width .3s ease; }
.al-bj-carto-nodo:hover .al-bj-carto-aro, .al-bj-carto-nodo.al-foco .al-bj-carto-aro { fill: rgba(233,59,36,.42); stroke: #FFFFFF; stroke-width: 2; }
.al-bj-carto-nodo:hover .al-bj-carto-halo, .al-bj-carto-nodo.al-foco .al-bj-carto-halo { opacity: 1; transform: scale(1.15); }
.al-bj-carto-pie { margin: 0; padding-top: 10px; border-top: 1px dashed rgba(243,243,243,.14); font-size: .78rem; line-height: 1.45; color: rgba(243,243,243,.65) !important; min-height: 3.6rem; display: flex; align-items: center; }
.al-bj-carto-pie b { color: #fff; }
.al-bj-areas { display: grid; grid-template-columns: 2.6fr 1.25fr .9fr .7fr .7fr; gap: 16px; align-items: end; align-self: end; margin-top: 0; }
.al-bj-area { padding: 14px; border-radius: 16px; border: 1px solid transparent; background: transparent; transition: transform .4s cubic-bezier(.2,.8,.2,1), background-color .35s ease, border-color .35s ease, box-shadow .4s ease; cursor: pointer; will-change: transform; }
.al-bj-area:hover, .al-bj-area.al-foco { background: rgba(233,59,36,.09); border-color: rgba(233,59,36,.4); transform: translateY(-2px); box-shadow: 0 12px 28px -10px rgba(233,59,36,.22); }
.al-bj-area-dots { display: flex; flex-wrap: wrap; gap: 4px; align-content: flex-end; }
.al-bj-area-dots i { width: 8px; height: 8px; border-radius: 50%; background: #E93B24; opacity: 0; transform: scale(.2); transition: opacity .35s ease, transform .35s ease, background-color .35s ease, box-shadow .35s ease; transition-delay: calc(var(--fila, 0) * 28ms); }
.al-on .al-bj-area-dots i { opacity: .88; transform: none; transition-delay: 0s; }
.al-bj-area.al-foco .al-bj-area-dots i, .al-bj-area:hover .al-bj-area-dots i { background: #FFFFFF; opacity: 1; box-shadow: 0 0 6px rgba(255,255,255,.45); }
.al-bj-area p { margin: 12px 0 0; font-size: .82rem; line-height: 1.35; color: rgba(243,243,243,.7) !important; transition: color .3s ease; }
.al-bj-area p b { display: block; font-family: var(--display); font-size: 1.6rem; color: #F3F3F3; transition: color .3s ease; }
.al-bj-area.al-foco p b, .al-bj-area:hover p b { color: #FFFFFF; }
.al-bj-escala { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 50px; }
.al-bj-escala div { padding: 22px; border-top: 1px solid rgba(243,243,243,.2); } .al-bj-escala b { font-family: var(--display); font-size: 1.8rem; color: #F3F3F3; } .al-bj-escala p { margin: 8px 0 0; color: rgba(243,243,243,.72) !important; font-size: .95rem; line-height: 1.5; }
.al-bj-per { display: grid; grid-template-columns: 1fr 1.05fr; gap: 50px; align-items: center; }
.al-bj-crono { background: rgba(243,243,243,.03); border: 1px solid rgba(243,243,243,.12); border-radius: 22px; padding: 22px 24px; display: flex; flex-direction: column; gap: 14px; position: relative; overflow: hidden; box-shadow: 0 16px 40px -20px rgba(0,0,0,.5); }
.al-bj-crono::before { content: ""; position: absolute; top: 0; right: 0; width: 150px; height: 150px; background: radial-gradient(circle at 100% 0%, rgba(233,59,36,.14), transparent 70%); pointer-events: none; }
.al-bj-crono-cab { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-bottom: 10px; border-bottom: 1px dashed rgba(243,243,243,.14); }
.al-bj-crono-sub { font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(243,243,243,.72); }
.al-bj-crono-tag { display: inline-flex; align-items: center; gap: 6px; font-size: .76rem; font-weight: 600; color: #F3F3F3; padding: 3px 10px; border-radius: 999px; background: rgba(233,59,36,.16); border: 1px solid rgba(233,59,36,.4); }
.al-bj-crono-dot { width: 6px; height: 6px; border-radius: 50%; background: #E93B24; box-shadow: 0 0 6px #E93B24; }
.al-bj-crono-svg { width: 100%; height: auto; display: block; overflow: visible; }
.al-bj-crono-bar { transform-origin: bottom; transform: scaleY(0); transition: transform .8s cubic-bezier(.16,1,.3,1), fill .25s ease, opacity .25s ease; cursor: pointer; outline: none; }
.al-on .al-bj-crono-bar { transform: scaleY(1); }
.al-bj-crono-bar:hover, .al-bj-crono-bar.al-activa { fill: #FFFFFF !important; opacity: 1 !important; }
.al-bj-crono-bar--2026 { fill: #E93B24; }
.al-bj-crono-bar--2026:hover, .al-bj-crono-bar--2026.al-activa { fill: #FF5A45 !important; }
.al-bj-crono-pulso { animation: al-bj-latido 2.2s ease-in-out infinite; transform-origin: 520px 40px; }
@keyframes al-bj-latido { 0% { transform: scale(1); opacity: .85; } 50% { transform: scale(1.6); opacity: 0; } 100% { transform: scale(1); opacity: 0; } }
.al-bj-crono-info { font-size: .82rem; line-height: 1.45; color: rgba(243,243,243,.8) !important; padding: 9px 14px; border-radius: 12px; background: rgba(11,8,8,.65); border: 1px solid rgba(243,243,243,.1); min-height: 2.8em; display: flex; align-items: center; transition: border-color .25s ease, background-color .25s ease; }
.al-bj-crono-info b { color: #fff; margin-right: 4px; }
.al-bj-crono-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding-top: 2px; }
.al-bj-crono-stat { padding: 12px 14px; border-radius: 14px; background: rgba(243,243,243,.04); border: 1px solid rgba(243,243,243,.08); }
.al-bj-crono-stat small { display: block; font-size: .65rem; letter-spacing: .06em; text-transform: uppercase; color: rgba(243,243,243,.72); margin-bottom: 2px; }
.al-bj-crono-stat b { display: block; font-family: var(--display); font-size: 1.45rem; line-height: 1.1; color: #F3F3F3; }
.al-bj-crono-stat span { display: block; font-size: .74rem; line-height: 1.3; color: rgba(243,243,243,.65); margin-top: 2px; }
.al-bj-crono-stat--alerta { background: rgba(233,59,36,.09); border-color: rgba(233,59,36,.32); }
.al-bj-crono-stat--alerta b { color: #E93B24; }
.al-bj-postura { margin-top: 26px; font-size: 1.02rem; line-height: 1.6; color: rgba(243,243,243,.85) !important; padding-left: 18px; border-left: 2px solid #7E17BE; }
.al-bj-pregunta { font-family: var(--display); font-weight: 500; font-size: clamp(2rem, 1.3rem + 3vw, 4.4rem); line-height: 1.05; letter-spacing: -0.03em; max-width: 60rem; color: #F3F3F3; }
.al-bj-linea { list-style: none; padding: 0; margin: 40px 0 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.al-bj-linea li { padding: 22px; border-radius: 16px; background: rgba(243,243,243,.04); border: 1px solid rgba(243,243,243,.1); } .al-bj-linea time { color: #E93B24; font-weight: 600; } .al-bj-linea p { margin: 8px 0 0; color: rgba(243,243,243,.78) !important; line-height: 1.5; }
.al-bj-rodaje { display: grid; grid-template-columns: repeat(12, 1fr); gap: 20px; margin-top: 36px; }
.al-bj-rod-f { grid-column: span 6; margin: 0; display: flex; flex-direction: column; opacity: 0; transform: translateY(22px); transition: opacity .65s cubic-bezier(.2,.8,.2,1), transform .65s cubic-bezier(.2,.8,.2,1); transition-delay: calc(var(--rod-i, 0) * 80ms); }
.al-bj-rod-f:nth-child(1) { grid-column: span 7; }
.al-bj-rod-f:nth-child(2) { grid-column: span 5; }
.al-bj-rod-f:nth-child(3) { grid-column: span 5; }
.al-bj-rod-f:nth-child(4) { grid-column: span 7; }
.al-bj-rod-f.al-rod-visto { opacity: 1; transform: none; }
.al-bj-rod-media { position: relative; aspect-ratio: 16 / 10; border-radius: 18px; overflow: hidden; background: #0c0909; border: 1px solid rgba(243,243,243,.12); cursor: zoom-in; }
.al-bj-rod-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,8,8,.55) 0%, transparent 28%, transparent 68%, rgba(11,8,8,.7) 100%); pointer-events: none; }
.al-bj-rod-f img { width: 100%; height: 100%; object-fit: cover; display: block; transform: scale(1.06); filter: contrast(1.04) saturate(.92); transition: transform .85s cubic-bezier(.2,.8,.2,1), filter .5s; }
.al-bj-rod-f.al-rod-visto img { transform: scale(1); }
.al-bj-rod-media:hover img { transform: scale(1.04); filter: contrast(1.08) saturate(1.05); }
.al-bj-rod-meta { position: absolute; left: 14px; top: 12px; z-index: 2; font-size: .68rem; letter-spacing: .09em; text-transform: uppercase; color: rgba(243,243,243,.88); padding: 4px 10px; border-radius: 999px; background: rgba(11, 8, 8, .68); border: 1px solid rgba(243,243,243,.16); backdrop-filter: blur(6px); font-variant-numeric: tabular-nums; }
.al-bj-rod-zoom { position: absolute; right: 14px; bottom: 12px; z-index: 2; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: rgba(11, 8, 8, .72); border: 1px solid rgba(243,243,243,.25); color: #F3F3F3; font-size: 1.05rem; transition: transform .25s, background .25s, border-color .25s; }
.al-bj-rod-media:hover .al-bj-rod-zoom { transform: scale(1.1); background: #E93B24; border-color: #E93B24; color: #fff; }
.al-bj-rod-f figcaption { margin-top: 10px; font-size: .88rem; line-height: 1.45; color: rgba(243,243,243,.68); }
.al-bj-rod-vacio { position: relative; aspect-ratio: 16 / 10; border-radius: 18px; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: 18px 20px; background: radial-gradient(circle at 80% 20%, rgba(126,23,190,.18), transparent 55%), linear-gradient(160deg, #1d1515, #090707); border: 1px solid rgba(243,243,243,.14); }
.al-bj-rod-top { position: relative; z-index: 2; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.al-bj-rod-top .al-bj-rod-meta { position: static; }
.al-bj-rod-top b { font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: #E93B24; font-variant-numeric: tabular-nums; }
.al-bj-rod-onda { width: 100%; height: 48px; margin: auto 0; fill: none; stroke: rgba(233,59,36,.65); stroke-width: 1.8; opacity: .85; }
.al-bj-rod-vacio span { position: relative; z-index: 2; color: #F3F3F3; font-size: .96rem; line-height: 1.4; }
.al-bj-rod-vacio small { position: relative; z-index: 2; margin-top: 6px; display: block; font-size: .72rem; letter-spacing: .07em; text-transform: uppercase; color: rgba(243,243,243,.72); }
.al-bj-visor { position: fixed; inset: 0; z-index: 120; background: rgba(7, 5, 5, .92); backdrop-filter: blur(14px); display: grid; place-items: center; padding: clamp(20px, 4vw, 56px); opacity: 0; pointer-events: none; transition: opacity .3s ease; }
.al-bj-visor.al-abierto { opacity: 1; pointer-events: auto; }
.al-bj-visor-fig { margin: 0; max-width: min(1100px, 92vw); max-height: 86vh; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.al-bj-visor-img { max-width: 100%; max-height: 74vh; width: auto; height: auto; object-fit: contain; border-radius: 14px; border: 1px solid rgba(243,243,243,.16); box-shadow: 0 30px 90px rgba(0,0,0,.85); }
.al-bj-visor-cap { text-align: center; max-width: 46rem; }
.al-bj-visor-cap small { display: block; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; color: #E93B24; margin-bottom: 4px; }
.al-bj-visor-cap p { margin: 0; font-size: .98rem; line-height: 1.5; color: rgba(243,243,243,.88) !important; }
.al-bj-visor-cerrar { position: absolute; right: 24px; top: 24px; width: 44px; height: 44px; border-radius: 50%; border: 1px solid rgba(243,243,243,.25); background: rgba(243,243,243,.06); color: #fff; font-size: 1.5rem; line-height: 1; cursor: pointer; transition: background .2s, transform .2s; }
.al-bj-visor-cerrar:hover { background: #E93B24; border-color: #E93B24; transform: scale(1.06); }
.al-bj-fin { text-align: center; }
.al-bj-fin-lineas p { font-family: "Instrument Serif", serif; font-style: italic; font-size: clamp(1.3rem, 1rem + 1.2vw, 2rem); line-height: 1.35; color: rgba(243,243,243,.85) !important; margin: 0 0 10px; }
.al-bj-fin-t { font-family: var(--display); font-weight: 500; font-size: clamp(2.2rem, 1.4rem + 3.6vw, 5rem); letter-spacing: -0.035em; line-height: 1.02; margin: 40px auto; max-width: 56rem; color: #F3F3F3; }
.al-bj-fin-acc { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 18px 28px; }
.al-bj-compartir { padding: 12px 20px; border-radius: 999px; border: 1px solid rgba(243,243,243,.4); background: none; color: #F3F3F3; font: inherit; cursor: pointer; }
.al-bj-compartir:hover { background: #F3F3F3; color: #2B2525; }
.al-bj-fuentes { max-width: 52rem; margin: 70px auto 0; text-align: left; border-top: 1px solid rgba(243,243,243,.14); padding-top: 16px; }
.al-bj-fuentes summary { cursor: pointer; color: #F3F3F3; } .al-bj-fuentes ol { margin: 14px 0 0; padding-left: 1.4em; } .al-bj-fuentes li { font-size: .84rem; line-height: 1.5; margin-bottom: 6px; } .al-bj-fuentes a { color: rgba(243,243,243,.7) !important; }
@media (max-width: 900px) {
  .al-bj-estreno, .al-bj-postal-grid, .al-bj-uno-datos, .al-bj-vida, .al-bj-ab, .al-bj-nor, .al-bj-proa, .al-bj-fondo, .al-bj-esc, .al-bj-per, .al-bj-linea, .al-bj-escala, .al-bj-mapa-layout, .al-bj-crono-stats { grid-template-columns: 1fr; }
  .al-bj-etapas, .al-bj-comau-datos { grid-template-columns: 1fr 1fr; }
  .al-bj-areas { grid-template-columns: 1fr; }
  .al-bj-cadena li { grid-template-columns: 1fr; gap: 6px; }
  .al-bj-cadena li b { justify-self: start; }
  .al-bj-rodaje { grid-template-columns: 1fr; }
  .al-bj-rod-f, .al-bj-rod-f:nth-child(1), .al-bj-rod-f:nth-child(2), .al-bj-rod-f:nth-child(3), .al-bj-rod-f:nth-child(4) { grid-column: 1 / -1; }
  .al-bj-hero-velo { background: linear-gradient(180deg, rgba(11,8,8,.65) 0%, rgba(11,8,8,.92) 45%, rgba(11,8,8,.98) 100%); }
  .al-bj-nor-grid { grid-template-columns: repeat(18, 1fr); }
}
/* fichas de Tras la Carne */
.al-dc-grid { display: grid; grid-template-columns: 1.3fr 1fr; gap: clamp(28px, 4vw, 60px); align-items: center; }
.al-dc-datos-grid, .al-dc-proy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(28px, 4vw, 60px); }
.al-dc-ficha div { display: grid; grid-template-columns: 9em 1fr; gap: 12px; padding: 12px 0; border-top: 1px solid rgba(43,37,37,.12); } .al-dc-ficha dt { color: rgba(43,37,37,.55); font-size: .88rem; } .al-dc-ficha dd { margin: 0; }
.al-dc-gente, .al-dc-temas { list-style: none; padding: 0; margin: 10px 0 30px; } .al-dc-gente li, .al-dc-temas li { padding: 10px 0; border-top: 1px solid rgba(43,37,37,.12); }
.al-dc-temas a { display: flex; justify-content: space-between; gap: 10px; color: inherit; text-decoration: none; } .al-dc-temas .al-icono { width: 14px; height: 14px; }
.al-dc-otros { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; }
.al-dc-otro { position: relative; display: flex; flex-direction: column; justify-content: flex-end; min-height: 220px; padding: 18px; border-radius: 18px; overflow: hidden; color: #F3F3F3 !important; text-decoration: none; }
.al-dc-otro img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: brightness(.45); transition: transform .8s; } .al-dc-otro:hover img { transform: scale(1.05); }
.al-dc-otro span, .al-dc-otro b { position: relative; } .al-dc-otro span { font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; opacity: .75; } .al-dc-otro b { font-family: var(--display); font-weight: 500; font-size: 1.5rem; }
.al-dc-otro b em { font-family: "Instrument Serif", serif; font-weight: 400; }
.al-dc-banda { padding: 0; } .al-dc-banda-in { display: grid; grid-template-columns: auto 1fr auto; gap: 8px 30px; align-items: center; padding: 34px 0; color: #F3F3F3 !important; text-decoration: none; }
.al-dc-banda-in b, .al-dc-banda-dos b { font-family: var(--display); font-weight: 500; font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.6rem); }
.al-dc-banda-in b em, .al-dc-banda-dos b em { font-family: "Instrument Serif", serif; font-weight: 400; font-style: italic; color: #E93B24; }
.al-dc-banda-in p { grid-column: 1 / 3; margin: 0; color: rgba(243,243,243,.7) !important; max-width: 46rem; }
.al-dc-banda-ir { display: inline-flex; align-items: center; gap: 8px; font-size: .9rem; text-decoration: underline; text-underline-offset: 4px; }
.al-dc-banda-ir .al-icono { width: 14px; height: 14px; }
.al-dc-banda-dos { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 30px 0; } .al-dc-banda-dos a { display: flex; flex-direction: column; gap: 6px; padding: 22px; border-radius: 18px; border: 1px solid rgba(243,243,243,.14); color: #F3F3F3 !important; text-decoration: none; }
@media (max-width: 900px) { .al-dc-grid, .al-dc-datos-grid, .al-dc-proy-grid, .al-dc-banda-dos, .al-dc-otros { grid-template-columns: 1fr; } .al-dc-banda-in { grid-template-columns: 1fr; } .al-dc-banda-in p { grid-column: auto; } }
.al-bj h1 em, .al-bj h2 em, .al-bj h1 em *, .al-bj h2 em * { background: none !important; -webkit-text-fill-color: #E9786A !important; color: #E9786A !important; font-family: "Instrument Serif", serif; font-style: italic; font-weight: 400; }
.al-bj .al-entra { opacity: 1 !important; transform: none !important; } .al-bj-player { align-self: start; }

/* =====================================================================
   v40 · Sellos de animales encuadrados íntegramente (sin cortes de cabeza ni cuerpo)
   ===================================================================== */
.al-con-sello { position: relative; overflow: hidden; }
.al-con-sello > :not(.al-sello-zoom):not(.al-luz-tarjeta):not(.al-barrido) { position: relative; z-index: 2; }
.al-sello-zoom {
  --sz-w: 168px;
  --sz-h: 138px;
  --sz-r: 14px;
  --sz-b: 12px;
  --sz-fx: -1;
  --sz-rot: -2deg;
  --sz-s: 0.96;
  position: absolute;
  right: var(--sz-r);
  bottom: var(--sz-b);
  width: var(--sz-w);
  height: var(--sz-h);
  z-index: 1;
  pointer-events: none;
  user-select: none;
  fill: currentColor;
  color: rgba(43, 37, 37, 0.075);
  transform: translate3d(0, 0, 0) scaleX(var(--sz-fx)) rotate(var(--sz-rot)) scale(var(--sz-s));
  transform-origin: 50% 50%;
  transition: transform 0.75s cubic-bezier(0.2, 0.8, 0.2, 1), color 0.45s ease, opacity 0.45s ease;
}
/* Proporciones anatómicas completas para que cabeza y cuerpo se vean enteros dentro de la tarjeta */
.al-sello-zoom--cerdo      { --sz-w: 184px; --sz-h: 112px; --sz-r: 14px; --sz-b: 14px; --sz-fx: -1; --sz-rot: -2deg; --sz-s: 0.96; }
.al-sello-zoom--gallina    { --sz-w: 146px; --sz-h: 146px; --sz-r: 14px; --sz-b: 12px; --sz-fx: -1; --sz-rot:  2deg; --sz-s: 0.95; }
.al-sello-zoom--vaca       { --sz-w: 192px; --sz-h: 126px; --sz-r: 14px; --sz-b: 14px; --sz-fx: -1; --sz-rot: -1deg; --sz-s: 0.96; }
.al-sello-zoom--conejo     { --sz-w: 144px; --sz-h: 144px; --sz-r: 14px; --sz-b: 12px; --sz-fx: -1; --sz-rot: -3deg; --sz-s: 0.95; }
.al-sello-zoom--salmon     { --sz-w: 205px; --sz-h:  88px; --sz-r: 14px; --sz-b: 18px; --sz-fx: -1; --sz-rot:  8deg; --sz-s: 0.96; }
.al-sello-zoom--oveja      { --sz-w: 172px; --sz-h: 126px; --sz-r: 14px; --sz-b: 12px; --sz-fx: -1; --sz-rot: -2deg; --sz-s: 0.96; }
.al-sello-zoom--tortuga    { --sz-w: 168px; --sz-h: 140px; --sz-r: 14px; --sz-b: 12px; --sz-fx: -1; --sz-rot:  5deg; --sz-s: 0.95; }
.al-sello-zoom--abeja      { --sz-w: 148px; --sz-h: 140px; --sz-r: 14px; --sz-b: 12px; --sz-fx: -1; --sz-rot: -4deg; --sz-s: 0.95; }
.al-sello-zoom--golondrina { --sz-w: 112px; --sz-h: 182px; --sz-r: 16px; --sz-b: 12px; --sz-fx: -1; --sz-rot: -8deg; --sz-s: 0.94; }
.al-sello-zoom--galgo      { --sz-w: 182px; --sz-h: 132px; --sz-r: 14px; --sz-b: 12px; --sz-fx: -1; --sz-rot: -2deg; --sz-s: 0.96; }
.al-sello-zoom--gato       { --sz-w: 154px; --sz-h: 132px; --sz-r: 14px; --sz-b: 12px; --sz-fx: -1; --sz-rot:  2deg; --sz-s: 0.95; }
.al-sello-zoom--perro      { --sz-w: 142px; --sz-h: 150px; --sz-r: 14px; --sz-b: 12px; --sz-fx: -1; --sz-rot: -1deg; --sz-s: 0.95; }
.al-sello-zoom--pato       { --sz-w: 156px; --sz-h: 144px; --sz-r: 14px; --sz-b: 12px; --sz-fx: -1; --sz-rot:  2deg; --sz-s: 0.95; }
.al-sello-zoom--buho       { --sz-w: 132px; --sz-h: 158px; --sz-r: 16px; --sz-b: 12px; --sz-fx:  1; --sz-rot: -2deg; --sz-s: 0.95; }
.al-sello-zoom--zorro      { --sz-w: 134px; --sz-h: 164px; --sz-r: 16px; --sz-b: 12px; --sz-fx: -1; --sz-rot: -2deg; --sz-s: 0.95; }
.al-sello-zoom--pulpo      { --sz-w: 174px; --sz-h: 130px; --sz-r: 14px; --sz-b: 12px; --sz-fx: -1; --sz-rot:  3deg; --sz-s: 0.95; }

/* En tarjetas con título abajo (.al-puerta, .al-camino, .al-sn-pc-card), el animal se ubica en el sector superior derecho con aire sobre la cabeza */
.al-puerta > .al-sello-zoom,
.al-camino > .al-sello-zoom,
.al-sn-pc-card > .al-sello-zoom {
  bottom: auto;
  top: 16px;
}
.al-puerta > .al-sello-zoom--golondrina,
.al-camino > .al-sello-zoom--golondrina,
.al-sn-pc-card > .al-sello-zoom--golondrina {
  top: 12px;
}

/* Contraste sobre tarjetas oscuras */
.al-mito-dorso > .al-sello-zoom,
.al-mito-home > .al-sello-zoom,
.al-camino > .al-sello-zoom,
.al-sn-pc-card > .al-sello-zoom,
.al-ra-uso > .al-sello-zoom,
.al-oscura.al-con-sello > .al-sello-zoom {
  color: rgba(207, 168, 239, 0.095);
}

/* Reacción sutil al pasar el cursor o enfocar */
.al-mito:hover .al-mito-cara > .al-sello-zoom,
.al-mito:focus-visible .al-mito-cara > .al-sello-zoom,
.al-con-sello:hover > .al-sello-zoom,
.al-con-sello:focus-visible > .al-sello-zoom {
  color: rgba(126, 23, 190, 0.145);
  transform: translate3d(-4px, -2px, 0) scaleX(var(--sz-fx)) rotate(calc(var(--sz-rot) + 2deg)) scale(calc(var(--sz-s) * 1.04));
}
.al-mito:hover .al-mito-dorso > .al-sello-zoom,
.al-mito:focus-visible .al-mito-dorso > .al-sello-zoom,
.al-mito-home:hover > .al-sello-zoom,
.al-camino:hover > .al-sello-zoom,
.al-camino:focus-visible > .al-sello-zoom,
.al-sn-pc-card:hover > .al-sello-zoom,
.al-sn-pc-card:focus-visible > .al-sello-zoom,
.al-ra-uso:hover > .al-sello-zoom,
.al-oscura.al-con-sello:hover > .al-sello-zoom {
  color: rgba(207, 168, 239, 0.22);
  transform: translate3d(-4px, -2px, 0) scaleX(var(--sz-fx)) rotate(calc(var(--sz-rot) + 2deg)) scale(calc(var(--sz-s) * 1.04));
}
@media (max-width: 600px) {
  .al-sello-zoom {
    transform: translate3d(0, 0, 0) scaleX(var(--sz-fx)) rotate(var(--sz-rot)) scale(calc(var(--sz-s) * 0.82));
  }
}
@media (prefers-reduced-motion: reduce) {
  .al-sello-zoom { transition: color 0.3s ease; }
}

/* ==========================================================================
   v40 · Home: 4 caminos en #sumate, El Sobre mejorado y Mini-Vitrina Flotante
   de la Tienda Solidaria (.al-ti-home)
   ========================================================================== */

/* 1. Cuatro caminos en #sumate (Donar, Voluntariado, Kit Activista, Tienda solidaria) */
.al-sumate-home .al-caminos {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 1199px) {
  .al-sumate-home .al-caminos {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .al-sumate-home .al-caminos {
    grid-template-columns: 1fr;
  }
}

/* 2. El Sobre en el pie y mejoras de navegación interna */
.al-sobre .al-sobre-tip {
  color: rgba(244, 239, 233, 0.62);
  transform: none;
}
html.al-js .al-sobre .al-sobre-tip {
  opacity: 0;
  transform: translateY(5px);
  transition: opacity .85s ease, transform .85s cubic-bezier(.2,.8,.2,1), color .3s ease;
}
html.al-js .al-sobre.al-pista-visible .al-sobre-tip,
html.al-js .al-sobre:hover .al-sobre-tip,
html.al-js .al-sobre:focus-visible .al-sobre-tip {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  html.al-js .al-sobre .al-sobre-tip { transform: none; transition: opacity .15s ease; }
}
.al-sobre .al-sobre-tip em {
  font-style: normal;
  font-family: var(--sans, 'Outfit', sans-serif);
  font-size: 0.78rem;
  letter-spacing: 0.04em;
  color: rgba(207, 168, 239, 0.72);
  margin-left: 4px;
}
.al-sobre:hover .al-sobre-tip,
.al-sobre:focus-visible .al-sobre-tip {
  color: #fff;
}
.al-sobre:hover .al-sobre-tip em,
.al-sobre:focus-visible .al-sobre-tip em {
  color: var(--lila);
}

.al-sx-pips button {
  padding: 0;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 1px solid rgba(207, 168, 239, 0.55);
  background: transparent;
  cursor: pointer;
  transition: transform 0.25s ease, background 0.5s ease, border-color 0.5s ease, box-shadow 0.5s ease;
}
.al-sx-pips button:hover,
.al-sx-pips button:focus-visible {
  transform: scale(1.45);
  border-color: #fff;
  outline: none;
}
.al-sx-pips button.al-on {
  background: #f08c78;
  border-color: #f08c78;
  box-shadow: 0 0 8px rgba(240, 140, 120, 0.75);
}
.al-sx-pips button.al-actual {
  transform: scale(1.5);
  border-color: #fff;
  background: #cfa8ef;
  box-shadow: 0 0 10px rgba(207, 168, 239, 0.95);
}
.al-sx-prom-directo {
  margin-left: 8px;
  padding: 3px 10px;
  border-radius: 99px;
  border: 1px solid rgba(240, 92, 64, 0.55);
  background: rgba(240, 92, 64, 0.12);
  color: #fff;
  font-family: var(--sans, 'Outfit', sans-serif);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background 0.25s ease, border-color 0.25s ease;
}
.al-sx-prom-directo:hover {
  background: rgba(240, 92, 64, 0.28);
  border-color: #f05c40;
}
.al-sx-texto {
  cursor: pointer;
}
.al-sx-carta-pie {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 24px;
  margin-top: 28px;
}
.al-sx-carta-pie .al-sx-soltar,
.al-sx-carta-pie .al-sx-sig {
  margin-top: 0;
  padding: 0 0 4px;
  border: 0;
  border-bottom: 1px solid rgba(244, 239, 233, 0.26);
  background: none;
  color: rgba(244, 239, 233, 0.65);
  font: inherit;
  font-size: 0.85rem;
  cursor: pointer;
  opacity: 0;
  transition: opacity 1.2s ease 0.5s, color 0.3s ease, border-color 0.3s ease;
}
.al-sx-carta-pie .al-sx-sig {
  color: #cfa8ef;
  border-bottom-color: rgba(207, 168, 239, 0.45);
}
.al-sx--foco .al-sx-carta:not(.al-sx-sale) .al-sx-soltar,
.al-sx--foco .al-sx-carta:not(.al-sx-sale) .al-sx-sig,
.al-sx-leida .al-sx-soltar,
.al-sx-leida .al-sx-sig {
  opacity: 1;
}
.al-sx-carta-pie .al-sx-soltar:hover,
.al-sx-carta-pie .al-sx-sig:hover {
  color: #fff;
  border-bottom-color: #f05c40;
}
.al-sx--final .al-sx-final-k { transition-delay: 0.3s; }
.al-sx--final .al-sx-promesa { transition-delay: 0.9s; }
.al-sx--final .al-sx-final h2 { transition-delay: 1.7s; }
.al-sx--final .al-sx-f1 { transition-delay: 2.4s; }
.al-sx--final .al-sx-fin-acc { transition-delay: 3.0s; }
.al-sx--final .al-sx-susurros { transition-delay: 3.4s; }
/* The sky uses cool starlight, including the listening-progress indicators. */
.al-sx-pips button.al-on { background: #d4baf2; border-color: #d4baf2; box-shadow: 0 0 8px rgba(208,184,246,.45); }

/* 3. Vitrina flotante de la Tienda solidaria en el Home (.al-ti-home) — v41, rediseño de marca
   Cápsula: foto real de la pieza, rótulo de marca, nombre en la tipografía del sitio y avance con el degradé institucional. */
.al-ti-home { position: fixed; left: clamp(16px, 2.6vw, 38px); bottom: 26px; z-index: 32; font-family: var(--texto-f, "Outfit", sans-serif); pointer-events: none; opacity: 0; transform: translateY(14px); transition: opacity .45s cubic-bezier(.22,1,.36,1), transform .45s cubic-bezier(.22,1,.36,1), bottom .35s; }
.al-ti-home.al-visible { opacity: 1; transform: none; pointer-events: auto; }
/* el botón del equipo vive en la misma esquina: mientras esté en su lugar, la tienda sube */
body:has(.al-equipo-flot:not(.al-movido)) .al-ti-home { bottom: 86px; }

.al-ti-home-btn { position: relative; display: flex; align-items: center; gap: 13px; max-width: min(340px, calc(100vw - 32px)); padding: 7px 8px 7px 7px; border: 1px solid rgba(243,239,233,.12); border-radius: 22px; background: #140c18; color: #F4EFE9; text-align: left; cursor: pointer; overflow: hidden; box-shadow: 0 22px 46px -18px rgba(8,3,12,.7), 0 0 0 1px rgba(0,0,0,.2); transition: transform .35s cubic-bezier(.22,1,.36,1), border-color .3s, box-shadow .3s; }
.al-ti-home-btn:hover, .al-ti-home-btn:focus-visible { transform: translateY(-2px); border-color: rgba(207,168,239,.4); box-shadow: 0 28px 56px -18px rgba(8,3,12,.8), 0 0 0 1px rgba(0,0,0,.2); outline: none; }
.al-ti-home-btn:focus-visible { box-shadow: 0 0 0 3px rgba(182,92,240,.55), 0 28px 56px -18px rgba(8,3,12,.8); }
.al-th-fotos { position: relative; flex: none; width: 52px; height: 52px; border-radius: 15px; overflow: hidden; background: #F4EFE9; }
.al-th-fotos img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.12); transition: opacity .7s ease, transform 1.4s cubic-bezier(.22,1,.36,1); }
.al-th-fotos img.al-on { opacity: 1; transform: scale(1); }
.al-ti-home-btn:hover .al-th-fotos img.al-on { transform: scale(1.06); }
.al-ti-home-txt { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
.al-ti-home-txt b { display: flex; align-items: center; gap: 8px; font-size: .6rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: #CFA8EF; }
.al-ti-home-txt b::before { content: ""; width: 14px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #8A00C6, #E93B24); }
.al-th-nombre { display: block; overflow: hidden; height: 1.3em; }
.al-th-nombre em { display: block; font-family: var(--display); font-style: normal; font-weight: 500; font-size: .98rem; line-height: 1.3; letter-spacing: -0.015em; color: #F4EFE9; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: transform .38s cubic-bezier(.22,1,.36,1), opacity .38s; }
.al-th-nombre em.al-sale { transform: translateY(-110%); opacity: 0; }
.al-th-nombre em.al-llega { transform: translateY(110%); opacity: 0; transition: none; }
.al-th-ir { position: relative; flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, #8A00C6 0%, #D3114B 70%, #F21727 100%); color: #fff; transition: transform .35s cubic-bezier(.22,1,.36,1); }
.al-th-ir svg { width: 18px; height: 18px; }
.al-ti-home-btn:hover .al-th-ir { transform: rotate(-8deg) scale(1.05); }
.al-ti-home-badge { position: absolute; top: -3px; right: -3px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 999px; border: 2px solid #140c18; background: #F4EFE9; color: #140c18; font-size: .64rem; font-weight: 700; line-height: 14px; text-align: center; }
.al-ti-home-badge[hidden] { display: none; }
.al-th-prog { position: absolute; left: 72px; right: 60px; bottom: 6px; height: 2px; border-radius: 2px; background: rgba(243,239,233,.08); overflow: hidden; }
.al-th-prog i { position: absolute; inset: 0; background: linear-gradient(90deg, #8A00C6, #E93B24); transform: scaleX(0); transform-origin: left; }
.al-th-prog.al-corre i { animation: al-th-avance 4.2s linear forwards; }
.al-ti-home.al-pausa .al-th-prog i { animation-play-state: paused; }
.al-ti-home.al-con-bolsa .al-th-prog { opacity: 0; }
@keyframes al-th-avance { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* Compacta: tras presentarse, la cápsula se recoge en la bolsita (vuelve a desplegarse al pasar el mouse o enfocarla) */
.al-ti-home-btn { transition: transform .35s cubic-bezier(.22,1,.36,1), border-color .3s, box-shadow .3s, padding .6s cubic-bezier(.22,1,.36,1), gap .6s cubic-bezier(.22,1,.36,1), border-radius .6s cubic-bezier(.22,1,.36,1); }
.al-th-fotos { transition: width .6s cubic-bezier(.22,1,.36,1), opacity .35s ease; }
.al-ti-home-txt { max-width: 230px; transition: max-width .6s cubic-bezier(.22,1,.36,1), opacity .3s ease; }
.al-th-ir { transition: transform .35s cubic-bezier(.22,1,.36,1), width .6s cubic-bezier(.22,1,.36,1), height .6s cubic-bezier(.22,1,.36,1); }
.al-th-prog { transition: opacity .3s; }
.al-ti-home.al-compacto .al-ti-home-btn { gap: 0; padding: 5px; border-radius: 30px; }
.al-ti-home.al-compacto .al-th-fotos { width: 0; opacity: 0; }
.al-ti-home.al-compacto .al-ti-home-txt { max-width: 0; opacity: 0; }
.al-ti-home.al-compacto .al-th-prog { opacity: 0; }
.al-ti-home.al-compacto .al-th-ir { width: 48px; height: 48px; }
.al-ti-home.al-compacto .al-th-ir svg { width: 20px; height: 20px; }
.al-th-ir::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 1.5px solid #D3114B; opacity: 0; pointer-events: none; }
.al-ti-home.al-compacto .al-th-ir::after { animation: al-th-llamado 2.4s .7s ease-out 2; }
@keyframes al-th-llamado { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(1.7); opacity: 0; } }

/* Panel */
.al-ti-home-pop { position: absolute; left: 0; bottom: calc(100% + 12px); width: min(392px, calc(100vw - 32px)); max-height: calc(100vh - 140px); overflow: auto; overscroll-behavior: contain; padding: 22px; border: 1px solid rgba(243,239,233,.1); border-radius: 26px; background: #140c18; color: #F4EFE9; box-shadow: 0 40px 90px -30px rgba(8,3,12,.85); transform-origin: 28px 100%; opacity: 0; transform: translateY(18px) scale(.94); transition: opacity .24s ease, transform .3s cubic-bezier(.4,0,.2,1); }
.al-ti-home.al-abierto .al-ti-home-pop { opacity: 1; transform: none; transition: opacity .4s ease, transform .6s cubic-bezier(.16,1,.3,1); }
/* el contenido entra escalonado: encabezado, cada pieza y el llamado final */
.al-ti-home-cab, .al-ti-home-item, .al-ti-home-pie { opacity: 0; transform: translateY(12px); transition: opacity .2s ease, transform .2s ease; }
.al-ti-home.al-abierto .al-ti-home-cab, .al-ti-home.al-abierto .al-ti-home-item, .al-ti-home.al-abierto .al-ti-home-pie { opacity: 1; transform: none; transition: opacity .5s ease, transform .6s cubic-bezier(.16,1,.3,1); }
.al-ti-home.al-abierto .al-ti-home-cab { transition-delay: .08s; }
.al-ti-home.al-abierto .al-ti-home-item:nth-child(1) { transition-delay: .16s; }
.al-ti-home.al-abierto .al-ti-home-item:nth-child(2) { transition-delay: .21s; }
.al-ti-home.al-abierto .al-ti-home-item:nth-child(3) { transition-delay: .26s; }
.al-ti-home.al-abierto .al-ti-home-item:nth-child(4) { transition-delay: .31s; }
.al-ti-home.al-abierto .al-ti-home-pie { transition-delay: .38s; }
.al-ti-home.al-abierto .al-ti-home-btn { border-color: rgba(207,168,239,.45); }
.al-ti-home-pop[hidden] { display: none; }
.al-ti-home-pop::before { content: ""; position: absolute; left: 22px; right: 22px; top: 0; height: 2px; border-radius: 0 0 2px 2px; background: linear-gradient(90deg, #8A00C6, #D3114B 70%, #F21727); }
.al-ti-home-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
.al-ti-home-k { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; font-size: .62rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: #CFA8EF !important; }
.al-ti-home-k i { width: 6px; height: 6px; border-radius: 50%; background: #E93B24; }
.al-ti-home-cab h3 { margin: 0; font-family: var(--display); font-weight: 500; font-size: 1.42rem; line-height: 1.08; letter-spacing: -0.03em; color: #F4EFE9; }
.al-ti-home-cab h3 em { font-family: "Instrument Serif", serif; font-style: italic; font-weight: 400; color: #E9786A; }
.al-ti-home-sub { margin: 10px 0 0; font-size: .84rem; line-height: 1.5; color: rgba(244,239,233,.66) !important; }
.al-ti-home-x { flex: none; display: grid; place-items: center; width: 34px; height: 34px; padding: 0; border: 1px solid rgba(244,239,233,.18); border-radius: 50%; background: transparent; color: #F4EFE9; cursor: pointer; transition: background .25s, border-color .25s; }
.al-ti-home-x svg { width: 16px; height: 16px; }
.al-ti-home-x:hover, .al-ti-home-x:focus-visible { background: rgba(244,239,233,.08); border-color: rgba(244,239,233,.4); outline: none; }
.al-ti-home-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; }
.al-ti-home-item { display: flex; flex-direction: column; min-width: 0; }
.al-ti-home-thumb { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: 16px; overflow: hidden; background: #F4EFE9; }
.al-ti-home-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s cubic-bezier(.22,1,.36,1); }
.al-ti-home-item:hover .al-ti-home-thumb img { transform: scale(1.05); }
.al-ti-home-item.al-en .al-ti-home-thumb { box-shadow: 0 0 0 2px #140c18, 0 0 0 4px #B65CF0; }
.al-ti-home-meta { display: flex; flex-direction: column; flex: 1; gap: 4px; padding-top: 10px; }
.al-ti-home-meta > span { font-size: .58rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: rgba(207,168,239,.85); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.al-ti-home-meta h4 { margin: 0; font-family: var(--display); font-weight: 500; font-size: .9rem; line-height: 1.22; letter-spacing: -0.01em; }
.al-ti-home-meta h4 a { color: #F4EFE9 !important; text-decoration: none; }
.al-ti-home-meta h4 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.al-ti-home-add { align-self: flex-start; margin-top: auto; padding: 7px 12px; border: 1px solid rgba(244,239,233,.22); border-radius: 999px; background: transparent; color: #F4EFE9; font: 600 .72rem/1 var(--texto-f, "Outfit", sans-serif); letter-spacing: .02em; cursor: pointer; transition: background .25s, border-color .25s, color .25s; }
.al-ti-home-meta h4 + .al-ti-home-add { margin-top: 10px; }
.al-ti-home-add:hover, .al-ti-home-add:focus-visible { border-color: #CFA8EF; background: rgba(207,168,239,.1); outline: none; }
.al-ti-home-add[aria-pressed="true"] { border-color: transparent; background: linear-gradient(135deg, #8A00C6, #D3114B 70%, #F21727); color: #fff; }
.al-ti-home-pie { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; }
.al-ti-home-ir { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 20px; border-radius: 999px; background: #F4EFE9; color: #140c18 !important; font-weight: 600; font-size: .9rem; text-decoration: none; transition: background .3s, color .3s; }
.al-ti-home-ir .al-icono { width: 18px; height: 18px; transition: transform .3s; }
.al-ti-home-ir:hover, .al-ti-home-ir:focus-visible { background: linear-gradient(135deg, #8A00C6, #D3114B 70%, #F21727); color: #fff !important; outline: none; }
.al-ti-home-ir:hover .al-icono { transform: translateX(4px); }
.al-ti-home-aviso { display: block; text-align: center; font-size: .82rem; color: #CFA8EF !important; text-decoration: underline; text-underline-offset: 3px; }
.al-ti-home-aviso[hidden] { display: none; }
/* con el menú, el cuaderno o El Sobre abiertos, la vitrina se retira */
html.al-menu-abierto .al-ti-home, html.al-cu-abierto .al-ti-home, html.al-sx-abierto .al-ti-home { opacity: 0 !important; pointer-events: none !important; }
@media (max-width: 767px) {
  .al-ti-home { left: 14px; bottom: 16px; }
  body:has(.al-equipo-flot:not(.al-movido)) .al-ti-home { bottom: 70px; }
  .al-ti-home-btn { gap: 10px; }
  .al-th-fotos { width: 46px; height: 46px; border-radius: 13px; }
  .al-th-prog { left: 64px; }
  .al-ti-home-pop { padding: 18px; }
  .al-ti-home-grid { gap: 14px 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .al-th-fotos img, .al-th-nombre em, .al-ti-home-btn, .al-th-ir, .al-ti-home-pop, .al-ti-home-cab, .al-ti-home-item, .al-ti-home-pie { transition: none !important; }
  .al-ti-home-cab, .al-ti-home-item, .al-ti-home-pie { opacity: 1; transform: none; }
  .al-th-prog { display: none; }
  .al-th-fotos, .al-ti-home-txt, .al-th-ir { transition: none !important; }
  .al-ti-home.al-compacto .al-th-ir::after { animation: none; }
}

/* ==========================================================================
   v40 · Alita: Botonera interactiva de capítulos y scroll fluido
   ========================================================================== */
.al-al-pips {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.al-al-pip {
  padding: 4px 9px;
  border-radius: 99px;
  border: 1px solid rgba(244, 239, 233, 0.16);
  background: rgba(244, 239, 233, 0.04);
  color: rgba(244, 239, 233, 0.55);
  font-family: var(--sans, 'Outfit', sans-serif);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  cursor: pointer;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.2s ease;
}
.al-al-pip:hover {
  color: #fff;
  border-color: rgba(207, 168, 239, 0.45);
}
.al-al-pip.al-on {
  background: linear-gradient(135deg, #7E17BE, #E93B24);
  border-color: transparent;
  color: #fff;
  transform: translateY(-1px);
}
@media (max-width: 767px) {
  .al-al-pips { display: none; }
}

/* ==========================================================================
   v40 · Rediseño Editorial del Equipo («La bandada detrás» · #equipo)
   ========================================================================== */
.al-eq-top-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 18px 28px;
  margin-bottom: 34px;
  padding: 18px 24px;
  border-radius: 20px;
  background: #fff;
  border: 1px solid var(--linea);
  box-shadow: 0 18px 42px -28px rgba(20, 10, 32, 0.18);
}
.al-eq-top-bar .al-eq-chips {
  margin-bottom: 0;
}
.al-eq-chip small {
  display: inline-block;
  margin-left: 5px;
  padding: 1px 7px;
  border-radius: 99px;
  background: rgba(43, 37, 37, 0.08);
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
}
.al-eq-chip.al-on small {
  background: rgba(255, 255, 255, 0.22);
  color: #fff;
}
.al-eq-mapa-mini {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  font-size: 0.8rem;
  color: var(--texto-2);
}
.al-eq-mapa-mini span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 500;
}
.al-eq-mapa-mini i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: linear-gradient(135deg, #7E17BE, #E93B24);
}

.al-eq-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}
.al-eq,
.al-eq:nth-child(n) {
  position: relative;
  display: flex;
  flex-direction: column;
  border-radius: 22px;
  background: #fff;
  border: 1px solid var(--linea);
  overflow: hidden;
  transform: none !important;
  box-shadow: 0 16px 36px -26px rgba(18, 10, 28, 0.2);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease, border-color 0.3s ease, opacity 0.3s ease;
}
.al-eq:hover,
.al-eq:focus-within {
  transform: translateY(-4px) !important;
  border-color: rgba(126, 23, 190, 0.38);
  box-shadow: 0 24px 48px -22px rgba(126, 23, 190, 0.25);
}
.al-eq.al-fuera {
  display: none !important;
}
/* Fundador destacado con diseño horizontal compacto de doble columna */
.al-eq--fundador {
  grid-column: span 2;
  display: grid !important;
  grid-template-columns: auto 1fr;
  align-items: center;
  background: linear-gradient(135deg, #160f20 0%, #241634 100%) !important;
  color: #f4efe9;
  border-color: rgba(207, 168, 239, 0.24) !important;
}
.al-eq-foto,
.al-eq:nth-child(n) .al-eq-foto {
  position: relative;
  margin: 0;
  padding: 20px 20px 0 !important;
  aspect-ratio: auto !important;
  min-height: 0 !important;
  height: auto !important;
  border-radius: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
}
.al-eq--fundador .al-eq-foto,
.al-eq--fundador:nth-child(n) .al-eq-foto {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 26px 8px 26px 28px !important;
  gap: 12px;
}
.al-eq-foto::after {
  display: none !important;
}
.al-eq-foto img,
.al-eq:nth-child(n) .al-eq-foto img {
  order: 1;
  width: 82px !important;
  height: 82px !important;
  border-radius: 22px !important;
  object-fit: cover;
  object-position: center 18%;
  flex-shrink: 0;
  background: #e9e2d8;
  border: 2px solid rgba(126, 23, 190, 0.15);
  box-shadow: 0 12px 24px -10px rgba(20, 10, 32, 0.25);
  filter: saturate(0.95) contrast(1.03) !important;
  mix-blend-mode: normal !important;
  opacity: 1 !important;
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.35s ease, filter 0.35s ease !important;
}
.al-eq--fundador .al-eq-foto img,
.al-eq--fundador:nth-child(n) .al-eq-foto img {
  width: 118px !important;
  height: 118px !important;
  border-radius: 28px !important;
  border: 2px solid rgba(207, 168, 239, 0.42);
  box-shadow: 0 16px 34px -12px rgba(0, 0, 0, 0.55);
}
.al-eq:hover .al-eq-foto img,
.al-eq:focus-within .al-eq-foto img {
  transform: scale(1.04) translateY(-1px);
  border-color: rgba(126, 23, 190, 0.45);
  filter: saturate(1.04) contrast(1.05) !important;
}
.al-eq--fundador:hover .al-eq-foto img {
  border-color: #cfa8ef;
}

.al-eq-badges {
  order: 2;
  position: static !important;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 5px;
  pointer-events: none;
}
.al-eq--fundador .al-eq-badges {
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.al-eq-num {
  font-family: var(--serif);
  font-style: italic;
  font-size: 0.84rem;
  padding: 2px 9px;
  border-radius: 99px;
  background: rgba(126, 23, 190, 0.08);
  color: var(--violeta);
  border: 1px solid rgba(126, 23, 190, 0.16);
}
.al-eq--fundador .al-eq-num {
  background: rgba(255, 255, 255, 0.1);
  color: #cfa8ef;
  border-color: rgba(207, 168, 239, 0.25);
}
.al-eq-pais {
  font-size: 0.62rem;
  font-weight: 600;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  padding: 3px 9px;
  border-radius: 99px;
  background: rgba(43, 37, 37, 0.06);
  color: var(--texto-2);
}
.al-eq--fundador .al-eq-pais {
  background: rgba(244, 239, 233, 0.14);
  color: #f4efe9;
}

.al-eq-info {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 14px 20px 20px !important;
}
.al-eq--fundador .al-eq-info {
  padding: 24px 26px 24px 18px !important;
  justify-content: center;
}
.al-eq-totem {
  position: absolute;
  right: 12px;
  bottom: 12px;
  width: 74px;
  height: 66px;
  fill: currentColor;
  color: rgba(126, 23, 190, 0.065);
  pointer-events: none;
  transform: scaleX(-1);
  transition: transform 0.5s ease, color 0.4s ease;
}
.al-eq--fundador .al-eq-totem {
  width: 118px;
  height: 104px;
  color: rgba(207, 168, 239, 0.09);
}
.al-eq:hover .al-eq-totem {
  color: rgba(126, 23, 190, 0.13);
  transform: scaleX(-1) translate(-3px, -3px) scale(1.05);
}
.al-eq--fundador:hover .al-eq-totem {
  color: rgba(207, 168, 239, 0.16);
}

.al-eq-area {
  position: static !important;
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  margin-bottom: 5px !important;
  padding: 0 !important;
  background: none !important;
  font-size: 0.65rem !important;
  font-weight: 600;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--violeta) !important;
}
.al-eq-area::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: linear-gradient(135deg, #7E17BE, #E93B24);
}
.al-eq--fundador .al-eq-area {
  color: #cfa8ef !important;
}

.al-eq-info h3 {
  margin: 0 0 2px !important;
  font-family: var(--display);
  font-size: 1.2rem !important;
  letter-spacing: -0.02em;
  color: var(--texto);
}
.al-eq--fundador .al-eq-info h3 {
  font-size: 1.6rem !important;
  color: #fff;
}
.al-eq-cargo {
  margin: 0 0 9px !important;
  font-size: 0.85rem !important;
  font-weight: 500;
  color: var(--texto-2) !important;
}
.al-eq--fundador .al-eq-cargo {
  color: rgba(244, 239, 233, 0.78) !important;
}
.al-eq-foco {
  margin: 0 0 14px !important;
  padding-top: 9px;
  border-top: 1px dashed var(--linea);
  font-size: 0.81rem !important;
  line-height: 1.46;
  color: var(--texto-2) !important;
}
.al-eq--fundador .al-eq-foco {
  border-top-color: rgba(244, 239, 233, 0.16);
  color: rgba(244, 239, 233, 0.82) !important;
  font-size: 0.88rem !important;
}
.al-eq-acc {
  margin-top: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 10px;
  position: relative;
  z-index: 2;
}
.al-eq-mail {
  font-size: 0.76rem !important;
  font-weight: 500;
  color: var(--violeta) !important;
  text-decoration: none;
}
.al-eq--fundador .al-eq-mail {
  color: #cfa8ef !important;
}
.al-eq-mail:hover {
  text-decoration: underline;
}
.al-eq-copy {
  padding: 3px 9px;
  border-radius: 99px;
  border: 1px solid var(--linea);
  background: rgba(43, 37, 37, 0.04);
  color: var(--texto-2);
  font: inherit;
  font-size: 0.68rem;
  font-weight: 500;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.al-eq-copy:hover,
.al-eq-copy.al-copiado {
  background: var(--violeta);
  border-color: var(--violeta);
  color: #fff;
}
.al-eq--fundador .al-eq-copy {
  border-color: rgba(244, 239, 233, 0.22);
  background: rgba(244, 239, 233, 0.08);
  color: #f4efe9;
}

@media (max-width: 1180px) {
  .al-eq-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .al-eq-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .al-eq--fundador { grid-column: 1 / -1; }
}
@media (max-width: 600px) {
  .al-eq-grid { grid-template-columns: 1fr; }
  .al-eq--fundador { grid-template-columns: 1fr; }
  .al-eq--fundador .al-eq-foto,
  .al-eq--fundador:nth-child(n) .al-eq-foto {
    flex-direction: row;
    justify-content: space-between;
    padding: 20px 20px 0 !important;
  }
  .al-eq--fundador .al-eq-foto img,
  .al-eq--fundador:nth-child(n) .al-eq-foto img {
    width: 92px !important;
    height: 92px !important;
  }
}

/* ==========================================================================
   v40 · Educación: Flotante Directora de Educación (.al-edu-flot)
   ========================================================================== */
.al-edu-flot {
  position: fixed;
  left: clamp(16px, 2.6vw, 38px);
  bottom: 26px;
  z-index: 32;
  font-family: var(--sans, 'Outfit', sans-serif);
  pointer-events: none;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 0.45s cubic-bezier(0.22, 1, 0.36, 1), transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.al-edu-flot.al-visible {
  opacity: 1;
  transform: none;
  pointer-events: auto;
}
html.al-menu-abierto .al-edu-flot,
html.al-cu-abierto .al-edu-flot,
html.al-sx-abierto .al-edu-flot {
  opacity: 0 !important;
  pointer-events: none !important;
}
.al-ef-btn {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  padding: 6px 16px 6px 6px;
  border-radius: 999px;
  border: 1px solid rgba(207, 168, 239, 0.32);
  background: rgba(14, 9, 22, 0.9);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  color: #f4efe9;
  cursor: pointer;
  box-shadow: 0 16px 38px -12px rgba(8, 4, 14, 0.72), 0 0 0 1px rgba(126, 23, 190, 0.18);
  transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.3s ease, box-shadow 0.3s ease;
}
.al-ef-btn:hover,
.al-edu-flot.al-abierto .al-ef-btn {
  transform: translateY(-2px);
  border-color: rgba(233, 59, 36, 0.65);
  box-shadow: 0 20px 44px -12px rgba(126, 23, 190, 0.55);
}
.al-ef-mini {
  position: relative;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  flex-shrink: 0;
}
.al-ef-mini img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  border: 1.5px solid #cfa8ef;
}
.al-ef-mini i {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: #2bd47d;
  border: 2px solid #120b1b;
}
.al-ef-txt {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  line-height: 1.18;
}
.al-ef-txt b {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #cfa8ef;
}
.al-ef-txt b i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #E93B24;
}
.al-ef-txt em {
  font-style: normal;
  font-size: 0.82rem;
  font-weight: 500;
  color: #fff;
}

.al-ef-pop {
  position: absolute;
  left: 0;
  bottom: calc(100% + 12px);
  width: min(390px, calc(100vw - 32px));
  padding: 20px;
  border-radius: 22px;
  border: 1px solid rgba(207, 168, 239, 0.28);
  background: rgba(14, 9, 22, 0.96);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
  color: #f4efe9;
  box-shadow: 0 28px 68px -12px rgba(0, 0, 0, 0.85);
  opacity: 0;
  transform: translateY(10px) scale(0.97);
  transform-origin: bottom left;
  transition: opacity 0.26s ease, transform 0.28s cubic-bezier(0.22, 1, 0.36, 1);
}
.al-edu-flot.al-abierto .al-ef-pop {
  opacity: 1;
  transform: none;
}
.al-ef-cab {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 12px;
}
.al-ef-persona {
  display: flex;
  align-items: center;
  gap: 12px;
}
.al-ef-avatar {
  position: relative;
  width: 54px;
  height: 54px;
  flex-shrink: 0;
}
.al-ef-avatar img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid rgba(207, 168, 239, 0.55);
}
.al-ef-avatar i {
  position: absolute;
  right: 1px;
  bottom: 1px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #2bd47d;
  border: 2px solid #120b1b;
}
.al-ef-k {
  display: block;
  font-size: 0.64rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #cfa8ef;
}
.al-ef-persona h3 {
  margin: 2px 0;
  font-size: 1.12rem;
  color: #fff;
}
.al-ef-persona p {
  margin: 0;
  font-size: 0.78rem;
  color: rgba(244, 239, 233, 0.68);
}
.al-ef-x {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(244, 239, 233, 0.75);
  display: grid;
  place-items: center;
  cursor: pointer;
}
.al-ef-x svg { width: 14px; height: 14px; }
.al-ef-cita {
  margin: 0 0 12px;
  padding: 10px 13px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  border-left: 2px solid #cfa8ef;
  font-family: var(--serif);
  font-style: italic;
  font-size: 0.94rem;
  line-height: 1.38;
  color: rgba(244, 239, 233, 0.9);
}
.al-ef-lbl {
  margin: 0 0 8px;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: rgba(244, 239, 233, 0.6);
}
.al-ef-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 14px;
}
.al-ef-chip {
  padding: 6px 11px;
  border-radius: 99px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.04);
  color: rgba(244, 239, 233, 0.82);
  font: inherit;
  font-size: 0.73rem;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.al-ef-chip:hover { border-color: #cfa8ef; color: #fff; }
.al-ef-chip.al-on {
  background: rgba(126, 23, 190, 0.38);
  border-color: #cfa8ef;
  color: #fff;
  font-weight: 500;
}
.al-ef-acc {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.09);
}
.al-ef-btn-pri {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 99px;
  background: linear-gradient(100deg, #7E17BE, #B42A9A 55%, #E93B24);
  color: #fff !important;
  font-size: 0.82rem;
  font-weight: 600;
  text-decoration: none;
}
.al-ef-btn-pri .al-icono { width: 14px; height: 14px; }
.al-ef-sec-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.al-ef-mailto {
  font-size: 0.78rem;
  color: #cfa8ef !important;
  text-decoration: none;
}
.al-ef-copy {
  padding: 4px 10px;
  border-radius: 99px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.05);
  color: #f4efe9;
  font: inherit;
  font-size: 0.7rem;
  cursor: pointer;
}
@media (max-width: 767px) {
  .al-edu-flot { left: 14px; bottom: 16px; }
  .al-ef-txt em { max-width: 155px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

/* ==========================================================================
   v40 · Educación: Brújula de Aprendizaje (.al-edu-brujula) y mejoras estratégicas de .al-pfi
   ========================================================================== */
.al-edu-brujula {
  padding: clamp(26px, 3.5vw, 44px);
  border-radius: 26px;
  background: linear-gradient(145deg, #160f20 0%, #221531 100%);
  color: #f4efe9;
  border: 1px solid rgba(207, 168, 239, 0.2);
  box-shadow: 0 28px 64px -28px rgba(14, 8, 24, 0.55);
  margin-bottom: clamp(36px, 5vw, 64px);
}
.al-br-cab {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: flex-end;
  gap: 16px 32px;
  margin-bottom: 24px;
}
.al-br-cab h3 {
  margin: 6px 0 0;
  font-family: var(--display);
  font-size: clamp(1.5rem, 1.15rem + 1.2vw, 2.2rem);
  letter-spacing: -0.02em;
  color: #fff;
}
.al-br-cab h3 em {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  color: #cfa8ef;
}
.al-br-cab p {
  margin: 0;
  max-width: 34rem;
  font-size: 0.94rem;
  color: rgba(244, 239, 233, 0.74);
}
.al-br-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 22px;
}
.al-br-tab {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  padding: 14px 16px;
  border-radius: 16px;
  border: 1px solid rgba(244, 239, 233, 0.12);
  background: rgba(244, 239, 233, 0.04);
  color: rgba(244, 239, 233, 0.8);
  font: inherit;
  text-align: left;
  cursor: pointer;
  transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}
.al-br-tab span {
  font-family: var(--serif);
  font-style: italic;
  font-size: 0.92rem;
  color: #cfa8ef;
}
.al-br-tab b {
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.28;
  color: #fff;
}
.al-br-tab:hover {
  border-color: rgba(207, 168, 239, 0.42);
  transform: translateY(-2px);
}
.al-br-tab.al-on {
  background: linear-gradient(135deg, rgba(126, 23, 190, 0.45), rgba(233, 59, 36, 0.28));
  border-color: #cfa8ef;
}
.al-br-panel {
  display: grid;
  grid-template-columns: 1fr 1.35fr;
  gap: 24px;
  align-items: center;
  padding: 22px 24px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid rgba(255, 255, 255, 0.1);
  animation: al-pfi-in 0.4s ease;
}
.al-br-panel[hidden] { display: none !important; }
.al-br-ruta-txt span {
  display: inline-block;
  margin-bottom: 6px;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #f08c78;
}
.al-br-ruta-txt h4 {
  margin: 0 0 8px;
  font-size: 1.28rem;
  color: #fff;
}
.al-br-ruta-txt p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.5;
  color: rgba(244, 239, 233, 0.78);
}
.al-br-cursos {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.al-br-curso {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 8px;
  padding: 14px 16px;
  border-radius: 14px;
  background: rgba(14, 9, 22, 0.65);
  border: 1px solid rgba(207, 168, 239, 0.2);
  color: #fff !important;
  text-decoration: none;
  transition: border-color 0.25s ease, transform 0.25s ease;
}
.al-br-curso:hover {
  border-color: #f08c78;
  transform: translateY(-2px);
}
.al-br-curso small {
  font-size: 0.68rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #cfa8ef;
}
.al-br-curso b {
  font-size: 0.94rem;
  line-height: 1.25;
}
.al-br-curso i {
  font-style: normal;
  font-size: 0.78rem;
  color: #f08c78;
}
@media (max-width: 991px) {
  .al-br-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .al-br-panel { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .al-br-tabs, .al-br-cursos { grid-template-columns: 1fr; }
}

/* Programa Formativo Interdisciplinar (.al-pfi) · Arquitectura estratégica */
.al-pfi-pilares-vista {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: clamp(32px, 4vw, 48px);
}
.al-pfi-pilar-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 24px;
  border-radius: 20px;
  background: linear-gradient(160deg, rgba(244, 239, 233, 0.07), rgba(244, 239, 233, 0.025));
  border: 1px solid rgba(207, 168, 239, 0.2);
  overflow: hidden;
  transition: border-color 0.3s ease, transform 0.3s ease;
}
.al-pfi-pilar-card:hover {
  border-color: rgba(233, 59, 36, 0.55);
  transform: translateY(-3px);
}
.al-pfi-pilar-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}
.al-pfi-pilar-num {
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.35rem;
  color: #cfa8ef;
}
.al-pfi-pilar-hrs {
  padding: 4px 10px;
  border-radius: 99px;
  background: rgba(233, 59, 36, 0.18);
  border: 1px solid rgba(233, 59, 36, 0.4);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: #fff;
}
.al-pfi-pilar-card h3 {
  margin: 0 0 6px;
  font-family: var(--display);
  font-size: 1.35rem;
  color: #fff;
}
.al-pfi-pilar-doc {
  margin: 0 0 14px;
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.02rem;
  color: #cfa8ef;
}
.al-pfi-pilar-card ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}
.al-pfi-pilar-card li {
  position: relative;
  padding-left: 16px;
  font-size: 0.86rem;
  line-height: 1.42;
  color: rgba(244, 239, 233, 0.78);
}
.al-pfi-pilar-card li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 7px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: linear-gradient(135deg, #7E17BE, #E93B24);
}

.al-pfi-simulador {
  margin-top: 26px;
  padding: 24px 28px;
  border-radius: 22px;
  background: rgba(244, 239, 233, 0.045);
  border: 1px solid rgba(244, 239, 233, 0.14);
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 24px;
  align-items: center;
}
.al-pfi-sim-izq span {
  display: block;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #cfa8ef;
  margin-bottom: 6px;
}
.al-pfi-sim-izq h4 {
  margin: 0 0 12px;
  font-family: var(--display);
  font-size: 1.25rem;
  color: #fff;
}
.al-pfi-sim-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.al-pfi-sim-chip {
  padding: 8px 14px;
  border-radius: 99px;
  border: 1px solid rgba(244, 239, 233, 0.2);
  background: transparent;
  color: rgba(244, 239, 233, 0.82);
  font: inherit;
  font-size: 0.8rem;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}
.al-pfi-sim-chip:hover { border-color: #cfa8ef; color: #fff; }
.al-pfi-sim-chip.al-on {
  background: linear-gradient(135deg, #7E17BE, #E93B24);
  border-color: transparent;
  color: #fff;
  font-weight: 500;
}
.al-pfi-sim-der {
  padding: 18px 22px;
  border-radius: 16px;
  background: rgba(14, 9, 22, 0.65);
  border-left: 3px solid #E93B24;
}
.al-pfi-sim-der.al-pfi-flash {
  animation: al-pfi-in 0.4s ease;
}
.al-pfi-sim-der b {
  display: block;
  font-size: 1.05rem;
  color: #fff;
  margin-bottom: 6px;
}
.al-pfi-sim-der p {
  margin: 0 0 10px;
  font-size: 0.9rem;
  line-height: 1.5;
  color: rgba(244, 239, 233, 0.82);
}
.al-pfi-perf-mod {
  display: inline-block;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #cfa8ef;
}
@media (max-width: 991px) {
  .al-pfi-pilares-vista, .al-pfi-simulador { grid-template-columns: 1fr; }
}

/* ==========================================================================
   v40 · Experiencia inmersiva secreta: «Cuando cierran los ojos» (#suenos)
   ========================================================================== */

html.al-suenos-abierto {
  overflow: hidden;
}

/* Ocultar el botón global de sonido (.al-son) y otros flotantes cuando #suenos está abierto */
html.al-suenos-abierto .al-son,
html.al-suenos-abierto .al-sonido,
html.al-suenos-abierto .al-lado,
html.al-suenos-abierto .al-ti-home,
html.al-suenos-abierto .al-edu-flot,
html.al-suenos-abierto .al-kit-aviso {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
  display: none !important;
}

.al-portal-sueno {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid rgba(207, 168, 239, 0.28);
  background: radial-gradient(circle at 20% 50%, rgba(126, 23, 190, 0.32), rgba(14, 9, 24, 0.92));
  color: #f4efe9 !important;
  font-family: var(--sans, 'Outfit', sans-serif);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-decoration: none !important;
  cursor: pointer;
  box-shadow: 0 12px 32px -10px rgba(8, 4, 18, 0.65);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.35s ease, box-shadow 0.35s ease, background 0.35s ease;
}
.al-portal-sueno:hover {
  transform: translateY(-2px);
  border-color: rgba(207, 168, 239, 0.65);
  box-shadow: 0 16px 40px -10px rgba(126, 23, 190, 0.55);
}
.al-portal-sueno--claro {
  background: linear-gradient(135deg, rgba(22, 14, 34, 0.94), rgba(38, 22, 58, 0.92));
  margin-left: 10px;
}
/* Botón secreto en el pie: una lunita misteriosa y etérea, sin texto invasivo */
.al-cierre-idiomas-wrap {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.al-portal-luna-sola {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  padding: 0;
  margin: 0;
  border-radius: 50%;
  border: 1px solid rgba(207, 168, 239, 0.32);
  background: radial-gradient(circle at 35% 35%, rgba(126, 23, 190, 0.38), rgba(14, 8, 26, 0.88));
  color: #cfa8ef;
  cursor: pointer;
  box-shadow: 0 0 16px -2px rgba(207, 168, 239, 0.28);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.35s ease, box-shadow 0.35s ease, background 0.35s ease;
  vertical-align: middle;
}
.al-portal-luna-sola:hover {
  transform: scale(1.18) rotate(10deg);
  border-color: #cfa8ef;
  box-shadow: 0 0 24px 2px rgba(207, 168, 239, 0.55);
  background: radial-gradient(circle at 35% 35%, rgba(126, 23, 190, 0.65), rgba(24, 12, 44, 0.95));
}
.al-portal-luna-sola .al-portal-luna {
  animation: al-luna-pulso 3.6s ease-in-out infinite;
}

/* Botón sorpresa en el menú: primeros 5s es solo una lunita misteriosa; luego se despliega solo */
.al-portal-sueno--menu {
  margin-top: 14px;
  align-self: flex-start;
  padding: 6px;
  max-width: 36px;
  height: 36px;
  overflow: hidden;
  white-space: nowrap;
  gap: 0;
  border-color: rgba(207, 168, 239, 0.32);
  background: radial-gradient(circle at 50% 50%, rgba(126, 23, 190, 0.38), rgba(12, 7, 22, 0.94));
  transition: max-width 0.95s cubic-bezier(0.16, 1, 0.3, 1), padding 0.75s cubic-bezier(0.16, 1, 0.3, 1), gap 0.6s ease, border-color 0.5s ease, box-shadow 0.6s ease, transform 0.35s ease;
}
.al-portal-sueno--menu .al-portal-txt {
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity 0.65s ease 0.18s, transform 0.65s cubic-bezier(0.16, 1, 0.3, 1) 0.18s;
  pointer-events: none;
}
.al-portal-sueno--menu.al-desplegado,
.al-portal-sueno--menu:hover,
.al-portal-sueno--menu:focus-visible {
  max-width: 340px;
  padding: 6px 16px 6px 8px;
  gap: 9px;
  border-color: rgba(207, 168, 239, 0.72);
  box-shadow: 0 0 28px -4px rgba(207, 168, 239, 0.45), 0 12px 30px -10px rgba(8, 4, 18, 0.8);
}
.al-portal-sueno--menu.al-desplegado .al-portal-txt,
.al-portal-sueno--menu:hover .al-portal-txt,
.al-portal-sueno--menu:focus-visible .al-portal-txt {
  opacity: 1;
  transform: translateX(0);
}

.al-portal-luna {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  flex-shrink: 0;
  border-radius: 50%;
  background: rgba(207, 168, 239, 0.18);
  color: #cfa8ef;
  font-size: 0.88rem;
  animation: al-luna-pulso 3.6s ease-in-out infinite;
}
.al-portal-sueno em {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  color: #cfa8ef;
  font-size: 0.92rem;
}
@keyframes al-luna-pulso {
  0%, 100% { transform: scale(1) rotate(-8deg); box-shadow: 0 0 0 0 rgba(207, 168, 239, 0.35); }
  50% { transform: scale(1.1) rotate(6deg); box-shadow: 0 0 16px 3px rgba(207, 168, 239, 0.45); }
}

/* Enlace inline en el pie junto a Violet Studios / Alita: solo la lunita sutil */
.al-link-sueno-inline {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  color: #cfa8ef !important;
  text-decoration: none !important;
  font-size: 0.95rem;
  transition: color 0.25s ease, transform 0.25s ease, text-shadow 0.25s ease;
  vertical-align: middle;
}
.al-link-sueno-inline:hover {
  color: #cfa8ef !important;
  transform: scale(1.28) rotate(8deg);
  text-shadow: 0 0 12px rgba(207, 168, 239, 0.7);
}

/* Telón de párpados que se cierran antes de entrar al sueño */
.al-sn-parpados {
  position: fixed;
  inset: 0;
  z-index: 9998;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.al-sn-parpado {
  width: 100%;
  height: 52vh;
  background: #05030b;
  transform: scaleY(0);
  transition: transform 0.52s cubic-bezier(0.65, 0, 0.35, 1);
}
.al-sn-parpado--sup {
  transform-origin: top;
  box-shadow: 0 24px 60px rgba(5, 3, 11, 0.95);
}
.al-sn-parpado--inf {
  transform-origin: bottom;
  box-shadow: 0 -24px 60px rgba(5, 3, 11, 0.95);
}
.al-sn-parpados.al-cerrando .al-sn-parpado {
  transform: scaleY(1.04);
}

/* Universo a pantalla completa de «Cuando cierran los ojos» (100% opaco, sin cajas) */
.al-suenos {
  position: fixed;
  inset: 0;
  z-index: 9992;
  background-color: #020104;
  background-image: radial-gradient(ellipse at 34% 52%, #090614 0%, #04020a 58%, #020104 100%);
  color: #f4efe9;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.7s ease, background-image 1.4s ease;
  font-family: var(--sans, 'Outfit', sans-serif);
  user-select: none;
}
.al-suenos.al-abierto {
  opacity: 1;
  pointer-events: auto;
}
.al-suenos.al-amanecer {
  background-color: #020104;
  background-image: radial-gradient(ellipse at 50% 88%, #0d081b 0%, #070412 45%, #04020a 82%, #020104 100%);
}
.al-suenos.al-en-pantalla-cierre {
  background-color: #020104;
  background-image: radial-gradient(ellipse at 50% 30%, #0d091a 0%, #05030c 55%, #020104 100%);
}
.al-suenos[hidden] {
  display: none !important;
}

/* Lienzo único a pantalla completa donde viven el túnel de estrellas 3D, los animales y el sueño */
.al-sn-lienzo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1;
  cursor: none;
}
@media (pointer: coarse) {
  .al-sn-lienzo {
    cursor: default;
  }
}

/* Escena Introductoria («El Umbral de la Medianoche») */
.al-sn-intro {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 24px;
  pointer-events: none;
  opacity: 0;
  transform: scale(0.96) translateY(10px);
  transition: opacity 0.85s cubic-bezier(0.22, 1, 0.36, 1), transform 0.95s cubic-bezier(0.22, 1, 0.36, 1);
}
.al-suenos.al-en-umbral .al-sn-intro {
  opacity: 1;
  transform: scale(1) translateY(0);
  pointer-events: auto;
}
.al-sn-intro-caja {
  max-width: 620px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  text-shadow: 0 6px 32px rgba(2, 1, 8, 0.96);
}
.al-sn-intro-hora {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 16px;
  border-radius: 999px;
  border: 1px solid rgba(207, 168, 239, 0.32);
  background: rgba(10, 6, 22, 0.62);
  backdrop-filter: blur(8px);
  font-size: 0.72rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #cfa8ef;
}
.al-sn-intro-tit {
  margin: 0;
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(2.2rem, 1.6rem + 2.6vw, 3.8rem);
  line-height: 1.04;
  letter-spacing: -0.02em;
  color: #fff;
}
.al-sn-intro-tit em {
  font-style: italic;
  color: #cfa8ef;
}
.al-sn-intro-sub {
  margin: 0;
  max-width: 520px;
  font-size: clamp(0.95rem, 0.9rem + 0.25vw, 1.1rem);
  line-height: 1.62;
  color: rgba(244, 239, 233, 0.8);
}
.al-sn-intro-btn {
  margin-top: 10px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 13px 28px;
  border-radius: 999px;
  border: 1px solid rgba(207, 168, 239, 0.45);
  background: radial-gradient(circle at 30% 50%, rgba(126, 23, 190, 0.65), rgba(20, 11, 38, 0.92));
  color: #fff;
  font: inherit;
  font-size: 0.86rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  cursor: pointer;
  box-shadow: 0 0 38px -6px rgba(207, 168, 239, 0.5), 0 18px 40px -12px rgba(0, 0, 0, 0.9);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease, border-color 0.35s ease;
}
.al-sn-intro-btn:hover {
  transform: translateY(-3px) scale(1.02);
  border-color: #cfa8ef;
  box-shadow: 0 0 48px -4px rgba(207, 168, 239, 0.65), 0 22px 46px -12px rgba(0, 0, 0, 0.95);
}
.al-sn-intro-btn i {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(207, 168, 239, 0.22);
  color: #cfa8ef;
  font-style: normal;
}

/* Mientras estamos en el Umbral Introductorio o en un Interludio, el cuerpo de noche animal se oculta suavemente */
.al-suenos.al-en-umbral .al-sn-cuerpo,
.al-suenos.al-en-umbral .al-sn-bottom,
.al-suenos.al-en-interludio .al-sn-cuerpo {
  opacity: 0;
  pointer-events: none;
  transform: translateY(18px);
}

/* Escena de Interludio Temático (sin silueta de animal: inmersión profunda centrada en el lienzo) */
.al-sn-interludio {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: clamp(24px, 5vw, 64px);
  pointer-events: none;
  opacity: 0;
  transform: scale(0.97) translateY(14px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.85s cubic-bezier(0.22, 1, 0.36, 1);
}
.al-suenos.al-en-interludio:not(.al-en-umbral) .al-sn-interludio {
  opacity: 1;
  transform: scale(1) translateY(0);
  pointer-events: auto;
}
.al-sn-interludio-caja {
  max-width: 660px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 18px;
  text-shadow: 0 4px 32px rgba(2, 1, 8, 0.96);
}
.al-sn-interludio-hora {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 6px 18px;
  border-radius: 999px;
  border: 1px solid rgba(207, 168, 239, 0.32);
  background: rgba(12, 7, 26, 0.65);
  backdrop-filter: blur(10px);
  font-size: 0.74rem;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #cfa8ef;
}
.al-sn-interludio-tit {
  margin: 0;
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(2rem, 1.5rem + 2.2vw, 3.4rem);
  line-height: 1.08;
  letter-spacing: -0.018em;
  color: #f8f3ec;
}
.al-sn-interludio-tit em {
  font-style: italic;
  color: #cfa8ef;
}
.al-sn-interludio-cuerpo {
  margin: 0;
  max-width: 560px;
  font-size: clamp(0.95rem, 0.88rem + 0.3vw, 1.12rem);
  line-height: 1.68;
  color: rgba(244, 239, 233, 0.82);
}
.al-sn-interludio-cita {
  margin: 4px 0 0;
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1rem, 0.94rem + 0.3vw, 1.22rem);
  line-height: 1.48;
  color: rgba(207, 168, 239, 0.92);
  border-left: none;
  padding: 0;
}
/* Indicador de navegación sutil y no invasivo en los interludios */
.al-sn-interludio-nav-sutil {
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.al-sn-interludio-sutil {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 8px 18px;
  border-radius: 999px;
  border: 1px solid rgba(244, 239, 233, 0.16);
  background: rgba(10, 6, 20, 0.45);
  backdrop-filter: blur(8px);
  color: rgba(244, 239, 233, 0.85);
  font: inherit;
  font-size: 0.82rem;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: border-color 0.3s ease, background 0.3s ease, color 0.3s ease, transform 0.3s ease;
}
.al-sn-interludio-sutil:hover {
  border-color: rgba(207, 168, 239, 0.65);
  background: rgba(126, 23, 190, 0.22);
  color: #fff;
  transform: translateY(-2px);
}
.al-sn-sutil-flecha {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(207, 168, 239, 0.18);
  color: #cfa8ef;
  transition: transform 0.25s ease, background 0.25s ease;
}
.al-sn-sutil-flecha svg {
  width: 14px;
  height: 14px;
  display: block;
}
.al-sn-interludio-sutil:hover .al-sn-sutil-flecha {
  transform: translateX(3px);
  background: rgba(207, 168, 239, 0.35);
  color: #fff;
}
.al-sn-sutil-rueda {
  font-size: 0.68rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgba(244, 239, 233, 0.4);
  pointer-events: none;
}

/* Barra superior minimalista flotando sobre el cielo */
.al-sn-top {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: clamp(16px, 2.4vw, 28px) clamp(20px, 4vw, 52px);
  pointer-events: none;
}
.al-sn-top > * {
  pointer-events: auto;
}
.al-sn-marca {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 0.74rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(244, 239, 233, 0.68);
}
.al-sn-marca i {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: rgba(207, 168, 239, 0.16);
  color: #cfa8ef;
  font-style: normal;
}
.al-sn-marca em {
  font-family: var(--serif);
  font-style: italic;
  text-transform: none;
  letter-spacing: 0;
  font-size: 1.05rem;
  color: #cfa8ef;
}
.al-sn-top-acc {
  display: flex;
  align-items: center;
  gap: 10px;
}
.al-sn-audio-btn,
.al-sn-cerrar {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border-radius: 99px;
  border: 1px solid rgba(244, 239, 233, 0.15);
  background: rgba(8, 5, 16, 0.55);
  backdrop-filter: blur(8px);
  color: rgba(244, 239, 233, 0.88);
  font: inherit;
  font-size: 0.75rem;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: border-color 0.25s ease, background 0.25s ease, color 0.25s ease;
}
.al-sn-audio-btn:hover,
.al-sn-cerrar:hover {
  border-color: rgba(207, 168, 239, 0.55);
  background: rgba(126, 23, 190, 0.28);
  color: #fff;
}
.al-sn-audio-btn.al-on {
  border-color: rgba(207, 168, 239, 0.65);
  color: #cfa8ef;
}
.al-sn-ondas {
  display: inline-flex;
  align-items: flex-end;
  gap: 2px;
  height: 11px;
}
.al-sn-ondas b {
  width: 2px;
  height: 4px;
  border-radius: 2px;
  background: currentColor;
  transition: height 0.2s ease;
}
.al-sn-audio-btn.al-on .al-sn-ondas b:nth-child(1) { animation: al-sn-onda 1.1s ease-in-out infinite; }
.al-sn-audio-btn.al-on .al-sn-ondas b:nth-child(2) { animation: al-sn-onda 0.85s ease-in-out 0.2s infinite; }
.al-sn-audio-btn.al-on .al-sn-ondas b:nth-child(3) { animation: al-sn-onda 1.25s ease-in-out 0.4s infinite; }
@keyframes al-sn-onda {
  0%, 100% { height: 3px; }
  50% { height: 11px; }
}

/* Espacio central: sin recuadros ni tarjetas, el poema flota en el aire junto a la constelación */
.al-sn-cuerpo {
  position: relative;
  z-index: 3;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  max-width: 1420px;
  width: 100%;
  margin: 0 auto;
  padding: 0 clamp(24px, 5vw, 72px);
  pointer-events: none;
  min-height: 0;
  transition: opacity 0.7s ease, transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
}

/* Susurro flotante sobre el animal dormido (guía poética de interacción) */
.al-sn-susurro-animal {
  position: absolute;
  left: 29%;
  bottom: 8%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  text-align: center;
  pointer-events: none;
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.al-sn-ficha-jaula {
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(200, 194, 214, 0.55);
  transition: color 0.6s ease, opacity 0.6s ease;
}
.al-suenos.al-sonando .al-sn-ficha-jaula {
  color: rgba(207, 168, 239, 0.95);
}
.al-sn-instruccion {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1rem, 0.9rem + 0.35vw, 1.22rem);
  color: rgba(244, 239, 233, 0.78);
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.9);
}
.al-sn-instruccion i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #cfa8ef;
  box-shadow: 0 0 12px #cfa8ef;
  animation: alLatido 2.2s infinite;
}
.al-suenos.al-sonando .al-sn-instruccion {
  color: #cfa8ef;
}
.al-suenos.al-sonando .al-sn-instruccion i {
  background: #cfa8ef;
  box-shadow: 0 0 16px #cfa8ef;
}

/* Columna poética flotante a la derecha */
.al-sn-voz {
  width: min(100%, 490px);
  display: flex;
  flex-direction: column;
  gap: 14px;
  pointer-events: auto;
  text-shadow: 0 4px 28px rgba(3, 2, 8, 0.95);
}
.al-sn-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(207, 168, 239, 0.78);
  margin: 0;
}
.al-sn-kicker b {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  font-size: 1.05rem;
  letter-spacing: 0.02em;
  text-transform: none;
  color: #cfa8ef;
}
.al-sn-titulo {
  margin: 0;
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(1.9rem, 1.4rem + 1.8vw, 3rem);
  line-height: 1.06;
  letter-spacing: -0.015em;
  color: #f4efe9;
}
.al-sn-titulo em {
  font-style: italic;
  color: #cfa8ef;
  transition: color 0.7s ease;
}
.al-suenos.al-sonando .al-sn-titulo em {
  color: #f4efe9;
}

/* Sombra del encierro */
.al-sn-sombra-afuera {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.56;
  color: rgba(210, 204, 222, 0.66);
  border-left: 1px solid rgba(207, 168, 239, 0.24);
  padding-left: 16px;
  transition: opacity 0.65s ease, transform 0.65s ease, border-color 0.65s ease;
}
.al-suenos.al-sonando .al-sn-sombra-afuera {
  opacity: 0.34;
  border-left-color: rgba(207, 168, 239, 0.25);
}
.al-suenos.al-amanecer .al-sn-sombra-afuera {
  display: none;
}

/* Versos del sueño que nacen palabra por palabra */
.al-sn-poema {
  display: flex;
  flex-direction: column;
  gap: 7px;
  min-height: 136px;
  margin-top: 2px;
}
.al-sn-verso {
  margin: 0;
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1.16rem, 1.02rem + 0.5vw, 1.46rem);
  line-height: 1.38;
  color: #f8f3ec;
  transition: opacity 0.5s ease, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}
.al-sn-verso span {
  display: inline-block;
  opacity: var(--v, 0.08);
  filter: blur(calc((1 - var(--v, 0.08)) * 5px));
  transform: translateY(calc((1 - var(--v, 0.08)) * 6px));
  transition: opacity 0.45s ease, filter 0.45s ease, transform 0.45s ease, color 0.45s ease;
}
.al-suenos.al-sonando .al-sn-verso:last-child span {
  color: #cfa8ef;
}

/* Revelación creativa e iluminación estelar de los versos en El Amanecer */
.al-suenos.al-amanecer .al-sn-verso {
  opacity: 0.35;
  transform: translateX(0);
}
.al-suenos.al-amanecer .al-sn-verso.al-verso-iluminado {
  opacity: 1;
  transform: translateX(10px);
}
.al-suenos.al-amanecer .al-sn-verso.al-verso-iluminado span {
  color: #fff;
  text-shadow: 0 0 16px rgba(207, 168, 239, 0.7), 0 0 32px rgba(126, 23, 190, 0.5);
  --v: 1 !important;
  filter: none !important;
}

/* Nota etológica al pie del poema */
.al-sn-ciencia {
  margin: 4px 0 0;
  padding-top: 12px;
  border-top: 1px solid rgba(207, 168, 239, 0.14);
  font-size: 0.77rem;
  line-height: 1.5;
  color: rgba(207, 168, 239, 0.72);
  display: flex;
  align-items: flex-start;
  gap: 8px;
  opacity: 0.55;
  transition: opacity 0.6s ease, color 0.6s ease;
}
.al-suenos.al-sonando .al-sn-ciencia {
  opacity: 0.95;
  color: rgba(207, 168, 239, 0.95);
}
.al-sn-ciencia i {
  font-style: normal;
  color: #cfa8ef;
}

/* Acciones: en las noches de animales se mantienen ocultas; en El Amanecer se revela el acceso poético al cierre */
.al-sn-acciones {
  display: none;
  align-items: center;
  gap: 12px;
  margin-top: 10px;
}
.al-suenos.al-amanecer .al-sn-acciones {
  display: flex;
}
.al-sn-btn-hacia-cierre {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 24px;
  border-radius: 999px;
  border: 1px solid rgba(207, 168, 239, 0.45);
  background: radial-gradient(circle at 30% 50%, rgba(126, 23, 190, 0.45), rgba(10, 6, 22, 0.85));
  backdrop-filter: blur(8px);
  color: #cfa8ef;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  cursor: pointer;
  box-shadow: 0 0 24px -6px rgba(207, 168, 239, 0.35);
  transition: transform 0.28s ease, border-color 0.28s ease, box-shadow 0.28s ease, color 0.28s ease;
}
.al-sn-btn-hacia-cierre:hover {
  transform: translateY(-2px);
  border-color: #cfa8ef;
  color: #fff;
  box-shadow: 0 0 36px -4px rgba(207, 168, 239, 0.65);
}
.al-sn-btn-hacia-cierre i {
  font-style: normal;
  transition: transform 0.25s ease;
}
.al-sn-btn-hacia-cierre:hover i {
  transform: translateX(4px);
}

/* ==========================================================================
   PANTALLA DE CIERRE: EL DESPERTAR Y LA ACCIÓN
   ========================================================================== */
.al-sn-pantalla-cierre {
  position: absolute;
  inset: 0;
  z-index: 6;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(24px, 4vw, 56px) clamp(20px, 4vw, 48px);
  overflow-y: auto;
  pointer-events: none;
  opacity: 0;
  transform: scale(0.97) translateY(18px);
  transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.85s cubic-bezier(0.22, 1, 0.36, 1);
}
.al-suenos.al-en-pantalla-cierre .al-sn-pantalla-cierre {
  opacity: 1;
  transform: scale(1) translateY(0);
  pointer-events: auto;
}
.al-suenos.al-en-pantalla-cierre .al-sn-cuerpo,
.al-suenos.al-en-pantalla-cierre .al-sn-intro,
.al-suenos.al-en-pantalla-cierre .al-sn-interludio,
.al-suenos.al-en-pantalla-cierre .al-sn-bottom {
  opacity: 0 !important;
  pointer-events: none !important;
  transform: translateY(20px) !important;
}

.al-sn-cierre-caja {
  max-width: 1120px;
  width: 100%;
  margin: auto;
  display: flex;
  flex-direction: column;
  gap: clamp(20px, 3vw, 36px);
  text-align: center;
}
.al-sn-cierre-cab {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  max-width: 740px;
  margin: 0 auto;
}
.al-sn-cierre-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 16px;
  border-radius: 999px;
  border: 1px solid rgba(207, 168, 239, 0.32);
  background: rgba(12, 7, 24, 0.65);
  font-size: 0.72rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #cfa8ef;
}
.al-sn-cierre-tit {
  margin: 0;
  font-family: var(--serif);
  font-weight: 400;
  font-size: clamp(2rem, 1.4rem + 2vw, 3.2rem);
  line-height: 1.08;
  letter-spacing: -0.018em;
  color: #fff;
}
.al-sn-cierre-tit em {
  font-style: italic;
  color: #cfa8ef;
}
.al-sn-cierre-sub {
  margin: 0;
  font-size: clamp(0.94rem, 0.88rem + 0.25vw, 1.08rem);
  line-height: 1.62;
  color: rgba(244, 239, 233, 0.82);
}

.al-sn-cierre-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  max-width: 1180px;
  margin: 0 auto;
  text-align: left;
}
@media (max-width: 1024px) {
  .al-sn-cierre-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
}
@media (max-width: 580px) {
  .al-sn-cierre-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
}

.al-sn-pc-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 28px 24px 24px;
  min-height: 250px;
  border-radius: 18px;
  border: 1px solid var(--linea-o, rgba(244, 239, 233, 0.12));
  background: rgba(244, 239, 233, 0.035);
  backdrop-filter: blur(14px);
  color: var(--hueso, #f4efe9);
  text-decoration: none;
  overflow: hidden;
  cursor: pointer;
  box-shadow: 0 16px 36px -10px rgba(0, 0, 0, 0.5);
  transition: background-color 0.35s ease, border-color 0.35s ease, transform 0.45s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.45s ease;
}
.al-sn-pc-card:hover {
  background: rgba(126, 23, 190, 0.18);
  border-color: rgba(207, 168, 239, 0.4);
  transform: translateY(-5px);
  box-shadow: 0 24px 44px -8px rgba(0, 0, 0, 0.7), 0 0 28px -6px rgba(207, 168, 239, 0.25);
}
.al-sn-pc-num {
  font-family: var(--serif);
  font-style: italic;
  font-size: 1.15rem;
  color: rgba(244, 239, 233, 0.45);
  margin-bottom: 28px;
  display: block;
}
.al-sn-pc-card-tit {
  margin: 0 0 10px;
  font-family: var(--display);
  font-size: clamp(1.35rem, 1.2rem + 0.3vw, 1.55rem);
  font-weight: 500;
  line-height: 1.22;
  letter-spacing: -0.025em;
  color: #fff;
}
.al-sn-pc-card-desc {
  margin: 0 0 22px;
  font-size: 0.88rem;
  line-height: 1.55;
  color: rgba(244, 239, 233, 0.72);
  flex: 1;
}
.al-sn-pc-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  border: 1px solid rgba(244, 239, 233, 0.16);
  color: var(--lila, #cfa8ef);
  margin-top: auto;
  align-self: flex-start;
  transition: border-color 0.3s ease, color 0.3s ease, transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1), background-color 0.3s ease;
}
.al-sn-pc-arrow svg {
  width: 14px;
  height: 14px;
  transition: transform 0.3s ease;
}
.al-sn-pc-card:hover .al-sn-pc-arrow {
  border-color: rgba(207, 168, 239, 0.55);
  background: rgba(207, 168, 239, 0.15);
  color: #fff;
  transform: translateX(4px);
}
.al-sn-pc-card:hover .al-sn-pc-arrow svg {
  transform: translateX(2px);
}

.al-sn-cierre-foot {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.al-sn-cierre-btn-volver {
  padding: 10px 22px;
  border-radius: 999px;
  border: 1px solid rgba(244, 239, 233, 0.2);
  background: rgba(10, 6, 20, 0.55);
  backdrop-filter: blur(8px);
  color: rgba(244, 239, 233, 0.85);
  font: inherit;
  font-size: 0.82rem;
  letter-spacing: 0.03em;
  cursor: pointer;
  transition: border-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
}
.al-sn-cierre-btn-volver:hover {
  border-color: rgba(207, 168, 239, 0.65);
  color: #cfa8ef;
  transform: translateY(-2px);
}
.al-sn-cierre-btn-salir {
  padding: 11px 26px;
  border-radius: 999px;
  border: 1px solid rgba(207, 168, 239, 0.45);
  background: radial-gradient(circle at 30% 50%, rgba(126, 23, 190, 0.45), rgba(14, 8, 28, 0.88));
  color: #cfa8ef;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 500;
  letter-spacing: 0.04em;
  cursor: pointer;
  box-shadow: 0 0 24px -6px rgba(207, 168, 239, 0.3);
  transition: border-color 0.25s ease, color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}
.al-sn-cierre-btn-salir:hover {
  border-color: #cfa8ef;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 0 36px -4px rgba(207, 168, 239, 0.65);
}

@media (max-width: 991px) {
  .al-sn-cierre-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .al-sn-pantalla-cierre {
    align-items: flex-start;
    padding-top: 72px;
    padding-bottom: 36px;
  }
}

/* Barra inferior de constelación íntima: sin nombres debajo, solo un hilo de estrellas respirando */
.al-sn-bottom {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: clamp(14px, 2vw, 24px) clamp(20px, 4vw, 52px);
  pointer-events: none;
}
.al-sn-bottom > * {
  pointer-events: auto;
}
.al-sn-noches {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 8px 16px;
  border-radius: 999px;
  background: rgba(8, 5, 16, 0.42);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(244, 239, 233, 0.08);
}
.al-sn-noche-btn {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  padding: 0;
  border-radius: 50%;
  border: none;
  background: transparent;
  cursor: pointer;
  color: rgba(244, 239, 233, 0.4);
  transition: transform 0.25s ease, color 0.25s ease;
}
.al-sn-noche-btn i {
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  transition: width 0.25s ease, height 0.25s ease, background 0.25s ease, box-shadow 0.25s ease;
}
.al-sn-noche-btn.al-sn-nodo--interludio i {
  width: 4px;
  height: 4px;
  opacity: 0.7;
}
.al-sn-noche-btn:hover {
  color: #cfa8ef;
  transform: scale(1.25);
}
.al-sn-noche-btn.al-on {
  color: #cfa8ef;
}
.al-sn-noche-btn.al-on i {
  width: 9px;
  height: 9px;
  background: #cfa8ef;
  box-shadow: 0 0 12px #cfa8ef, 0 0 24px rgba(207, 168, 239, 0.6);
}
.al-sn-noche-btn.al-visitado:not(.al-on) {
  color: rgba(207, 168, 239, 0.75);
}
.al-sn-nav-flechas {
  display: flex;
  align-items: center;
  gap: 8px;
}
.al-sn-flecha {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1px solid rgba(244, 239, 233, 0.16);
  background: rgba(8, 5, 16, 0.55);
  color: #fff;
  display: grid;
  place-items: center;
  cursor: pointer;
  transition: border-color 0.25s ease, background 0.25s ease;
}
.al-sn-flecha:hover {
  border-color: #cfa8ef;
  background: rgba(126, 23, 190, 0.35);
}

@media (max-width: 991px) {
  .al-sn-cuerpo {
    align-items: flex-end;
    justify-content: center;
    padding: 0 20px 12px;
  }
  .al-sn-susurro-animal {
    left: 50%;
    top: 39%;
    bottom: auto;
  }
  .al-sn-voz {
    width: 100%;
    gap: 10px;
    background: linear-gradient(180deg, rgba(5, 3, 11, 0) 0%, rgba(5, 3, 11, 0.86) 28%, rgba(5, 3, 11, 0.95) 100%);
    padding-top: 18px;
  }
  .al-sn-poema {
    min-height: 96px;
  }
  .al-sn-verso {
    font-size: 1.08rem;
  }
  .al-sn-bottom {
    flex-direction: column;
    align-items: stretch;
    padding-top: 6px;
  }
  .al-sn-noches {
    overflow-x: auto;
    justify-content: center;
    padding: 6px 12px;
  }
}

/* ==========================================================================
   v40 · Sección Editorial de Santuarios & Vida Libre (#santuarios)
   ========================================================================== */
.al-santuarios {
  position: relative;
  background: radial-gradient(circle at 18% 25%, rgba(126, 23, 190, 0.08), transparent 48%),
              radial-gradient(circle at 82% 75%, rgba(233, 59, 36, 0.06), transparent 52%),
              #0e0914;
  color: #fff;
  padding: clamp(70px, 9vw, 130px) 0;
  overflow: hidden;
}
.al-santuarios::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(207, 168, 239, 0.35), transparent);
}
.al-san-cab {
  margin-bottom: clamp(36px, 5vw, 64px);
}
.al-san-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #cfa8ef;
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-bottom: 14px;
}
.al-san-kicker i {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #cfa8ef;
  box-shadow: 0 0 10px #cfa8ef;
}

/* Tarjeta protagonista Santuario Empatía */
.al-san-hero-card {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: clamp(28px, 4vw, 56px);
  align-items: center;
  background: rgba(22, 14, 34, 0.68);
  border: 1px solid rgba(244, 239, 233, 0.12);
  border-radius: 28px;
  padding: clamp(24px, 4vw, 48px);
  backdrop-filter: blur(18px);
  box-shadow: 0 32px 64px -16px rgba(0, 0, 0, 0.65), 0 0 42px -12px rgba(126, 23, 190, 0.25);
  margin-bottom: 42px;
  position: relative;
  overflow: hidden;
}
.al-san-hero-card::after {
  content: "";
  position: absolute;
  top: -40%;
  right: -20%;
  width: 380px;
  height: 380px;
  background: radial-gradient(circle, rgba(207, 168, 239, 0.14), transparent 70%);
  pointer-events: none;
}
.al-san-hero-foto {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 18px 40px -10px rgba(0, 0, 0, 0.8);
  aspect-ratio: 4 / 3;
}
.al-san-hero-foto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}
.al-san-hero-card:hover .al-san-hero-foto img {
  transform: scale(1.035);
}
.al-san-hero-badge {
  position: absolute;
  bottom: 16px;
  left: 16px;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(14, 9, 24, 0.78);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(207, 168, 239, 0.35);
  color: #cfa8ef;
  font-size: 0.74rem;
  letter-spacing: 0.05em;
  font-weight: 500;
}
.al-san-hero-info {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.al-san-hero-tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  align-self: flex-start;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(207, 168, 239, 0.14);
  border: 1px solid rgba(207, 168, 239, 0.28);
  color: #cfa8ef;
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.al-san-hero-tit {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(1.8rem, 1.5rem + 1.2vw, 2.6rem);
  font-weight: 400;
  line-height: 1.18;
  color: #fff;
}
.al-san-hero-tit em {
  font-style: italic;
  color: #cfa8ef;
}
.al-san-hero-fund {
  font-size: 0.88rem;
  color: rgba(244, 239, 233, 0.7);
  margin: -6px 0 0;
}
.al-san-hero-fund strong {
  color: #fff;
  font-weight: 600;
}
.al-san-hero-desc {
  font-size: 0.94rem;
  line-height: 1.68;
  color: rgba(244, 239, 233, 0.84);
  margin: 0;
}
.al-san-hero-puntos {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin: 6px 0;
  padding: 16px 0;
  border-top: 1px solid rgba(244, 239, 233, 0.1);
  border-bottom: 1px solid rgba(244, 239, 233, 0.1);
}
.al-san-hero-pt b {
  display: block;
  font-size: 1.05rem;
  color: #cfa8ef;
  font-family: var(--serif);
  font-weight: normal;
}
.al-san-hero-pt span {
  font-size: 0.72rem;
  color: rgba(244, 239, 233, 0.65);
  line-height: 1.35;
  display: block;
}
.al-san-hero-acciones {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.al-san-btn-ig {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 13px 26px;
  border-radius: 999px;
  background: linear-gradient(135deg, #7E17BE, #E93B24);
  color: #fff;
  font-weight: 600;
  font-size: 0.88rem;
  letter-spacing: 0.02em;
  text-decoration: none;
  box-shadow: 0 12px 28px -6px rgba(233, 59, 36, 0.38);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.al-san-btn-ig:hover {
  transform: translateY(-2px);
  box-shadow: 0 16px 36px -4px rgba(233, 59, 36, 0.52);
  color: #fff;
}
.al-san-btn-ig svg {
  width: 18px;
  height: 18px;
}

/* Grilla de 3 pilares */
.al-san-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.al-san-col {
  padding: 28px 24px;
  border-radius: 20px;
  background: rgba(18, 12, 28, 0.45);
  border: 1px solid rgba(244, 239, 233, 0.08);
  backdrop-filter: blur(12px);
  display: flex;
  flex-direction: column;
  gap: 12px;
  transition: transform 0.3s ease, border-color 0.3s ease;
}
.al-san-col:hover {
  transform: translateY(-4px);
  border-color: rgba(207, 168, 239, 0.4);
}
.al-san-col-num {
  font-family: var(--serif);
  font-size: 1.25rem;
  font-style: italic;
  color: #cfa8ef;
}
.al-san-col h3 {
  margin: 0;
  font-family: var(--serif);
  font-size: 1.22rem;
  font-weight: 400;
  color: #fff;
}
.al-san-col p {
  margin: 0;
  font-size: 0.86rem;
  line-height: 1.62;
  color: rgba(244, 239, 233, 0.75);
  flex: 1;
}

@media (max-width: 991px) {
  .al-san-hero-card {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .al-san-grid {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   v40 · Botones de Pago Payku & Tienda Solidaria (Alto Contraste y Marca)
   ========================================================================== */
.al-ti-precio {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 6px;
  background: rgba(126, 23, 190, 0.08);
  border: 1px solid rgba(126, 23, 190, 0.22);
  color: var(--violeta);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  margin-left: 8px;
  vertical-align: middle;
}
.al-oscura .al-ti-precio {
  background: rgba(207, 168, 239, 0.16);
  border-color: rgba(207, 168, 239, 0.35);
  color: #fff;
}
.al-ti-payku-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 16px;
  border-radius: 999px;
  background: var(--violeta);
  border: 1px solid var(--violeta);
  color: #ffffff !important;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(126, 23, 190, 0.28);
  transition: all 0.25s cubic-bezier(0.2, 0.8, 0.2, 1);
  margin-top: 6px;
}
.al-ti-payku-btn:hover {
  background: var(--rojo);
  border-color: var(--rojo);
  color: #ffffff !important;
  box-shadow: 0 6px 20px rgba(233, 59, 36, 0.38);
  transform: translateY(-2px);
}
.al-ti-modal-payku {
  background: var(--violeta) !important;
  color: #ffffff !important;
  border: none !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 16px rgba(126, 23, 190, 0.35) !important;
}
.al-ti-modal-payku:hover {
  background: var(--rojo) !important;
  color: #ffffff !important;
  box-shadow: 0 6px 22px rgba(233, 59, 36, 0.45) !important;
}
.al-ti-tienda-online {
  background: var(--tinta) !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
}
.al-ti-tienda-online:hover {
  background: var(--violeta) !important;
  border-color: var(--violeta) !important;
  color: #ffffff !important;
}

/* ==========================================================================
   v40 · Página dedicada: Santuarios de Animales (santuarios.html)
   ========================================================================== */
.al-san-hero-card {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 36px;
  background: #150f1d;
  border: 1px solid rgba(207, 168, 239, 0.22);
  border-radius: 28px;
  overflow: hidden;
  box-shadow: 0 24px 60px -20px rgba(0, 0, 0, 0.6);
  margin: 36px 0 48px;
}
.al-san-hero-foto {
  position: relative;
  min-height: 380px;
}
.al-san-hero-foto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.al-san-hero-badge {
  position: absolute;
  left: 20px;
  bottom: 20px;
  padding: 6px 14px;
  border-radius: 999px;
  background: rgba(11, 7, 16, 0.85);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #f4efe9;
  font-size: 0.76rem;
  letter-spacing: 0.04em;
}
.al-san-hero-info {
  padding: clamp(24px, 4vw, 44px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.al-san-hero-tag {
  display: inline-block;
  align-self: flex-start;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--rojo);
  font-weight: 700;
  margin-bottom: 8px;
}
.al-san-hero-tit {
  margin: 0 0 4px;
  font-family: var(--display);
  font-size: clamp(2rem, 1.6rem + 1.8vw, 2.9rem);
  letter-spacing: -0.02em;
  color: #fff;
  line-height: 1.12;
}
.al-san-hero-tit em {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  color: #cfa8ef;
}
.al-san-hero-fund {
  margin: 0 0 16px;
  font-size: 0.95rem;
  color: rgba(244, 239, 233, 0.8);
}
.al-san-hero-fund strong {
  color: #fff;
}
.al-san-hero-desc {
  margin: 0 0 24px;
  font-size: 0.96rem;
  line-height: 1.68;
  color: rgba(244, 239, 233, 0.88);
}
.al-san-hero-puntos {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  padding: 20px 0;
  border-top: 1px solid rgba(244, 239, 233, 0.12);
  border-bottom: 1px solid rgba(244, 239, 233, 0.12);
  margin-bottom: 24px;
}
.al-san-hero-pt b {
  display: block;
  font-family: var(--display);
  font-size: 1.6rem;
  color: #fff;
  line-height: 1;
}
.al-san-hero-pt span {
  display: block;
  font-size: 0.76rem;
  color: rgba(244, 239, 233, 0.65);
  margin-top: 4px;
  line-height: 1.35;
}
.al-san-btn-ig {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 24px;
  border-radius: 999px;
  background: var(--violeta);
  color: #fff !important;
  font-weight: 700;
  font-size: 0.88rem;
  text-decoration: none;
  box-shadow: 0 6px 20px rgba(126, 23, 190, 0.35);
  transition: all 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
  border: 1px solid rgba(207, 168, 239, 0.3);
}
.al-san-btn-ig:hover {
  background: var(--rojo);
  border-color: var(--rojo);
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(233, 59, 36, 0.45);
}
.al-san-btn-ig svg {
  width: 20px;
  height: 20px;
  flex: none;
}

/* Habitantes con Nombre Propio (Cards de Residentes) */
.al-san-residentes-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 36px;
}
.al-san-res-card {
  background: #140e1b;
  border: 1px solid rgba(207, 168, 239, 0.16);
  border-radius: 22px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}
.al-san-res-card:hover {
  transform: translateY(-6px);
  border-color: rgba(207, 168, 239, 0.4);
  box-shadow: 0 18px 40px -15px rgba(0, 0, 0, 0.7);
}
.al-san-res-foto {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #0b0710;
}
.al-san-res-foto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.al-san-res-card:hover .al-san-res-foto img {
  transform: scale(1.05);
}
.al-san-res-tag {
  position: absolute;
  top: 14px;
  left: 14px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(11, 7, 16, 0.8);
  backdrop-filter: blur(6px);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #fff;
  font-size: 0.7rem;
  letter-spacing: 0.04em;
  font-weight: 600;
}
.al-san-res-cuerpo {
  padding: 22px 20px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.al-san-res-cuerpo h3 {
  margin: 0 0 2px;
  font-family: var(--display);
  font-size: 1.45rem;
  color: #fff;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}
.al-san-res-cuerpo h3 span {
  font-family: var(--sans);
  font-size: 0.75rem;
  color: #cfa8ef;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.al-san-res-cuerpo p {
  margin: 10px 0 0;
  font-size: 0.88rem;
  line-height: 1.62;
  color: rgba(244, 239, 233, 0.82);
  flex: 1;
}

/* Testimonio de Fundadores */
.al-san-quote {
  position: relative;
  margin: 54px 0;
  padding: clamp(32px, 5vw, 60px);
  background: linear-gradient(135deg, rgba(126, 23, 190, 0.18), rgba(233, 59, 36, 0.12));
  border: 1px solid rgba(207, 168, 239, 0.28);
  border-radius: 28px;
  text-align: center;
}
.al-san-quote blockquote {
  margin: 0 auto;
  max-width: 860px;
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1.25rem, 1.05rem + 1vw, 1.85rem);
  line-height: 1.5;
  color: #ffffff;
}
.al-san-quote cite {
  display: block;
  margin-top: 20px;
  font-style: normal;
  font-size: 0.86rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #cfa8ef;
  font-weight: 600;
}

@media (max-width: 991px) {
  .al-san-residentes-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 680px) {
  .al-san-residentes-grid {
    grid-template-columns: 1fr;
  }
  .al-san-hero-puntos {
    grid-template-columns: 1fr;
    gap: 12px;
  }
}

/* Evitar duplicidad de llamada a la acción en páginas de proyecto con su propio bloque .al-pp-sumate */
.al-pp-sumate + #pie .al-cierre-cta,
.al-pp-sumate + .al-cierre .al-cierre-cta,
.al-pp-sumate ~ #pie .al-cierre-cta,
.al-pp-sumate ~ .al-cierre .al-cierre-cta {
  display: none !important;
}

/* Respiro y separación elegante entre el contenido y el pie de página */
.al-cierre {
  position: relative;
}
.al-cierre .al-nombres {
  padding-top: clamp(30px, 4vw, 52px);
}
.al-cierre > .al-ancho:first-child .al-pie2,
.al-cierre-directo .al-pie2 {
  padding-top: clamp(64px, 8vw, 108px);
}
#apoyar.al-sec--hueso {
  padding-bottom: clamp(90px, 11vw, 140px);
}

/* ==========================================================================
   Popup Gran Estreno Documental Salmones (1 de Noviembre)
   ========================================================================== */
.al-doc-pop-overlay {
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: rgba(6, 3, 10, 0.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0.4s ease;
}
.al-doc-pop-overlay.al-doc-pop--visible {
  opacity: 1;
  visibility: visible;
}

.al-doc-pop-card {
  position: relative;
  max-width: 540px;
  width: 100%;
  background: linear-gradient(145deg, #180c26 0%, #0d0614 55%, #08030c 100%);
  border: 1px solid rgba(196, 120, 240, 0.28);
  border-radius: 28px;
  box-shadow: 0 32px 80px rgba(0, 0, 0, 0.8), 0 0 100px rgba(138, 0, 198, 0.2);
  padding: clamp(28px, 5vw, 42px);
  color: #ffffff;
  overflow: hidden;
  transform: translateY(24px) scale(0.95);
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}
.al-doc-pop-overlay.al-doc-pop--visible .al-doc-pop-card {
  transform: translateY(0) scale(1);
}

.al-doc-pop-card::before {
  content: "";
  position: absolute;
  top: -80px;
  left: 50%;
  transform: translateX(-50%);
  width: 320px;
  height: 160px;
  background: radial-gradient(ellipse at center, rgba(240, 92, 64, 0.28) 0%, rgba(138, 0, 198, 0.2) 50%, transparent 80%);
  pointer-events: none;
}

.al-doc-pop-watermark {
  position: absolute;
  top: -15px;
  right: -25px;
  width: 220px;
  height: auto;
  opacity: 0.08;
  pointer-events: none;
  fill: #cfa8ef;
}

.al-doc-pop-cerrar {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: rgba(244, 239, 233, 0.08);
  border: 1px solid rgba(244, 239, 233, 0.16);
  color: rgba(244, 239, 233, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  line-height: 1;
  cursor: pointer;
  transition: all 0.25s ease;
  z-index: 2;
}
.al-doc-pop-cerrar:hover {
  background: rgba(244, 239, 233, 0.2);
  color: #ffffff;
  transform: scale(1.08);
}

.al-doc-pop-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 30px;
  background: rgba(240, 92, 64, 0.14);
  border: 1px solid rgba(240, 92, 64, 0.35);
  color: #ff9b82;
  font-size: 0.76rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 16px;
}
.al-doc-pop-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #f05c40;
  box-shadow: 0 0 10px #f05c40;
  animation: al-pop-pulse 1.8s infinite;
}
@keyframes al-pop-pulse {
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(1.4); opacity: 0.5; }
}

.al-doc-pop-tit {
  font-family: var(--display, 'Heuvel Grotesk', sans-serif);
  font-size: clamp(2rem, 1.6rem + 1.6vw, 2.8rem);
  font-weight: 500;
  letter-spacing: -0.03em;
  line-height: 1.05;
  color: #ffffff;
  margin: 0 0 8px;
}
.al-doc-pop-sub {
  font-family: var(--serif, 'Instrument Serif', Georgia, serif);
  font-style: italic;
  font-size: 1.15rem;
  color: var(--lila, #cfa8ef);
  line-height: 1.35;
  margin: 0 0 22px;
}

.al-doc-pop-countdown {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  background: rgba(244, 239, 233, 0.04);
  border: 1px solid rgba(196, 120, 240, 0.18);
  border-radius: 18px;
  padding: 16px 18px;
  margin-bottom: 20px;
}
.al-doc-pop-time-box {
  flex: 1;
  text-align: center;
}
.al-doc-pop-num {
  display: block;
  font-family: var(--display, 'Heuvel Grotesk', sans-serif);
  font-size: clamp(1.6rem, 1.3rem + 1vw, 2.1rem);
  font-weight: 600;
  color: #ffffff;
  line-height: 1;
  letter-spacing: -0.02em;
}
.al-doc-pop-lbl {
  display: block;
  font-size: 0.65rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: rgba(244, 239, 233, 0.5);
  margin-top: 4px;
}
.al-doc-pop-sep {
  color: rgba(196, 120, 240, 0.4);
  font-size: 1.4rem;
  font-weight: 300;
  margin-bottom: 12px;
}

.al-doc-pop-txt {
  font-size: 0.92rem;
  color: rgba(244, 239, 233, 0.72);
  line-height: 1.55;
  margin: 0 0 24px;
}

.al-doc-pop-acciones {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.al-doc-pop-btn {
  width: 100%;
  justify-content: center;
  text-align: center;
  font-weight: 600;
  padding: 15px 28px !important;
  background: var(--hueso, #f4efe9) !important;
  color: var(--tinta, #0b0710) !important;
  border-radius: 36px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.al-doc-pop-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 10px 24px rgba(240, 92, 64, 0.25);
}
.al-doc-pop-link {
  background: none;
  border: none;
  color: rgba(244, 239, 233, 0.45);
  font-size: 0.84rem;
  text-align: center;
  cursor: pointer;
  transition: color 0.2s ease;
  padding: 4px;
}
.al-doc-pop-link:hover {
  color: rgba(244, 239, 233, 0.85);
  text-decoration: underline;
}

@media (max-width: 480px) {
  .al-doc-pop-card {
    padding: 24px 20px;
    border-radius: 22px;
  }
  .al-doc-pop-countdown {
    padding: 12px 8px;
  }
  .al-doc-pop-sep {
    display: none;
  }
}

/* ==========================================================================
   Primer plano: Siluetas de animales dignificadas (cuerpo entero sin recortes)
   con mirada sutil iluminada en lila marca y blanco estrella (.al-forma)
   ========================================================================== */
.al-forma {
  position: relative;
  overflow: hidden;
}
.al-forma > * {
  position: relative;
  z-index: 2;
}
.al-forma > .al-forma-silueta {
  position: absolute;
  bottom: 8px;
  right: -10px;
  width: clamp(210px, 24vw, 300px);
  height: auto;
  pointer-events: none;
  z-index: 1;
  color: var(--texto, #2b2525);
  opacity: 0.13;
  transition: opacity 0.5s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);
  transform-origin: bottom right;
}
.al-forma:hover .al-forma-silueta {
  opacity: 0.24;
  transform: scale(1.04) translateY(-3px);
}
.al-forma-silueta path:first-child {
  fill: currentColor;
}

/* Escala y ubicación equilibrada según anatomía de cada animal */
.al-forma-silueta--vaca {
  width: clamp(230px, 26vw, 320px);
  bottom: 10px;
  right: -15px;
}
.al-forma-silueta--cerdo {
  width: clamp(225px, 25vw, 310px);
  bottom: 14px;
  right: -15px;
}
.al-forma-silueta--gallina {
  width: clamp(120px, 13vw, 165px);
  bottom: 12px;
  right: 12px;
}

/* Mirada viva y sutil: luz serena en lila (#cfa8ef) y violeta institucional (#7E17BE) */
@keyframes al-ojo-latido {
  0%, 100% {
    filter: drop-shadow(0 0 3px #cfa8ef) drop-shadow(0 0 6px rgba(126, 23, 190, 0.5));
    opacity: 0.82;
  }
  50% {
    filter: drop-shadow(0 0 5px #cfa8ef) drop-shadow(0 0 10px rgba(126, 23, 190, 0.75));
    opacity: 0.98;
  }
}
.al-forma-ojo {
  fill: #ffffff;
  opacity: 0.85;
  filter: drop-shadow(0 0 4px #cfa8ef) drop-shadow(0 0 8px rgba(126, 23, 190, 0.6));
  animation: al-ojo-latido 4.5s ease-in-out infinite;
  transition: opacity 0.4s ease, filter 0.4s ease;
}
.al-forma:hover .al-forma-ojo {
  animation: none;
  opacity: 1;
  filter: drop-shadow(0 0 6px #ffffff) drop-shadow(0 0 10px #cfa8ef) drop-shadow(0 0 16px rgba(126, 23, 190, 0.9));
}

/* ==========================================================================
   v40 · Manifiesto de Nivel Internacional: «El Ciclo Estratégico» (#manifiesto)
   ========================================================================== */
.al-manif {
  position: relative;
  padding: clamp(72px, 8vw, 130px) 0;
  background: var(--papel, #FAF7F3);
}

.al-manif-head {
  max-width: 1040px;
  margin-bottom: clamp(40px, 5vw, 64px);
}
.al-manif-kicker-row {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 18px;
}
.al-manif-sello {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(126, 23, 190, 0.08);
  border: 1px solid rgba(126, 23, 190, 0.2);
  color: var(--violeta, #7E17BE);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.al-manif-sello i {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--violeta, #7E17BE);
  box-shadow: 0 0 8px rgba(126, 23, 190, 0.6);
}

.al-manif .al-manifiesto-frase {
  font-family: var(--display) !important;
  font-weight: 400;
  font-size: clamp(1.85rem, 1.3rem + 2.2vw, 3.4rem) !important;
  line-height: 1.18 !important;
  letter-spacing: -0.028em;
  color: var(--texto, #2B2525) !important;
  max-width: 100% !important;
  margin: 0 !important;
}
.al-manif .al-manifiesto-frase em {
  font-family: var(--serif);
  font-style: italic;
  color: var(--violeta, #7E17BE);
}

/* Bloque central: Misión & Visión emparejadas frente a la Foto */
.al-manif-centro {
  display: grid;
  grid-template-columns: minmax(0, 1.22fr) minmax(0, 0.78fr);
  gap: clamp(32px, 5vw, 64px);
  align-items: stretch;
  margin-bottom: clamp(52px, 6vw, 84px);
}

.al-manif-dupla {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.al-manif-card {
  display: flex;
  flex-direction: column;
  padding: clamp(24px, 3vw, 36px);
  border-radius: 22px;
  background: #ffffff;
  border: 1px solid rgba(43, 37, 37, 0.08);
  box-shadow: 0 10px 30px -12px rgba(43, 37, 37, 0.06);
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.35s ease, border-color 0.35s ease;
}
.al-manif-card:hover {
  transform: translateY(-3px);
  border-color: rgba(126, 23, 190, 0.24);
  box-shadow: 0 18px 40px -14px rgba(126, 23, 190, 0.12);
}

.al-manif-card-tag {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 16px;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--violeta, #7E17BE);
}
.al-manif-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--violeta, #7E17BE);
}

.al-manif-card--mision h3 {
  margin: 0 0 12px;
  font-family: var(--display);
  font-weight: 500;
  font-size: clamp(1.2rem, 1.08rem + 0.3vw, 1.45rem);
  line-height: 1.25;
  letter-spacing: -0.015em;
  color: var(--texto, #2B2525);
}
.al-manif-card--mision p {
  margin: 0;
  font-size: 0.94rem;
  line-height: 1.62;
  color: var(--texto-2, #5f5866);
  flex: 1;
}

.al-manif-card--vision {
  background: linear-gradient(145deg, #ffffff 0%, rgba(244, 239, 233, 0.45) 100%);
  border-left: 3px solid var(--violeta, #7E17BE);
}
.al-manif-vision-quote {
  margin: 0 0 16px;
  padding: 0;
  border: 0;
  font-family: var(--serif);
  font-style: italic;
  font-size: clamp(1.22rem, 1.1rem + 0.4vw, 1.5rem);
  line-height: 1.35;
  color: var(--texto, #2B2525);
  flex: 1;
}
.al-manif-vision-pie {
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--texto-3, #8b8392);
  border-top: 1px solid rgba(43, 37, 37, 0.08);
  padding-top: 12px;
}

/* Foto institucional con placa de autoridad */
.al-manif-foto-wrap {
  position: relative;
  margin: 0;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 18px 44px -14px rgba(43, 37, 37, 0.16);
  display: flex;
  flex-direction: column;
}
.al-manif-foto-wrap .al-foto {
  width: 100%;
  height: 100%;
  min-height: 380px;
  aspect-ratio: 4 / 5;
  border-radius: 22px;
}
.al-manif-badge-foto {
  position: absolute;
  left: 16px;
  right: 16px;
  bottom: 16px;
  padding: 16px 18px;
  border-radius: 16px;
  background: rgba(14, 9, 22, 0.85);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #fff;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.al-manif-badge-tit {
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--lila, #cfa8ef);
}
.al-manif-badge-txt {
  margin: 0;
  font-family: var(--serif);
  font-style: italic;
  font-size: 0.98rem;
  line-height: 1.35;
  color: #f4efe9;
}
.al-manif-badge-sub {
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  color: rgba(244, 239, 233, 0.6);
  text-transform: uppercase;
  margin-top: 2px;
}

/* ==========================================================================
   Pipeline Horizontal: El Ciclo Estratégico de Impacto
   ========================================================================== */
.al-manif-ciclo-box {
  padding: clamp(32px, 4vw, 52px);
  border-radius: 28px;
  background: #ffffff;
  border: 1px solid rgba(43, 37, 37, 0.08);
  box-shadow: 0 16px 48px -18px rgba(43, 37, 37, 0.08);
}

.al-manif-ciclo-cab {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: clamp(32px, 4vw, 44px);
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(43, 37, 37, 0.08);
}
.al-manif-ciclo-tit {
  margin: 6px 0 0;
  font-family: var(--display);
  font-weight: 500;
  font-size: clamp(1.4rem, 1.15rem + 1vw, 2rem);
  letter-spacing: -0.02em;
  color: var(--texto, #2B2525);
}
.al-manif-ciclo-tit em {
  font-family: var(--serif);
  font-style: italic;
  font-weight: 400;
  color: var(--violeta, #7E17BE);
}
.al-manif-ciclo-desc {
  margin: 0;
  max-width: 420px;
  font-size: 0.9rem;
  line-height: 1.58;
  color: var(--texto-2, #5f5866);
}

.al-manif-pipeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(16px, 2.5vw, 32px);
  position: relative;
}

.al-pipe-step {
  position: relative;
  display: flex;
  flex-direction: column;
}

.al-pipe-top {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 14px;
  position: relative;
}
.al-pipe-num {
  display: inline-grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(126, 23, 190, 0.08);
  border: 1px solid rgba(126, 23, 190, 0.22);
  color: var(--violeta, #7E17BE);
  font-family: var(--display);
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: -0.02em;
  flex-shrink: 0;
  transition: transform 0.3s ease, background 0.3s ease, color 0.3s ease;
}
.al-pipe-step:hover .al-pipe-num {
  background: var(--violeta, #7E17BE);
  color: #fff;
  transform: scale(1.08);
}
.al-pipe-line {
  flex: 1;
  height: 2px;
  background: linear-gradient(90deg, rgba(126, 23, 190, 0.35) 0%, rgba(43, 37, 37, 0.1) 100%);
}
.al-pipe-step:last-child .al-pipe-line {
  background: linear-gradient(90deg, rgba(126, 23, 190, 0.35) 0%, transparent 100%);
}

.al-pipe-body {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.al-pipe-name {
  font-family: var(--display);
  font-weight: 600;
  font-size: 1.18rem;
  letter-spacing: -0.015em;
  color: var(--texto, #2B2525);
}
.al-pipe-sub {
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--violeta, #7E17BE);
}
.al-pipe-txt {
  margin: 4px 0 0;
  font-size: 0.88rem;
  line-height: 1.55;
  color: var(--texto-2, #5f5866);
}
.al-pipe-puntos {
  list-style: none;
  margin: 10px 0 0;
  padding: 10px 0 0;
  border-top: 1px dashed rgba(43, 37, 37, 0.12);
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.al-pipe-puntos li {
  position: relative;
  padding-left: 14px;
  font-size: 0.78rem;
  line-height: 1.4;
  color: var(--texto-3, #6c6573);
}
.al-pipe-puntos li::before {
  content: "•";
  position: absolute;
  left: 0;
  color: var(--violeta, #7E17BE);
  font-size: 1rem;
}

.al-manif-ciclo-pie {
  margin-top: clamp(28px, 3.5vw, 40px);
  padding-top: 22px;
  border-top: 1px solid rgba(43, 37, 37, 0.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}
.al-manif-retorno {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.86rem;
  color: var(--texto-2, #5f5866);
  font-style: italic;
  font-family: var(--serif);
}
.al-manif-retorno i {
  font-style: normal;
  color: var(--violeta, #7E17BE);
  font-size: 1.15rem;
}

/* Adaptabilidad responsive */
@media (max-width: 1024px) {
  .al-manif-centro {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .al-manif-pipeline {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px 24px;
  }
  .al-manif-ciclo-cab {
    flex-direction: column;
    align-items: flex-start;
  }
}

@media (max-width: 680px) {
  .al-manif-dupla {
    grid-template-columns: 1fr;
  }
  .al-manif-pipeline {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .al-pipe-line {
    display: none;
  }
  .al-pipe-step {
    padding-left: 52px;
  }
  .al-pipe-top {
    position: absolute;
    left: 0;
    top: 0;
    margin: 0;
  }
  .al-pipe-step::before {
    content: "";
    position: absolute;
    left: 19px;
    top: 44px;
    bottom: -16px;
    width: 2px;
    background: rgba(126, 23, 190, 0.18);
  }
  .al-pipe-step:last-child::before {
    display: none;
  }
  .al-manif-ciclo-pie {
    flex-direction: column;
    align-items: flex-start;
  }
}






/* Bloque 01: accesos a los temas de Veganismo, sin ocultar contenido. */
.al-indice-pagina { background: #f4efe9; color: #0b0710; border-bottom: 1px solid rgba(11,7,16,.14); padding: 24px 0; }
.al-indice-pagina p { margin: 0 0 12px; font-weight: 500; color: inherit; }
.al-indice-pagina ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.al-indice-pagina a { display: inline-flex; align-items: center; min-height: 44px; padding: 9px 16px; border: 1px solid rgba(11,7,16,.3); border-radius: 24px; color: #0b0710; font-size: .95rem; line-height: 1.4; }
.al-indice-pagina a:hover { background: #0b0710; color: #f4efe9; }
.al-indice-pagina a:focus-visible { outline: 3px solid #7e17be; outline-offset: 3px; }
#definicion, #razones { scroll-margin-top: 110px; }
@media (max-width: 600px) {
  .al-indice-pagina { padding: 20px 0; }
  .al-indice-pagina a { padding: 9px 12px; }
}

/* Bloque 02: búsqueda combinada con temas en el catálogo de estudios. */
#catalogo-estudios { scroll-margin-top: 110px; }
.al-est-busqueda { margin: 0 0 16px; }
.al-est-busqueda label { display: block; font-weight: 500; margin-bottom: 8px; }
.al-est-busqueda-fila { display: flex; gap: 12px; flex-wrap: wrap; }
.al-est-busqueda input { flex: 1 1 260px; min-width: 0; min-height: 48px; padding: 12px 16px; border: 1px solid #756f78; border-radius: 12px; background: #fff; color: #0b0710; font: inherit; }
.al-est-busqueda input::placeholder { color: #655f68; opacity: 1; }
.al-est-busqueda button { min-height: 48px; padding: 10px 16px; border: 1px solid #756f78; border-radius: 12px; background: transparent; color: #0b0710; font: inherit; cursor: pointer; }
.al-est-busqueda button:disabled { opacity: .5; cursor: default; }
.al-est-busqueda input:focus-visible, .al-est-busqueda button:focus-visible, .al-est-sec .al-est-chip:focus-visible { outline: 3px solid #7e17be; outline-offset: 3px; }
.al-est-sec .al-est-chip { min-height: 44px; }
.al-est-estado { margin: 0 0 20px; font-size: .95rem; }
.al-est-vacio { padding: 24px; background: #f4efe9; color: #0b0710; border-radius: 12px; }
.al-est-busqueda[hidden], .al-est-estado[hidden], .al-est-vacio[hidden] { display: none; }
.al-est .al-est-disponibilidad { font-size: .82rem; font-style: italic; }

.al-uni-form .al-form-estado { grid-column: 1 / -1; margin: 12px 0; font-size: .95rem; line-height: 1.6; }
.al-form-estado a { text-decoration: underline; text-underline-offset: 3px; overflow-wrap: anywhere; }
.al-form-estado a:focus-visible { outline: 3px solid #7e17be; outline-offset: 3px; }

/* Bloque 04: elegir entre coincidencias y recuperar búsquedas sin resultados. */
.al-rc-ayuda { max-width: 70ch; margin: 0 0 20px; line-height: 1.6; }
.al-rc-ayuda a { text-decoration: underline; text-underline-offset: 3px; }
.al-rc-elegir { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px 16px; margin: 20px 0; }
.al-rc-elegir label { grid-column: 1 / -1; font-weight: 500; }
.al-rc-elegir select, .al-rc-elegir button { min-width: 0; min-height: 48px; border: 1px solid #756f78; border-radius: 12px; padding: 10px 14px; font: inherit; color: #0b0710; background: #fff; }
.al-rc-elegir select { width: 100%; }
.al-rc-elegir button { cursor: pointer; }
.al-rc-elegir :disabled, .al-rc-azar:disabled { opacity: .5; cursor: default; }
.al-rc-elegir select:focus-visible, .al-rc-elegir button:focus-visible, .al-rc-chip:focus-visible, .al-rc-dia:focus-visible { outline: 3px solid #7e17be; outline-offset: 3px; }
.al-rc-chip { min-height: 44px; }
.al-rc-carta[hidden] { display: none; }
#calendario { scroll-margin-top: 110px; }
@media (max-width: 680px) { .al-rc-elegir { grid-template-columns: minmax(0, 1fr); } }

/* Bloque 08: reservar los rótulos laterales para pantallas con margen suficiente. */
.al-ti-modal [hidden] { display: none !important; }
@media (max-width: 1400px) {
  .mil-frame .mil-frame-bottom { display: none; }
}
@media (min-width: 1000px) {
  .al-art-portada h1.al-art-h1,
  .al-art-portada .al-portada-pie { max-width: 50%; }
  .al-art-portada .al-protagonista { top: auto !important; bottom: 90px; }
}

/* ==========================================================================
   v41 · Protagonismo del estreno de «Bajo las jaulas»
   Marca en el menú · banda de estreno en el home · estreno al frente de Documentales
   ========================================================================== */
.al-menu-estreno { display: inline-block; margin-left: 6px; padding: 2px 7px 2px; border-radius: 999px; background: #E93B24; color: #fff; font-family: var(--texto-f); font-style: normal; font-weight: 600; font-size: .58rem; letter-spacing: .12em; text-transform: uppercase; vertical-align: 2px; line-height: 1.5; }
.al-kicker-estreno i { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #E93B24; box-shadow: 0 0 0 0 rgba(233,59,36,.6); animation: al-estreno-pulso 1.8s ease-out infinite; }
@keyframes al-estreno-pulso { 0% { box-shadow: 0 0 0 0 rgba(233,59,36,.55); } 80%, 100% { box-shadow: 0 0 0 10px rgba(233,59,36,0); } }

/* Home: banda de estreno entre la portada y las rutas */
.al-estreno-banda { position: relative; overflow: hidden; padding: clamp(80px, 10vw, 150px) 0; background: #0b0808; color: #F3F3F3; isolation: isolate; }
.al-estreno-fondo { position: absolute; inset: 0; z-index: -1; }
.al-estreno-fondo img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; opacity: .38; filter: saturate(.55) contrast(1.1) brightness(.75); transform: scale(1.04); }
.al-estreno-fondo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,8,8,.94) 0%, rgba(11,8,8,.78) 45%, rgba(11,8,8,.35) 100%), linear-gradient(180deg, rgba(11,8,8,.4), transparent 30%, transparent 70%, rgba(11,8,8,.6)); }
.al-estreno-in { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .8fr); gap: clamp(30px, 5vw, 80px); align-items: end; }
.al-estreno-banda .al-kicker { color: rgba(243,243,243,.75); }
.al-estreno-t { margin: 0; font-family: var(--display); font-weight: 500; font-size: clamp(3rem, 1.6rem + 6vw, 7.5rem); line-height: .92; letter-spacing: -0.05em; color: #F3F3F3; }
.al-estreno-t em { font-family: "Instrument Serif", serif; font-style: italic; font-weight: 400; color: #E9786A; }
.al-estreno-l { margin: 18px 0 0; font-family: "Instrument Serif", serif; font-style: italic; font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.4rem); color: #F3F3F3 !important; }
.al-estreno-p { max-width: 36rem; margin: 14px 0 0; font-size: 1.04rem; line-height: 1.6; color: rgba(243,243,243,.8) !important; }
.al-estreno-acc { display: flex; flex-direction: column; align-items: flex-start; gap: 18px; padding-bottom: 8px; }
.al-estreno-hash { margin: 6px 0 0; font-weight: 600; letter-spacing: .04em; color: #E93B24 !important; }
@media (max-width: 900px) { .al-estreno-in { grid-template-columns: 1fr; align-items: start; } .al-estreno-fondo::after { background: linear-gradient(180deg, rgba(11,8,8,.6), rgba(11,8,8,.9)); } }

@media (prefers-reduced-motion: reduce) { .al-kicker-estreno i { animation: none; } }

/* Documentales: el estreno como ficha de película — afiche, sinopsis, ficha, acciones y los tres actos */
.al-doc-estreno { position: relative; overflow: hidden; padding: clamp(100px, 12vw, 180px) 0 !important; background: radial-gradient(70% 50% at 15% 0%, rgba(233,120,106,.10), transparent 70%), linear-gradient(180deg, #0f0b0b 0%, #0b0808 100%) !important; color: #F3F3F3; }
.al-doc-estreno::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(233,120,106,.7), transparent); }
.al-doc-estreno .al-kicker { color: rgba(243,243,243,.72); }
.al-de-grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: clamp(40px, 6vw, 100px); align-items: center; }
.al-de-afiche { position: relative; display: block; aspect-ratio: 4 / 5; border-radius: 26px; overflow: hidden; background: #000; box-shadow: 0 50px 100px -40px rgba(0,0,0,.9), 0 0 0 1px rgba(243,243,243,.08); text-decoration: none !important; }
.al-de-afiche img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.6) brightness(.72) contrast(1.06); transform: scale(1.02); transition: transform 1.2s cubic-bezier(.2,.7,.2,1), filter .6s; }
.al-de-afiche:hover img, .al-de-afiche:focus-visible img { transform: scale(1.07); filter: saturate(.75) brightness(.82) contrast(1.06); }
.al-de-afiche:focus-visible { outline: 2px solid #E9786A; outline-offset: 5px; }
.al-de-velo { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,8,8,.35) 0%, transparent 30%, transparent 55%, rgba(11,8,8,.9) 100%); }
.al-de-estado { position: absolute; left: 20px; top: 20px; display: inline-flex; align-items: center; gap: 9px; padding: 8px 14px; border-radius: 999px; background: rgba(11,8,8,.62); border: 1px solid rgba(243,243,243,.18); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: #F3F3F3; }
.al-de-estado i { width: 7px; height: 7px; border-radius: 50%; background: #E93B24; animation: al-estreno-pulso 1.8s ease-out infinite; }
.al-de-afiche-pie { position: absolute; left: 24px; right: 24px; bottom: 22px; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 14px; font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: rgba(243,243,243,.8); }
.al-de-afiche-pie b { letter-spacing: .04em; text-transform: none; font-size: .9rem; color: #E9786A; }
.al-de-t { margin: 0; font-family: var(--display); font-weight: 500; font-size: clamp(3rem, 1.6rem + 5vw, 6.6rem); line-height: .92; letter-spacing: -0.05em; color: #F3F3F3; }
.al-de-t em { font-family: "Instrument Serif", serif; font-style: italic; font-weight: 400; color: #E9786A; background: none; -webkit-text-fill-color: currentColor; }
.al-de-lema { margin: 16px 0 0; font-family: "Instrument Serif", serif; font-style: italic; font-size: clamp(1.45rem, 1.1rem + 1.2vw, 2.2rem); color: #F3F3F3 !important; }
.al-de-lead { max-width: 36rem; margin: 18px 0 0; font-size: 1.04rem; line-height: 1.62; color: rgba(243,243,243,.8) !important; }
.al-de-ficha { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 26px; max-width: 36rem; margin: 28px 0 0; }
.al-de-ficha > div { padding: 12px 0; border-top: 1px dashed rgba(243,243,243,.16); }
.al-de-ficha dt { font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(243,243,243,.6); }
.al-de-ficha dd { margin: 4px 0 0; font-size: .94rem; line-height: 1.4; color: #F3F3F3; }
.al-de-ficha-ir { display: inline-flex; align-items: center; gap: 10px; margin-top: 10px; font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: #E9786A !important; text-decoration: none; }
.al-de-ficha-ir i { position: relative; width: 16px; height: 1px; background: currentColor; transition: width .3s; }
.al-de-ficha-ir i::after { content: ""; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-right: 1px solid currentColor; border-top: 1px solid currentColor; transform: rotate(45deg); }
.al-de-ficha-ir:hover i, .al-de-ficha-ir:focus-visible i { width: 26px; }
.al-de-acc { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 32px; }
.al-de-mas { margin: 22px 0 0; font-size: .86rem; line-height: 1.5; color: rgba(243,243,243,.66) !important; }
.al-de-mas a { color: #F3F3F3 !important; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(243,243,243,.35); }
.al-de-actos { margin-top: clamp(80px, 9vw, 130px); }
.al-de-actos-cab { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 10px 30px; margin-bottom: 28px; }
.al-de-actos-cab .al-kicker { margin-bottom: 0; }
.al-de-actos-t { margin: 0; font-family: var(--display); font-weight: 500; font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.8rem); line-height: 1.02; letter-spacing: -0.035em; color: #F3F3F3; }
.al-de-actos-t em { font-family: "Instrument Serif", serif; font-style: italic; font-weight: 400; color: #E9786A; }
.al-de-actos-lista { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; list-style: none; margin: 0; padding: 0; }
.al-de-acto { position: relative; display: flex; flex-direction: column; height: 100%; padding: 28px 26px 24px; border-radius: 22px; overflow: hidden; border: 1px solid rgba(243,243,243,.12); color: #F3F3F3 !important; text-decoration: none !important;
  background: linear-gradient(180deg, rgba(130,195,220, calc(.11 - var(--k) * .035)) 0%, rgba(11,8,8,0) 70%), rgba(243,243,243,.02); transition: transform .4s cubic-bezier(.2,.7,.2,1), border-color .3s, background-color .3s; }
.al-de-acto::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: linear-gradient(90deg, rgba(130,195,220,.7), rgba(233,120,106,.8)); opacity: calc(1 - var(--k) * .25); }
.al-de-acto:hover, .al-de-acto:focus-visible { transform: translateY(-4px); border-color: rgba(233,120,106,.6); background-color: rgba(233,120,106,.05); outline: none; }
.al-de-acto-sup { display: flex; justify-content: space-between; gap: 10px; font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(243,243,243,.62); font-variant-numeric: tabular-nums; }
.al-de-acto-sup b { color: #E9786A; font-weight: 600; }
.al-de-acto-t { margin-top: 16px; font-family: var(--display); font-weight: 500; font-size: clamp(1.4rem, 1.15rem + .8vw, 1.9rem); line-height: 1.05; letter-spacing: -0.03em; }
.al-de-acto-g { margin-top: 10px; font-size: .92rem; line-height: 1.5; color: rgba(243,243,243,.72); }
.al-de-acto-dato { display: flex; align-items: baseline; gap: 10px; margin-top: 20px; padding-top: 16px; border-top: 1px dashed rgba(243,243,243,.14); font-size: .8rem; line-height: 1.35; color: rgba(243,243,243,.7); }
.al-de-acto-dato b { flex: none; font-family: var(--display); font-weight: 600; font-size: 1.9rem; line-height: 1; letter-spacing: -0.04em; color: #E9786A; }
.al-de-acto-ir { display: inline-flex; align-items: center; gap: 10px; margin-top: auto; padding-top: 20px; font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; color: #F3F3F3; }
.al-de-acto-ir i { position: relative; width: 16px; height: 1px; background: currentColor; transition: width .3s; }
.al-de-acto-ir i::after { content: ""; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-right: 1px solid currentColor; border-top: 1px solid currentColor; transform: rotate(45deg); }
.al-de-acto:hover .al-de-acto-ir i, .al-de-acto:focus-visible .al-de-acto-ir i { width: 28px; }
@media (max-width: 991px) {
  .al-de-grid { grid-template-columns: 1fr; }
  .al-de-afiche { aspect-ratio: 4 / 3; }
  .al-de-actos-lista { grid-template-columns: 1fr; }
}
@media (max-width: 480px) { .al-de-ficha { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .al-de-estado i { animation: none; } .al-de-afiche img, .al-de-acto { transition: none; } }

/* ==========================================================================
   v41 · «Alguien, no algo»: los animales con el mismo dibujo de puntos del menú
   ========================================================================== */
.al-alguien-escena { background: radial-gradient(70% 60% at 50% 42%, #1a0d24 0%, #0b0710 70%) !important; box-shadow: 0 40px 90px -40px rgba(11,7,16,.6); }
.al-alguien-contador { color: rgba(244,239,233,.55) !important; }
.al-alguien-contador b { color: #F4EFE9 !important; }
.al-alguien-pista { color: rgba(244,239,233,.6) !important; }
.al-ind-visual--puntos { position: relative; display: block; aspect-ratio: 4 / 3; border-radius: 20px; overflow: hidden; background: radial-gradient(70% 60% at 50% 45%, #1a0d24 0%, #0b0710 72%); cursor: pointer; -webkit-tap-highlight-color: transparent; }
.al-ind-visual--puntos canvas { position: absolute; inset: 0; width: 100%; height: 100%; transition: opacity .5s ease; }
.al-ind-visual--puntos img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .6s ease; }
.al-ind-visual--puntos.al-ver-foto img { opacity: 1; }
.al-ind-visual--puntos.al-ver-foto canvas { opacity: 0; }
.al-ind-pista { position: absolute; right: 14px; bottom: 12px; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: rgba(244,239,233,.12); border: 1px solid rgba(244,239,233,.25); }
.al-ind-pista::before { content: ""; width: 12px; height: 9px; border: 1.5px solid #F4EFE9; border-radius: 2px; box-shadow: inset 0 0 0 2px transparent; }
.al-ind-visual--puntos.al-ver-foto .al-ind-pista { background: rgba(11,7,16,.55); }
.al-ind-visual--puntos:focus-visible { outline: 3px solid #B65CF0; outline-offset: 3px; }

/* v41 · Vitrina de la tienda: compactar, desplegar y abrir el panel con suavidad */
.al-ti-home { --th-ease: cubic-bezier(.65, 0, .35, 1); }
/* al desplegarse: primero crece, después aparece el texto */
.al-ti-home-btn { transition: transform .35s cubic-bezier(.22,1,.36,1), border-color .3s, box-shadow .3s, padding .55s var(--th-ease), gap .55s var(--th-ease), border-radius .55s var(--th-ease); }
.al-th-fotos { transition: width .55s var(--th-ease), opacity .35s ease .22s; }
.al-ti-home-txt { max-width: var(--th-tw, 230px); transition: max-width .55s var(--th-ease), opacity .35s ease .28s; }
.al-th-ir { transition: transform .35s cubic-bezier(.22,1,.36,1), width .55s var(--th-ease), height .55s var(--th-ease); }
.al-th-prog { transition: opacity .3s ease .3s; }
/* al compactarse: primero se apaga el texto, después se recoge */
.al-ti-home.al-compacto .al-ti-home-btn { transition: transform .35s cubic-bezier(.22,1,.36,1), border-color .3s, box-shadow .3s, padding .55s var(--th-ease) .12s, gap .55s var(--th-ease) .12s, border-radius .55s var(--th-ease) .12s; }
.al-ti-home.al-compacto .al-th-fotos { transition: width .55s var(--th-ease) .12s, opacity .2s ease; }
.al-ti-home.al-compacto .al-ti-home-txt { transition: max-width .55s var(--th-ease) .12s, opacity .18s ease; }
.al-ti-home.al-compacto .al-th-ir { transition: transform .35s cubic-bezier(.22,1,.36,1), width .55s var(--th-ease) .12s, height .55s var(--th-ease) .12s; }
.al-ti-home.al-compacto .al-th-prog { transition: opacity .15s ease; }

/* el panel se despliega desde la bolsita y se pliega igual de suave */
.al-ti-home-pop { opacity: 0; transform: translateY(12px) scale(.97); clip-path: inset(35% 0 0 0 round 26px); -webkit-clip-path: inset(35% 0 0 0 round 26px);
  transition: opacity .26s ease .04s, transform .34s cubic-bezier(.4,0,.2,1), clip-path .34s cubic-bezier(.4,0,.2,1), -webkit-clip-path .34s cubic-bezier(.4,0,.2,1); }
.al-ti-home.al-abierto .al-ti-home-pop { opacity: 1; transform: none; clip-path: inset(0 0 0 0 round 26px); -webkit-clip-path: inset(0 0 0 0 round 26px);
  transition: opacity .35s ease, transform .65s cubic-bezier(.16,1,.3,1), clip-path .65s cubic-bezier(.16,1,.3,1), -webkit-clip-path .65s cubic-bezier(.16,1,.3,1); }
@media (prefers-reduced-motion: reduce) {
  .al-ti-home-pop, .al-ti-home.al-abierto .al-ti-home-pop { clip-path: none; -webkit-clip-path: none; transform: none; transition: opacity .2s ease; }
  .al-ti-home-btn, .al-th-fotos, .al-ti-home-txt, .al-th-ir, .al-ti-home.al-compacto .al-ti-home-btn, .al-ti-home.al-compacto .al-th-fotos, .al-ti-home.al-compacto .al-ti-home-txt, .al-ti-home.al-compacto .al-th-ir { transition: none !important; }
}

/* v41 · Cifras: pantalla de puntos viva en «+100M» */
.al-b-play .al-picto--vivo { width: 92px; height: 92px; }
.al-b-play .al-picto--vivo circle { fill: var(--lila); opacity: 0; transform-box: fill-box; transform-origin: center; transform: scale(.55);
  transition: opacity .45s ease, transform .55s cubic-bezier(.2,.8,.2,1), fill .4s ease; transition-delay: var(--md, 0ms); }
.al-b-play .al-picto--vivo circle.on { opacity: 1; transform: scale(1); }
.al-b--vistas:hover .al-b-play .al-picto--vivo circle.on { fill: #f3c6ff; }
@media (prefers-reduced-motion: reduce) { .al-b-play .al-picto--vivo circle, .al-b-play .al-picto--vivo circle.on { transform: none; transition: opacity .5s ease; transition-delay: 0ms; } }

/* ==========================================================================
   v41 · Cifras: línea de hitos y tarjeta del estreno
   ========================================================================== */
/* 16 años: línea con hitos */
.al-b-linea--hitos { align-items: center; }
.al-b-eje { position: relative; flex: 1; height: 18px; display: flex; align-items: center; }
.al-b-eje > i { position: absolute; left: 0; right: 0; top: 50%; height: 2px; margin-top: -1px; background: var(--linea); overflow: hidden; }
.al-b-eje > i b { position: absolute; inset: 0; background: var(--violeta); transform: scaleX(0); transform-origin: left; transition: transform 1.6s cubic-bezier(.6,0,.2,1) .3s; }
.al-b.al-visto .al-b-eje > i b { transform: scaleX(1); }
.al-b-hitos { position: absolute; inset: 0; display: flex; justify-content: space-between; align-items: center; list-style: none; margin: 0; padding: 0; }
.al-b-hitos li { display: flex; }
.al-b-hitos button { position: relative; display: grid; place-items: center; width: 22px; height: 22px; margin: 0 -11px; padding: 0; border: 0; background: none; cursor: pointer; }
.al-b-hitos li:first-child button { margin-left: -6px; } .al-b-hitos li:last-child button { margin-right: -6px; }
.al-b-hitos button i { width: 9px; height: 9px; border-radius: 50%; background: var(--papel); border: 2px solid var(--violeta); transition: transform .35s cubic-bezier(.2,.8,.2,1), background .3s, box-shadow .3s; }
.al-b-hitos button.al-pasado i { background: var(--violeta); }
.al-b-hitos button.al-on i { background: var(--violeta); transform: scale(1.45); box-shadow: 0 0 0 5px rgba(126,23,190,.14); }
.al-b-hitos button:focus-visible { outline: 2px solid var(--violeta); outline-offset: 2px; border-radius: 50%; }
.al-b-hito { display: block; margin-top: 12px; min-height: 3.6em; color: var(--texto) !important; text-decoration: none !important; transition: opacity .18s ease, transform .18s ease; }
.al-b-hito.al-cambia { opacity: 0; transform: translateY(4px); }
.al-b-hito b { font-family: var(--serif); font-style: italic; font-weight: 400; font-size: 1.05rem; color: var(--violeta); }
.al-b-hito span { font-size: .84rem; line-height: 1.35; color: var(--texto-2); }
.al-b-hito em { display: block; margin-top: 6px; font-style: normal; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: var(--texto-3); transition: color .25s; }
.al-b-hito:hover em, .al-b-hito:focus-visible em { color: var(--violeta); }
.al-b--anos .al-b-linea { margin-top: auto; }

/* +1 en camino: Bajo las jaulas */
.al-b--estreno { position: relative; isolation: isolate; text-decoration: none !important; background: radial-gradient(90% 70% at 100% 100%, rgba(233,59,36,.16), transparent 60%), #0b0710 !important; color: #F4EFE9 !important; transition: transform .4s cubic-bezier(.2,.8,.2,1); }
.al-b--estreno:hover, .al-b--estreno:focus-visible { transform: translateY(-3px); outline: none; }
.al-b--estreno:focus-visible { box-shadow: 0 0 0 3px #B65CF0; }
.al-b-estreno-k { display: inline-flex; align-items: center; gap: 8px; font-size: .74rem; letter-spacing: .04em; color: rgba(244,239,233,.75); }
.al-b-estreno-k em { font-family: var(--serif); font-style: italic; font-size: .95rem; color: #E9786A; }
.al-b-estreno-k i { width: 7px; height: 7px; border-radius: 50%; background: #E93B24; animation: al-estreno-pulso 1.8s ease-out infinite; }
.al-b--estreno .al-b-num { color: #F4EFE9; }
.al-b--estreno .al-b-txt { color: rgba(244,239,233,.8); }
.al-b-estreno-sil { position: absolute; right: -14px; bottom: 26px; z-index: -1; width: 74%; height: 46%; fill: rgba(233,120,106,.12); transition: transform .8s cubic-bezier(.2,.8,.2,1); }
.al-b--estreno:hover .al-b-estreno-sil { transform: translateX(-10px); }
.al-b-estreno-ir { display: inline-flex; align-items: center; gap: 10px; margin-top: auto; font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; color: #F4EFE9; }
.al-b-estreno-ir i { position: relative; width: 16px; height: 1px; background: currentColor; transition: width .3s; }
.al-b-estreno-ir i::after { content: ""; position: absolute; right: 0; top: -3px; width: 7px; height: 7px; border-right: 1px solid currentColor; border-top: 1px solid currentColor; transform: rotate(45deg); }
.al-b--estreno:hover .al-b-estreno-ir i { width: 28px; }
@media (prefers-reduced-motion: reduce) { .al-b-estreno-k i { animation: none; } .al-b--estreno, .al-b-estreno-sil { transition: none; } }
/* rótulo del estreno en una línea */
.al-b-estreno-k { display: block; line-height: 1.4; }
.al-b-estreno-k i { display: inline-block; margin-right: 8px; vertical-align: 1px; }

/* v41 · Cifras: «+100M» con una foto de fondo apenas presente (la cabrita), entre el número y el ícono */
.al-b--vistas { isolation: isolate; }
.al-b--vistas::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: url("../img/animales/cabrita.webp") 75% 30% / 60% auto no-repeat;
  opacity: .2; filter: saturate(.6); transform: scale(1.03); transform-origin: 62% 50%;
  -webkit-mask-image: radial-gradient(ellipse 30% 80% at 62% 45%, #000 35%, transparent 100%); mask-image: radial-gradient(ellipse 30% 80% at 62% 45%, #000 35%, transparent 100%);
  transition: opacity .8s ease, transform 1.4s cubic-bezier(.2,.8,.2,1); }
.al-b--vistas:hover::before { opacity: .3; transform: scale(1); }
@media (max-width: 560px) { .al-b--vistas::before { background-size: 80% auto; background-position: 100% 30%; opacity: .16;
  -webkit-mask-image: radial-gradient(ellipse 38% 80% at 66% 45%, #000 30%, transparent 100%); mask-image: radial-gradient(ellipse 38% 80% at 66% 45%, #000 30%, transparent 100%); } }
@media (prefers-reduced-motion: reduce) { .al-b--vistas::before { transition: none; transform: none; } }

/* v41 · Cifras: «2 documentales publicados» con los dos afiches de fondo, a sangre, alternándose en un fundido
   (solo opacidad: se mantiene también con movimiento reducido) */
.al-b--docs { isolation: isolate; }
.al-b--docs .al-b-afiches { position: absolute; inset: 0; z-index: -1; display: block; margin: 0; pointer-events: none; opacity: .55; transition: opacity .8s ease; }
.al-b--docs:hover .al-b-afiches { opacity: .75; }
.al-b--docs .al-b-afiches::after { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(to bottom, var(--papel, #faf7f3) 18%, rgba(250,247,243,.82) 42%, rgba(250,247,243,.25) 78%, rgba(250,247,243,.1) 100%); }
.al-b--docs .al-b-afiches .al-foto { position: absolute; inset: 0; aspect-ratio: auto; width: 100%; height: 100%; border-radius: 0; transform: none !important; opacity: 1; filter: saturate(.7) contrast(.95); }
.al-b--docs .al-b-afiches .al-foto img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.05); transition: transform 1.6s cubic-bezier(.2,.8,.2,1); }
.al-b--docs .al-b-afiches .al-foto:first-child img { object-position: 35% 60%; }
.al-b--docs .al-b-afiches .al-foto:nth-child(2) { opacity: 0; animation: al-docs-cruce 11s ease-in-out infinite; }
.al-b--docs .al-b-afiches .al-foto:nth-child(2) img { object-position: 60% 8%; }
@keyframes al-docs-cruce { 0%, 38% { opacity: 0; } 50%, 88% { opacity: 1; } 100% { opacity: 0; } }
.al-b--docs:hover .al-b-afiches .al-foto img { transform: scale(1); }
@media (prefers-reduced-motion: reduce) { .al-b--docs .al-b-afiches .al-foto img { transition: none; transform: none; } }

/* ==========================================================================
   v41 · Flotante de Julieta (Educación): se compacta a la foto, vista previa del mensaje,
   motivo según la sección, se retira junto a la ficha, hoja en celular y no se pisa con «Equipo»
   ========================================================================== */
.al-ef-mini i, .al-ef-avatar i, .al-ef-txt b i { display: none; }
.al-ef-btn { transition: transform .3s cubic-bezier(.22,1,.36,1), border-color .3s ease, box-shadow .3s ease, padding .55s cubic-bezier(.22,1,.36,1), gap .55s cubic-bezier(.22,1,.36,1); }
.al-ef-txt { max-width: var(--ef-tw, 340px); overflow: hidden; white-space: nowrap; opacity: 1;
  transition: max-width .6s cubic-bezier(.22,1,.36,1), opacity .35s ease .12s; }
.al-ef-txt em { white-space: nowrap; }
.al-edu-flot.al-compacto .al-ef-btn { padding-right: 6px; gap: 0; }
.al-edu-flot.al-compacto .al-ef-txt { max-width: 0; opacity: 0; transition: max-width .6s cubic-bezier(.22,1,.36,1) .05s, opacity .2s ease; }
.al-edu-flot.al-compacto .al-ef-mini img { box-shadow: 0 0 0 0 rgba(207,168,239,.5); animation: al-ef-latido 3.2s ease-out 1; }
@keyframes al-ef-latido { 0% { box-shadow: 0 0 0 0 rgba(207,168,239,.45); } 100% { box-shadow: 0 0 0 12px rgba(207,168,239,0); } }

/* Vista previa del mensaje que arma cada motivo */
.al-ef-chips { margin-bottom: 10px; }
.al-ef-prev { margin: 0 0 14px; padding: 10px 12px; border-radius: 12px; border: 1px dashed rgba(207,168,239,.28); background: rgba(126,23,190,.08); }
.al-ef-prev span { display: block; margin-bottom: 4px; font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(207,168,239,.85); }
.al-ef-prev p { margin: 0; font-size: .8rem; line-height: 1.42; color: rgba(244,239,233,.86); transition: opacity .16s ease, transform .16s ease; }
.al-ef-prev p.al-cambia { opacity: 0; transform: translateY(3px); }
.al-ef-prev p::before { content: "“"; color: #cfa8ef; } .al-ef-prev p::after { content: "”"; color: #cfa8ef; }
.al-ef-velo { display: none; }

/* El botón «Equipo» sube para no pisar a Julieta mientras ella está a la vista (salvo que lo hayan movido) */
html.al-ef-visible .al-equipo-flot:not(.al-movido) { bottom: calc(clamp(12px, 2vw, 28px) + 64px); }

/* Celular: el contacto se abre como hoja desde abajo */
@media (max-width: 767px) {
  .al-ef-txt em { max-width: 175px; overflow: hidden; text-overflow: ellipsis; }
  .al-ef-velo { display: block; position: fixed; inset: 0; z-index: 0; background: rgba(8,4,14,.55); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); opacity: 0; pointer-events: none; transition: opacity .3s ease; }
  .al-edu-flot.al-abierto .al-ef-velo { opacity: 1; pointer-events: auto; }
  .al-ef-pop { position: fixed; z-index: 1; left: 0; right: 0; bottom: 0; width: 100%; max-height: 86vh; overflow-y: auto; overscroll-behavior: contain; box-sizing: border-box;
    padding: 26px 18px calc(18px + env(safe-area-inset-bottom)); border-radius: 24px 24px 0 0; border-bottom: 0;
    transform: translateY(104%); transform-origin: bottom center; transition: transform .45s cubic-bezier(.22,1,.36,1), opacity .2s ease; }
  .al-ef-pop::before { content: ""; position: absolute; left: 50%; top: 9px; width: 38px; height: 4px; margin-left: -19px; border-radius: 4px; background: rgba(244,239,233,.22); }
  .al-edu-flot.al-abierto .al-ef-pop { transform: none; }
  .al-ef-chip { min-height: 40px; padding: 8px 13px; font-size: .78rem; }
  .al-ef-btn-pri { min-height: 48px; font-size: .9rem; }
  .al-ef-copy { min-height: 36px; padding: 6px 14px; }
  html.al-ef-hoja .al-equipo-flot, html.al-ef-hoja .al-dona-flotante { opacity: 0; pointer-events: none; }
  html.al-ef-visible .al-equipo-flot:not(.al-movido) { bottom: 84px; }
}
@media (prefers-reduced-motion: reduce) {
  .al-ef-txt, .al-edu-flot.al-compacto .al-ef-txt, .al-ef-btn, .al-ef-pop { transition: opacity .2s ease !important; }
  .al-edu-flot.al-compacto .al-ef-mini img { animation: none; }
}
@media (max-width: 767px) { html.al-ef-hoja .al-edu-flot { z-index: 9600; } }
/* con el contacto abierto, el botón «Equipo» se corre de en medio */
html.al-ef-abierto .al-equipo-flot { opacity: 0; pointer-events: none; }

/* v41 · Banda institucional (.al-alianza: home, fundaciones, únete, contacto): foto del auditorio de fondo en duotono violeta */
.al-alianza { position: relative; isolation: isolate; overflow: hidden; }
.al-alianza::before { content: ""; position: absolute; inset: 0; z-index: -2; pointer-events: none;
  background: url("../img/fotos/charla-auditorio-2.webp") 60% 58% / cover no-repeat;
  filter: grayscale(1) contrast(1.15) brightness(.95); opacity: .62; transform: scale(1.06); transform-origin: 70% 50%;
  transition: transform 2.4s cubic-bezier(.2,.8,.2,1), opacity .8s ease; }
.al-alianza::after { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background:
    linear-gradient(90deg, rgba(11,7,16,.97) 0%, rgba(11,7,16,.88) 30%, rgba(11,7,16,.35) 62%, rgba(11,7,16,.55) 100%),
    linear-gradient(0deg, rgba(74,12,118,.5), rgba(74,12,118,.5)); }
.al-alianza:hover::before { transform: scale(1); opacity: .75; }
@media (max-width: 991px) {
  .al-alianza::before { background-position: 60% 70%; }
  .al-alianza::after { background: linear-gradient(180deg, rgba(11,7,16,.94) 0%, rgba(11,7,16,.82) 45%, rgba(11,7,16,.42) 100%), linear-gradient(0deg, rgba(74,12,118,.5), rgba(74,12,118,.5)); }
}
@media (prefers-reduced-motion: reduce) { .al-alianza::before { transition: opacity .3s ease; transform: none; } .al-alianza:hover::before { transform: none; } }
/* el botón de la banda no se sale en pantallas angostas */
@media (max-width: 600px) {
  .al-alianza > .mil-button { max-width: 100%; box-sizing: border-box; justify-self: stretch; justify-content: space-between; gap: 12px; }
  .al-alianza > .mil-button span { white-space: normal; text-align: left; letter-spacing: .08em; line-height: 1.35; }
}

/* v41 · Quiénes somos (home): la tarjeta «Visión de futuro» con foto (sin el fondo gris genérico de las citas) */
.al-manif-card--vision .al-manif-vision-quote { flex: none; background: none; }
.al-manif-vision-foto { position: relative; flex: 1; min-height: 170px; margin: 0 0 16px; border-radius: 14px; overflow: hidden; background: #ece6df; }
.al-manif-vision-foto img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% 35%; transform: scale(1.04); transition: transform 1.6s cubic-bezier(.2,.8,.2,1); }
.al-manif-vision-foto::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: inset 0 0 0 1px rgba(43,37,37,.06); pointer-events: none; }
.al-manif-card--vision:hover .al-manif-vision-foto img { transform: scale(1); }
@media (max-width: 680px) { .al-manif-vision-foto { flex: none; aspect-ratio: 16 / 10; min-height: 0; } }
@media (prefers-reduced-motion: reduce) { .al-manif-vision-foto img { transition: none; transform: none; } }

/* v41 · Quiénes somos (home): en «Misión», la silueta de línea fina del cerdo asoma desde abajo y se dibuja al entrar */
.al-manif-card--mision { position: relative; overflow: hidden; isolation: isolate; }
.al-manif-card--mision > *:not(.al-manif-mision-animal) { position: relative; z-index: 1; }
.al-manif-mision-animal { position: absolute; z-index: 0; left: -20%; bottom: -9%; width: 108%; aspect-ratio: 800 / 471; pointer-events: none;
  transition: transform 1s cubic-bezier(.2,.8,.2,1); }
.al-manif-mision-animal svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
/* solo la silueta de línea fina, en violeta, que se dibuja al entrar */
.al-mma-contorno { fill: none; stroke: var(--violeta, #7E17BE); stroke-width: 3.2; stroke-linejoin: round; stroke-linecap: round; opacity: .85; }
.al-manif-card--mision:hover .al-manif-mision-animal { transform: translateY(-10px); }
@supports (animation-timeline: view()) {
  .al-manif-mision-animal { animation: al-mma-asoma linear both; animation-timeline: view(); animation-range: entry 10% cover 45%; }
  @keyframes al-mma-asoma { from { translate: 0 30%; } to { translate: 0 0; } }
  .al-mma-contorno { stroke-dasharray: 9000; animation: al-mma-traza linear both; animation-timeline: view(); animation-range: entry 0% cover 50%; }
  @keyframes al-mma-traza { from { stroke-dashoffset: 9000; } to { stroke-dashoffset: 0; } }
}
@media (max-width: 680px) { .al-manif-card--mision { min-height: 400px; } .al-manif-mision-animal { width: 92%; left: -12%; bottom: -8%; } }
@media (prefers-reduced-motion: reduce) { .al-manif-mision-animal, .al-mma-contorno { animation: none; transition: none; stroke-dasharray: none; } }

/* v41 · Recetario: filtro «Fuente de» por nutriente */
.al-rc-nut { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: 14px 0 6px; }
.al-rc-nut-k { font-family: var(--serif); font-style: italic; font-size: 1.05rem; color: var(--violeta, #7E17BE); margin-right: 4px; }
.al-rc-chip--nut i { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; box-shadow: inset 0 0 0 1.5px currentColor; vertical-align: 1px; }
.al-rc-chip--nut.al-on i { background: #E93B24; box-shadow: none; }
.al-rc-nut small { flex-basis: 100%; font-size: .74rem; color: var(--texto-3, #8b8392); }
.al-rc-fuente b { color: var(--violeta, #7E17BE); }

/* v41 · Día Nacional contra el Rodeo: voces y próxima edición */
.al-dncr-citas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.al-dncr-cita .al-pp-v-n { font-family: var(--serif); font-style: italic; font-size: 4.2rem; line-height: .6; height: 34px; display: block; }
.al-dncr-cita blockquote { margin: 0 0 22px !important; padding: 0 !important; border: 0 !important; background: none !important; }
.al-dncr-cita blockquote p { margin: 0; font-family: var(--serif); font-style: italic; font-size: clamp(1.45rem, 1.1rem + 1.1vw, 2.1rem); line-height: 1.2; color: var(--blanco-s, #F3F3F3) !important; }
.al-dncr-quien { display: flex; flex-direction: column; gap: 3px; margin: 0; font-size: .9rem; }
.al-dncr-quien b { font-weight: 600; color: var(--blanco-s, #F3F3F3); }
.al-dncr-quien span { font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; opacity: .62; }
.al-dncr-prox { position: relative; overflow: hidden; margin-top: clamp(40px, 5vw, 72px); }
.al-dncr-prox > div, .al-dncr-prox .al-dia-fecha { position: relative; z-index: 1; }
.al-dncr-faltan { color: var(--blanco-s, #F3F3F3); font-weight: 600; }
.al-dncr-faltan:empty { display: none; }
@media (max-width: 760px) { .al-dncr-citas { grid-template-columns: 1fr; } }
/* La tarjeta del 7 de septiembre en celular: fecha arriba, texto abajo (también en #NoEsDeporte) */
@media (max-width: 700px) {
  .al-dia { grid-template-columns: 1fr !important; gap: 18px !important; }
  .al-dia-fecha { flex-direction: row !important; align-items: flex-end !important; gap: 12px; }
  .al-dia-fecha b { font-size: 5.2rem !important; }
  .al-dia-fecha span { margin: 0 0 8px !important; }
  .al-dia .al-acciones { flex-wrap: wrap; }
}

/* v41 · Diccionario: foto de biblioteca a la derecha (mismo efecto que el rodeo), sin palabra en puntos */
.al-dic-portada { position: relative; overflow: hidden; }
.al-dic-foto { position: absolute; top: 0; right: 0; bottom: 0; width: 60%; z-index: 0; pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 45%); mask-image: linear-gradient(90deg, transparent 0%, #000 45%); }
.al-dic-foto img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; opacity: .45; filter: saturate(.8) contrast(1.05); animation: al-dic-foto-in 2.2s ease-out both; }
.al-dic-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,7,16,.6), transparent 30%, transparent 70%, rgba(11,7,16,.7)); }
.al-dic-portada .al-ancho { position: relative; z-index: 1; }
@keyframes al-dic-foto-in { from { opacity: 0; transform: scale(1.05); } to { opacity: .45; transform: none; } }
@media (max-width: 860px) {
  .al-dic-foto { width: 100%; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 40%); mask-image: linear-gradient(180deg, transparent 0%, #000 40%); }
  .al-dic-foto img { opacity: .28; animation-name: al-dic-foto-in-m; }
  @keyframes al-dic-foto-in-m { from { opacity: 0; } to { opacity: .28; } }
}
@media (prefers-reduced-motion: reduce) { .al-dic-foto img { animation: none; } }

/* Calculadora: fuentes, redondeos y datos del estudio histórico. */
.al-calc-ctrl.mil-up, .al-calc-res.mil-up, .al-pl-panel.mil-up, .al-pl-fig.mil-up { opacity: 1 !important; transform: none !important; }
.al-pl-fig figcaption { height: 7.5rem; overflow-y: auto; scrollbar-gutter: stable; }
.al-calc-step button:disabled { opacity: .35; cursor: default; }
.al-calc-redondeo { margin-top: 18px; line-height: 1.6; }
.al-calc-metodo { margin-top: 28px; padding-top: 20px; border-top: 1px solid rgba(36,23,45,.18); }
.al-calc-metodo summary { cursor: pointer; font-weight: 600; line-height: 1.5; }
.al-calc-metodo p { margin-top: 18px; line-height: 1.65; }
.al-calc-metodo a { text-decoration: underline; text-underline-offset: 3px; }
.al-calc-tabla-wrap { max-width: 100%; overflow-x: auto; margin-top: 24px; }
.al-calc-tabla-wrap table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: .9rem; }
.al-calc-tabla-wrap caption { text-align: left; padding-bottom: 12px; line-height: 1.5; }
.al-calc-tabla-wrap th, .al-calc-tabla-wrap td { padding: 10px 12px; border-bottom: 1px solid rgba(36,23,45,.14); text-align: right; font-variant-numeric: tabular-nums; }
.al-calc-tabla-wrap th:first-child { text-align: left; font-weight: 500; }
.al-calc-metodo summary:focus-visible, .al-calc-tabla-wrap:focus-visible { outline: 2px solid var(--violeta, currentColor); outline-offset: 4px; }
/* Glosario curado · fuentes y explicación de categorías */
.al-dic-criterio { font-size: .84rem; line-height: 1.65; max-width: 80ch; opacity: .8; margin-top: 1rem; }
.al-dic-fuente { font-size: .78rem; line-height: 1.6; overflow-wrap: anywhere; margin: 1rem 0; }
.al-dic-fuente a { text-decoration: underline; text-underline-offset: .2em; }
.al-dic-cat { max-width: 100%; white-space: normal; }
.al-dic [hidden] { display: none !important; }
.al-dic-tema:disabled, [data-dic-azar]:disabled { opacity: .45; cursor: default; }
.al-rc-envases { margin-top: 1.4rem; padding: 1rem; border-left: 2px solid var(--violeta, #7e17be); background: rgba(126,23,190,.035); font-size: .88rem; line-height: 1.7; }
.al-rc-origen { font-size: .78rem; line-height: 1.6; margin-top: 1rem; opacity: .75; }
.al-rc-metodo { max-width: 85ch; margin-top: 2rem; line-height: 1.7; }
.al-rc-metodo summary { cursor: pointer; font-weight: 600; }
.al-rc-metodo p { margin-top: .8rem; }

/* v41 · «Capacidad de sentir»: cuatro fotos que se alternan con fundido suave cada 5 s */
.al-manif-foto-wrap .al-foto { position: relative; }
.al-manif-foto-wrap .al-foto img.al-manif-rota { transition: opacity 1.4s ease; }
.al-manif-foto-wrap .al-foto img.al-manif-rota:not(.al-on) { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; }
.al-manif-foto-wrap .al-foto img.al-manif-rota.al-on { opacity: 1; }
.al-manif-foto-wrap .al-foto img.al-manif-rota.al-sale { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* rotación de fotos reutilizable (Capacidad de sentir, Galgos libres) */
[data-manif-rota] .al-foto { position: relative; }
[data-manif-rota] .al-foto img.al-manif-rota { transition: opacity 1.4s ease; }
[data-manif-rota] .al-foto img.al-manif-rota:not(.al-on) { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; }
[data-manif-rota] .al-foto img.al-manif-rota.al-on { opacity: 1; }
/* v41 · Galgos libres: más aire entre «Lo que falta» y los botones */
.al-ahora .al-ah-falta { margin-bottom: 34px !important; line-height: 1.7; }
.al-ahora .al-ah-linea { margin-bottom: 30px !important; }
.al-ahora .al-acciones { gap: 16px 30px; flex-wrap: wrap; }

/* v41 · «En red»: logos de AVA, Lush y Veganuary (tinta; color al pasar el cursor) */
.al-red-franja { align-items: center; }
.al-red-logos { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 34px; }
.al-red-franja span.al-red-logos { font-size: inherit; letter-spacing: 0; text-transform: none; }
.al-red-logo { display: block; width: auto; height: 34px; filter: grayscale(1) brightness(.18); opacity: .82; transition: filter .45s ease, opacity .45s ease; }
.al-red-logo--ava { height: 46px; }
.al-red-logo--lush { height: 24px; }
.al-red-logo--veganuary { height: 30px; }
.al-red-franja:hover .al-red-logo, .al-red-franja:focus-visible .al-red-logo { filter: none; opacity: 1; }
@media (max-width: 600px) { .al-red-logos { gap: 12px 24px; } .al-red-logo--ava { height: 38px; } .al-red-logo--lush { height: 19px; } .al-red-logo--veganuary { height: 24px; } }

/* v41 · Tienda: la bolsa solidaria con foto de fondo (mismo efecto de opacidad que el rodeo) y oculta con el menú abierto */
.al-ti-bolsa-fondo { position: absolute; inset: 0; z-index: 0; overflow: hidden; border-radius: inherit; pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 18%, #000 72%); mask-image: linear-gradient(90deg, transparent 18%, #000 72%); }
.al-ti-bolsa-fondo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 40%; opacity: 0; transform: scale(1.04); transition: opacity 1.4s ease, transform 6s ease-out; filter: saturate(.85) contrast(1.05); }
.al-ti-bolsa-fondo img.al-on { opacity: .42; transform: scale(1); }
.al-ti-bolsa:not(.al-llena) .al-ti-bolsa-fondo img.al-on { opacity: .3; }
.al-ti-bolsa > :not(.al-ti-bolsa-fondo) { position: relative; z-index: 1; }
@media (max-width: 600px) { .al-ti-bolsa-fondo { -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 60%); mask-image: linear-gradient(180deg, transparent 0%, #000 60%); } .al-ti-bolsa-fondo img.al-on { opacity: .3; } }
@media (prefers-reduced-motion: reduce) { .al-ti-bolsa-fondo img { transform: none; } }
html.al-menu-abierto .al-ti-bolsa, html.al-cu-abierto .al-ti-bolsa, html.al-sx-abierto .al-ti-bolsa, html.al-kit-abierto .al-ti-bolsa, html.al-pxp-abierta .al-ti-bolsa { opacity: 0 !important; visibility: hidden; pointer-events: none !important; transition: opacity .2s ease, visibility 0s .2s; }

/* v41 · Quiénes somos · «Un movimiento sin fronteras»: más compacta y con fotos del movimiento rotando de fondo (cada 5 s) */
.al-fronteras--fotos { position: relative; overflow: hidden; padding-top: clamp(64px, 8vw, 110px) !important; padding-bottom: clamp(64px, 8vw, 110px) !important; }
.al-fronteras--fotos .al-ancho { position: relative; z-index: 1; }
.al-fronteras--fotos .al-cabecera { margin-bottom: clamp(28px, 3vw, 44px); }
.al-fronteras--fotos .al-titulo-xl { font-size: clamp(2.2rem, 1.4rem + 2.6vw, 3.9rem); }
.al-fronteras--fotos .al-pais-fila { padding: 16px 0; }
.al-fronteras--fotos .al-pais-fila h3 { font-size: clamp(1.9rem, 1.2rem + 2.4vw, 3.4rem); }
.al-fronteras--fotos .al-pais-fila p { color: rgba(255,255,255,.72); }
.al-fronteras-fondos { position: absolute; top: 0; right: 0; bottom: 0; width: 60%; z-index: 0; pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 45%); mask-image: linear-gradient(90deg, transparent 0%, #000 45%); }
.al-fronteras-fondos img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.04); transition: opacity 1.6s ease, transform 6.5s ease-out; filter: saturate(.85) contrast(1.05); }
.al-fronteras-fondos img.al-on { opacity: .4; transform: scale(1); }
.al-fronteras-fondos::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,7,16,.55), transparent 30%, transparent 70%, rgba(11,7,16,.65)); }
@media (max-width: 860px) {
  .al-fronteras-fondos { width: 100%; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 35%, #000 100%); mask-image: linear-gradient(180deg, transparent 0%, #000 35%, #000 100%); }
  .al-fronteras-fondos img.al-on { opacity: .26; }
}
@media (prefers-reduced-motion: reduce) { .al-fronteras-fondos img { transform: none; } }
@media (max-width: 600px) {
  .al-ti-bolsa-cta { flex-wrap: wrap; gap: 8px; }
  .al-ti-bolsa-cta .mil-button { flex: 1 1 100%; justify-content: space-between; min-height: 0; height: auto; padding: 10px 10px 10px 20px; }
  .al-ti-bolsa-cta .mil-button span { font-size: .66rem; letter-spacing: .1em; white-space: normal; text-align: left; }
  .al-ti-vaciar { order: 3; margin: 2px auto 0; }
}
@media (max-width: 600px) { .al-red-logos { width: 100%; flex-wrap: nowrap; justify-content: space-between; gap: 14px; } .al-red-logo--ava { height: 40px; } .al-red-logo--lush { height: 18px; } .al-red-logo--veganuary { height: 23px; } }

/* v41 · Alita: el aviso «Encontraste el archivo secreto» a la misma escala que en el cuaderno */
.al-alita .al-cu-secreto { font-size: .78rem !important; letter-spacing: .16em !important; gap: 10px; }
.al-alita .al-cu-secreto i { width: 7px; height: 7px; box-shadow: 0 0 0 4px rgba(240,92,64,.18); }

/* v41 · Menú: «En vivo» a la derecha de Radio Alguien (punto bermellón que late + ecualizador de puntos) */
.al-menu-nav li[data-animal="buho"] { align-items: center; }
.al-menu-vivo { justify-self: end; display: inline-flex; align-items: center; gap: 9px; padding: 7px 13px 7px 11px; border: 1px solid rgba(233,59,36,.42); border-radius: 99px; background: rgba(233,59,36,.08);
  font: 600 .64rem/1 var(--texto-f); letter-spacing: .2em; text-transform: uppercase; color: #ff8a73; white-space: nowrap; pointer-events: none; }
.al-menu-vivo-punto { position: relative; width: 7px; height: 7px; border-radius: 50%; background: #E93B24; }
.al-menu-vivo-punto::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 1px solid rgba(233,59,36,.7); animation: al-vivo-onda 1.8s ease-out infinite; }
.al-menu-vivo-eq { display: inline-flex; align-items: flex-end; gap: 2px; height: 12px; margin-left: 1px; }
.al-menu-vivo-eq b { width: 2px; height: 100%; border-radius: 2px; background: linear-gradient(180deg, #cfa8ef, #E93B24); transform-origin: bottom; animation: al-vivo-eq 1.1s ease-in-out infinite alternate; }
.al-menu-vivo-eq b:nth-child(2) { animation-duration: .8s; animation-delay: -.3s; }
.al-menu-vivo-eq b:nth-child(3) { animation-duration: 1.3s; animation-delay: -.6s; }
.al-menu-vivo-eq b:nth-child(4) { animation-duration: .95s; animation-delay: -.15s; }
.al-menu-nav li[data-animal="buho"]:hover .al-menu-vivo { border-color: rgba(233,59,36,.7); background: rgba(233,59,36,.14); }
@keyframes al-vivo-onda { from { transform: scale(.6); opacity: 1; } to { transform: scale(1.6); opacity: 0; } }
@keyframes al-vivo-eq { from { transform: scaleY(.25); } to { transform: scaleY(1); } }
@media (max-width: 767px) { .al-menu-nav li[data-animal="buho"] { grid-template-columns: minmax(0, auto) auto !important; } .al-menu-vivo { padding: 6px 10px 6px 9px; font-size: .58rem; } }

/* Alguien · the photograph opens a fuller account without moving the actions. */
.al-ind-relato { display:grid; max-width:34rem; margin:4px 0 22px; }
.al-ind-relato>p { grid-area:1/1; margin:0; font-size:1.05rem; line-height:1.75; }
.al-ind-resumen { opacity:1; visibility:visible; transition:opacity .25s ease; }
.al-ind-desarrollo { opacity:0; visibility:hidden; pointer-events:none; }
.al-ind-revelado .al-ind-resumen { opacity:0; visibility:hidden; }
.al-ind-revelado .al-ind-desarrollo { opacity:1; visibility:visible; pointer-events:auto; }
.al-ind-revelado .al-ind-desarrollo span { display:inline; animation:al-ind-palabra .3s ease both; animation-delay:var(--paso,0s); }
@keyframes al-ind-palabra { from { opacity:0; } to { opacity:1; } }
.al-ind-acciones { display:flex; align-items:center; flex-wrap:wrap; gap:12px 24px; }
.al-ind-acciones .al-ind-link { display:inline-flex; align-items:center; min-height:44px; margin:0; }
.al-ind-acciones .al-ind-ficha { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:44px; margin:0; padding:10px 17px; border:1px solid #7e17be40; border-radius:999px; background:#7e17be08; color:var(--violeta); font-family:var(--sans); font-size:12px; line-height:1.3; letter-spacing:.01em; text-transform:none; transition:background .25s,border-color .25s,box-shadow .25s; }
.al-ind-acciones .al-ind-ficha svg { width:17px; height:17px; flex:none; }
.al-ind-acciones .al-ind-ficha:hover { color:var(--violeta); background:#7e17be14; border-color:#7e17be80; box-shadow:0 6px 20px #7e17be12; }
.al-ind-acciones .al-ind-ficha:focus-visible,.al-alguien-escena:focus-visible { outline:2px solid var(--violeta); outline-offset:5px; }
.al-alguien-escena[role="button"] { cursor:pointer; }
.al-alguien-escena:hover .al-alguien-foto.al-activo { opacity:0; z-index:0; }
.al-alguien-escena:hover .al-alguien-lienzo { opacity:1; }
.al-alguien-escena.al-ver-foto .al-alguien-foto.al-activo { opacity:1; z-index:2; }
.al-alguien-escena.al-ver-foto .al-alguien-lienzo { opacity:0; }
.al-alguien-escena.al-ver-foto .al-alguien-pista { opacity:0; }
@media(max-width:991px) { .al-ind-relato { margin-top:8px; } .al-ind-relato>p { font-size:1rem; } .al-ind-acciones { gap:10px 18px; } .al-ind[data-animal="gallina"] .al-ind-visual--puntos img { object-position:50% 0%; } }
@media(prefers-reduced-motion:reduce) { .al-ind-resumen { transition:none; } .al-ind-revelado .al-ind-desarrollo span { animation:none; opacity:1; } }

/* Scientific context belongs in the entry, behind a quiet disclosure. */
.al-cu-contexto { margin-top:22px; border-top:1px solid #cfa8ef26; padding-top:15px; color:#b4a5be; font-size:12px; line-height:1.7; }
.al-cu-contexto summary { cursor:pointer; color:#d2b3e5; font-size:12px; }
.al-cu-contexto p { margin:12px 0 0; }
.al-cu-contexto a { color:#d2b3e5; text-underline-offset:3px; }
.al-cu-contexto summary:focus-visible { outline:2px solid #cfa8ef; outline-offset:4px; }

/* Fotografías entregadas para AVA y el equipo: composición completa y rostro visible. */
.al-red-carta--congresos { grid-template-rows: auto 1fr; }
.al-red-carta--congresos .al-red-foto { height: auto; aspect-ratio: 2048 / 1365; }
.al-red-carta--congresos .al-red-foto img { object-fit: contain; transform: none; }
img[src*="julieta-dellarciprete-20261024"] { object-position: 50% 30%; }
.al-bj-foto-credito { margin: 18px 0 0; font-size: .78rem; line-height: 1.6; }
.al-bj-hero-bg img[src*="reloncavi-jaulas-rectangulares"] { object-position: 50% 55%; }

/* La escala de Bajo las jaulas conserva el coral de su relato, también al usar teclado. */
.al-bj-zoom-btn:focus-visible, .al-bj-zoom-range:focus-visible { outline: 2px solid #E9786A; outline-offset: 4px; }
@media (max-width: 640px) {
  .al-bj-zoom-tabs { align-items: stretch; }
  .al-bj-zoom-btn { min-width: 0; white-space: normal; line-height: 1.35; }
}

/* Cabecera del documental: acentos coral coherentes con su fondo oscuro. */
body[data-pagina="bajo-las-jaulas"] .al-cabecera-dona:hover { background: #E9786A; border-color: #E9786A; color: #0b0808; }
body[data-pagina="bajo-las-jaulas"] .mil-frame .al-logo-pista { color: #E9786A; }