/* Escenas "Qué gana tu empresa": cuatro ilustraciones con una animación breve al entrar en pantalla.
   Mismo lenguaje que Data Catalog (líneas que se dibujan y piezas que llegan). Lo activa outcome-scenes.js. */
.scene-sprite{position:absolute;width:0;height:0;overflow:hidden}
.results-four{position:relative;text-align:center}
html body main>section.results-four,html body section.results-four{background:#f7f7fb!important}
.results-four .results-heading{max-width:850px;margin:0 auto 40px}
.results-four .results-heading h2{font-size:var(--dicsys-section,clamp(32px,3.5vw,48px));line-height:1.13;letter-spacing:-.035em;color:#14171f;margin:18px 0 22px}
.results-four .results-heading>p{font-size:18px;line-height:1.65;max-width:62ch;margin:0 auto;color:#4b5565}
.outcome-scenes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.outcome-scenes article{min-width:0}
.outcome-scenes svg{width:100%;height:auto;display:block;overflow:visible;filter:drop-shadow(0 12px 15px #1c478709)}
.outcome-scenes svg .tag{font-family:inherit;font-size:15px;fill:#3f4d62}
.outcome-index{display:block;margin-top:6px;font-size:10px;letter-spacing:.1em;color:#586b85}
.outcome-scenes h4{font-size:24px;font-weight:700;letter-spacing:-.03em;line-height:1.12;color:#14171f;margin:12px 0;min-height:2.24em}
.outcome-scenes article>p{font-size:16px;line-height:1.5;color:#4b5565;max-width:25ch;margin:auto}
.outcome-gain{display:inline-flex;align-items:center;gap:8px;margin-top:16px;color:#237e61;font-size:16px;font-weight:500}
.outcome-gain:before{content:"✓";display:grid;place-items:center;width:21px;height:21px;border-radius:50%;background:#e8f5ee;font-size:12px}
.resolved-line{fill:none;stroke:#9671ce;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:320;stroke-dashoffset:320;transition:stroke-dashoffset 1.2s ease var(--result-delay,0ms)}
.resolved-arrival,.scene-step,.scene-stamp{opacity:0;transform-box:fill-box;transform-origin:center}
.resolved-arrival{transform:scale(.6);transition:opacity .6s ease calc(var(--result-delay,0ms) + 1.1s),transform .6s cubic-bezier(.3,1.6,.5,1) calc(var(--result-delay,0ms) + 1.1s)}
.scene-step{transform:translateY(8px);transition:opacity .5s ease calc(var(--result-delay,0ms) + .45s + var(--i,0)*.28s),transform .5s ease calc(var(--result-delay,0ms) + .45s + var(--i,0)*.28s)}
.scene-travel{opacity:0;transform:translateX(-70px);transition:opacity .4s ease calc(var(--result-delay,0ms) + .2s),transform 1.4s cubic-bezier(.4,0,.2,1) calc(var(--result-delay,0ms) + .2s)}
.scene-stamp{transform:scale(1.4) rotate(-6deg);transition:opacity .35s ease calc(var(--result-delay,0ms) + 1s),transform .45s cubic-bezier(.3,1.5,.5,1) calc(var(--result-delay,0ms) + 1s)}
.results-four.revealed .resolved-line{stroke-dashoffset:0}
.results-four.revealed .resolved-arrival{opacity:1;transform:none}
.results-four.revealed .scene-step{opacity:1;transform:none}
.results-four.revealed .scene-travel{opacity:1;transform:translateX(0)}
.results-four.revealed .scene-stamp{opacity:1;transform:rotate(-3deg)}
.results-four + .brand-wave-cta{margin-top:0}
.results-four + .brand-wave-cta .brand-waves{background:#f7f7fb}
/* Variante dentro de "Qué obtienes" (gain-scenes de business-story): mantiene su grilla y alineación. */
.gains-section.results-four{text-align:inherit}
.gain-art.scene-art{height:auto;display:block}
.gain-art.scene-art svg{width:100%;max-width:360px;height:auto;display:block;overflow:visible;filter:drop-shadow(0 12px 15px #1c478709)}
.gain-art.scene-art svg .tag{font-family:inherit;font-size:15px;fill:#3f4d62}
@media(max-width:900px){.outcome-scenes{grid-template-columns:repeat(2,minmax(0,1fr))}.outcome-scenes svg{max-width:340px;margin:auto}}
@media(max-width:500px){.outcome-scenes{grid-template-columns:1fr;gap:34px}.outcome-scenes h4{font-size:22px;min-height:0}.outcome-scenes article>p{font-size:15px}}
@media(prefers-reduced-motion:reduce){.results-four *{transition:none!important}.resolved-line{stroke-dashoffset:0}.resolved-arrival,.scene-step,.scene-travel,.scene-stamp{opacity:1;transform:none}}
