.hero2{position:relative;overflow:hidden;background:var(--bk)}.slides{display:grid}
.slide{grid-area:1/1;position:relative;min-height:clamp(580px,88vh,790px);display:flex;align-items:center;padding:130px 0 125px;overflow:hidden;opacity:0;visibility:hidden;transition:opacity .9s var(--ease),visibility 0s .9s}
.slide.on{opacity:1;visibility:visible;transition-delay:0s;z-index:1}
.slide .hero-in{animation:none;opacity:0}.slide.on .hero-in{animation:rise .9s var(--ease) both}
.hbg{position:absolute;inset:-60px 0 0 auto;width:64%;overflow:hidden;transform:translate3d(0,var(--py,0px),0);animation:fadein 1.6s var(--ease) backwards}
.hbg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center}
.slide.on .hbg img{animation:zoom 14s ease-out forwards}
.hbg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--bk) 0,rgba(10,10,10,.6) 28%,transparent 65%),linear-gradient(0deg,var(--bk),transparent 22%)}
@keyframes zoom{to{transform:scale(1.07)}}
.hero2 .wrap{position:relative;z-index:2}
.hero2 .in-c{max-width:560px}
.hero2 .eyebrow{font-size:.8rem;margin-bottom:1.3rem}
.hero2 .t{font-size:clamp(2.7rem,6vw,4.7rem);line-height:.98;margin-bottom:1.6rem}
.hero2 .t .y{display:block}
.hero2 .lead{font-size:1.08rem;color:#e2e2e2;max-width:46ch;margin-bottom:2rem}
.btn-o{display:inline-flex;align-items:center;gap:.9rem;border:2px solid var(--yl);color:var(--yl);padding:1rem 1.5rem;font:600 1.05rem/1 var(--bd);transition:background .25s,color .25s,transform .25s var(--ease)}
.btn-o svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s var(--ease)}
.btn-o:hover{background:var(--yl);color:var(--bk);transform:translateY(-2px)}.btn-o:hover svg:last-child{transform:translateX(5px)}
.btn-w{border-color:#fff;color:#fff}.btn-w:hover{background:#fff;color:var(--bk)}
.btn-s{background:var(--yl);color:var(--bk)}.btn-s:hover{background:#fff}
.hctrl{position:absolute;left:0;right:0;bottom:26px;z-index:5}.hctrl .wrap{display:flex;justify-content:space-between;align-items:center}
.dots2{display:flex;gap:.6rem}.dots2 button{background:none;border:0;padding:.9rem 0;cursor:pointer}
.hb{display:flex;gap:.6rem}.hb .arr{width:44px;height:44px}
.dots2 i{display:block;width:32px;height:4px;background:#555;position:relative;overflow:hidden;transition:background .3s}.dots2 button:hover i{background:#888}
.dots2 .on i::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left;animation:fillbar 4s linear forwards}
.hero2.paused .dots2 .on i::after{animation-play-state:paused}
.strip.s5 .wrap{grid-template-columns:repeat(5,1fr)}
.sec{padding:clamp(3rem,6vw,4.6rem) 0}
.sh{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem 3rem;flex-wrap:wrap;margin-bottom:2rem}
.sh h2{font-size:clamp(2rem,4.2vw,3rem);line-height:1}
.sh p{max-width:46ch;color:var(--g2);font-size:.98rem}
.link{display:inline-flex;gap:.6rem;align-items:center;color:var(--yl);font-weight:600;white-space:nowrap}
.link svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s var(--ease)}.link:hover svg{transform:translateX(6px)}
.track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:.8rem .2rem 1rem;margin-inline:-.2rem;overscroll-behavior-x:contain}
.track::-webkit-scrollbar{display:none}
.eq{flex:0 0 min(250px,72%);scroll-snap-align:start;position:relative;height:210px;border:1px solid #2a2a2a;background:#0f0f0f;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:1rem;transition:transform .35s var(--ease),border-color .35s,box-shadow .35s}
.eq>img,.eq>i{position:absolute;inset:0 0 auto 0;width:100%;height:75%;object-fit:cover;transition:transform .6s var(--ease)}
.eq::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,#0b0b0b 22%,transparent 70%)}
.eq:hover{transform:translateY(-6px);border-color:var(--yl);box-shadow:0 18px 36px -18px rgba(255,214,0,.4)}.eq:hover>img,.eq:hover>i{transform:scale(1.08)}
.eq div{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:.6rem;font-weight:500;line-height:1.25}
.go{flex:none;width:40px;height:40px;border-radius:50%;background:var(--yl);display:grid;place-items:center;transition:transform .3s var(--ease)}
.go svg{width:20px;height:20px;stroke:var(--bk);fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.eq:hover .go{transform:scale(1.15) rotate(-45deg)}
.ctrl{display:flex;align-items:center;gap:1.1rem;margin-top:.6rem}
.arr{width:48px;height:48px;border:2px solid var(--yl);background:transparent;cursor:pointer;display:grid;place-items:center;flex:none;transition:background .25s,transform .25s var(--ease)}
.arr svg{width:22px;height:22px;stroke:var(--yl);fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.arr:hover{background:var(--yl);transform:scale(1.06)}.arr:hover svg{stroke:var(--bk)}
.pg{flex:1;height:4px;background:var(--g1);position:relative;overflow:hidden}
.pg i{position:absolute;left:0;top:0;height:100%;width:0;background:var(--yl);transition:width .35s}
.brands{border-block:1px solid #1d1d1d;padding:1.6rem 0 1.8rem;background:#0b0b0b}
.brands .eyebrow{font-size:.78rem;margin-bottom:1rem}
.bl{display:flex;justify-content:space-between;align-items:center;gap:1.4rem 2rem;flex-wrap:wrap}
.bl img{height:34px;width:auto;opacity:.82;transition:opacity .3s,transform .3s var(--ease)}.bl img:hover{opacity:1;transform:scale(1.07)}
.why{display:grid;grid-template-columns:.9fr 1.35fr;background:#0d0d0d;border-bottom:1px solid #1d1d1d}
.why .ph{position:relative;min-height:290px;background:url(../assets/images/porque.jpg) center/cover;overflow:hidden}
.why .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,#0d0d0d)}
.why .bd{display:grid;grid-template-columns:1.25fr 1fr;gap:2rem;align-items:center;padding:2.6rem clamp(1.5rem,4vw,3rem)}
.why h2{font-size:clamp(1.8rem,3.4vw,2.5rem);margin-bottom:1.1rem}
.why p{color:var(--g2);font-size:.98rem;margin-bottom:1.4rem}
.chk{list-style:none;margin:0;padding:0 0 0 2rem;border-left:1px solid #2a2a2a;display:grid;gap:1.1rem}
.chk li{display:flex;gap:1rem;align-items:center;line-height:1.3;color:var(--g2)}.chk b{display:block;color:var(--wh);font-weight:500}
.chk svg{flex:none;width:40px;height:40px;stroke:var(--yl);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .4s var(--ease)}.chk li:hover svg{transform:scale(1.15) rotate(-8deg)}
.sol{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
.sc{position:relative;height:150px;border:1px solid #2a2a2a;overflow:hidden;display:flex;align-items:flex-end;padding:1rem;transition:transform .35s var(--ease),border-color .35s}
.sc>img{position:absolute;inset:0 0 auto 0;width:100%;height:80%;object-fit:cover;transition:transform .6s var(--ease)}
.sc::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,#090909 30%,rgba(9,9,9,.35))}
.sc:hover{transform:translateY(-6px);border-color:var(--yl)}.sc:hover>img{transform:scale(1.1)}
.sc div{position:relative;z-index:2;display:flex;align-items:center;gap:.9rem;font-weight:500;font-size:.95rem;line-height:1.25}
.sc svg{flex:none;width:36px;height:36px;stroke:var(--yl);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.cta{position:relative;overflow:hidden;border-top:1px solid #1d1d1d;padding:clamp(3rem,6vw,4.4rem) 0;background:var(--bk)}
.cbg{position:absolute;inset:0 0 0 auto;width:62%;background:url(../assets/images/cta.jpg) right center/cover;animation:zoom 22s ease-in-out infinite alternate}
.cta::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--bk) 30%,rgba(10,10,10,.5) 62%,transparent)}
.cta .wrap{position:relative;z-index:2}
.cta h2{font-size:clamp(2.1rem,4.6vw,3.2rem);margin-bottom:1rem}.cta h2 .y{display:block}
.cta p{color:#d6d6d6;font-size:1.12rem;max-width:30ch;margin-bottom:1.6rem}
.cta .row{display:flex;gap:1rem;flex-wrap:wrap}
@media (max-width:1060px){.why{grid-template-columns:1fr}.why .ph{min-height:240px}.why .ph::after{background:linear-gradient(0deg,#0d0d0d,transparent 50%)}.sol{grid-template-columns:1fr 1fr}}
@media (max-width:980px){.strip.s5 .wrap{grid-template-columns:repeat(3,1fr)}.strip.s5 .sf{border-left:0}.hbg{width:100%;opacity:.55}.hbg::after{background:linear-gradient(90deg,var(--bk) 0,rgba(10,10,10,.5)),linear-gradient(0deg,var(--bk),transparent 30%)}}
@media (max-width:700px){.strip.s5 .wrap{grid-template-columns:1fr 1fr}.why .bd{grid-template-columns:1fr}.chk{border-left:0;padding:1.4rem 0 0;border-top:1px solid #2a2a2a}.sol{grid-template-columns:1fr}.cbg{width:100%;opacity:.5}.slide{padding-top:110px}.bl{justify-content:center}.arr{display:none}}

/* ===== animación extra (moderada) ===== */
@keyframes fadein{from{opacity:0}}
.hbg::before{content:"";position:absolute;z-index:1;top:-20%;bottom:-20%;left:0;width:70px;background:linear-gradient(90deg,transparent,rgba(255,214,0,.3),transparent);transform:translateX(-120px) skewX(-20deg);animation:streak 8s 1.5s ease-in-out infinite}
@keyframes streak{0%{transform:translateX(-120px) skewX(-20deg)}40%,100%{transform:translateX(70vw) skewX(-20deg)}}
@keyframes fillbar{to{transform:scaleX(1)}}
.stg>*{opacity:0}
.stg.in>*{opacity:1;animation:pop .85s var(--ease) backwards;animation-delay:calc(var(--k)*100ms)}
.stg.r.in>*{animation-name:popr}
@keyframes pop{from{opacity:0;transform:translateY(34px) scale(.96)}}
@keyframes popr{from{opacity:0;transform:translateX(34px)}}
@keyframes bounce{0%{transform:scale(.6)}60%{transform:scale(1.15)}100%{transform:scale(1)}}
.stg.in .sf svg{animation:bounce .9s calc(var(--k)*100ms + .3s) var(--ease) backwards}
.stg.draw svg *{stroke-dasharray:240;stroke-dashoffset:240;transition:stroke-dashoffset 1.5s calc(var(--k)*100ms + .3s) var(--ease)}
.stg.draw.in svg *{stroke-dashoffset:0}
.sf:hover svg{transform:rotate(-8deg) scale(1.1);transition:transform .35s var(--ease)}
.go svg{animation:nudge 2.4s ease-in-out infinite}
@keyframes nudge{50%{transform:translateX(3px)}}
.btn-w{position:relative}
.btn-w::after{content:"";position:absolute;inset:-2px;border:2px solid #fff;opacity:0;pointer-events:none;animation:ring 3.2s ease-out infinite}
@keyframes ring{0%{opacity:.55;transform:scale(1)}70%,100%{opacity:0;transform:scale(1.1,1.4)}}

.eq i.ill{display:grid;place-items:center;background:radial-gradient(circle at 50% 55%,#2d2d2d,#111)}.eq i.ill svg{width:62%;margin-top:-6px}