/* ---------- Demo final: guion de cinco partes y rúbrica en anillo ---------- */
.dm2{display:grid;grid-template-columns:1fr 1.12fr;gap:28px;margin-top:6px;align-items:start}
.dm2 h3{font-family:var(--tt);font-weight:500;font-size:24px;letter-spacing:-.02em;color:#DCE5FA;margin-bottom:14px}
.dm2-guion ol{list-style:none;padding:0;display:grid;gap:10px}
.dm2-guion li{display:grid;grid-template-columns:46px 1fr;gap:16px;align-items:center;padding:13px 18px;border-radius:18px;background:rgba(255,255,255,.035);border:1px solid var(--line);animation:sube .8s var(--ease) both;animation-delay:var(--t)}
.dm2-guion .n{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;font-family:var(--tt);font-weight:600;font-size:21px;color:#05060A;background:var(--c);box-shadow:0 0 22px color-mix(in srgb,var(--c) 45%,transparent)}
.dm2-guion b{display:block;font-size:21px;font-weight:500;color:#F2F2F5}
.dm2-guion i{display:block;height:5px;border-radius:3px;margin-top:9px;width:0;background:linear-gradient(90deg,var(--c),color-mix(in srgb,var(--c) 25%,transparent));animation:dm2barra 1.2s var(--ease) forwards;animation-delay:calc(var(--t) + 450ms)}
@keyframes dm2barra{to{width:var(--w)}}
.dm2-rub{padding:20px 24px 18px;border-radius:24px;background:linear-gradient(180deg,rgba(140,170,255,.07),rgba(140,170,255,.015));border:1px solid var(--vidrio-borde)}
.dm2-cuerpo{display:grid;grid-template-columns:290px 1fr;gap:20px;align-items:center}
.dm2-cuerpo svg{width:290px;height:290px;display:block;overflow:visible}
.dm2-arco{fill:none;stroke-width:44;stroke-dasharray:0 100;stroke-dashoffset:var(--o);cursor:pointer;transition:stroke-width .45s var(--ease),opacity .45s;animation:dm2arco 1.1s var(--ease) forwards;animation-delay:var(--t)}
@keyframes dm2arco{to{stroke-dasharray:var(--l) 100}}
.dm2-rub.sel .dm2-arco{opacity:.3}
.dm2-rub.sel .dm2-arco.on{opacity:1;stroke-width:56}
.dm2-pts{font-family:var(--tt);font-weight:600;font-size:80px;letter-spacing:-.04em;fill:#fff;transition:fill .4s}
.dm2-de{font-size:21px;fill:#A1A1AA}
.dm2-ley{list-style:none;padding:0;display:grid;gap:4px}
.dm2-ley li{display:grid;grid-template-columns:40px 1fr;gap:10px;align-items:center;padding:6px 10px;border-radius:12px;cursor:pointer;transition:background .35s,opacity .35s}
.dm2-ley li:hover{background:rgba(255,255,255,.05)}
.dm2-ley em{font-style:normal;font-family:var(--tt);font-weight:600;font-size:22px;color:var(--c)}
.dm2-ley span{font-size:18px;line-height:1.3;color:#D9DCE6}
.dm2-rub.sel .dm2-ley li{opacity:.45}
.dm2-rub.sel .dm2-ley li.on{opacity:1;background:color-mix(in srgb,var(--c) 15%,transparent)}

/* ---------- Siguiente paso: carriles de decisión con la ficha de cada equipo ---------- */
.sg2-carriles{margin-top:8px;gap:16px}
.sg2-car{position:relative;padding:18px 20px 16px;border-radius:24px;background:linear-gradient(180deg,color-mix(in srgb,var(--c) 11%,transparent),rgba(255,255,255,.012));border:1px solid color-mix(in srgb,var(--c) 32%,transparent)}
.sg2-car header b{display:block;font-family:var(--tt);font-weight:500;font-size:31px;letter-spacing:-.03em;color:var(--c)}
.sg2-car header p{font-size:18px;line-height:1.4;color:#D4D4D9;margin-top:4px;min-height:50px}
.sg2-fichas{display:flex;gap:10px;align-items:center;min-height:62px;margin-top:12px;padding:7px 10px;border-radius:16px;border:1px dashed color-mix(in srgb,var(--c) 38%,transparent);background:rgba(0,0,0,.18)}
.sg2-car .s2-eqs{padding-top:12px}
.sg2-ficha{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;flex:none;background:radial-gradient(circle at 34% 30%,rgba(255,255,255,.45),transparent 58%),var(--fc);box-shadow:0 0 20px color-mix(in srgb,var(--fc) 55%,transparent)}
.sg2-ficha[data-f="1"]{--fc:#2ED3C6}.sg2-ficha[data-f="2"]{--fc:#4C9BFF}.sg2-ficha[data-f="3"]{--fc:#9D8CFF}.sg2-ficha[data-f="4"]{--fc:#FF6B5A}
.sg2-ficha b{font-family:var(--tt);font-weight:600;font-size:20px;color:#05060A}
.sg2-ficha.llega{animation:pop .7s cubic-bezier(.34,1.56,.64,1) both}
.sg2-pend{display:flex;align-items:center;gap:16px;margin-top:14px;min-height:50px}
.sg2-pend small{font-size:17px;color:var(--muted)}
.sg2-pend div{display:flex;gap:10px;align-items:center}
.sg2-pend em{font-style:normal;font-size:18px;color:#BDF3EE}
.sg2-ses{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px;padding-top:24px;text-align:center}
.sg2-linea{position:absolute;left:16.6%;right:16.6%;top:7px;height:4px;border-radius:2px;background:rgba(160,180,230,.15)}
.sg2-linea i{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:2px;background:var(--grad)}
.s.on .sg2-linea i{animation:sg2llena 1.8s var(--ease) 1s forwards}
@keyframes sg2llena{to{width:50%}}
.sg2-s span{position:absolute;top:0;width:18px;height:18px;margin-left:-9px;border-radius:50%;background:#2ED3C6}
.sg2-s:nth-child(2) span{left:16.6%}.sg2-s:nth-child(3) span{left:50%}.sg2-s:nth-child(4) span{left:83.4%}
.sg2-s.hoy span{background:#fff;box-shadow:0 0 0 7px rgba(127,178,255,.25),0 0 24px #4C9BFF}
.sg2-s.luego span{background:#04050B;border:2px dashed #F5C84B}
.sg2-s small{display:block;font-size:17px;color:var(--muted)}
.sg2-s b{display:block;font-family:var(--tt);font-weight:500;font-size:21px;letter-spacing:-.015em;margin-top:2px;color:#E8EAF2}
.sg2-s.hoy b{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
