/* p-transiciones.css · /video/transiciones/ · solo tokens (sin hex sueltos, sin sombras, sin degradados, sin rebotes) · prefijo tr- */

/* =========================================================================
   Escenario 16:9 (lienzo de 1280 × 720 escalado, como en la guía de video)
   ========================================================================= */
.tr-stage{display:block;aspect-ratio:16/9;min-height:0}
.tr-esc{position:absolute;inset:0;overflow:hidden;background:var(--fondo);color:var(--texto);font-family:var(--fuente)}
.tr-lienzo{position:absolute;left:0;top:0;width:1280px;height:720px;transform-origin:0 0;overflow:hidden;font-size:16px;font-weight:var(--regular);line-height:1.2;letter-spacing:0;text-align:left}
.tr-capa{position:absolute;inset:0}
.tr-op{background:var(--fondo)}
.tr-sup{background:var(--superficie)}
.tr-ab{position:absolute}
/* la barra «Repetir» que pone el sitio queda sobre cualquier fondo */
.tr-stage .stage-bar{left:10px;right:auto;bottom:10px;gap:var(--s-12);padding:3px 14px 3px 3px;background:var(--elevado);border:var(--borde-ancho) solid var(--borde);border-radius:var(--r-pill)}
.tr-stage .stage-bar{max-width:calc(100% - 20px)}
.tr-stage .stage-bar span{margin-left:0;font-variant-numeric:tabular-nums;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tr-stage .stage-bar .btn{background:var(--superficie)}

/* texto de la escena */
.tr-e{font-size:36px;font-weight:var(--bold);letter-spacing:.1em;text-transform:uppercase;color:var(--texto-2);line-height:1.2;white-space:nowrap}
.tr-h{font-weight:var(--bold);line-height:1.03;letter-spacing:-.04em;color:var(--texto)}
.tr-az{color:var(--acento-texto)}
.tr-cifra{font-size:380px;font-weight:var(--bold);line-height:.9;letter-spacing:-.05em;color:var(--texto)}
.tr-cifra.tr-az{color:var(--acento-texto)}
.tr-guia{position:absolute;top:0;height:720px;border-left:2px dashed var(--texto-3)}
.tr-guiat{position:absolute;top:10px;font-size:24px;color:var(--texto-3)}
.tr-base{height:0;border-top:2px solid var(--borde)}
.tr-mk{overflow:hidden}
.tr-mkt{white-space:nowrap}

/* teléfono (kit/telefono.tsx a 450 × 900; siempre claro) */
.tr-telw{transform-origin:0 0}
.tr-tel{width:450px;height:900px;box-sizing:border-box;border-radius:72px;background:var(--telefono-marco);padding:18px}
.tr-pant{width:100%;height:100%;border-radius:54px;background:var(--telefono-pantalla);overflow:hidden;display:flex;flex-direction:column}
.tr-hora{height:52px;display:flex;align-items:flex-end;padding:0 30px;font-size:17px;font-weight:var(--bold);color:var(--texto)}
.tr-cab{padding:14px 22px;border-bottom:1.5px solid var(--borde);display:flex;align-items:center;justify-content:space-between}
.tr-cab b{display:block;font-size:25px;color:var(--texto)}
.tr-cab span{display:block;font-size:15px;color:var(--texto-2)}
.tr-cab .tr-ej{border:1.5px solid var(--borde);border-radius:var(--r-pill);padding:3px 12px;background:var(--elevado);font-size:13px;font-weight:var(--bold);letter-spacing:.1em;text-transform:uppercase;color:var(--texto-2)}
.tr-chat{flex:1;padding:18px 22px;display:flex;flex-direction:column;gap:12px}
.tr-brow{display:flex;justify-content:flex-start}
.tr-brow.d{justify-content:flex-end}
.tr-bw{max-width:84%}
.tr-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)}
.tr-bub.on{background:var(--acento-suave);border:3px solid var(--acento)}
.tr-bh{font-size:14px;color:var(--texto-2);margin-top:4px}
.tr-brow.d .tr-bh{text-align:right}
.tr-sep{display:flex;align-items:center;gap:10px;margin-top:4px}
.tr-sep i{flex:1;height:1.5px;background:var(--borde)}
.tr-sep span{font-size:13px;font-weight:var(--bold);letter-spacing:.1em;text-transform:uppercase;color:var(--texto-2)}
.tr-chiprow{display:flex;justify-content:center}
.tr-chip{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}
.tr-chip.pun{border-style:dashed;border-color:var(--control-apagado);color:var(--texto-2)}
.tr-apr{font-size:15px;font-weight:var(--bold);color:var(--texto-2);text-align:right;margin-top:6px}

/* cápsula del interruptor */
.tr-caps{position:relative;flex:none}
.tr-caps i{position:absolute;display:block;border-radius:50%;background:var(--fondo)}
.tr-cap-azul{background:var(--control-apagado)}
.tr-cap-tinta{background:var(--texto)}
.tr-simb{display:flex}
.tr-fondoaz{background:var(--acento-suave);opacity:0}
.tr-tarjeta{background:var(--fondo);border:2px solid var(--borde);border-radius:40px}

/* hilera de 14 días (interruptor como dato) */
.tr-hil{display:flex;gap:18px}
.tr-dia{display:block;width:34px;height:54px;border:3px solid var(--control-apagado);border-radius:var(--r-pill);position:relative}
.tr-dia i{position:absolute;left:3px;right:3px;bottom:3px;height:20px;border-radius:var(--r-pill);background:var(--control-apagado)}
.tr-dia.hecho{border-color:var(--texto)}.tr-dia.hecho i{background:var(--texto);transform:translateY(-14px)}
.tr-dia.hoy{border-color:var(--acento)}.tr-dia.hoy i{background:var(--acento);transform:translateY(-14px)}

/* elemento compartido */
.tr-bubg{background:var(--elevado);border:5px solid var(--borde);border-radius:70px;padding:40px 52px;font-size:68px;line-height:1.22;letter-spacing:-.02em;color:var(--texto)}
.tr-bubg small{display:block;font-size:30px;color:var(--texto-2);margin-top:14px;letter-spacing:0}
.tr-chipg{transform-origin:0 0}

/* diagrama de cuatro nodos (kit/flujo.tsx) */
.tr-mundo{background:var(--fondo)}
.tr-nodo{width:250px;height:360px;box-sizing:border-box;border:2px solid var(--borde);border-radius:24px;padding:22px;background:var(--elevado);display:flex;flex-direction:column}
.tr-nodo.on{border-color:var(--acento);background:var(--acento-suave)}
.tr-nn{font-size:16px;font-weight:var(--bold);letter-spacing:.1em;color:var(--texto-2)}
.tr-na{flex:1;display:flex;align-items:center;justify-content:center}
.tr-nt{font-size:24px;line-height:1.15;letter-spacing:-.015em;color:var(--texto)}
.tr-ns{font-size:17px;color:var(--texto-2);margin-top:6px}
.tr-bz i{display:block;width:110px;height:40px;border-radius:14px;border:3px solid var(--control-apagado);background:var(--elevado);margin-bottom:12px;position:relative}
.tr-bz i::after{content:"";position:absolute;left:12px;right:12px;top:14px;height:6px;border-radius:var(--r-pill);background:var(--borde)}
.tr-vend{display:flex;flex-direction:column;gap:16px}
.tr-vend span{display:flex;align-items:center;gap:8px}
.tr-bi{display:block;width:62px;height:28px;border-radius:10px;border:3px solid var(--control-apagado);background:var(--elevado)}
.tr-vend u{display:block;width:20px;height:3px;background:var(--texto)}
.tr-vend b{border:2px solid var(--texto);border-radius:var(--r-pill);padding:2px 14px;background:var(--elevado);font-size:20px;color:var(--texto)}
.tr-reloj{position:relative;width:96px;height:96px;border-radius:50%;border:5px solid var(--texto);box-sizing:border-box}
.tr-reloj i{position:absolute;left:50%;bottom:50%;width:5px;margin-left:-2.5px;background:var(--texto);border-radius:3px;transform-origin:50% 100%}
.tr-reloj .h1{height:34px;transform:rotate(300deg)}.tr-reloj .h2{height:24px;transform:rotate(115deg)}
.tr-rep{width:176px;box-sizing:border-box;background:var(--elevado);border:2px solid var(--borde);border-radius:12px;padding:12px}
.tr-rep small{display:block;font-size:12px;font-weight:var(--bold);letter-spacing:.1em;text-transform:uppercase;color:var(--texto-2);margin-bottom:8px}
.tr-rep u{display:block;height:7px;border-radius:var(--r-pill);background:var(--borde);margin-bottom:7px}
.tr-rep div{display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:baseline;margin-top:10px}
.tr-rep b{font-size:30px;line-height:1;color:var(--texto)}.tr-rep em{font-style:normal;font-size:13px;color:var(--texto-2)}

/* lo que NO hacemos: efectos prohibidos, solo para mostrarlos */
.tr-fr,.tr-gr,.tr-gb{background:transparent}
.tr-gr .tr-h{color:var(--error)}.tr-gb .tr-h{color:var(--acento)}
.tr-gr .tr-e,.tr-gb .tr-e{color:inherit}
.tr-gr,.tr-gb{opacity:.75;mix-blend-mode:multiply}
.tr-flash{background:var(--blanco);opacity:0}
.tr-meta{border:3px dashed var(--texto-3);border-radius:var(--r-tarjeta)}
.tr-metat{font-size:24px;color:var(--texto-3)}
.tr-tl-t{font-size:48px;font-weight:var(--bold);letter-spacing:-.03em;color:var(--texto)}
.tr-tl-n{font-size:28px;font-weight:var(--bold);color:var(--texto-2)}
.tr-tl-r{height:0;border-top:2px solid var(--borde)}
.tr-tl-c{width:4px;height:80px;margin-left:-2px;background:var(--texto);opacity:0}
.tr-tl-p{width:0;border-left:2px solid var(--texto-3)}
.tr-tl-w{display:flex;flex-direction:column;align-items:flex-start;gap:6px;opacity:0;color:var(--texto)}
.tr-tl-w svg{fill:currentColor;flex:none}
.tr-tl-w small{font-size:26px;font-weight:var(--bold);color:var(--texto-2)}
.tr-tl-ok{flex-direction:row;align-items:center;gap:12px}
.tr-tl-ok b{display:block;width:44px;height:44px;border-radius:50%;background:var(--acento)}
.tr-tl-ok small{color:var(--acento-texto)}

/* =========================================================================
   Página
   ========================================================================= */
.hero{padding:var(--s-48) 0 var(--s-32)}
.hero-acc{margin-top:var(--s-24)}
.sec{padding:var(--s-48) 0}
.sec-head{margin-bottom:var(--s-24)}
.sec-head h2{font-size:var(--t-42);letter-spacing:var(--trk-42);line-height:var(--lh-titulo-42)}
.sec-head .lede{font-size:var(--t-19);letter-spacing:var(--trk-19);margin-top:var(--s-12);max-width:none}
@media (max-width:767px){.sec-head h2{font-size:var(--web-h2);letter-spacing:var(--web-h2-trk);line-height:var(--lh-titular)}}
.tr-mapa-sec{padding-top:0;padding-bottom:var(--s-32)}
.tr-mapa-t{margin:0 0 var(--s-16);color:var(--texto-2);font-size:var(--t-15)}
.tr-mapa{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-24) var(--medianil)}
@media (max-width:900px){.tr-mapa{grid-template-columns:repeat(2,minmax(0,1fr))}}
.tr-mini{display:block;text-decoration:none;color:inherit;min-width:0}
.tr-miniesc{position:relative;aspect-ratio:16/9;border-radius:var(--r-captura);overflow:hidden;border:var(--borde-ancho) solid var(--borde);transition:border-color var(--dur-micro) var(--mov-micro)}
.tr-mini:hover .tr-miniesc,.tr-mini:focus-visible .tr-miniesc{border-color:var(--texto)}
.tr-mini .tr-m-t{display:flex;align-items:baseline;gap:var(--s-8);margin-top:var(--s-8)}
.tr-mini .tr-m-t i{font-style:normal;font-size:var(--t-12);font-weight:var(--bold);letter-spacing:var(--trk-eyebrow);color:var(--texto-2);font-variant-numeric:tabular-nums}
.tr-mini .tr-m-t b{font-size:var(--t-17)}
.tr-mini .tr-m-d{display:block;font-size:var(--t-15);color:var(--texto-2);font-variant-numeric:tabular-nums}

.sec-head h2{text-wrap:balance}.hero h1{text-wrap:balance}
.tr-sec .sec-head .eyebrow i.tr-num{font-style:normal;font-variant-numeric:tabular-nums}
.tr-demo{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:var(--s-24) var(--s-32);align-items:center}
.tr-bajo{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--s-32) var(--s-48);align-items:start}
@media (max-width:1000px){.tr-demo,.tr-bajo{grid-template-columns:minmax(0,1fr)}}
/* lo accesorio, plegado: el porqué, lo técnico, los fotogramas y de dónde sale */
details.mas.tr-det{margin-top:var(--s-24);padding-bottom:0}
.tr-mas-top{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:var(--s-16) var(--s-48);align-items:start;margin-bottom:var(--s-24)}
.tr-mas-top p{margin:0}
.tr-mas-top .tr-cb{margin-top:var(--s-8)}
.tr-mas-top .kv{grid-template-columns:5.5em 1fr;row-gap:var(--s-12)}
.tr-mas-top .kv dt{font-weight:var(--bold);color:var(--texto)}
.tr-mas-top .kv dd{color:var(--texto-2)}
@media (max-width:1000px){.tr-mas-top{grid-template-columns:minmax(0,1fr)}}

.tr-ficha{display:flex;flex-direction:column;gap:var(--s-16);min-width:0}
.tr-dur{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s-16)}
.tr-dur .big-num{margin:0;white-space:nowrap}
.tr-dur .big-num span{font-size:var(--t-24);letter-spacing:var(--trk-24);color:var(--texto-2);font-weight:var(--regular);margin-left:6px}
.tr-curva{display:block;width:80px;height:80px;flex:none;overflow:visible}
.tr-cb{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-8);font-size:var(--t-12);color:var(--texto-2)}
.tr-cb .copy{font-size:var(--t-12)}
.tr-dot{fill:var(--acento);stroke:none}
.tr-detalle{margin:0;color:var(--texto-2);font-size:var(--t-15)}
.tr-ficha .kv{grid-template-columns:5.5em 1fr;row-gap:var(--s-12)}
.tr-ficha .kv dt{font-weight:var(--bold);color:var(--texto)}
.tr-ficha .kv dd{color:var(--texto-2)}

.tr-tt{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s-16);margin:0 0 var(--s-12);font-size:var(--t-15);font-weight:var(--bold)}
.tr-tt span{font-weight:var(--regular);color:var(--texto-2);font-size:var(--t-12)}
@media (max-width:620px){.tr-tt{flex-direction:column;gap:2px}}
.tr-tira.tira{flex-wrap:wrap;overflow:visible;gap:var(--s-12) var(--s-8);padding-bottom:0}
.tr-tira.tira figure{width:var(--fw,calc((100% - 24px)/4))}
.tr-tira.tira img{display:block;height:auto;aspect-ratio:16/9;object-fit:cover;background:var(--superficie)}
.tr-tira.tira figcaption{margin-top:6px}
.tr-pie{margin:var(--s-8) 0 0;font-size:var(--t-12);color:var(--texto-2)}

.tr-ref{display:flex;flex-direction:column;gap:var(--s-8);min-width:0}
.tr-ref-g{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-8)}
.tr-ref-g.u{grid-template-columns:minmax(0,1fr)}
.tr-ref-g .p1{grid-column:1/-1}
.tr-ref-g figure{margin:0;min-width:0}
.tr-ref-g img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:8px;border:var(--borde-ancho) solid var(--borde);background:var(--superficie)}
.tr-ref-g figcaption{font-size:var(--t-12);margin-top:3px;font-variant-numeric:tabular-nums}
.tr-ref-g figcaption a{color:var(--texto-2)}.tr-ref-g figcaption a:hover{color:var(--acento-texto)}
.tr-ref-h{margin:0;font-size:var(--t-12);font-weight:var(--bold);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2)}
.tr-ref-c{margin:0;font-size:var(--t-12);color:var(--texto-2);line-height:1.35}
.tr-ref-c a{color:var(--texto-2)}.tr-ref-c a:hover{color:var(--acento-texto)}
.tr-ref-t{margin:0;font-size:var(--t-15)}

/* pestañas de la máscara */
.tr-mas .tabs{margin-bottom:var(--s-24)}
.tr-var{font-size:var(--t-15);color:var(--texto-2);margin:0 0 var(--s-16)}

/* =========================================================================
   Cuándo usar cuál
   ========================================================================= */
.tr-diez{display:flex;align-items:flex-end;gap:var(--s-8);margin:0 0 var(--s-8)}
.tr-diez i{display:block;width:var(--s-32);height:var(--s-48);border-radius:var(--r-pill);background:var(--texto)}
.tr-diez i.e{background:var(--texto-2);height:var(--s-32)}
.tr-diez i.f{background:var(--apagado);height:var(--s-24)}
.tr-diez-l{display:flex;flex-wrap:wrap;gap:var(--s-8) var(--s-24);font-size:var(--t-15);color:var(--texto-2);margin:0}
.tr-diez-l b{color:var(--texto)}
.tr-cuando{border-top:var(--borde-ancho) solid var(--texto)}
.tr-cu{display:grid;grid-template-columns:72px minmax(0,1.1fr) minmax(0,2fr) minmax(0,2fr);gap:var(--s-16) var(--s-24);align-items:start;padding:var(--s-16) 0;border-bottom:var(--borde-ancho) solid var(--borde);text-decoration:none;color:inherit;transition:background var(--dur-micro) var(--mov-micro)}
.tr-cu:hover{background:var(--superficie)}
.tr-cu .g{color:var(--texto);padding-top:2px}
.tr-cu .g svg{display:block;width:56px;height:34px}
.tr-cu b{display:block;font-size:var(--t-17)}
.tr-cu em{display:block;font-style:normal;font-size:var(--t-15);color:var(--texto-2);font-variant-numeric:tabular-nums}
.tr-cu p{margin:0;font-size:var(--t-15);color:var(--texto-2)}
.tr-cu p span{display:block;font-size:var(--t-12);font-weight:var(--bold);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto);margin-bottom:2px}
.tr-cu.hd{font-size:var(--t-12);font-weight:var(--bold);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2);border-bottom-color:var(--texto);padding:var(--s-8) 0}
.tr-cu.hd:hover{background:transparent}
@media (max-width:900px){
  .tr-cu{grid-template-columns:56px minmax(0,1fr)}
  .tr-cu p{grid-column:2}
  .tr-cu.hd{display:none}
}

/* =========================================================================
   Lo que no hacemos
   ========================================================================= */
.tr-no{display:flex;flex-direction:column;gap:var(--s-64)}
.tr-no h3{margin-bottom:var(--s-16)}
.tr-no .pair .stage{--alto:0}
.tr-motivo{margin:var(--s-16) 0 0;max-width:46em;color:var(--texto-2)}
.tr-motivo b{color:var(--texto)}
/* en pantalla ancha, cada «no» en una fila: título y porqué a la izquierda, el par sí / no a la derecha */
.tr-no{gap:0}
.tr-no-r{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-16) var(--s-32);align-items:start;padding:var(--s-24) 0;border-top:var(--borde-ancho) solid var(--borde)}
.tr-no-r:first-child{border-top:0;padding-top:0}
.tr-no-r:last-child{padding-bottom:0}
.tr-no-r h3{margin:0}
.tr-no-r .tr-motivo{margin:var(--s-8) 0 0;font-size:var(--t-15)}
.tr-no-r details.mas{margin-top:var(--s-12);padding:var(--s-12) 0 0}
.tr-no-r .tr-ref{max-width:360px}
@media (min-width:1280px){.tr-no-r{grid-template-columns:minmax(0,2fr) minmax(0,5fr)}}

/* =========================================================================
   Ritmo
   ========================================================================= */
.tr-sub{margin-top:var(--s-32)}
.tr-sub h3{margin:0 0 var(--s-4)}
.tr-sub>p.small{margin:0 0 var(--s-16)}
.tr-sub .tr-plan{margin-top:var(--s-16)}
.tr-leyenda{display:flex;flex-wrap:wrap;gap:var(--s-8) var(--s-24);margin:0 0 var(--s-24);font-size:var(--t-15);color:var(--texto-2)}
.tr-leyenda span{display:inline-flex;align-items:center;gap:var(--s-8)}
.tr-leyenda .pt{display:inline-block;width:12px;height:12px;border-radius:50%;background:var(--texto)}
.tr-leyenda .pt.h{background:transparent;border:2px solid var(--texto)}
.tr-leyenda .pt.z{background:var(--acento)}
.tr-leyenda .pt.zh{background:transparent;border:2px solid var(--acento)}
.tr-leyenda .pt.b{width:22px;height:12px;border-radius:3px;background:var(--acento-suave);border:var(--borde-ancho) solid var(--acento)}
.tr-hant{border-top:var(--borde-ancho) solid var(--texto)}
.tr-hf{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr);gap:var(--s-16);align-items:center;padding:0;border-bottom:var(--borde-ancho) solid var(--borde)}
.tr-hf.ini{border-top:var(--borde-ancho) solid var(--texto-3)}
.tr-hant .tr-hf.ini:first-child{border-top:0}
.tr-hf .n{font-size:var(--t-15);line-height:1.25;min-width:0;padding:var(--s-8) 0}
.tr-hf .n b{display:block;min-height:1.25em}
.tr-hf .n span{display:block;font-size:var(--t-12);color:var(--texto-2)}
.tr-hf .p{position:relative;height:48px}
.tr-hf .p .band{position:absolute;top:0;bottom:0;background:var(--acento-suave)}
.tr-hf .p .rail{position:absolute;left:0;right:0;top:50%;border-top:var(--borde-ancho) solid var(--borde)}
.tr-hf .p .rg{position:absolute;top:50%;height:2px;margin-top:-1px;background:var(--texto-3)}
.tr-hf .p .d{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--texto)}
.tr-hf .p .d.h{background:var(--fondo);border:2px solid var(--texto);box-sizing:border-box}
.tr-hf .p .v{position:absolute;top:50%;font-size:var(--t-12);font-weight:var(--bold);font-variant-numeric:tabular-nums;white-space:nowrap;color:var(--texto);transform:translate(12px,-50%)}
.tr-hf .p .v.l{transform:translate(calc(-100% - 12px),-50%)}
.tr-hf .p .v.h{font-weight:var(--regular);color:var(--texto-2)}
.tr-hf.nos .rg{background:var(--acento)}
.tr-hf.nos .d{background:var(--acento)}
.tr-hf.nos .d.h{background:var(--fondo);border-color:var(--acento)}
.tr-hf.nos .n b{color:var(--acento-texto)}
.tr-eje{display:grid;grid-template-columns:minmax(120px,190px) minmax(0,1fr);gap:var(--s-16);margin-top:var(--s-8);font-size:var(--t-12);color:var(--texto-2)}
.tr-eje b{display:block}
.tr-eje>div{position:relative;height:34px}
.tr-eje>div span{position:absolute;transform:translateX(-50%);font-variant-numeric:tabular-nums}
.tr-eje>div em{position:absolute;left:0;right:0;top:18px;text-align:center;font-style:normal}
.tr-pnota{font-size:var(--t-12);color:var(--texto-2);margin:var(--s-16) 0 0;max-width:62em}

/* pulso en vivo */
.tr-stage-p{aspect-ratio:auto;min-height:0;padding:var(--s-24) var(--s-24) 56px;display:block;place-items:stretch}
.tr-stage-p .stage-bar{left:12px}
.tr-pulso{position:relative;width:100%}
.tr-pu-eje{position:relative;height:18px;margin-left:calc(190px + var(--s-16));margin-right:calc(40px + var(--s-16));font-size:var(--t-12);color:var(--texto-2)}
.tr-pu-eje span{position:absolute;transform:translateX(-50%);font-variant-numeric:tabular-nums}
.tr-pu-fila{display:grid;grid-template-columns:190px minmax(0,1fr) 40px;gap:var(--s-16);align-items:center;padding:var(--s-8) 0;border-top:var(--borde-ancho) solid var(--borde)}
.tr-pu-n{font-size:var(--t-15);font-weight:var(--bold);line-height:1.2}
.tr-pu-n small{display:block;font-weight:var(--regular);font-size:var(--t-12);color:var(--texto-2)}
.tr-pu-pista{position:relative;height:34px;border-left:var(--borde-ancho) solid var(--borde);border-right:var(--borde-ancho) solid var(--borde)}
.tr-pu-t{position:absolute;top:4px;bottom:4px;width:2px;margin-left:-1px;background:var(--texto);opacity:0}
.tr-pu-cab{position:absolute;top:-4px;bottom:-4px;width:0;border-left:2px solid var(--texto-3)}
.tr-pu-c{font-size:var(--t-19);font-weight:var(--bold);text-align:right;font-variant-numeric:tabular-nums}
.tr-pu-fila.nos .tr-pu-t{background:var(--acento)}
.tr-pu-fila.nos .tr-pu-n{color:var(--acento-texto)}
@media (max-width:700px){
  .tr-pu-eje{margin-left:0;margin-right:0}
  .tr-pu-fila{grid-template-columns:minmax(0,1fr) 40px;row-gap:var(--s-4)}
  .tr-pu-pista{grid-column:1/-1;order:3}
}

/* plan de una pieza de 2 minutos */
.tr-plan{position:relative;margin-top:var(--s-24)}
.tr-plan-s{display:grid;grid-template-columns:var(--cols);gap:var(--s-4)}
.tr-plan-s div{border:var(--borde-ancho) solid var(--borde);background:var(--superficie);border-radius:6px;padding:var(--s-8) var(--s-12);font-size:var(--t-12);font-weight:var(--bold);min-width:0}
.tr-plan-s div span{display:block;font-weight:var(--regular);color:var(--texto-2);font-variant-numeric:tabular-nums}
.tr-plan-c{position:relative;height:34px;margin-top:var(--s-12)}
.tr-plan-c i{position:absolute;top:0;bottom:0;width:1px;background:var(--texto-3)}
.tr-plan-m{position:relative;height:56px}
.tr-plan-m a{position:absolute;top:0;display:block;width:150px;margin-left:-1px;padding:0 0 0 var(--s-8);border-left:2px solid var(--texto);font-size:var(--t-12);line-height:1.3;color:var(--texto-2);text-decoration:none}
.tr-plan-m a b{display:block;color:var(--texto);font-size:var(--t-15)}
.tr-plan-m a.r{border-left:0;border-right:2px solid var(--texto);padding:0 var(--s-8) 0 0;margin-left:-149px;text-align:right}
@media (max-width:700px){.tr-plan-m{height:130px}.tr-plan-m a{width:120px}.tr-plan-m a.r{margin-left:-119px}}

/* Notion */
.tr-nv{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-24) var(--medianil)}
@media (max-width:900px){.tr-nv{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.tr-nv{grid-template-columns:minmax(0,1fr)}}
.tr-nv .ref{margin:0}
.tr-nv .ref img{aspect-ratio:16/9;object-fit:cover}
.tr-nv .ref .ref-take b{display:block;font-size:var(--t-12);letter-spacing:var(--trk-eyebrow);text-transform:uppercase;color:var(--texto-2);margin-bottom:2px}
.tr-notion-t{margin-top:0}
.tr-notion-t .tabla{min-width:680px}
.tr-notion-t .tabla th:first-child{width:20%}
.tr-notion-t .tabla td:first-child{font-weight:var(--bold)}
.tr-notion-t .tabla td:last-child{color:var(--texto)}
.tr-notion-t .tabla td:nth-child(2){color:var(--texto-2)}
.tr-notion-t .tabla-scroll{margin-top:0}

/* descargas */
.tr-dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-24) var(--medianil)}
@media (max-width:700px){.tr-dl{grid-template-columns:minmax(0,1fr)}}
.tr-dl>div{border-top:var(--borde-ancho) solid var(--texto);padding-top:var(--s-16);display:flex;flex-direction:column;gap:var(--s-8);align-items:flex-start}
.tr-dl h3{font-size:var(--t-19);letter-spacing:var(--trk-19)}
.tr-dl p{margin:0;color:var(--texto-2);font-size:var(--t-15)}