/* The main story follows native scroll; its content remains usable without WebGL. */
.hero-story{--header-height:84px;--hero-height:max(620px,calc(100svh - 96px));position:relative;margin:0 10px}
.hero-story.motion-enabled{height:calc(var(--hero-height) + 135svh)}
.terrain-hero{height:var(--hero-height);position:relative;isolation:isolate;overflow:hidden;border-radius:7px;background:radial-gradient(ellipse at 75% 40%,#175b88 0%,#003f72 42%,#052b50 88%);color:#fff}
.motion-enabled .terrain-hero{position:sticky;top:var(--header-height)}
.hero-stage{position:absolute;inset:0 0 0 29%;z-index:-2;opacity:1;transition:opacity .6s}
.hero-stage canvas{display:block;width:100%;height:100%}
.hero-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.25;z-index:-3;transition:opacity .6s}
.scene-ready .hero-fallback{opacity:0}
.terrain-hero:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#052b50 0%,#052b50e8 24%,#052b5066 45%,transparent 70%),linear-gradient(0deg,#052b50 0%,transparent 23%)}
.story-top,.story-footer{position:absolute;left:clamp(26px,5vw,90px);right:clamp(26px,5vw,90px);display:flex;align-items:center;justify-content:space-between}
.story-top{top:30px;gap:20px}
.story-top .eyebrow{font-size:9px;letter-spacing:.11em}
.story-top .mono{font-size:9px;color:#a1ccff}
.story-copy{position:absolute;left:clamp(26px,5vw,90px);right:26px;top:clamp(100px,17svh,185px);max-width:750px}
.story-panel{grid-area:1/1;transition:opacity .4s,transform .6s;opacity:0;transform:translateY(18px);visibility:hidden;pointer-events:none}
.story-panels{display:grid}
.story-panel.is-active{opacity:1;transform:none;visibility:visible;pointer-events:auto}
.story-panel h1,.story-panel h2{font-size:clamp(58px,5.65vw,104px);line-height:1.04;letter-spacing:-.068em;font-weight:500;max-width:850px}
.story-panel h1 span,.story-panel h2 span{color:#a1ccff}
.story-panel p{font-size:clamp(13px,1.05vw,17px);line-height:1.8;color:#d4e6f5;margin-top:26px;max-width:370px;letter-spacing:-.02em}
.story-copy .hero-actions{gap:26px;margin-top:30px;flex-direction:row;align-items:center}
.story-copy .button{font-size:12px;min-height:52px}
.story-copy .hero-explore{font-size:11px}
.scene-caption{position:absolute;right:5%;bottom:155px;color:#a1ccff;display:flex;align-items:center;gap:15px}
.scene-caption:before{content:'+';font-size:28px;font-weight:300}
.scene-caption .mono{font-size:8px;line-height:1.9;letter-spacing:.08em}
.scene-caption strong{display:block;color:#fff;font-weight:400}
.terrain-hero:not(.scene-ready) .scene-caption .mono{display:none}
.terrain-hero:not(.scene-ready) .scene-caption:after{content:'PAISAJE ILUSTRATIVO GENERADO CON IA';font-family:var(--mono);font-size:7px}
.story-footer{bottom:29px;border-top:1px solid #a1ccff38;padding-top:22px;gap:25px}
.story-footer .hero-experience{gap:16px;flex-shrink:0}
.story-footer .hero-experience strong{font-size:42px}
.story-footer .hero-experience>span{font-size:7px}
.story-steps{display:flex;gap:26px;align-items:center;margin-left:auto}
.story-step{color:#c1d5e7;border:0;border-top:1px solid #a1ccff42;background:none;display:flex;align-items:center;gap:12px;text-align:left;padding:14px 0 0;min-height:44px;font-size:12px;min-width:106px;position:relative;transition:color .25s}
.story-step:before{content:'';position:absolute;top:-1px;left:0;right:0;height:2px;background:#a1ccff;transform:scaleX(0);transform-origin:left;transition:transform .4s}
.story-step[aria-pressed=true]{color:white}
.story-step[aria-pressed=true]:before{transform:scaleX(1)}
.story-step .mono{font-size:9px;color:#a1ccff}
.story-scroll{font-size:8px;color:#b7d0e7;display:flex;align-items:center;gap:12px;margin-left:15px;white-space:nowrap}
.story-scroll svg{width:20px;height:20px}
.viewing-hero .whatsapp-float{visibility:hidden;opacity:0;pointer-events:none}
.clients-motion{padding-block:42px 34px;border-bottom:1px solid var(--line);overflow:hidden}
.clients-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px}
.clients-heading p{font-size:13px;line-height:1.7;color:var(--muted)}
.clients-heading strong{font-weight:600;color:var(--ink);margin-right:8px}
.clients-toggle{border:1px solid #d2ddec;border-radius:50%;width:38px;height:38px;flex-shrink:0;background:transparent;color:#003f72;display:grid;place-items:center;transition:background .2s}
.clients-toggle:hover{background:white}
.clients-toggle .pause-icon{width:8px;height:11px;border-inline:2px solid currentColor}
.clients-toggle[aria-pressed=true] .pause-icon{width:0;height:0;border:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:9px solid currentColor;margin-left:2px}
.clients-window{overflow-x:auto;scrollbar-width:thin;padding-block:12px;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.clients-track{display:flex;width:max-content}
.clients-group{display:flex;align-items:center;width:var(--client-cycle,1100px);flex:none;margin:0;padding:0;list-style:none}
.client-brand{display:flex;align-items:center;justify-content:center;width:25%;height:104px;border-right:1px solid #d9e3f2}
.client-brand svg{display:block;overflow:hidden;height:auto;max-height:78px}
.client-brand .logo-cbb{width:112px}
.client-brand .logo-madesal{width:165px}
.client-brand .logo-vanrom{width:60px}
.client-brand .logo-proingesa{width:179px}
.clients-running .clients-window{overflow:hidden}
.clients-running .clients-track{animation:clients-drift var(--client-duration,40s) linear infinite;will-change:transform}
.clients-running.is-paused .clients-track,.clients-running.is-offscreen .clients-track,.clients-running .clients-window:hover .clients-track{animation-play-state:paused}
@keyframes clients-drift{to{transform:translateX(-50%)}}
@media(min-width:1600px){.story-copy{left:max(70px,calc((100vw - 1490px)/2));top:18svh}.story-top,.story-footer{left:max(70px,calc((100vw - 1490px)/2));right:max(70px,calc((100vw - 1490px)/2))}}
@media(max-width:1100px){.story-panel h1,.story-panel h2{font-size:clamp(54px,6.7vw,73px)}.story-copy{top:145px;max-width:580px}.story-steps{gap:17px}.story-step{min-width:88px;font-size:11px}.story-scroll span{display:none}.hero-stage{left:21%}.scene-caption{bottom:145px}}
@media(max-width:760px){
 .hero-story{--header-height:72px;--hero-height:max(660px,calc(100svh - 80px));margin:0 6px}
 .hero-story.motion-enabled{height:calc(var(--hero-height) + 115svh)}
 .story-top{top:24px;left:22px;right:22px}.story-top .eyebrow{font-size:7px;letter-spacing:.055em;gap:9px}.story-top>.mono{display:none}
 .story-copy{top:77px;left:22px;right:22px;max-width:none}
 .story-panel h1,.story-panel h2{font-size:clamp(41px,9.3vw,64px);line-height:1.06}
 .story-panel p{font-size:12px;line-height:1.75;max-width:265px;margin-top:18px}
 .story-copy .hero-actions{margin-top:22px;gap:16px;align-items:center;flex-wrap:wrap}
 .story-copy .button{font-size:10px;min-height:44px;padding:11px 13px;gap:14px}.story-copy .button .icon{width:18px;height:18px}
 .story-copy .hero-explore{font-size:10px;gap:8px;padding-block:8px}
 .hero-stage{left:-9%;right:-20%;top:265px;bottom:68px}
 .terrain-hero:before{background:linear-gradient(180deg,#052b50 0%,#052b50b3 30%,transparent 61%,#052b50 98%)}
 .scene-caption{bottom:133px;right:22px}.scene-caption .mono{font-size:6px}.scene-caption:before{font-size:20px}
 .story-footer{left:22px;right:22px;bottom:20px;padding-top:12px;flex-wrap:wrap;gap:16px}
 .story-footer .hero-experience{display:none}
 .story-steps{margin:0;width:100%;gap:19px}.story-step{flex:1;min-width:0;gap:8px;font-size:11px;min-height:44px;padding-top:9px}
 .story-scroll{position:absolute;right:0;bottom:80px;margin:0}.story-scroll svg{width:17px;height:17px}.story-scroll span{display:none}
 .clients-motion{padding-block:30px 26px}.clients-heading{margin-bottom:12px}.clients-heading p{font-size:11px}.clients-heading strong{display:block}.clients-toggle{width:36px;height:36px}
 .client-brand{height:94px}.client-brand .logo-cbb{width:101px}.client-brand .logo-madesal{width:146px}.client-brand .logo-proingesa{width:158px}.client-brand .logo-vanrom{width:54px}
}
@media(max-width:360px){.story-copy{left:18px;right:18px}.story-panel h1,.story-panel h2{font-size:37px}.story-copy .hero-actions{gap:12px}.story-copy .hero-explore{font-size:9px}.story-copy .button{font-size:9px;gap:8px}.story-top,.story-footer{left:18px;right:18px}.story-step{font-size:10px}.story-steps{gap:13px}}
@media(max-height:750px) and (max-width:760px){.hero-story{--hero-height:max(570px,calc(100svh - 80px))}.story-copy{top:70px}.hero-stage{top:250px;bottom:62px}.scene-caption{bottom:110px}.story-footer{bottom:15px}.story-scroll{bottom:65px}}
@media(max-height:580px){.hero-story.motion-enabled{height:var(--hero-height)}.motion-enabled .terrain-hero{position:relative;top:0}}
@media(max-height:720px) and (min-width:761px){.story-copy{top:100px}.story-panel h1,.story-panel h2{font-size:64px}.story-panel p{margin-top:18px}.story-copy .hero-actions{margin-top:22px}}
@media(prefers-reduced-motion:reduce){
 .hero-story.motion-enabled{height:var(--hero-height)}.motion-enabled .terrain-hero{position:relative;top:0}
 .story-panel,.hero-fallback,.hero-stage,.story-step:before{transition:none}
 .clients-running .clients-track{animation:none;transform:none;will-change:auto}.clients-running .clients-window{overflow-x:auto}
 .clients-group[aria-hidden=true],.clients-toggle{display:none}
}