/* Four cinematic chapters, each with its own scene and color. */
.method-film{--method-progress:0;--method-light:0;--route-accent:#9ae0ea;background:#081c24;color:#fbfaf7;position:relative;padding:0;isolation:isolate}
.method-film[data-phase=integrar]{--route-accent:#e5bbd7}.method-film[data-phase=reinventar]{--route-accent:#efc19a}.method-film[data-phase=sostener]{--route-accent:#c0dcae}
.method-film-heading{display:grid;grid-template-columns:1.2fr .8fr;gap:22px 80px;padding:110px 0 65px;align-items:end}
.method-film-heading .eyebrow{grid-column:1/-1;color:#a6d8df;margin:0 0 4px}
.method-film-heading h2{font-size:clamp(3.6rem,6.5vw,6.25rem);line-height:.98;letter-spacing:-.035em}
.method-film-heading h2 em{color:#a6d8df}
.method-heading-aside{max-width:370px;padding-bottom:7px}.method-heading-aside p{color:#d3dfe0;font-size:1.0625rem;line-height:1.8}.method-heading-aside span{display:block;margin-top:28px;font-size:.75rem;letter-spacing:.13em;color:#93aeb4}
.method-route{position:sticky;top:15px;z-index:8;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;max-width:710px;width:calc(100% - 100px);margin:0 auto;background:#0b1a20ed;border:1px solid #ffffff27;border-radius:60px;padding:13px 20px 12px;backdrop-filter:blur(16px);box-shadow:0 10px 50px #0003}
.method-route-line{position:absolute;top:30px;left:14%;right:14%;height:1px;background:#e5e5dc35;pointer-events:none}.method-route-line>span{height:100%;display:block;background:var(--route-accent);transform:scaleX(var(--method-progress));transform-origin:left;transition:background .7s}
.method-stop{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:.875rem;line-height:1.4;color:#b8c4c8;text-align:center;padding:0 2px}
.method-stop-number{display:grid;place-items:center;width:33px;height:33px;border:1px solid #72828b;border-radius:50%;background:#12242d;font-size:.75rem;font-weight:600;transition:color .6s,background .6s,box-shadow .6s,border-color .6s}
.method-stop[aria-current=step]{color:var(--route-accent);font-weight:700}.method-stop[aria-current=step] .method-stop-number{color:#12242d;background:var(--route-accent);border-color:var(--route-accent);box-shadow:0 0 24px #c8e9ec25}.method-stop.is-reached .method-stop-number{border-color:var(--route-accent)}.method-stop:hover{color:white}
.method-chapters{margin-top:-45px}
.method-chapter{--scene-progress:.5;--scene-base:#071d2a;--phase-accent:#a6dfec;--phase-glow:#356f84;min-height:max(820px,100svh);position:relative;isolation:isolate;overflow:clip;scroll-margin-top:0;background:var(--scene-base)}
.phase-integrar{--scene-base:#261521;--phase-accent:#e8c5dc;--phase-glow:#855073}.phase-reinventar{--scene-base:#302017;--phase-accent:#f5c89c;--phase-glow:#a96839}.phase-sostener{--scene-base:#192b1d;--phase-accent:#c4e2ac;--phase-glow:#63834d}
.method-scene{position:absolute;inset:0;z-index:-2;overflow:hidden}.method-scene picture,.method-scene img{width:100%;height:100%;display:block}.method-scene img{object-fit:cover;object-position:68% center;transform:scale(1.065) translateY(calc((var(--scene-progress) - .5)*-35px));filter:saturate(.83);transform-origin:70% center}
.method-chapter:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--scene-base) 0%,color-mix(in srgb,var(--scene-base) 95%,transparent) 16%,color-mix(in srgb,var(--scene-base) 76%,transparent) 38%,color-mix(in srgb,var(--scene-base) 12%,transparent) 76%),linear-gradient(0deg,var(--scene-base),transparent 22%,transparent 82%,var(--scene-base));pointer-events:none}
.method-chapter-layout{min-height:inherit;display:flex;align-items:center;position:relative;padding:120px 0 95px}
.method-chapter-inner{position:relative;width:52%;max-width:585px;padding:0 22px 0 0;z-index:2;transition:transform .8s}
.method-film.has-path-motion .method-chapter:not(.is-current) .method-chapter-inner{transform:translateY(18px)}
.method-scene-label{font-size:.75rem;letter-spacing:.14em;line-height:1.8;color:var(--phase-accent);margin:0 0 22px}.method-phase-name{font-size:clamp(4.5rem,7.8vw,7.4rem);line-height:.95;letter-spacing:-.04em;margin-bottom:26px;color:#fbfaf7}
.method-chapter-title{font-family:var(--serif);font-size:clamp(2.1rem,3.1vw,3rem);line-height:1.08;letter-spacing:-.02em;margin:0 0 27px;color:#fbfaf7}.method-chapter-title em{color:var(--phase-accent)}
.method-chapter-description{font-size:1rem;line-height:1.8;max-width:490px;color:#e0e6e4}.method-chapter-description p+p{margin-top:16px}
.method-example{border-top:1px solid color-mix(in srgb,var(--phase-accent) 35%,transparent);padding-top:20px;margin-top:26px;font-size:.9375rem;line-height:1.75;color:#e6e6df;max-width:490px}.method-example span{display:block;text-transform:uppercase;font-size:.6875rem;letter-spacing:.13em;color:var(--phase-accent);margin-bottom:9px;font-weight:700}
.method-scene-number{position:absolute;right:0;top:14%;font-family:var(--serif);font-size:clamp(9rem,22vw,23rem);line-height:1;letter-spacing:-.08em;color:#ffffff12;pointer-events:none}
/* Integration has a softer, distinct golden frame. */
.phase-integrar .method-chapter-inner{padding:46px 35px 38px;border:1px solid #cfabbd4a;border-radius:50px 4px 50px 4px;background:linear-gradient(145deg,#362030e6,#241521bf);box-shadow:0 24px 90px #150c1733}.phase-integrar .method-phase-name{font-size:clamp(4.3rem,7.1vw,6.5rem)}.phase-integrar .method-example{border-color:#d6bb8440}.phase-integrar .method-example span{color:#e9cd96}
.method-end{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:35px 0 45px}.method-film-footnote{font-size:.875rem;line-height:1.7;color:#bfcec4;max-width:550px}.method-end .text-link{color:#e0d2ae;flex-shrink:0}
@media(max-width:1000px){.method-film-heading{gap:28px 35px}.method-film-heading h2{font-size:4.3rem}.method-chapter-inner{width:61%;max-width:600px}.method-chapter:after{background:linear-gradient(90deg,var(--scene-base) 0%,color-mix(in srgb,var(--scene-base) 90%,transparent) 26%,color-mix(in srgb,var(--scene-base) 45%,transparent) 69%,transparent),linear-gradient(0deg,var(--scene-base),transparent 28%,transparent 80%,var(--scene-base))}.method-route{width:calc(100% - 64px)}.method-scene img{object-position:66% center}.method-phase-name{font-size:6rem}.method-end{gap:25px}}
@media(max-width:640px){.method-film-heading{display:block;padding:70px 0 38px}.method-film-heading .eyebrow{margin-bottom:25px;letter-spacing:.10em;font-size:.6875rem}.method-film-heading h2{font-size:3.55rem;line-height:1.02}.method-heading-aside{margin-top:27px;max-width:none;padding:0}.method-heading-aside p{font-size:.9375rem;line-height:1.75}.method-heading-aside span{margin-top:20px;font-size:.625rem;letter-spacing:.11em}.method-route{width:calc(100% - 24px);top:9px;padding:10px 5px;gap:0;border-radius:40px}.method-route-line{top:24px;left:13%;right:13%}.method-stop{font-size:.75rem;gap:5px;letter-spacing:-.01em}.method-stop-number{width:29px;height:29px;font-size:.6875rem}.method-chapters{margin-top:-28px}.method-chapter{min-height:0;overflow:hidden}.method-chapter-layout{display:block;padding:320px 0 68px}.method-scene{height:520px}.method-scene img{object-position:50% 25%;transform:scale(1.04) translateY(calc((var(--scene-progress) - .5)*-22px))}.method-chapter:after{background:linear-gradient(180deg,color-mix(in srgb,var(--scene-base) 90%,transparent) 0,transparent 90px,transparent 170px,var(--scene-base) 405px,var(--scene-base) 100%)}.method-chapter-inner{width:100%;max-width:none;padding:0}.method-scene-label{font-size:.6875rem;letter-spacing:.11em;margin-bottom:19px}.method-phase-name,.phase-integrar .method-phase-name{font-size:clamp(3.6rem,15vw,5rem);margin-bottom:23px}.method-chapter-title{font-size:2.3rem;margin-bottom:24px}.method-chapter-description{font-size:.9375rem;line-height:1.85}.method-example{font-size:.875rem;margin-top:24px;padding-top:20px}.method-example span{font-size:.6875rem}.method-scene-number{font-size:10rem;top:125px;right:10px;color:#ffffff20}.phase-integrar .method-chapter-inner{padding:30px 22px;border-radius:38px 3px 38px 3px;background:#2d1c29e8}.phase-integrar .method-chapter-title{font-size:2.1rem}.phase-integrar .method-scene img{object-position:60% 10%}.method-end{display:block;padding:30px 0 43px}.method-film-footnote{font-size:.8125rem}.method-end .text-link{font-size:.8125rem;margin-top:22px}.method-film.has-path-motion .method-chapter:not(.is-current) .method-chapter-inner{transform:translateY(10px)}}
@media(prefers-reduced-motion:reduce){.method-scene img{transform:none!important}.method-chapter-inner{transform:none!important;transition:none!important}.method-stop-number,.method-route-line>span{transition:none!important}}
