/* p-animacion.css · /video/animacion/ · prefijo ani- · solo tokens de tokens.css (sin hex sueltos, sin degradados, sin sombras en lo que sí; la versión «mala» de cada par es la excepción y se marca) */

/* ------------------------------------------------------------ la página */
.ani-hero-st{margin:0 0 var(--s-16)}
.ani-hero-st .stage{max-width:none}
.ani-cvs-fila{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s-24);margin-bottom:var(--s-64)}
@media (max-width:1100px){.ani-cvs-fila{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:620px){.ani-cvs-fila{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ani-cv{min-width:0;border-top:var(--borde-ancho) solid var(--texto);padding-top:var(--s-16)}
.ani-cv h3{font-size:var(--t-19);letter-spacing:var(--trk-19);margin:var(--s-12) 0 var(--s-8)}
.ani-cvs{width:100%;max-width:150px;height:auto;display:block}
.ani-cvs rect{fill:none;stroke:var(--borde);stroke-width:1}
.ani-cvs .m{fill:none;stroke:var(--texto-3);stroke-width:1}
.ani-cvs .c{fill:none;stroke:var(--texto);stroke-width:2.2}
.ani-cvs circle{fill:var(--texto)}
.ani-cv code{display:block;margin:6px 0 10px;color:var(--texto-2);font-size:12px}
.ani-cv p{font-size:var(--t-15);color:var(--texto-2);margin:0 0 var(--s-8)}
.ani-dd b{color:var(--texto);margin-right:4px}
.ani-reglas-b{margin-bottom:var(--s-32)}
.ani-reglas-b h3{margin-bottom:var(--s-16)}
.ani-reglas{counter-reset:r;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-16) var(--s-48)}
@media (max-width:800px){.ani-reglas{grid-template-columns:minmax(0,1fr)}}
.ani-reglas li{counter-increment:r;display:grid;grid-template-columns:28px minmax(0,1fr);gap:var(--s-8)}
.ani-reglas li::before{content:counter(r);font-weight:var(--bold);font-variant-numeric:tabular-nums}
.ani-reglas p{margin:0;font-size:var(--t-17);color:var(--texto-2)}
.ani-reglas p b{color:var(--texto)}
.ani-reglas code,.ani-dl code{font-size:.86em}

/* pestañas del catálogo */
.ani-cuenta{font-size:var(--t-12);color:var(--texto-2);font-variant-numeric:tabular-nums;margin-left:4px}

/* un elemento: escenario + ficha a la izquierda, referencias a la derecha, tira de fotogramas debajo */
.ani-lista{display:flex;flex-direction:column;gap:var(--s-64)}
.ani-el{border-top:var(--borde-ancho) solid var(--borde);padding-top:var(--s-32);min-width:0}
.ani-el:first-child,.ani-el[hidden]+.ani-el:first-of-type{border-top:0}
.ani-lista>.ani-el:first-child{border-top:0;padding-top:0}
.ani-el-h{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--s-16);align-items:start;margin-bottom:var(--s-24)}
.ani-n{font-size:var(--t-15);font-weight:var(--bold);color:var(--texto-2);font-variant-numeric:tabular-nums;letter-spacing:var(--trk-eyebrow);padding-top:6px}
.ani-el-h h3{max-width:30em}
.ani-ctl{display:flex;gap:var(--s-8);flex-wrap:wrap;justify-content:flex-end}
.ani-ctl .btn[aria-pressed="true"]{background:var(--texto);color:var(--fondo);border-color:var(--texto)}
@media (max-width:760px){.ani-el-h{grid-template-columns:auto minmax(0,1fr)}.ani-ctl{grid-column:1/-1;justify-content:flex-start}}
.ani-g{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s-32);align-items:start}
.ani-el.v .ani-g{grid-template-columns:300px minmax(0,1fr)}
@media (max-width:900px){.ani-g,.ani-el.v .ani-g{grid-template-columns:minmax(0,1fr)}}
.ani-main{min-width:0;display:flex;flex-direction:column;gap:var(--s-24)}
.ani-side{min-width:0;display:flex;flex-direction:column;gap:var(--s-24)}
.ani-refs{display:flex;flex-direction:column;gap:var(--s-24);min-width:0}
.ani-refs .ref{margin:0}
.ani-el.v .ani-refs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.ani-el.v .ani-refs.n1{grid-template-columns:minmax(0,26em)}
@media (max-width:620px){.ani-el.v .ani-refs{grid-template-columns:minmax(0,1fr)}}
.ani-ficha{gap:var(--s-8) var(--s-16);align-items:start}
.ani-ficha dt{padding-top:1px}
.ani-ficha dd b{color:var(--texto)}
.ani-ficha dd small{color:var(--texto-2)}
.ani-curvaf{display:flex;align-items:center;gap:var(--s-12)}
.ani-mini{flex:none}.ani-mini rect{fill:none;stroke:var(--borde)}.ani-mini path{fill:none;stroke:var(--texto);stroke-width:2}.ani-mini circle{fill:var(--texto)}
.ani-tira{margin-top:var(--s-24);align-items:flex-start}
.ani-tira img{height:auto}
.ani-tira figure{flex:1 1 0;min-width:136px;width:auto}
.ani-tira.v figure{flex:0 0 112px;min-width:0}
.ani-tira figcaption{line-height:1.35}
.ani-tira figcaption b{display:block;color:var(--texto);font-weight:var(--bold)}
.ani-el details.mas{margin-top:var(--s-16)}
.ani-el .code pre{font-size:13px}
.ani-nos{display:flex;flex-direction:column;gap:var(--s-48)}
.ani-nos details+.pair,.ani-nos .pair+.pair{margin-top:0}
.ani-sync{display:grid;gap:var(--s-24)}
.ani-sync-n{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-24);align-items:start}
@media (max-width:760px){.ani-sync-n{grid-template-columns:minmax(0,1fr)}}
.ani-dl{gap:var(--s-32)}
.ani-dl-i{display:flex;flex-direction:column;gap:var(--s-8);align-items:flex-start;border-top:var(--borde-ancho) solid var(--texto);padding-top:var(--s-16)}
.ani-dl-i h3{font-size:var(--t-19);letter-spacing:var(--trk-19)}
.ani-dl-i p{margin:0;color:var(--texto-2);font-size:var(--t-15);flex:1}

/* ------------------------------------------------------------ el escenario (lienzo escalado) */
.stage.ani-stage{display:block;padding:0 0 44px;min-height:0}
.ani-esc{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--fondo);color:var(--texto);font-family:var(--fuente);border-bottom:var(--borde-ancho) solid var(--borde)}
.ani-esc.v{aspect-ratio:9/16}.ani-esc.w{aspect-ratio:1280/440}
.ani-stage.v{max-width:300px}
.ani-stage.v .stage-bar span{display:none}
.ani-lienzo{position:absolute;left:0;top:0;transform-origin:0 0;font-family:var(--fuente);color:var(--texto);line-height:1.2}
.ani-lec{font-style:normal;font-size:var(--t-12);color:var(--texto);font-variant-numeric:tabular-nums;white-space:nowrap;margin-left:var(--s-8)}
.ani-stage .stage-bar{gap:var(--s-8)}
.ani-stage .stage-bar .btn{white-space:nowrap;flex:none}
@media (max-width:520px){.ani-stage .stage-bar span{display:none}}
.ani-stage .stage-bar span{white-space:nowrap}

@media (max-width:900px){.ani-stage.v{margin-inline:auto}}

/* ------------------------------------------------------------ piezas dentro del lienzo (px de lienzo, no de pantalla) */
.ani-ab{position:absolute}
.ani-t{font-weight:var(--bold);line-height:1.03;color:var(--texto)}
.ani-e{font-weight:var(--bold);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2);line-height:1.2;white-space:nowrap}
.ani-tag{display:inline-block;padding:2px 14px;border:1.5px solid var(--borde);border-radius:var(--r-pill);color:var(--texto-2);background:var(--elevado);line-height:1.4;font-weight:var(--regular);letter-spacing:0;text-transform:none}
.ani-foto{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

/* titular apilado */
.ani-tw{line-height:1.03;margin-bottom:6px;will-change:opacity,transform}
.ani-caja{display:inline-block;padding:.02em .16em .09em;border-radius:.1em;margin-left:-.16em}

/* subtítulo */
.ani-subfila{display:flex;justify-content:center}
.ani-subtit{display:inline-flex;gap:.26em;font-size:72px;font-weight:var(--bold);letter-spacing:var(--trk-58);line-height:1.2;background:color-mix(in srgb,var(--superficie) 90%,transparent);border:2px solid color-mix(in srgb,var(--borde) 90%,transparent);border-radius:22px;padding:14px 38px;white-space:nowrap;color:var(--texto)}

/* rótulos */
.ani-rot{left:80px;bottom:96px}
.ani-rot-in{display:inline-block;background:var(--superficie);border:2px solid var(--borde);padding:18px 34px}
.ani-rot-in span{display:block;white-space:nowrap}
.ani-rot-in b{display:block;font-size:38px;line-height:1.2;color:var(--texto);letter-spacing:var(--trk-30)}
.ani-rot-in i{display:block;font-style:normal;font-size:24px;line-height:1.3;color:var(--texto-2);margin-top:2px}

/* mapa */
.ani-pin{display:block;width:36px;height:36px;border-radius:50%;background:var(--acento);border:5px solid var(--elevado);box-sizing:border-box}
.ani-mcard{background:var(--elevado);border:1.5px solid var(--borde);border-radius:16px;padding:16px 22px;display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.ani-mcard b{font-size:30px;letter-spacing:var(--trk-30);line-height:1.1;color:var(--texto)}
.ani-mcard .ani-tag{font-size:18px}

/* flujo de cuatro nodos */
.ani-nd{box-sizing:border-box;background:var(--elevado);border:2px solid var(--borde);border-radius:28px;padding:26px 24px;display:flex;flex-direction:column;opacity:.6}
.ani-nd-n{font-size:20px;font-weight:var(--bold);letter-spacing:var(--trk-eyebrow);color:var(--texto-2)}
.ani-nd-art{flex:1;display:flex;align-items:center;justify-content:center;min-height:0}
.ani-nd>b{font-size:28px;line-height:1.12;letter-spacing:var(--trk-24);color:var(--texto)}
.ani-nd>span{font-size:20px;line-height:1.25;color:var(--texto-2);margin-top:6px}
.ani-cb i{display:block;height:4px;width:0;background:var(--acento)}
.ani-bzs{display:flex;flex-direction:column;gap:12px}
.ani-bzs i{display:block;width:120px;height:44px;border-radius:16px;background:var(--elevado);border:3px solid var(--apagado);opacity:0;position:relative;box-sizing:border-box}
.ani-bzs i::after{content:"";position:absolute;left:14px;right:14px;top:50%;height:6px;margin-top:-3px;border-radius:var(--r-pill);background:var(--borde)}
.ani-vend{display:flex;flex-direction:column;gap:16px}
.ani-vend span{display:flex;align-items:center;gap:10px;opacity:0}
.ani-vend i{display:block;width:78px;height:30px;border-radius:12px;background:var(--elevado);border:3px solid var(--apagado);box-sizing:border-box}
.ani-vend u{display:block;width:22px;height:4px;background:var(--texto)}
.ani-vend b{border:3px solid var(--texto);border-radius:var(--r-pill);padding:2px 16px;font-size:22px;background:var(--elevado);color:var(--texto)}
.ani-reloj{position:relative;width:112px;height:112px;border-radius:50%;border:5px solid var(--texto);box-sizing:border-box}
.ani-reloj i{position:absolute;left:calc(50% - 3px);bottom:50%;width:6px;border-radius:var(--r-pill);background:var(--texto);transform-origin:50% 100%}
.ani-reloj i:first-child{height:38px}.ani-reloj i:last-child{height:26px;width:8px;left:calc(50% - 4px)}
.ani-rep{width:196px}
.ani-rep small{display:block;font-size:14px;font-weight:var(--bold);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2);margin-bottom:10px}
.ani-rep u{display:block;height:8px;border-radius:var(--r-pill);background:var(--borde);margin-bottom:8px;transform-origin:0 50%;transform:scaleX(0)}
.ani-rep div{display:flex;gap:22px;margin-top:12px}
.ani-rep span{opacity:0}
.ani-rep b{display:block;font-size:40px;line-height:1;letter-spacing:var(--trk-30);color:var(--texto)}
.ani-rep em{display:block;font-style:normal;font-size:14px;color:var(--texto-2)}

/* teléfono (450 × 900; la pantalla siempre clara) */
.ani-telw{width:450px;height:900px;transform-origin:0 0}
.ani-tel{width:450px;height:900px;border-radius:72px;background:var(--telefono-marco);padding:18px;box-sizing:border-box}
.ani-pant{width:100%;height:100%;border-radius:54px;background:var(--telefono-pantalla);overflow:hidden;display:flex;flex-direction:column;color:var(--texto);font-family:var(--fuente)}
.ani-hora{height:52px;display:flex;align-items:flex-end;padding:0 30px 4px;font-size:17px;font-weight:var(--bold);color:var(--texto)}
.ani-cab{padding:14px 22px;border-bottom:1.5px solid var(--borde);display:flex;align-items:center;justify-content:space-between}
.ani-cab b{display:block;font-size:25px;letter-spacing:var(--trk-24);line-height:1.2}
.ani-cab span{display:block;font-size:15px;color:var(--texto-2)}
.ani-ej{font-style:normal;font-size:13px;font-weight:var(--bold);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2);border:1.5px solid var(--borde);border-radius:var(--r-pill);padding:3px 12px;background:var(--elevado)}
.ani-chat{flex:1;padding:18px 22px;display:flex;flex-direction:column;gap:12px;min-height:0}
.ani-sep{display:flex;align-items:center;gap:10px;margin-top:4px}
.ani-sep i{flex:1;height:1.5px;background:var(--borde)}
.ani-sep span{font-size:13px;font-weight:var(--bold);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2);white-space:nowrap}
.ani-brow{display:flex;justify-content:flex-start}
.ani-brow.d{justify-content:flex-end}
.ani-bw{max-width:84%}
.ani-bub{background:var(--elevado);border:1.5px solid var(--borde);border-radius:22px;padding:12px 16px;font-size:22px;line-height:1.3;color:var(--texto)}
.ani-bub.on{background:var(--acento-suave);border:3px solid var(--acento);padding:10px 14px}
.ani-bh{font-size:14px;color:var(--texto-2);margin-top:4px}
.ani-brow.d .ani-bh{text-align:right}
.ani-puntos{letter-spacing:.2em;color:var(--texto-2);font-weight:var(--bold)}
.ani-chiprow{display:flex;justify-content:center}
.ani-chip{display:inline-block;border:1.5px solid var(--texto);background:var(--elevado);border-radius:var(--r-pill);padding:5px 16px;font-size:17px;font-weight:var(--bold);color:var(--texto);white-space:nowrap}
.ani-chip.pun{border-style:dashed;border-color:var(--apagado);color:var(--texto-2)}
.ani-chip.on{border-color:var(--acento);background:var(--acento-suave)}
.ani-chiptwo{position:relative;height:38px}
.ani-chiptwo .ani-chip{position:absolute;top:0}
.ani-slot{position:relative;min-height:108px}
.ani-apr{font-size:15px;font-weight:var(--bold);color:var(--texto-2);text-align:right;opacity:0;margin-top:-4px}
/* burbuja grande de un reel (no es un teléfono: es la burbuja a escala de lienzo vertical) */
.ani-reelb .ani-bw{max-width:100%}
.ani-brow.big .ani-bub{font-size:44px;border-radius:44px;padding:26px 34px;border-width:2px}
.ani-brow.big .ani-bh{font-size:28px;margin-top:8px}
.ani-reelb{width:760px}

/* botón de cierre, cursor, campo, hoja, estados */
.ani-boton{display:inline-flex;align-items:center;justify-content:center;background:var(--acento);color:var(--sobre-acento);border-radius:var(--r-pill);padding:20px 52px;font-size:32px;font-weight:var(--bold);letter-spacing:var(--trk-30);line-height:1.2}
.ani-boton-n{background:transparent;color:var(--texto);border:2px solid var(--texto);height:84px;padding:0 40px;font-size:34px;box-sizing:border-box}
.ani-boton-g{font-size:40px;padding:26px 64px}
.ani-pj img{display:block;height:360px;width:auto;max-width:none}
.ani-sub2{font-size:24px;color:var(--texto-2)}
.ani-mk{overflow:hidden}
.ani-ul{position:relative;display:inline-block}
.ani-ul i{position:absolute;left:0;right:0;bottom:-4px;height:12px;background:var(--acento);transform:scaleX(0);transform-origin:0 50%}
.ani-card9{height:440px;border:2px solid var(--borde);border-radius:24px;padding:44px 50px;display:flex;align-items:flex-start;gap:24px;box-sizing:border-box}
.ani-card9 b{display:block;font-size:44px;letter-spacing:var(--trk-42);margin-bottom:4px}
.ani-card9 span{display:block;font-size:32px;color:var(--texto-2)}
.ani-av{width:84px;height:84px;border-radius:50%;background:var(--superficie);display:flex;align-items:center;justify-content:center;font-size:40px;font-weight:var(--bold);flex:none}
.ani-campo{position:relative;width:800px;height:120px;border:2px solid var(--borde-control);border-radius:var(--r-tarjeta);background:var(--elevado);display:flex;align-items:center;padding:0 36px;font-size:44px;color:var(--texto);box-sizing:border-box}
.ani-ph{position:absolute;left:36px;color:var(--texto-3)}
.ani-caret{display:inline-block;width:3px;height:56px;background:var(--texto);margin-left:4px;opacity:0}
.ani-hoja{border:3px solid var(--borde);border-radius:24px;background:var(--fondo)}
.ani-rline{position:absolute;left:48px;right:48px;top:0;height:3px;background:var(--texto-3)}
.ani-rrow{position:absolute;left:48px;right:48px;top:0;bottom:0;display:flex;align-items:center;font-size:40px;letter-spacing:var(--trk-30)}
.ani-rrow b{width:190px}
.ani-rrow em{flex:1;text-align:right;font-style:normal;color:var(--texto-2);white-space:nowrap}
.ani-rrow em.ani-sr{flex:none;width:340px;display:flex;justify-content:flex-end;align-items:center}
.ani-pto{display:inline-block;width:20px;height:20px;border-radius:50%;background:var(--acento);margin-right:14px}
.ani-tt{font-weight:var(--bold);letter-spacing:var(--trk-58);color:var(--texto)}
.ani-dots{display:inline-flex;gap:14px}
.ani-dots i{display:block;width:20px;height:20px;border-radius:50%;background:var(--control-apagado)}
.ani-okc{display:flex;align-items:center;justify-content:center;width:84px;height:84px;border-radius:50%;background:var(--acento);flex:none}

/* lo que NO hacemos: aquí sí hay efectos que la marca no usa (cartel, partículas, rayitas) */
.ani-cartel{width:760px;height:380px;border:2px solid var(--borde);border-radius:28px;background:var(--elevado);display:flex;flex-direction:column;justify-content:space-between;padding:36px 44px;box-sizing:border-box}
.ani-cartel small{font-size:26px;font-weight:var(--bold);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2)}
.ani-cartel b{font-size:72px;letter-spacing:var(--trk-58);line-height:1.05;color:var(--texto)}
.ani-part{position:absolute;left:0;top:0;display:block;opacity:0}
.ani-fch{border:2px solid var(--borde);border-radius:24px;background:var(--elevado);display:flex;align-items:center;padding:0 40px;box-sizing:border-box}
.ani-fch b{font-size:46px;letter-spacing:var(--trk-42);color:var(--texto)}
.ani-lns i{display:block;height:6px;border-radius:var(--r-pill);background:var(--texto-3);margin:20px 0}
.ani-lns i:nth-child(2){margin-left:36px}

/* en celular el botón «Copiar» va en su propia franja y no tapa el código */
@media (max-width:700px){.code{padding-top:var(--s-48)}}

/* ------------------------------------------------------------ la página (versión corta): una fila por elemento, lo técnico dentro de <details>
   Todo va bajo .ani-pg para no tocar la hoja descargable, que sigue usando el diseño largo. */
.ani-pg .hero{padding:var(--s-64) 0 var(--s-32)}
.ani-pg .sec{padding:var(--s-48) 0}
.ani-pg .sec-head{margin-bottom:var(--s-24);max-width:none}
.ani-pg .sec-head .lede{margin-top:var(--s-12)}
.ani-pg .ani-hero-st{margin:0}
.ani-pg .ani-cvs-fila{gap:var(--s-24);margin-bottom:var(--s-32)}
.ani-pg .ani-cvs{max-width:112px}
.ani-pg .ani-cv h3{margin:var(--s-8) 0 var(--s-4)}
.ani-pg .ani-cv .copy{font-size:12px}
.ani-pg .ani-cv p{margin:var(--s-8) 0 0}
.ani-pg .ani-reglas-b{margin-bottom:var(--s-16)}
.ani-pg .ani-reglas-b h3{margin-bottom:var(--s-16)}
.ani-pg .ani-reglas{gap:var(--s-12) var(--s-48)}
.ani-pg .ani-reglas p{font-size:var(--t-15)}
.ani-pg .tabs{margin-bottom:var(--s-24)}

/* una fila: escenario a la izquierda, dos frases a la derecha */
.ani-pg .ani-lista{gap:var(--s-32)}
.ani-pg .ani-el{padding-top:var(--s-32)}
.ani-pg .ani-fila{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-8) var(--s-32);align-items:start}
.ani-pg .ani-fila.v{grid-template-columns:300px minmax(0,1fr)}
@media (max-width:900px){.ani-pg .ani-fila,.ani-pg .ani-fila.v{grid-template-columns:minmax(0,1fr);gap:var(--s-16)}}
.ani-pg .ani-fila>details.mas{grid-column:1/-1;padding:var(--s-8) 0}
.ani-pg .ani-fila>details.mas .ani-refs{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:var(--s-24)}
@media (max-width:900px){.ani-pg .ani-fila>details.mas .ani-refs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.ani-pg .ani-fila>details.mas .ani-refs{grid-template-columns:minmax(0,1fr)}}
.ani-pg .ani-fila>details.mas .ani-tira{margin-top:var(--s-24)}
.ani-st{min-width:0}
.ani-info{min-width:0;display:flex;flex-direction:column;gap:var(--s-12)}
.ani-ih{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--s-12);align-items:baseline}
.ani-ih .ani-n{padding-top:0}
.ani-q{margin:0;font-size:var(--t-17)}
.ani-d{margin:0;font-size:var(--t-15);color:var(--texto-2)}
.ani-d b{color:var(--texto);margin-right:var(--s-4)}
.ani-nn{gap:var(--s-8) var(--s-16)}
.ani-nn dd{margin:0}
.ani-info .ani-ctl{justify-content:flex-start;margin-top:var(--s-4)}
.ani-info details.mas{margin-top:var(--s-8)}
.ani-info .ani-refs,.ani-fila>details .ani-refs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-16);margin-top:var(--s-16)}
.ani-info .ani-refs.n1{grid-template-columns:minmax(0,24em)}
@media (max-width:620px){.ani-info .ani-refs{grid-template-columns:minmax(0,1fr)}}
.ani-info .ani-tira{margin-top:var(--s-16)}

/* Notion: rejilla de dos, escenario arriba y texto abajo */
.ani-pg .ani-cuad{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-48) var(--s-32)}
@media (max-width:900px){.ani-pg .ani-cuad{grid-template-columns:minmax(0,1fr)}}
.ani-pg .ani-cd{display:flex;flex-direction:column;gap:var(--s-16);border-top:0;padding-top:0}

/* lo que no hacemos y descargas */
.ani-pg .ani-nos{gap:var(--s-32)}
.ani-pg .ani-nos details.mas{border-top:0;padding:0}
.ani-pg .ani-nos+details.mas,.ani-pg .ani-cuad+details.mas,.ani-pg .ani-dl+details.mas{margin-top:var(--s-32)}
.ani-pg .ani-dl{gap:var(--s-24)}
.ani-pg .ani-sync{gap:var(--s-8)}
.ani-pg .ani-sync-n{margin-top:var(--s-4)}

@media (max-width:620px){
  .ani-nn{grid-template-columns:minmax(0,1fr);gap:2px}
  .ani-nn dd{margin-bottom:var(--s-8)}
  .ani-pg .hero{padding:var(--s-48) 0 var(--s-24)}
  .ani-pg .sec{padding:var(--s-32) 0}
}
@media (max-width:900px){
  .ani-info>.ani-refs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:var(--s-16);scrollbar-width:none}
  .ani-info>.ani-refs::-webkit-scrollbar{display:none}
  .ani-info>.ani-refs>.ref{flex:0 0 min(78%,320px);scroll-snap-align:start}
}
@media (max-width:620px){
  .ani-pg .ani-cvs-fila{grid-template-columns:minmax(0,1fr);gap:var(--s-16)}
  .ani-pg .ani-cv{display:grid;grid-template-columns:88px minmax(0,1fr);column-gap:var(--s-16);align-items:start;padding-top:var(--s-12)}
  .ani-pg .ani-cv .ani-cvs{grid-row:1/span 4;width:88px}
  .ani-pg .ani-cv>h3,.ani-pg .ani-cv>p,.ani-pg .ani-cv>.copy{grid-column:2;justify-self:start}
  .ani-pg .ani-cv>p{margin:var(--s-4) 0 0}
}