/* Promotion Mind · EL ESTILO DE LA PRESENTACIÓN, SIMPLE (Pablo, 23-oct: «tiene que ser de ese estilo pero con un buen
   diseño que se entienda, no que te la complique, algo simple como lo plantea la presentación»).
   Maqueta aprobada: maquetas/simple.html. Blanco y azul, Inter, tarjetas blancas, botón azul, APROBAR verde, el logo de CD
   con sus colores apoyado sobre el azul (nunca en una caja blanca). Una pregunta por pantalla.
   Va ÚLTIMO: pisa a estilo.css y recorrido.css (el negro espejado queda guardado, no se usa). */
:root{
 --az:#0a5bb5;--az2:#0b3f86;--cel:#e8f1fc;--ink:#14223a;--mut:#6b7a90;--line:#e6ecf4;--bg:#f3f6fb;
 --ok:#1f9d55;--okb:#e6f6ec;--rj:#d93b3b;--rjb:#fdecec;--nar:#c26b06;--narb:#fdf3e4;
 --n-bg:var(--bg);--n-card:#fff;--n-line:var(--line);--n-ink:var(--ink);--n-ink2:#3b4a62;--n-mut:var(--mut);--n-soft:#eef2f8;
 --n-ac:var(--az);--n-acb:var(--cel);--n-ok:var(--ok);--n-okb:var(--okb);--n-rj:var(--rj);--n-rjb:var(--rjb);--n-am:var(--nar);--n-amb:var(--narb);
 --hecho:var(--az);--ahora:var(--nar);--vidrio:#fff;--filo:0 1px 0 var(--line);
 --card:#fff;--head:var(--ink);--muted:var(--mut);--surface:#f5f8fc;--plane:#f3f6fb;--line2:#eef2f8;--ink2:#3b4a62;--c1:var(--az)}
body{font-family:Inter,system-ui,sans-serif;background:#e7edf5;color:var(--ink)}
.top h1,.top .who2 b{color:var(--ink)}.top .s,.top .who2,.foot{color:var(--mut)}
.phone{border-color:#0f1b2e;background:var(--bg)}
#screen{background:var(--bg)}#screen:before{display:none}
.body{background:var(--bg);padding:14px 16px 22px}
.sb{background:var(--az2);color:#fff}
/* ENCABEZADO AZUL de la presentación: arriba SAVENCIA y el logo de CD; el título grande; una línea de contexto */
.hd{background:linear-gradient(180deg,var(--az2),var(--az));color:#fff;padding:12px 18px 18px;border:none}
.hd .r{min-height:36px;display:flex;align-items:center}
.hd .marca{font-size:12px;font-weight:700;letter-spacing:.05em;opacity:.92;display:flex;align-items:center;gap:6px}
.hd .cdw{margin-left:auto;display:flex;align-items:center;gap:6px;font-size:9px;letter-spacing:.08em;color:rgba(255,255,255,.75)}
.hd .cdw img{height:18px}
.hd .t{font-size:24px;font-weight:800;letter-spacing:-.02em;margin-top:10px;display:flex;align-items:center;gap:8px;color:#fff;line-height:1.15}
.hd .t em{font-family:inherit;font-style:normal;font-weight:800}
.hd .sub2{font-size:13px;opacity:.85;margin-top:4px}
.hd .ico{color:#fff;min-width:40px;min-height:40px;margin:-6px -4px}
.hd .ico .n{background:#ff5a5a}
.hd .back{color:#fff;font-size:24px;font-weight:400;margin:0 2px 0 -2px;min-height:auto}
.hd .acciones{margin-left:auto;display:flex;align-items:center}
/* BARRA DE ABAJO: blanca, cuatro lugares con su nombre */
.tab{background:#fff;border-top:1px solid var(--line);height:62px;justify-content:space-around;gap:0;backdrop-filter:none}
.tab span,.tab span:first-child{flex-direction:column;gap:2px;height:auto;min-height:48px;padding:4px 10px;border-radius:12px;color:#9aa8bc;background:transparent}
.tab span small{display:block;font-family:Inter,sans-serif;font-size:11px;font-weight:600}
.tab span.on,.tab span.on:first-child{background:transparent;color:var(--az);padding:4px 10px}
.tab span svg{width:21px;height:21px}
@media (max-width:520px){.tab{height:calc(62px + env(safe-area-inset-bottom))}.hd{padding-top:calc(12px + env(safe-area-inset-top))}}
/* TARJETAS blancas, sin bordes duros */
.card,.tope,.req,.menu,.sol,.cad,.n-acc,.n-kp,.n-tl,.mstat,.tregua,.pr,.r-chips div,.r-pres,.sucs span,.gf{background:#fff;border:none;box-shadow:0 1px 0 var(--line),0 0 0 1px rgba(20,34,58,.03)}
.card{border-radius:18px;padding:15px 16px}
.n-vacio{background:#fff;border:1.5px dashed #d5deea;color:var(--mut)}
.lbl,.r-sec{font-family:Inter,sans-serif;font-size:11px;font-weight:700;letter-spacing:.05em;color:var(--mut);text-transform:uppercase}
.row,.kpi,.cmp,.reg,.opt,.sol .tres{border-color:var(--line)}
.inp,select.inp,.sel{background:#fff;color:var(--ink);border-color:var(--line)}
.btn{background:var(--az);color:#fff;border-radius:14px;font-weight:700;font-family:Inter,sans-serif}
.btn.o{background:#fff;color:var(--az);border:1.5px solid var(--az)}.btn.r{background:#fff;color:var(--rj);border:1.5px solid #f3c0c0}.btn.g{background:var(--ok)}
.seg span{background:#fff;color:var(--ink);border-color:var(--line)}.seg span.on{background:var(--az);color:#fff;border-color:var(--az)}
.n-mes span{background:#fff;color:var(--ink)}.n-mes span.on{background:var(--az);color:#fff;border-color:var(--az)}
.tag{font-family:Inter,sans-serif;font-weight:700;background:#eef2f8;color:#3b4a62}.tag.ink{background:var(--az);color:#fff}
.badge{font-family:Inter,sans-serif;font-weight:700;font-size:11px;padding:4px 10px}
.b-pd{background:var(--cel);color:var(--az)}.b-rv{background:var(--narb);color:var(--nar)}
.mono{font-family:Inter,sans-serif}
.toast{background:#fff;color:var(--ink);border-color:var(--line)}
.undo{background:var(--ink);color:#fff}.undo button{background:#fff;color:var(--ink)}.undo .anillo{stroke:#fff}.undo circle:first-child{stroke:rgba(255,255,255,.25)}
.n-ok .c{background:var(--ok);color:#fff}
.warn.y{background:var(--narb);color:#8a5410}.warn.g{background:var(--okb);color:#2a6b45}.n-aviso,.err{background:var(--rjb);color:#8a2020}.ent{background:var(--cel);color:#24466f}
/* la recomendación verde de la presentación */
.n-reco{background:var(--okb);box-shadow:none;border-radius:18px}.n-reco.no{background:var(--rjb)}.n-reco.rv{background:var(--narb)}
.n-reco .k{font-family:Inter,sans-serif;font-weight:600;letter-spacing:0;text-transform:none;font-size:12px;color:#3d5a4a}
.n-reco b{font-weight:800;color:var(--ok)}.n-reco.no b{color:var(--rj)}.n-reco.rv b{color:var(--nar)}.n-reco .x b{color:var(--ink)}
.n-merma{background:#fff;border:1.5px solid #f3c0c0}
.n-merma small,.n-kp small,.sol .tres small,.r-chips small{font-family:Inter,sans-serif;letter-spacing:.02em}
.n-plazo{background:var(--az2);border:none;color:#fff;box-shadow:none}.n-plazo .cdw div{background:rgba(255,255,255,.12)}.n-plazo .cdw b{font-family:Inter,sans-serif}
.plazo{background:var(--az2);border:none}.merma{background:#fff;border:1.5px solid #f3c0c0}
.reco{background:var(--okb)}.reco.no{background:var(--rjb)}.reco.rv{background:var(--narb)}
.n-thumb{box-shadow:none}
.ring:after{background:#fff}.ring span{color:var(--ink)}
.cal span{color:var(--ink)}.cal span.x{color:#c5cede}.cal span.on{background:var(--az);color:#fff}.cal2 .ct{background:#eef2f8}
.simr.on{background:var(--cel);box-shadow:inset 0 0 0 1.5px var(--az);border-color:var(--az)}.simr .sb2{background:#e6ecf5}.simr .sb2 i{background:var(--az)}
.desliza input{background:linear-gradient(90deg,var(--az) var(--p,50%),#e6ecf5 var(--p,50%))}.desliza input::-webkit-slider-thumb{background:#fff;border-color:var(--az)}
.desliza .globo{background:var(--az);color:#fff;font-family:Inter,sans-serif}.desliza-res div{background:#f3f6fb}.desliza .marcas{font-family:Inter,sans-serif}
.steps div{background:#dde5f0}.steps div.on{background:var(--az)}
.opt.on i{border-color:var(--az);background:radial-gradient(var(--az) 45%,#fff 50%)}
.n-barra{background:#e6ecf5}.n-barra i{background:var(--az)}
.embudo i[style*="var(--n-ink)"]{background:var(--az2)!important}
.pie{color:var(--mut)}
.anillos text[fill="#111"]{fill:var(--ink)}
/* el pop de la casa, blanco */
#phone .modal{background:#fff;color:var(--ink);font-family:Inter,sans-serif}#phone .ovl{background:rgba(15,27,46,.4)}#phone .modal:before{background:#c9d2de}
#phone .rrow .rb{background:#e6ecf5}#phone .rrow .rb i{background:var(--az)!important}#phone .mread{background:var(--cel);color:#24466f}#phone .mclose{color:var(--mut)}
/* ============ INICIO ============ */
.hoy-card .acc{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);cursor:pointer;min-height:60px}
.hoy-card .acc:last-child{border:none;padding-bottom:2px}.hoy-card .acc:active{background:#f7f9fc}
.hoy-card .ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:0 0 auto}
.hoy-card .ic svg{width:20px;height:20px}
.hoy-card .t{flex:1;font-size:14.5px;font-weight:600;line-height:1.3}.hoy-card .t small{display:block;font-size:12.5px;font-weight:400;color:var(--mut);margin-top:2px}
.hoy-card .n{font-size:16px;font-weight:800;white-space:nowrap}.hoy-card .go{color:#9aa8bc;font-size:20px}
.tope2 .tt{font-size:17px;font-weight:800;letter-spacing:-.01em}.tope2 .tt b{color:var(--rj)}
.tope2 .ss{font-size:12.5px;color:var(--mut);margin:3px 0 0}
.tope2 .bar{height:10px;border-radius:99px;background:#e6ecf5;position:relative;margin:14px 0 6px}
.tope2 .bar i{position:absolute;left:0;top:0;bottom:0;border-radius:99px;background:var(--az);transition:width 1s cubic-bezier(.2,.8,.2,1)}
.tope2 .bar i.pasa{background:var(--rj)}.tope2 .bar em{position:absolute;top:-5px;width:3px;height:20px;background:var(--rj);border-radius:2px}
.tope2 .barl{display:flex;justify-content:space-between;font-size:11px;color:var(--mut)}
.tope2 .mas{font-size:12px;color:var(--az);font-weight:600;margin-top:8px}
/* una promo en la lista: el estado, una barrita de 6 tramos y el paso en palabras */
.pr{border-radius:16px;padding:13px 14px;margin-bottom:10px}
.pr .h{display:flex;justify-content:space-between;align-items:center;gap:8px}.pr .h b{font-size:14.5px;font-weight:700}
.pr .m{font-size:12.5px;color:var(--mut);margin-top:2px}
.pr .av{display:flex;gap:3px;margin:10px 0 6px}.pr .av span{flex:1;height:5px;border-radius:9px;background:#e6ecf5}.pr .av span.ok{background:var(--az)}.pr .av span.ya{background:var(--nar)}.pr .av span.mal{background:var(--rj)}
.pr .paso{font-size:12.5px;font-weight:600}.pr .paso em{font-style:normal;color:var(--mut);font-weight:400}
.pr.urge,.pr.alerta{box-shadow:0 1px 0 var(--line),inset 3px 0 0 var(--nar)}.pr.alerta{box-shadow:0 1px 0 var(--line),inset 3px 0 0 var(--rj)}
/* el director: lo que espera su decisión */
.dec .nm{font-size:16px;font-weight:700}.dec .sb3{font-size:12.5px;color:var(--mut);margin-top:3px}
.dec .reco2{display:flex;align-items:center;gap:12px;border-radius:16px;padding:13px 15px;margin:12px 0 10px;background:var(--okb)}
.dec .reco2.rv{background:var(--narb)}.dec .reco2.no{background:var(--rjb)}
.dec .reco2 small{font-size:12px;color:#3d5a4a}.dec .reco2 .big{font-size:22px;font-weight:800;color:var(--ok)}.dec .reco2.rv .big{color:var(--nar)}.dec .reco2.no .big{color:var(--rj)}
.dec .reco2 .x{margin-left:auto;text-align:right}.dec .reco2 .x b{font-size:26px;font-weight:800;color:var(--ink)}
.dec .lin{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;color:var(--mut)}.dec .lin b{color:var(--rj)}
.cada .acc{display:flex;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid var(--line);cursor:pointer}.cada .acc:last-child{border:none}
.cada .t{flex:1;font-size:14.5px;font-weight:600}.cada .t small{display:block;font-size:12.5px;color:var(--mut);font-weight:400;margin-top:1px}
/* ============ LA PROMO POR DENTRO: el recorrido en claro ============ */
.n-hero h2{font-weight:800}
.rc{background:#fff;border-radius:18px;padding:16px 16px 4px;box-shadow:0 1px 0 var(--line);margin-top:12px}
.rc .et{padding:0 0 16px 36px}
.rc .et:before{left:11px;top:26px;background:#dfe6f0}.rc .et.hecho:before{background:var(--az)}
.rc .et>i{width:24px;height:24px;border:2px solid #cbd5e3;background:#fff;color:#9aa8bc;font-family:Inter,sans-serif;font-size:11px;font-weight:700}
.rc .et.hecho>i{background:var(--az);border-color:var(--az);color:#fff}
.rc .et.ahora>i{border-color:var(--nar);color:var(--nar);box-shadow:0 0 0 5px var(--narb);animation:none}
.rc .et.mal>i{background:var(--rj);border-color:var(--rj);color:#fff}
.rc .et h3{font-size:14.5px;font-weight:700;color:var(--ink)}.rc .et h3 small{font-family:Inter,sans-serif;color:var(--mut);font-weight:500}
.rc .et.falta h3{color:#9aa8bc}.rc .et .q{color:var(--mut)}
.rc .et .cont .card,.rc .et .cont .n-kp,.rc .et .cont .tregua{background:#f7f9fc;box-shadow:none}
/* las fotos y la cámara (la cámara sigue negra: es la cámara) */
.gdots i{background:var(--ok)}.gdots i.x{background:var(--rj)}
.gseg span{border-color:var(--line);color:var(--ink)}.gseg span.on{background:var(--az);color:#fff;border-color:var(--az)}.gseg em b.on{color:var(--ink)}
.gf{background:#eef2f8}.gf .sinf{background:repeating-linear-gradient(135deg,#eef2f8 0 8px,#f5f8fc 8px 16px);color:#9aa8bc}.gf .s{color:#fff}
.fg{border-color:var(--line)}
.sucs span{color:var(--ink)}.sucs span.on{background:var(--az);color:#fff}
.leyendo{color:var(--ink2)}.leyendo i{border-color:#dbe3ee;border-top-color:var(--az)}
.n-ing{background:linear-gradient(180deg,var(--az2),var(--az));color:#fff}
.n-ing h1 em{font-family:Inter,sans-serif;font-style:normal;font-weight:800;opacity:.85}
.n-ing .s{color:rgba(255,255,255,.85)}.n-ing form{background:#fff;color:var(--ink);border:none}
.n-ing .pie{color:rgba(255,255,255,.8)}
.n-ing>div[style*="color:var(--n-mut)"]{color:rgba(255,255,255,.85)!important}

/* ================= LA MAQUETA VIVA (Pablo, 23-oct: «me gusta mucho, todo, no cambiaría nada») =================
   maquetas/vivo.html + indice.html + roles.html. Movimiento donde suma; se apaga con «reducir movimiento». */
.hd{background:linear-gradient(160deg,var(--az2) 0%,var(--az) 60%,#2f86e0 120%);overflow:hidden;position:relative}
.hd:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.13) 48%,transparent 60%);transform:translateX(-100%);animation:hdbrillo 6s ease-in-out 1s infinite;pointer-events:none}
@keyframes hdbrillo{30%,100%{transform:translateX(100%)}}
.hd>*{position:relative;z-index:1}
.hd .bm{width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.15);border:none;color:#fff;display:grid;place-items:center;cursor:pointer;margin-right:8px;flex:0 0 auto}
.hd .bm svg{width:20px;height:20px}
.hd .der{margin-left:auto;display:flex;align-items:center;gap:8px}
.hd .der small{font-size:10.5px;line-height:1.2;opacity:.9;text-align:right}.hd .der b{display:block;font-size:15px}
.hd .der svg circle.v{transition:stroke-dashoffset 1.4s cubic-bezier(.2,.8,.2,1)}
.hd .tit2{display:flex;align-items:center;margin-top:10px}
.hd .tit2 .t{margin-top:0}
.tab span{min-width:72px}
/* el índice que baja desde arriba */
.ind{position:absolute;inset:0;z-index:45;display:flex;flex-direction:column;pointer-events:none}
.ind .panel{background:linear-gradient(170deg,var(--az2),var(--az) 70%);color:#fff;border-radius:0 0 28px 28px;padding:calc(14px + env(safe-area-inset-top)) 14px 16px;transform:translateY(-104%);transition:transform .42s cubic-bezier(.2,.9,.2,1);pointer-events:auto;max-height:94%;overflow-y:auto;overscroll-behavior:contain}
.ind .velo{flex:1;background:rgba(15,27,46,.35);opacity:0;transition:opacity .3s;pointer-events:none}
.ind.on .panel{transform:none}.ind.on .velo{opacity:1;pointer-events:auto}
.ind .cab{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.ind .cab b{font-size:18px;font-weight:800}
.ind .x{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.14);border:none;color:#fff;font-size:18px;cursor:pointer}
.ind .quien{font-size:12px;opacity:.75;margin-bottom:4px}
.ind h5{font-size:10.5px;font-weight:700;letter-spacing:.08em;opacity:.65;margin:14px 6px 6px;text-transform:uppercase}
.ind .ent{display:flex;align-items:center;gap:12px;padding:10px;border-radius:14px;cursor:pointer;opacity:0;transform:translateY(-6px);min-height:52px}
.ind.on .ent{animation:entra .35s ease-out forwards}@keyframes entra{to{opacity:1;transform:none}}
.ind .ent:active,.ind .ent.aca{background:rgba(255,255,255,.12)}
.ind .ent .paso{font-size:10px;font-weight:800;opacity:.55;width:12px;text-align:center}
.ind .ent .ic{width:36px;height:36px;border-radius:11px;background:rgba(255,255,255,.14);display:grid;place-items:center;flex:0 0 auto}.ind .ent .ic svg{width:18px;height:18px}
.ind .ent .t{flex:1;font-size:14.5px;font-weight:600;line-height:1.25}.ind .ent .t small{display:block;font-size:12px;opacity:.72;font-weight:400;margin-top:1px}
.ind .ent .n{min-width:24px;height:24px;border-radius:99px;background:rgba(255,255,255,.2);font-size:12px;font-weight:800;display:grid;place-items:center;padding:0 8px}
.ind .ent .n.r{background:#ff6b6b}.ind .ent .n.o{background:var(--nar)}
@media (max-width:520px){.ind{position:fixed}}
/* LOGIN de los puntitos, sin la tarjeta blanca */
.n-ing{position:relative;overflow-y:auto;padding:calc(20px + env(safe-area-inset-top)) 22px 20px}
.n-ing:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.10) 48%,transparent 60%);transform:translateX(-100%);animation:hdbrillo 7s ease-in-out 1.5s infinite;pointer-events:none}
.n-ing .arriba{display:flex;justify-content:space-between;align-items:center}
.n-ing .arriba .marca{font-size:12px;font-weight:700;letter-spacing:.05em;opacity:.9}
.n-ing .arriba .cdw{display:flex;align-items:center;gap:6px;font-size:9px;letter-spacing:.08em;color:rgba(255,255,255,.75)}.n-ing .arriba .cdw img{height:18px}
.n-ing h1{margin-top:30px;font-size:40px;font-weight:900;line-height:1;letter-spacing:-.035em}.n-ing h1 span{opacity:.6;font-weight:800}
.n-ing .s{color:rgba(255,255,255,.85);font-size:14px;margin-top:10px}
.puntos{display:grid;grid-template-columns:repeat(8,1fr);gap:12px;margin-top:24px;justify-items:center}
.puntos i{width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.15);display:block;animation:enc .5s ease-out forwards}
@keyframes enc{60%{transform:scale(1.25)}100%{background:var(--c);box-shadow:0 0 12px var(--c)}}
.puntos-ley{display:flex;gap:14px;font-size:11.5px;opacity:.85;margin-top:12px}.puntos-ley i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:5px}
.n-ing form{margin-top:auto;padding-top:24px;background:none;border:none}
.n-ing form .lbl{color:rgba(255,255,255,.8);margin:12px 0 6px}
.n-ing form .inp{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);color:#fff;border-radius:14px;padding:14px;font-size:15px;margin-bottom:0}
.n-ing form .inp::placeholder{color:rgba(255,255,255,.5)}
.n-ing form .inp:focus{outline:2px solid rgba(255,255,255,.6);border-color:transparent}
.n-ing form .btn{background:#fff;color:var(--az2);font-weight:800;margin-top:18px}
.n-ing form .olv{text-align:center;font-size:12px;color:rgba(255,255,255,.8);margin-top:12px}
.n-ing form .err{background:rgba(255,107,107,.25);color:#fff}
.n-ing .pie2{text-align:center;font-size:11.5px;opacity:.8;margin-top:16px}
/* la pila de «Hoy tenés que» */
.pila{position:relative;margin-bottom:24px;cursor:pointer}
.pila .acc2{background:#fff;border-radius:18px;padding:13px 14px;display:flex;align-items:center;gap:12px;box-shadow:0 1px 0 var(--line),0 8px 24px -18px rgba(11,63,134,.35);transition:transform .45s cubic-bezier(.2,.9,.2,1),opacity .35s,margin .45s;position:relative}
.pila .acc2+.acc2{margin-top:-60px;transform:scale(.94) translateY(12px);opacity:.75;z-index:-1}
.pila .acc2+.acc2+.acc2{transform:scale(.88) translateY(24px);opacity:.5;z-index:-2}
.pila .acc2+.acc2+.acc2+.acc2{opacity:0}
.pila.abierta .acc2+.acc2{margin-top:8px;transform:none;opacity:1;z-index:0}
.pila .ic{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;flex:0 0 auto}.pila .ic svg{width:20px;height:20px}
.pila .t{flex:1;font-size:14.5px;font-weight:600;line-height:1.3}.pila .t small{display:block;font-size:12.5px;font-weight:400;color:var(--mut)}
.pila .n{font-weight:800;font-size:16px;white-space:nowrap}.pila .go{color:#9aa8bc;font-size:20px}
.pila .cuenta{position:absolute;right:12px;bottom:-20px;font-size:11px;color:var(--mut);font-weight:600}
.pila.abierta .cuenta{display:none}
/* el Tope vivo: área azul debajo de la curva */
.tope{background:#fff;border:none;border-radius:20px;box-shadow:0 1px 0 var(--line),0 8px 24px -18px rgba(11,63,134,.35)}
.tope .tt{font-size:17px;font-weight:800}
/* LA OPERACIÓN: la línea con seis estaciones y las promos que circulan */
.metro{position:relative;padding:6px 0 2px}
.metro .via{position:absolute;left:22px;right:22px;top:27px;height:4px;border-radius:4px;background:#dbe4f0;overflow:hidden}
.metro .via i{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:var(--az);width:0;transition:width 1.6s cubic-bezier(.2,.8,.2,1)}
.metro .viajero{position:absolute;top:25px;width:8px;height:8px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px var(--az);animation:viaja 7s linear infinite;left:22px}
@keyframes viaja{0%{left:22px;opacity:0}8%{opacity:1}92%{opacity:1}100%{left:calc(100% - 30px);opacity:0}}
.est{display:grid;grid-template-columns:repeat(6,1fr);position:relative}
.est a{display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;color:var(--ink);min-height:44px}
.est .bola{width:44px;height:44px;border-radius:50%;background:#fff;border:3px solid var(--az);display:grid;place-items:center;position:relative;z-index:1;color:var(--az)}
.est .bola svg{width:18px;height:18px}
.est a.falta .bola{border-color:#cbd5e3;color:#9aa8bc}
.est a.hoy .bola{border-color:var(--nar);color:var(--nar);animation:hoy 2s ease-out infinite}
@keyframes hoy{0%{box-shadow:0 0 0 0 rgba(224,138,30,.45)}100%{box-shadow:0 0 0 12px rgba(224,138,30,0)}}
.est .num{position:absolute;top:-6px;right:-9px;min-width:20px;height:20px;border-radius:99px;background:var(--az);color:#fff;font-size:11px;font-weight:800;display:grid;place-items:center;padding:0 5px;border:2px solid #fff}
.est .num.r{background:var(--rj)}.est .num.cero{background:#cbd5e3}
.est b{font-size:10.5px;font-weight:700;margin-top:7px;line-height:1.15}.est small{font-size:9.5px;color:var(--mut);margin-top:2px;line-height:1.2}
/* el director: decidir desde el inicio */
.dec .reco2 .x b{font-size:28px}
.merma2{display:flex;align-items:center;justify-content:space-between;border:1.5px solid #f3c0c0;border-radius:14px;padding:10px 13px;margin:0 0 10px}
.merma2 small{font-size:10.5px;font-weight:800;color:var(--rj);letter-spacing:.04em}
.merma2 b{font-size:20px;color:var(--rj);position:relative}.merma2 b:after{content:"";position:absolute;left:-2px;right:-2px;top:52%;height:2.5px;background:var(--rj);transform:scaleX(0);transform-origin:left;animation:tacha .7s ease-out 1s forwards}
@keyframes tacha{to{transform:scaleX(1)}}
.plazo2{background:linear-gradient(160deg,var(--az2),var(--az));color:#fff;border-radius:14px;padding:10px 13px;display:flex;align-items:center;gap:10px;margin-bottom:10px}
.plazo2 small{font-size:10px;opacity:.75;text-transform:uppercase;letter-spacing:.06em;display:block}.plazo2 span{font-size:12.5px}
.plazo2 .cdw{display:flex;gap:4px;margin:0 0 0 auto}.plazo2 .cdw div{background:rgba(255,255,255,.14);border-radius:9px;min-width:36px;text-align:center;padding:3px 0}.plazo2 .cdw b{display:block;font-size:15px;font-variant-numeric:tabular-nums}.plazo2 .cdw small{font-size:8px;opacity:.7;text-transform:none;letter-spacing:0}
.cada2 .fila2{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);cursor:pointer}.cada2 .fila2:last-child{border:none}
.cada2 .nm{font-size:14px;font-weight:700;width:92px;display:flex;align-items:center;gap:6px}.cada2 .b{flex:1;height:8px;border-radius:9px;background:#e6ecf5;overflow:hidden;position:relative}
.cada2 .b i{display:block;height:100%;border-radius:9px;width:0;transition:width 1.2s cubic-bezier(.2,.8,.2,1)}
/* la promo por dentro: el riel se llena paso a paso y las sucursales se encienden */
.rc .et.hecho:before{transform-origin:top;animation:crece .45s ease-out both}
.rc .et:nth-child(1):before{animation-delay:.2s}.rc .et:nth-child(2):before{animation-delay:.55s}.rc .et:nth-child(3):before{animation-delay:.9s}.rc .et:nth-child(4):before{animation-delay:1.25s}.rc .et:nth-child(5):before{animation-delay:1.6s}
@keyframes crece{from{transform:scaleY(0)}}
.rc .et.ahora>i{animation:hoy 2s ease-out infinite}
.gdots i{transform:scale(0);animation:prende .3s cubic-bezier(.2,1.4,.4,1) forwards}@keyframes prende{to{transform:scale(1)}}
.n-merma b{text-decoration:none;position:relative}.n-merma b:after{content:"";position:absolute;left:-2px;right:-2px;top:52%;height:2.5px;background:var(--rj);transform:scaleX(0);transform-origin:left;animation:tacha .7s ease-out .8s forwards}
@media (prefers-reduced-motion:reduce){.hd:after,.n-ing:after,.metro .viajero{display:none}.puntos i{background:var(--c)}.gdots i{transform:none}.merma2 b:after,.n-merma b:after{transform:scaleX(1)}.est a.hoy .bola,.rc .et.ahora>i{animation:none}}
.n-ing{background:linear-gradient(165deg,var(--az2) 0%,var(--az) 55%,#2f86e0 120%)!important;color:#fff;display:flex;flex-direction:column;flex:1}
.n-ing h1{color:#fff;margin-top:30px}
/* autorizar desde el inicio: el círculo verde se abre desde el dedo */
.circ{position:absolute;border-radius:50%;background:var(--ok);transform:scale(0);transition:transform .65s cubic-bezier(.2,.8,.2,1);z-index:30;pointer-events:none}
.listo2{position:absolute;inset:0;z-index:31;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-align:center;padding:30px;opacity:0;transition:opacity .3s .45s;pointer-events:none}
.listo2.on{opacity:1}.listo2 .c{width:78px;height:78px;border-radius:50%;border:3px solid #fff;display:grid;place-items:center;margin-bottom:14px}.listo2 h4{font-size:26px;font-weight:900}.listo2 p{font-size:14px;opacity:.9;margin-top:6px;line-height:1.4}
.undo{z-index:40}
.dec .two{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}.dec .two .btn{margin:0}
.tope .ayuda{font-size:11px;color:var(--mut);margin-top:2px}
.pila{isolation:isolate}.pila.abierta .acc2{opacity:1!important;transform:none!important;margin-top:8px}.pila.abierta .acc2:first-child{margin-top:0}
.anm{display:flex;flex-direction:row;align-items:center;gap:8px;cursor:pointer}.anm small{font-size:10.5px;line-height:1.2;opacity:.9;text-align:right}.anm b{display:block;font-size:15px}
.anm svg circle.ar{transition:stroke-dashoffset 1.4s cubic-bezier(.2,.8,.2,1)}
.hd .tit2{margin-top:2px;justify-content:space-between}
.ind{z-index:70}
.ind .ent{background:transparent;border:none;box-shadow:none;color:#fff;margin:0;font-size:inherit}
.ind .ent .t small{color:#fff}
