/* Video vertical de 45 s al costado del texto (en el celular, debajo): marco oscuro. */
.demo{overflow-x:clip}
.demo-intro{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:clamp(40px,6vw,88px);align-items:center}
.demo-steps-list{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:14px}
.demo-steps-list li{display:flex;align-items:center;gap:14px;font:600 clamp(18px,2vw,22px)/1.3 var(--font)}
.demo-steps-list b{flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--accent);color:var(--ink);font:800 17px var(--display)}
.demo-actions{margin-top:32px}
.demo-video-note{margin:16px 0 0;font-size:14px;color:var(--muted)}
.demo-video{justify-self:center;width:100%}
.dv-stage{position:relative;width:min(100%,380px);margin:0 auto}
.dv-glow{position:absolute;inset:-70px -50px;background:radial-gradient(55% 55% at 50% 50%,rgba(245,166,35,.42),rgba(245,166,35,0) 72%);pointer-events:none}
.dv-window{position:relative;padding:11px;border-radius:48px;background:#111214;box-shadow:0 0 0 1px #2c2d30,0 44px 90px rgba(17,18,20,.38)}
.dv-screen{position:relative;border-radius:38px;overflow:hidden;aspect-ratio:9/16;background:#000;box-shadow:0 0 0 1px #2c2d30}
.dv-screen video{display:block;width:100%;height:100%;object-fit:contain;background:#000}
.dv-play{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;border:0;cursor:pointer;color:#fff;background:rgba(17,18,20,.26)}
.dv-icon{display:grid;place-items:center;width:84px;height:84px;padding-left:7px;border-radius:50%;background:var(--accent);color:#111214;font-size:33px;box-shadow:0 14px 34px rgba(0,0,0,.4);transition:transform .2s}
.dv-label{padding:8px 18px;border-radius:999px;background:rgba(17,18,20,.78);font:700 15px var(--font);text-align:center}
.dv-play:hover .dv-icon,.dv-play:focus-visible .dv-icon{transform:scale(1.08)}
.dv-play:focus-visible{outline:4px solid var(--accent);outline-offset:-6px}
.dv-screen.is-playing .dv-play{display:none}
@media(max-width:900px){.demo-intro{grid-template-columns:1fr;gap:44px}}
@media(prefers-reduced-motion:reduce){.dv-icon{transition:none}}