/* Resultados: composición editorial con profundidad y ritmo, no una tabla administrativa. */
.outcomes { padding: 128px 0; overflow: hidden; }
.outcomes-layout { display: grid; grid-template-columns: minmax(300px, .82fr) minmax(610px, 1.18fr); gap: clamp(58px, 7vw, 138px); align-items: start; }
.outcomes-intro { position: sticky; top: 148px; }
.outcomes-intro h2 { max-width: 580px; margin: 0 0 27px; font-size: clamp(3.2rem, 4.45vw, 5.25rem); }
.outcomes-intro > p:last-child { max-width: 405px; margin: 0; color: var(--muted); font-size: 1.05rem; line-height: 1.55; }
.outcome-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; padding: 1px; background: #b7beb4; }
.outcome-item { position: relative; display: flex; min-height: 188px; flex-direction: column; justify-content: space-between; padding: 27px 29px 25px; background: var(--soft); color: var(--ink); opacity: 0; overflow: hidden; transform: translateY(16px); transition: background .32s ease, color .32s ease, box-shadow .32s ease, opacity .45s ease, transform .45s ease; transition-delay: var(--outcome-delay); }
.outcome-item h3 { position: relative; z-index: 1; max-width: 280px; margin: 0; font-size: clamp(1.15rem, 1.35vw, 1.42rem); letter-spacing: -.05em; line-height: 1.05; }
.outcome-item p { position: relative; z-index: 1; max-width: 265px; margin: 23px 0 0; padding: 0; border: 0; color: var(--muted); font-size: .91rem; font-weight: 500; line-height: 1.45; }
.outcome-item::before { position: absolute; top: 0; right: 0; width: 58px; height: 58px; border-top: 3px solid transparent; border-right: 3px solid transparent; content: ''; transition: width .32s ease, height .32s ease, border-color .32s ease; }
.outcome-item::after { position: absolute; bottom: 0; left: 0; width: 0; height: 4px; background: var(--lime); content: ''; transition: width .38s cubic-bezier(.18,.72,.22,1); }
.outcomes.is-revealed .outcome-item { opacity: 1; transform: translateY(0); }
.outcomes.is-revealed .outcome-item.is-active { background: #fbfcf8; box-shadow: 0 12px 26px rgba(17,20,16,.08); }
.outcomes.is-revealed .outcome-item.is-active h3 { color: #527300; }
.outcomes.is-revealed .outcome-item.is-active::before { width: 86px; height: 86px; border-color: var(--lime); }
.outcomes.is-revealed .outcome-item.is-active::after { width: 100%; }
@media (hover:hover) { .outcomes.is-revealed .outcome-item:hover { z-index: 1; background: #fbfcf8; box-shadow: 0 12px 26px rgba(17,20,16,.08); cursor: default; } .outcomes.is-revealed .outcome-item:hover h3 { color: #527300; } .outcomes.is-revealed .outcome-item:hover::before { width: 86px; height: 86px; border-color: var(--lime); } .outcomes.is-revealed .outcome-item:hover::after { width: 100%; } }
@media (max-width:980px) { .outcomes-layout { grid-template-columns: 1fr; gap: 48px; } .outcomes-intro { position: static; } .outcomes-intro h2 { max-width: 730px; } }
@media (max-width:620px) { .outcomes { padding: 78px 0; } .outcomes-layout { gap: 38px; } .outcomes-intro h2 { font-size: clamp(2.85rem, 14vw, 4rem); } .outcome-grid { grid-template-columns: 1fr; } .outcome-item { min-height: 155px; padding: 23px 22px; } .outcome-item::before { width: 48px; height: 48px; } }
@media (prefers-reduced-motion:reduce) { .outcome-item,.outcome-item::before,.outcome-item::after { transition: none; } }