/* Vínculos de Alma — dirección de arte y escenas de la edición 2026. */
:root {
  color-scheme: dark;
  --bg: #0c090b;
  --bg-deep: #080608;
  --bg-raised: #191013;
  --text: #f2e4ce;
  --text-dim: #d9c7ac;
  --text-muted: #b6a48e;
  --accent: #d4a548;
  --accent-bright: #f2ce6b;
  --accent-hot: #d13243;
  --line: #d4a54840;
  --line-soft: #d4a54820;
  --cinema-red: #7d1426;
  --cinema-paper: #ead6ae;
}
body { font-weight: 350; }
html { overflow-x: clip; }
.veil { background: repeating-linear-gradient(to bottom, #00000007 0 1px, transparent 1px 4px), radial-gradient(108% 80% at 50% 45%, transparent 45%, #03020366 100%); opacity: .65; }
.nav { padding: 22px 3.4vw; background: linear-gradient(#0c090bf2, #0c090be6 70%, #0c090b00); }
.nav__mark { font-size: 12px; letter-spacing: .12em; }
.nav__links { gap: 1.6rem; }
.nav__links a { font-size: 9px; letter-spacing: .18em; }
.nav__mark span { color: #ee6976; }
.nav .toggle { font-size: 9px; }
.nav::after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 1px; background: var(--accent); transform: scaleX(var(--progress, 0)); transform-origin: left; }
.curtain__leaf { background-image: repeating-linear-gradient(90deg, #0006 0, #0006 3%, #ffffff07 6%, #0007 9%), linear-gradient(140deg, #4e1425, #150b10 80%); }
.curtain__title { letter-spacing: -.04em; }
.curtain__note { font-size: 16px; }
.curtain__gate::after { content: 'DOS FIRMAS. NINGUNA VUELTA ATRÁS.'; font: 9px var(--font-mono); letter-spacing: .23em; color: var(--text-muted); margin-top: 1.5rem; }

/* Portada: cartel editorial + objeto del pacto dentro de un portal. */
.hero { min-height: 100svh; padding: 140px 0 76px; gap: 0; text-align: left; overflow: clip; background: radial-gradient(ellipse at 79% 39%, #71162b30, transparent 54%), linear-gradient(115deg, #0c090bea, #0c090b30); }
.hero::before { background: repeating-linear-gradient(90deg, transparent 0, transparent calc(25% - 1px), #d4a54808 25%); }
.hero > .shell { display: grid; grid-template-columns: 1.04fr 1fr; align-items: center; gap: 42px 24px; width: min(1320px, 90vw); }
.hero__copy { position: relative; z-index: 3; }
.hero__eyebrow { font-size: 9px; letter-spacing: .2em; justify-content: flex-start; margin-bottom: 34px; color: var(--accent); }
.hero__eyebrow::before { flex: 0 0 25px; background: var(--accent); }
.hero__eyebrow::after { display: none; }
.hero__title { font-size: clamp(72px, 7.5vw, 116px); line-height: .93; letter-spacing: -.055em; }
.hero__title em { font-family: var(--font-display); font-size: .88em; color: #df5262; letter-spacing: -.055em; text-indent: 0; margin-top: .1em; }
.hero__kicker { margin-top: 26px; font: 24px var(--font-deco); color: var(--bone-100); }
.hero__lede { max-width: 40ch; font-size: 17px; line-height: 1.75; margin: 15px 0 26px; color: var(--text-muted); }
.hero__copy .hero__actions { justify-content: flex-start; gap: 12px; }
.hero .btn { font-size: 10px; letter-spacing: .14em; min-height: 51px; }
.hero__visual { position: relative; min-width: 0; aspect-ratio: 1; display: grid; place-items: center; pointer-events: none; transform: translate3d(calc(var(--art-x, 0) * 1px), calc(var(--art-y, 0) * 1px), 0); }
.hero__portal { position: absolute; inset: 2%; border-radius: 50%; border: 1px solid #d4a54842; background: radial-gradient(circle, #b42b3845 0, #5b142755 37%, #260f1980 57%, transparent 71%); box-shadow: inset 0 0 90px #8f152133, 0 0 110px #93122d1a; }
.hero__portal::before { content: ''; position: absolute; inset: 6%; border: 1px solid #d4a54835; border-radius: 50%; background: repeating-conic-gradient(from 0deg, #d4a54855 0 .4deg, transparent .4deg 8deg); mask: radial-gradient(transparent 68%, #000 68.5%, #000 69%, transparent 69.5%); animation: spin 110s linear infinite; }
.hero__portal::after { content: ''; position: absolute; inset: 15%; border: 1px solid #d4a54825; transform: rotate(45deg); }
.hero__portal-mark { position: absolute; inset: 11%; color: #d4a54835; rotate: -15deg; }
.hero__art { position: relative; z-index: 2; width: 127%; height: auto; max-width: none; transform: rotate(-10deg); filter: drop-shadow(0 22px 30px #0008); animation: pact-float 8s ease-in-out infinite; }
.hero__visual-top, .hero__visual-bottom { position: absolute; z-index: 3; font: 9px var(--font-mono); letter-spacing: .3em; text-transform: uppercase; color: var(--text-muted); }
.hero__visual-top { top: 0; }
.hero__visual-bottom { bottom: 1%; }
.hero__orbit-label { position: absolute; z-index: 3; top: 43%; right: -8%; writing-mode: vertical-rl; font: 8px var(--font-mono); letter-spacing: .35em; color: var(--accent); }
.hero__serial { position: absolute; top: 25%; left: 4%; font: 64px var(--font-deco); color: #d4a54848; }
.hero__deco { width: 90vw; left: 68%; opacity: .035; }
.hero__cuñas { display: none; }
.hero__ticket { grid-column: 1 / -1; position: relative; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 32px; padding: 26px 32px; border: 1px solid #d4a54835; background: #d4a54806; }
.hero__ticket::before, .hero__ticket::after { content: ''; position: absolute; left: -7px; top: calc(50% - 7px); width: 13px; height: 13px; border: 1px solid #d4a54835; background: var(--bg); border-radius: 50%; }
.hero__ticket::after { left: auto; right: -7px; }
.hero__meta { justify-content: flex-start; gap: clamp(30px, 5vw, 80px); font-size: 9px; letter-spacing: .17em; }
.hero__meta b { font-family: var(--font-body); font-size: 22px; font-weight: 400; color: var(--bone-100); margin-top: 7px; }
.hero__deadline { display: flex; align-items: center; gap: 26px; border-left: 1px dashed #d4a54850; padding-left: 32px; }
.hero__deadline .label { max-width: 120px; font-size: 8px; line-height: 1.7; letter-spacing: .15em; }
.hero__deadline .label::before, .hero__deadline .label::after { display: none; }
.hero__closing-date { display: flex; align-items: center; gap: 14px; color: var(--accent); white-space: nowrap; }
.hero__closing-date strong { font: 58px/1 var(--font-display); letter-spacing: -.05em; }
.hero__closing-date span { font: 11px/1.6 var(--font-mono); text-transform: uppercase; letter-spacing: .08em; }
.countdown { gap: 20px; }
.countdown__n { font-family: var(--font-deco); font-size: 30px; }
.countdown__l { font-size: 8px; }
.countdown__cell { min-width: 2.4ch; }
.hero__scroll { inset: auto 0 20px; display: flex; justify-content: center; align-items: center; gap: 12px; font-size: 8px; }
.hero__scroll i { width: 30px; height: 1px; animation: none; }
@keyframes pact-float { 0%,100% { transform: translateY(-7px) rotate(-10deg); } 50% { transform: translateY(9px) rotate(-7deg); } }

/* Las transiciones son escenas breves, ligadas al desplazamiento real. */
.threshold { position: relative; height: 135vh; z-index: 2; }
.threshold__stage { position: sticky; top: 0; height: 100svh; display: grid; place-items: center; overflow: clip; isolation: isolate; background: var(--bg); }
.threshold__stage::before { content: ''; position: absolute; inset: 0; z-index: -2; background: radial-gradient(ellipse, #951b3150, transparent 65%); opacity: calc(.3 + var(--cut, .5) * .7); }
.threshold__field { position: absolute; inset: 8%; border: 1px solid #d4a54820; transform: rotate(calc(-14deg + var(--cut, .5) * 28deg)) scale(calc(.86 + var(--cut, .5) * .24)); }
.threshold__field::after { content: ''; position: absolute; inset: 14%; border: 1px solid #d4a54825; border-radius: 50%; }
.threshold__title { position: relative; z-index: 2; text-align: center; font: clamp(60px, 10.2vw, 160px)/.94 var(--font-display); text-transform: uppercase; letter-spacing: -.06em; }
.threshold__title span { display: block; translate: calc((var(--cut, .5) - .5) * -16vw) 0; }
.threshold__title em { display: block; font-style: normal; color: transparent; -webkit-text-stroke: 1px #d5b57a; translate: calc((var(--cut, .5) - .5) * 16vw) 0; }
.threshold__caption { position: absolute; bottom: 17%; font: 10px var(--font-mono); letter-spacing: .23em; color: var(--text-muted); text-transform: uppercase; text-align: center; }
.threshold__index { position: absolute; top: 17%; font: 10px var(--font-mono); letter-spacing: .3em; color: var(--accent); }
.threshold__ribbon { position: absolute; z-index: -1; left: -15%; width: 130%; height: 64px; display: flex; align-items: center; justify-content: center; background: #841c30; border-block: 1px solid #de6a6655; color: #e9c6a1; font: 12px var(--font-mono); letter-spacing: .7em; word-spacing: 2em; white-space: nowrap; }
.threshold__ribbon--a { top: 24%; rotate: -12deg; translate: calc((var(--cut, .5) - .5) * 30vw) 0; }
.threshold__ribbon--b { bottom: 24%; rotate: 10deg; translate: calc((var(--cut, .5) - .5) * -30vw) 0; background: #29191d; }
.threshold--closing { height: 110vh; }
.threshold--closing .threshold__stage { background: #110b10; }

/* Capítulos, contrato de papel y fichas de los dos roles. */
.section { padding-block: clamp(70px, 8vw, 130px); }
.section__head { gap: 15px; margin-bottom: 50px; }
.section__title { max-width: 1000px; font-size: clamp(38px, 5.5vw, 76px); letter-spacing: -.035em; }
.section__note { max-width: 57ch; font-size: 17px; }
.section__head .label { font-size: 9px; }
#pacto { padding-block: 0; background: linear-gradient(#0c090b, #25111870, #0c090b); }
#pacto .escena__fijo { padding-block: 100px 60px; }
#pacto .escena__fijo > .shell { display: grid; grid-template-columns: .84fr 1.16fr; align-items: center; gap: 60px; }
#pacto .section__head { text-align: left; justify-items: start; align-content: start; margin: 0; }
#pacto .section__head .label { width: auto; }
#pacto .section__head .label::before, #pacto .section__head .label::after { display: none; }
#pacto .section__title { font-size: clamp(42px, 5.2vw, 74px); line-height: 1.02; }
.pacto__aside { margin-top: 25px; font: 21px/1.5 var(--font-deco); color: var(--text-muted); max-width: 25ch; }
.pacto { position: relative; padding: 44px; gap: 18px; background: var(--cinema-paper); color: #392c2a; font: 15px/1.65 var(--font-body); border: 1px solid #ffe9bb; box-shadow: 14px 16px 0 #a5724420, 0 25px 80px #0005; transform: rotate(1.5deg); }
.pacto::before { content: 'CONTRATO DE ALMA     /     Nº 002—2026'; font: 8px var(--font-mono); letter-spacing: .15em; color: #77533c; padding-bottom: 15px; border-bottom: 1px solid #503b2c40; }
.pacto::after { content: 'V · A'; position: absolute; right: -25px; bottom: -27px; width: 86px; height: 86px; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle at 30% 25%, #bd4b53, #681b2c 75%); color: #e8b088; font: 24px var(--font-display); border: 7px double #af4c4d; box-shadow: 3px 8px 15px #0005; rotate: -18deg; }
.pacto strong { color: #6f2032; font-weight: 600; }
.pacto .capitular::first-letter { color: #8b2c3c; }
.pacto .tirada { font-size: 23px; color: #721e2f; border-left-color: #7c463d50; margin-block: 0; }
.pacto__clausulas { margin-top: 0; gap: 13px; }
.clausula { padding-top: 13px; border-color: #5738252a; gap: 15px; }
.clausula::before { color: #7f3b33; font-size: 8px; }
.roles { gap: 0; grid-template-columns: 1fr 76px 1fr; }
.rol { padding: 48px; min-height: 405px; border: 1px solid #d4a54835; background: radial-gradient(ellipse at top right, #70203445, transparent 66%), #140e12; transition: transform .65s var(--ease-deco), background .4s; }
.rol:hover { transform: translateY(-8px); }
.rol--firmante { background: radial-gradient(ellipse at bottom right, #6d57302c, transparent 65%), #140e12; }
.rol::after { content: 'I'; position: absolute; right: 18px; top: -50px; font: 330px var(--font-display); color: #d4a54809; pointer-events: none; }
.rol--firmante::after { content: 'II'; color: #f2e4ce08; }
.rol > * { position: relative; z-index: 1; }
.rol__nombre { font-size: clamp(36px, 3.7vw, 55px); letter-spacing: -.035em; }
.rol__etiqueta { color: var(--accent); }
.rol__lema { max-width: 26ch; font-size: 24px; }
.rol__lista { font-size: 15px; line-height: 1.6; }
.roles__nudo { width: 76px; background: var(--bg); padding: 10px; z-index: 2; }

/* Testigos: retratos, nombres monumentales y una pista editorial. */
.desfile__fijo { background: #0c090b; }
.desfile__cadena, .testigo__cuñas { display: none; }
.desfile__cabecera { align-items: start; justify-items: start; text-align: left; inset: 104px 6vw auto; gap: 8px; }
.desfile__cabecera .section__title { font-size: clamp(28px, 3.3vw, 46px); max-width: 700px; }
.desfile__cabecera .label { font-size: 9px; }
.testigo__actor { width: clamp(260px, 32vw, 490px); aspect-ratio: 1; }
.js .testigo { --entra: clamp(0, calc((var(--a) - .1) / .22), 1); --sale: clamp(0, calc((.9 - var(--a)) / .22), 1); }
.testigo__actor .figura__aura { opacity: calc(.15 + var(--vida, 0) * .25); }
.testigo__marco { border: 1px solid #d4a54833; border-radius: 48% 48% 2px 2px; background: #100b10; }
.testigo__marco .figura__aro { display: none; }
.testigo__ambiente { opacity: calc(var(--vida, 0) * .34); }
.testigo__ficha { bottom: clamp(6rem, 13vh, 9rem); left: 7vw; width: min(40ch, 37vw); }
.testigo__nombre { font-size: clamp(48px, 6.8vw, 98px); line-height: .95; letter-spacing: -.06em; }
.testigo__ficha::before { inset: -40px -50px; background: radial-gradient(ellipse at 30% 50%, #0c090be6, #0c090b80 50%, transparent 75%); }
.testigo__vinculo { border: none; border-left: 1px solid var(--c1); padding: 0 0 0 14px; font-size: 11px; }
.testigo__poder { font-size: 17px; }
.testigo__reclamo { border: none; padding: 0; font-size: 23px; }
.testigo__backname { position: absolute; left: -3%; top: 26%; color: transparent; -webkit-text-stroke: 1px color-mix(in srgb, var(--c1) 23%, transparent); font: clamp(90px, 19vw, 290px)/1 var(--font-display); letter-spacing: -.055em; white-space: nowrap; opacity: var(--vida, 0); transform: translateX(calc((var(--a, 0) - .5) * -160px)); pointer-events: none; }
.desfile__edition { position: absolute; right: 5vw; bottom: 40px; color: var(--text-muted); font: 9px var(--font-mono); letter-spacing: .18em; }
.desfile__counter-large { position: absolute; left: 6vw; bottom: 30px; font: 44px var(--font-deco); color: var(--accent); }
.desfile__counter-large small { font: 10px var(--font-mono); color: var(--text-muted); }
.witness-portrait { position: absolute; inset: 0; overflow: hidden; }
.witness-portrait img { position: absolute; width: 100%; max-width: 100%; height: 100%; object-fit: contain; left: 0; top: 0; filter: none; }
.testigo__marco > img { display: none; }

/* La entrega, el calendario y el cierre conservan contenido, cambian presencia. */
#entrega { background: linear-gradient(#0c090b, #1b1119 60%, #0c090b); }
.entrega { gap: 64px; }
.entregable__cabeza { padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.entregable__num { font: 72px var(--font-deco); color: #df5262; }
.entregable__nombre { font-size: 33px; letter-spacing: .02em; }
.entregable__texto { font-size: 16px; }
.match { transform: rotate(-2deg); border: 1px solid #d4a54840; transition: transform .6s var(--ease-deco); }
.match:hover { transform: rotate(0deg) translateY(-5px); }
.match__portada { background: radial-gradient(ellipse at 75% 0, #a5364860, transparent 60%), repeating-linear-gradient(-35deg, #d4a54809 0 1px, transparent 1px 18px), #23151d; }
.manuscrito { background: #e6d3b0; color: #38242a; padding: 32px; transform: rotate(2deg); box-shadow: 10px 10px 0 #d4a54815; }
.manuscrito h4, .manuscrito p { color: #38242a; }
.manuscrito__texto::first-letter { color: #8b2c3c; }
.manuscrito__pie { color: #79413a; border-color: #79413a50; }
.fases__fijo { background: radial-gradient(ellipse at 50% 100%, #57182c44, transparent 75%), #0c090b; }
.fases__fijo::before { content: '2026'; position: absolute; inset: 20% 6vw auto auto; font: clamp(150px, 24vw, 360px)/1 var(--font-display); letter-spacing: -.07em; color: #d4a54809; pointer-events: none; }
.fases__rail { counter-reset: acto; }
.fase { border-top: 1px solid var(--line); padding-top: 35px; }
.fase::after { counter-increment: acto; content: counter(acto, decimal-leading-zero); position: absolute; right: 16px; top: 8px; color: #d4a54815; font: 70px var(--font-deco); pointer-events: none; }
.fase__fecha { color: #e45b6b; }
.premio { position: relative; border-top: 1px solid var(--line); padding-top: 30px; }
.premio::after { content: '✦'; position: absolute; top: 20px; right: 15px; color: #d4a54822; font-size: 80px; }
[data-ficha] { min-height: 235px; padding: 28px; border: 1px solid var(--line-soft); background: #181015; transition: transform .45s var(--ease-deco), border-color .45s; }
[data-ficha]::after { display: none; }
#bases .roles { gap: 18px; }
[data-ficha]:hover, [data-ficha]:focus-within { transform: translateY(-6px); border-color: var(--accent); }
.sin-arte .witness-portrait { display: none; }
.firmar { position: relative; isolation: isolate; overflow: clip; padding-block: 140px; background: radial-gradient(ellipse at 50% 60%, #90203948, transparent 70%), #120a10; border-block: 1px solid var(--line); }
.firmar::before { content: 'TU ALMA'; position: absolute; top: 20%; left: 50%; translate: -50% 0; z-index: -1; white-space: nowrap; font: clamp(100px, 22vw, 340px) var(--font-display); color: transparent; -webkit-text-stroke: 1px #d4a54815; }
.firmar__titulo { letter-spacing: -.05em; }
.pie { background: #090709; }
.pie::before { content: 'VÍNCULOS DE ALMA'; display: block; width: 90vw; margin: 0 auto 70px; text-align: center; color: #e9d4b5; opacity: .13; font: clamp(34px, 8.5vw, 125px)/1 var(--font-display); letter-spacing: -.04em; }

@media (min-width: 901px) and (prefers-reduced-motion: no-preference) {
  html.js:not(.motion-off) .testigo__actor { left: 71%; top: 56%; translate: -50% calc(-50% + (1 - var(--entra, 0)) * 17vh - (1 - var(--sale, 0)) * 16vh); scale: calc(.87 + var(--a, 0) * .22); rotate: calc((var(--a, 0) - .5) * -12deg); }
}
@media (min-width: 901px) and (max-height: 800px) {
  .hero { padding-top: 105px; }
  .hero > .shell { gap: 25px; }
  .hero__visual { max-height: 470px; }
  .hero__ticket { padding-block: 18px; }
  #pacto .escena__fijo { padding-block: 80px 40px; }
  .pacto { font-size: 13px; gap: 12px; padding: 30px; }
  .pacto .tirada { font-size: 20px; }
}
@media (max-width: 1100px) {
  .hero__title { font-size: 8vw; }
  .hero__ticket { padding: 22px; }
  .hero__deadline { gap: 15px; padding-left: 20px; }
  .hero__deadline .label { display: none; }
  #pacto .escena__fijo > .shell { gap: 35px; }
  .pacto { padding: 30px; }
  .rol { padding: 32px; }
}
@media (max-width: 900px) {
  .cursor { display: none !important; }
  .has-cursor, .has-cursor a, .has-cursor button { cursor: auto; }
  .hero__visual { transform: none; }
  .escena { height: auto; }
  .escena__fijo { position: static; min-height: 0; }
  .js .paso, .js .paso--maska { opacity: 1 !important; translate: none !important; clip-path: none !important; }
  .nav { padding: 18px 5vw; }
  .hero { padding: 112px 0 65px; }
  .hero > .shell { grid-template-columns: minmax(0, 1fr); gap: 26px; width: 88vw; }
  .hero__copy { min-width: 0; text-align: center; }
  .hero__eyebrow { justify-content: center; margin-bottom: 25px; font-size: 8px; }
  .hero__eyebrow::before { display: none; }
  .hero__title { font-size: clamp(58px, 12vw, 106px); }
  .hero__kicker { font-size: 24px; margin-top: 22px; }
  .hero__lede { margin-inline: auto; max-width: 44ch; font-size: 16px; }
  .hero__copy .hero__actions { justify-content: center; }
  .hero__visual { width: min(480px, 84vw); justify-self: center; margin-block: 5px 10px; }
  .hero__art { width: 118%; }
  .hero__orbit-label { right: -3%; }
  .hero__ticket { min-width: 0; grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .hero__meta { justify-content: space-around; gap: 16px; }
  .hero__deadline { display: grid; grid-template-columns: minmax(0, 1fr); justify-items: center; gap: 10px; border-left: 0; border-top: 1px dashed #d4a54840; padding: 20px 0 0; text-align: center; }
  .hero__deadline .label { display: block; max-width: none; }
  .threshold { height: 90vh; }
  .threshold__stage { height: 70svh; }
  .threshold__title { font-size: 11.5vw; }
  .threshold__ribbon { height: 43px; font-size: 9px; }
  .threshold__caption { width: 75%; line-height: 1.9; font-size: 8px; bottom: 15%; }
  .threshold__index { font-size: 8px; top: 15%; }
  #pacto .escena__fijo > .shell { grid-template-columns: 1fr; gap: 35px; }
  #pacto .section__head { text-align: center; justify-items: center; }
  #pacto .section__title { max-width: 600px; }
  .pacto__aside { margin-top: 0; max-width: 35ch; }
  .pacto { width: 92%; max-width: 620px; font-size: 15px; }
  .roles { grid-template-columns: 1fr; }
  .rol { min-height: 330px; }
  .roles__nudo { margin-block: -10px; }
  .desfile__cabecera { padding-inline: 6vw; align-items: center; justify-items: center; text-align: center; }
  .desfile__pista { width: 88vw; margin-inline: auto; gap: 45px; }
  .desfile__pista .testigo { display: grid; grid-template-columns: .85fr 1.15fr; align-items: center; gap: 26px; padding-bottom: 45px; border-bottom: 1px solid var(--line); }
  .testigo__actor { width: 100%; max-width: 330px; }
  .testigo__ficha { margin-top: 0; text-align: left; width: auto; }
  .testigo__nombre { font-size: clamp(34px, 6vw, 58px); }
  .testigo__backname, .desfile__edition, .desfile__counter-large { display: none; }
  .testigo__poder { font-size: 15px; }
  .testigo__reclamo { font-size: 21px; }
  .testigo__vinculo { font-size: 10px; }
  .entrega { gap: 55px; }
  .fases__fijo::before { display: none; }
  .entregable__nombre { font-size: 28px; }
  .firmar { padding-block: 90px; }
}
@media (max-width: 560px) {
  .nav__mark { font-size: 10px; letter-spacing: .08em; max-width: 110px; }
  .nav__mark span { display: block; }
  .nav__tools { gap: 5px; }
  .nav .toggle { padding: 8px; font-size: 8px; letter-spacing: .08em; gap: 5px; }
  .hero__eyebrow { letter-spacing: .1em; font-size: 7px; }
  .hero__title { font-size: 14vw; }
  .hero__copy .hero__actions { gap: 8px; }
  .hero .btn { padding-inline: 16px; font-size: 9px; letter-spacing: .09em; }
  .hero__visual { margin-top: 15px; }
  .hero__art { width: 104%; }
  .hero__visual-top, .hero__visual-bottom { font-size: 7px; letter-spacing: .2em; }
  .hero__serial { font-size: 48px; }
  .hero__meta { font-size: 7px; }
  .hero__meta b { font-size: 18px; }
  .hero__deadline .label { font-size: 7px; }
  .countdown { gap: 14px; }
  .countdown__n { font-size: 25px; }
  .countdown__l { font-size: 7px; }
  .section__title { font-size: 38px; }
  .section__note { font-size: 15px; }
  .pacto { padding: 25px; width: 93%; font-size: 14px; transform: rotate(.7deg); }
  .pacto::before { font-size: 7px; }
  .pacto::after { width: 64px; height: 64px; right: -10px; font-size: 18px; }
  .pacto .tirada { font-size: 22px; }
  .clausula { grid-template-columns: 1fr; gap: 6px; }
  .rol { padding: 30px; }
  .desfile__pista .testigo { grid-template-columns: 1fr; gap: 22px; }
  .testigo__actor { width: min(310px, 75vw); }
  .testigo__ficha { text-align: center; max-width: 40ch; margin-inline: auto; }
  .testigo__nombre { font-size: 48px; }
  .testigo__vinculo { border: none; padding: 0; }
  .testigo__poder { margin-top: 10px; }
  .threshold__ribbon { letter-spacing: .3em; }
  .manuscrito { padding: 24px; }
}

/* Todas las capas conservan un estado completo sin animación o JavaScript. */
html.motion-off .hero__visual, html:not(.js) .hero__visual { transform: none; }
html.motion-off .hero__art, html.motion-off .hero__portal::before { animation: none; }
html.motion-off .threshold, html:not(.js) .threshold { height: auto; }
html.motion-off .threshold__stage, html:not(.js) .threshold__stage { position: relative; height: 65svh; }
html.motion-off .threshold *, html:not(.js) .threshold * { translate: none; transform: none; }
html.motion-off .testigo__backname, html:not(.js) .testigo__backname { display: none; }
html.motion-off .desfile__edition, html.motion-off .desfile__counter-large,
html:not(.js) .desfile__edition, html:not(.js) .desfile__counter-large { display: none; }
html.motion-off .desfile__cabecera, html:not(.js) .desfile__cabecera { align-items: center; justify-items: center; text-align: center; }
html.motion-off .testigo__actor, html:not(.js) .testigo__actor { width: min(350px, 75vw); }
html.motion-off .testigo__ficha, html:not(.js) .testigo__ficha { max-width: 48ch; margin-inline: auto; }
html:not(.js) .nav { opacity: 1; transform: none; }
html:not(.js) .desfile, html:not(.js) .desfile__fijo, html:not(.js) .escena, html:not(.js) .fases { height: auto; }
html:not(.js) .desfile__fijo, html:not(.js) .escena__fijo, html:not(.js) .fases__fijo { position: static; height: auto; padding-block: 80px; }
html:not(.js) .desfile__cabecera { position: static; margin-bottom: 50px; }
html:not(.js) .desfile__pista { position: static; display: grid; gap: 60px; }
html:not(.js) .desfile__pista .testigo { position: static; }
html:not(.js) .testigo__actor { position: relative; left: auto; top: auto; margin-inline: auto; opacity: 1; translate: none; scale: none; rotate: none; }
html:not(.js) .testigo__ficha { position: static; width: 88vw; opacity: 1; translate: none; text-align: center; margin-top: 20px; }
html:not(.js) .testigo__ambiente, html:not(.js) .desfile__contador { display: none; }
html:not(.js) .fases__rail { width: auto; transform: none; flex-wrap: wrap; }
html.motion-off .hero__portal-mark, html.motion-off .hero__deco svg, html.motion-off .roles__nudo, html.motion-off .rol::before, html.motion-off .figura__aura { animation: none !important; }
@media (min-width: 901px) and (max-height: 660px) {
  #pacto .escena { height: auto; }
  #pacto .escena__fijo { position: static; }
  #pacto .paso { opacity: 1 !important; translate: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  .hero__visual { transform: none; }
  .hero__art, .hero__portal::before { animation: none; }
  .threshold { height: auto; }
  .threshold__stage { position: relative; height: 65svh; }
  .threshold * { translate: none; transform: none; }
  .testigo__backname, .desfile__edition, .desfile__counter-large { display: none; }
  .rol:hover, [data-ficha]:hover, [data-ficha]:focus-within, .match:hover { transform: none; }
}