@font-face{font-family:Anton;src:url(../fonts/anton-400.woff2) format("woff2");font-weight:400;font-display:optional}
@font-face{font-family:Barlow;src:url(../fonts/barlow-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:Barlow;src:url(../fonts/barlow-600.woff2) format("woff2");font-weight:600;font-display:swap}
:root{--red:#e10600;--red-t:#ff4136;--ink:#0b0b0b;--ink2:#151515;--ink3:#222;--bone:#f4f1ea;--mute:#b8b4ab;--line:#2c2c2c;
--f-d:Anton,Impact,"Arial Narrow",sans-serif;--f-b:Barlow,system-ui,-apple-system,"Segoe UI",sans-serif;
--h1:clamp(3.2rem,11vw,9.5rem);--h2:clamp(2.4rem,6vw,5rem);--h3:clamp(1.4rem,2.4vw,2rem);--p:clamp(1rem,.95rem + .25vw,1.15rem)}
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;scroll-behavior:smooth;scroll-padding-top:76px}
body{margin:0;background:var(--ink);color:var(--bone);font:400 var(--p)/1.6 var(--f-b);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit}
:focus-visible{outline:3px solid #fff;outline-offset:3px}
.skip{position:absolute;left:-999px;top:0;background:#fff;color:#000;padding:.8rem 1rem;z-index:100}.skip:focus{left:0}
.wrap{width:min(1240px,100% - 2.5rem);margin-inline:auto}
.d{font-family:var(--f-d);font-weight:400;text-transform:uppercase;line-height:.92;letter-spacing:.01em;margin:0}
.kick{font:600 .85rem/1 var(--f-b);letter-spacing:.28em;text-transform:uppercase;color:var(--red-t);display:flex;align-items:center;gap:.8rem;margin:0 0 1.2rem}
.kick::before{content:"";width:2.5rem;height:3px;background:var(--red)}
/* grano industrial */
.grain{position:relative;isolation:isolate}
.grain::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.07;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
/* botones */
.btn{display:inline-flex;align-items:center;gap:.7rem;font:400 1.15rem/1 var(--f-d);text-transform:uppercase;letter-spacing:.08em;text-decoration:none;padding:1.05rem 1.7rem;border:3px solid #fff;background:var(--red);color:#fff;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));transition:transform .18s cubic-bezier(.2,.8,.2,1),background .18s;cursor:pointer;min-height:48px}
.btn:hover{transform:translateY(-3px);background:#ff1a0d}
.btn:active{transform:translateY(0) scale(.98)}
.btn.ghost{background:transparent}
.btn.ghost:hover{background:#fff;color:#000}
.btn.wa{background:#fff;color:#000;border-color:#fff}
/* header */
header.top{position:fixed;inset:0 0 auto 0;z-index:50;background:rgba(11,11,11,.88);backdrop-filter:blur(8px);border-bottom:3px solid var(--red)}
header.top .wrap{display:flex;align-items:center;justify-content:space-between;height:68px}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none}
.brand svg{height:56px;width:auto}
nav.main{display:flex;gap:1.6rem;align-items:center}
nav.main a{font:600 .9rem/1 var(--f-b);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;padding:.6rem 0;position:relative}
nav.main a:not(.btn)::after{content:"";position:absolute;left:0;bottom:.1rem;height:3px;width:0;background:var(--red);transition:width .25s}
nav.main a:not(.btn):hover::after{width:100%}
nav.main .btn{padding:.7rem 1.1rem;font-size:1rem}
.burger{display:none;background:none;border:3px solid #fff;color:#fff;font:400 1rem var(--f-d);letter-spacing:.1em;padding:.55rem .9rem;cursor:pointer;min-height:44px}
/* hero */
.hero{position:relative;min-height:100svh;display:grid;align-items:end;padding:120px 0 64px;overflow:hidden;background:
 radial-gradient(120% 80% at 85% 10%,rgba(225,6,0,.38),transparent 55%),linear-gradient(180deg,#0b0b0b,#111 70%,#0b0b0b)}
.hero .jet{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero .jet svg{width:100%;height:100%}
.jet line{stroke:#fff;stroke-linecap:round;stroke-dasharray:90 900;animation:jet 1.6s linear infinite}
.jet line:nth-child(3n){stroke:var(--red);stroke-width:5}
.jet line:nth-child(2n){animation-duration:2.1s;animation-delay:-.7s}
.jet line:nth-child(5n){animation-duration:1.2s;animation-delay:-.3s}
@keyframes jet{from{stroke-dashoffset:990}to{stroke-dashoffset:0}}
.hero .inner{position:relative;z-index:2}
.hero h1{font-size:clamp(3.6rem,11.2vw,10.5rem);line-height:.88;max-width:none}
.hero h1 em,.hero h1{text-shadow:0 4px 0 #000}.hero h1 .o{text-shadow:none}
.hero h1 em{font-style:normal;color:var(--red);-webkit-text-stroke:0}
.hero h1 .o{color:transparent;-webkit-text-stroke:3px #fff}
.hero h1 em{display:inline-block;transform:skewX(-6deg)}
.hero p.lead{max-width:44ch;font-size:clamp(1.1rem,1rem + .6vw,1.5rem);color:var(--bone);margin:1.6rem 0 2rem;border-left:5px solid var(--red);padding-left:1.1rem}
.cta-row{display:flex;flex-wrap:wrap;gap:1rem}
.hero .badge{position:absolute;right:max(1.25rem,calc((100vw - 1240px)/2));bottom:150px;z-index:4;width:clamp(130px,15vw,200px);transform:rotate(8deg);filter:drop-shadow(0 12px 0 rgba(0,0,0,.5))}
/* marquee */
.strip{background:var(--red);color:#fff;border-block:4px solid #000;overflow:hidden;white-space:nowrap;transform:rotate(-1.2deg);margin:-14px -10px 0;position:relative;z-index:5}
.strip .row{display:inline-flex;gap:2.4rem;padding:.9rem 0;font:400 1.5rem/1 var(--f-d);text-transform:uppercase;letter-spacing:.08em;animation:mq 28s linear infinite}
.strip span::after{content:"★";margin-left:2.4rem}
@keyframes mq{to{transform:translateX(-50%)}}
section{padding:clamp(4.5rem,9vw,8rem) 0;position:relative}
section h2{font-size:var(--h2);margin-bottom:1.2rem}
section h2 em{font-style:normal;color:var(--red)}
.sub{max-width:60ch;color:var(--mute);margin:0 0 3rem}
/* servicios */
.fam{display:grid;grid-template-columns:repeat(12,1fr);gap:1.2rem}.fam .card{grid-column:span 12}
@media(min-width:900px){.fam .card:nth-child(1){grid-column:span 7}.fam .card:nth-child(2){grid-column:span 5;margin-top:2.5rem}.fam .card:nth-child(3){grid-column:span 5}.fam .card:nth-child(4){grid-column:span 7;margin-top:2.5rem}.fam .card:nth-child(1) h3{font-size:clamp(2.4rem,4.4vw,3.8rem);max-width:10ch}.fam .card:nth-child(1) ul{grid-template-columns:1fr 1fr}.fam .card.big{grid-column:1/-1}}
.card{background:var(--ink2);border:2px solid var(--line);padding:2rem 1.6rem 1.8rem;position:relative;transition:transform .25s cubic-bezier(.2,.8,.2,1),border-color .25s,background .25s}
.card:hover{transform:translateY(-6px);border-color:var(--red);background:#1a1010}
.card .n{font:400 5rem/1 var(--f-d);color:transparent;-webkit-text-stroke:2px var(--red);position:absolute;right:1rem;top:.4rem;opacity:.9}
.card h3{font-size:var(--h3);margin:2.6rem 0 .8rem;max-width:14ch}
.card ul{list-style:none;margin:1rem 0 0;padding:0;display:grid;gap:.45rem}
.card li{padding-left:1.4rem;position:relative;color:#ddd}
.card li::before{content:"";position:absolute;left:0;top:.62em;width:.6rem;height:.6rem;background:var(--red);transform:rotate(45deg)}
.card.big{grid-column:1/-1;background:linear-gradient(100deg,#c40500,#e10600 55%,#9c0400);border-color:#fff}
.card.big:hover{background:linear-gradient(100deg,#d40600,#ff1a0d 55%,#a80400)}
.card.big li::before{background:#fff}.card.big li{color:#fff}
.card.big h3{max-width:none}
.card.big .n{-webkit-text-stroke-color:#000}
.card.big ul{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
/* antes/despues */
.ba{background:#000;border-block:4px solid var(--red)}
.cmp{position:relative;aspect-ratio:16/8;min-height:260px;overflow:hidden;border:4px solid #fff;user-select:none;touch-action:pan-y;--p:50%}
.cmp .layer{position:absolute;inset:0}
.cmp .after{background:
 repeating-linear-gradient(90deg,transparent 0 calc(25% - 6px),#f6d200 calc(25% - 6px) calc(25% - 0px),transparent 25%),
 linear-gradient(180deg,#b9b9b6,#cfcfcb)}
.cmp .after::before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .25 0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E")}
.cmp .before{clip-path:inset(0 calc(100% - var(--p)) 0 0);background:
 radial-gradient(40% 30% at 20% 70%,rgba(0,0,0,.65),transparent 70%),radial-gradient(30% 40% at 62% 30%,rgba(30,20,0,.7),transparent 70%),radial-gradient(35% 25% at 85% 80%,rgba(0,0,0,.6),transparent 70%),
 repeating-linear-gradient(90deg,transparent 0 calc(25% - 6px),#6e6320 calc(25% - 6px) calc(25% - 0px),transparent 25%),
 linear-gradient(180deg,#3a3835,#2a2927)}
.cmp .before::before{content:"";position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.55' numOctaves='4'/%3E%3CfeColorMatrix values='0 0 0 0 .1 0 0 0 0 .08 0 0 0 0 .05 0 0 0 .9 -.15'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)'/%3E%3C/svg%3E")}
.cmp .tag{position:absolute;top:1rem;font:400 1.3rem/1 var(--f-d);letter-spacing:.1em;padding:.5rem .9rem;background:#000;color:#fff;border:2px solid #fff;z-index:3}
.cmp .tag.l{left:1rem}.cmp .tag.r{right:1rem;background:var(--red)}
.cmp .handle{position:absolute;top:0;bottom:0;left:var(--p);width:6px;margin-left:-3px;background:#fff;z-index:4;pointer-events:none}
.cmp .handle::after{content:"◀ ▶";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--red);color:#fff;border:3px solid #fff;font:400 .95rem var(--f-d);letter-spacing:.2em;padding:.9rem .8rem;white-space:nowrap}
.cmp input[type=range]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:5;margin:0}
.cmp:focus-within .handle::after{outline:3px solid #fff;outline-offset:3px}
.note{font-size:.85rem;color:var(--mute);margin:.8rem 0 0}
/* motobombas */
.pump{display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
.pump .panel{background:var(--ink2);border:3px solid #fff;padding:2rem;position:relative}
.pump .panel::before{content:"ARRIENDO";position:absolute;top:-1.25rem;left:1.5rem;background:var(--red);color:#fff;font:400 1.3rem/1 var(--f-d);letter-spacing:.14em;padding:.5rem 1rem;border:3px solid #fff}
.opt{display:grid;gap:1px;background:var(--line);margin:1rem 0 1.4rem}
.opt div{background:var(--ink2);padding:1rem 1.1rem;display:flex;justify-content:space-between;gap:1rem;align-items:baseline}
.opt b{font:400 1.4rem/1 var(--f-d);text-transform:uppercase;letter-spacing:.04em}
.opt span{color:var(--mute);text-align:right}
.pump svg.mb{width:100%;height:auto;max-height:360px;color:var(--red)}
/* proceso */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:0;counter-reset:s;border:3px solid #fff}
.step{padding:2rem 1.5rem;border-right:3px solid #fff;position:relative;background:var(--ink2)}
.step:last-child{border-right:0}
.step::before{counter-increment:s;content:counter(s,decimal-leading-zero);font:400 4.2rem/1 var(--f-d);color:var(--red)}
.step h3{font-size:1.6rem;margin:.6rem 0}
.step p{margin:0;color:var(--mute)}
/* cobertura */
.cov{background:var(--bone);color:var(--ink);clip-path:polygon(0 3vw,100% 0,100% calc(100% - 3vw),0 100%);padding-block:clamp(6rem,11vw,10rem)}
.cov .kick{color:#b00500}.cov .kick::before{background:#b00500}
.cov h2 em{color:var(--red)}
.cov .sub{color:#444}
.chips{display:flex;flex-wrap:wrap;gap:.6rem;padding:0;list-style:none;margin:0}
.chips li{border:3px solid var(--ink);padding:.55rem 1rem;font:400 1.1rem/1 var(--f-d);text-transform:uppercase;letter-spacing:.06em}
.chips li.hot{background:var(--ink);color:#fff}
/* faq */
.faq{display:grid;gap:.8rem;max-width:900px}
details{background:var(--ink2);border:2px solid var(--line);transition:border-color .2s}
details[open]{border-color:var(--red)}
summary{cursor:pointer;list-style:none;padding:1.2rem 1.4rem;font:400 1.35rem/1.2 var(--f-d);text-transform:uppercase;letter-spacing:.03em;display:flex;justify-content:space-between;gap:1rem;min-height:48px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--red-t);font-size:1.8rem;line-height:1}
details[open] summary::after{content:"–"}
details p{margin:0;padding:0 1.4rem 1.3rem;color:#ddd}
/* cotizador */
.quote{background:linear-gradient(135deg,#8c0300,#e10600 50%,#5a0200);border-top:6px solid #000}
.qgrid{display:grid;grid-template-columns:.9fr 1.1fr;gap:3rem;align-items:start}
.quote h2 em{color:#000}
form.q{background:#0b0b0b;border:4px solid #fff;padding:clamp(1.3rem,3vw,2.2rem);display:grid;gap:1rem;grid-template-columns:1fr 1fr}
form.q .full{grid-column:1/-1}
form.q label{display:grid;gap:.4rem;font:600 .8rem/1 var(--f-b);letter-spacing:.18em;text-transform:uppercase}
form.q input,form.q select,form.q textarea{width:100%;font:400 1.05rem/1.3 var(--f-b);background:#181818;color:#fff;border:2px solid #444;padding:.85rem .9rem;min-height:48px;border-radius:0}
form.q input:focus,form.q select:focus,form.q textarea:focus{border-color:var(--red-t);outline:3px solid #fff}
form.q input[type=file]{padding:.6rem}
.hp{position:absolute;left:-9999px}
#qmsg{min-height:1.6em;font-weight:600}
#qmsg.ok{color:#7dffb0}#qmsg.err{color:#ffb3ad}
.contact-list{list-style:none;padding:0;margin:2rem 0 0;display:grid;gap:.7rem;font-weight:600}
/* footer */
footer{background:#000;border-top:6px solid var(--red);padding:3rem 0 2rem}
footer .wrap{display:grid;grid-template-columns:auto 1fr auto;gap:2rem;align-items:center}
footer svg{height:90px;width:auto}
footer small{color:var(--mute)}
footer .links{display:flex;gap:1.4rem;flex-wrap:wrap}
.dock{position:fixed;left:0;right:0;bottom:0;z-index:60;display:none;gap:.5rem;padding:.6rem .75rem calc(.6rem + env(safe-area-inset-bottom));background:#000;border-top:3px solid var(--red);transform:translateY(110%);transition:transform .25s}.dock.on{transform:none}.dock .btn{flex:1;justify-content:center;min-height:48px}
.reveal{opacity:0;transform:translateY(28px)}
.no-js .reveal{opacity:1;transform:none}
@media (max-width:900px){
 nav.main{position:fixed;inset:68px 0 auto 0;background:#0b0b0b;flex-direction:column;align-items:stretch;gap:0;padding:1rem 1.25rem 1.5rem;border-bottom:3px solid var(--red);transform:translateY(-130%);transition:transform .3s;visibility:hidden}
 nav.main.open{transform:none;visibility:visible}
 nav.main a{padding:1rem 0;border-bottom:1px solid var(--line);font-size:1.05rem}
 nav.main .btn{margin-top:1rem;justify-content:center}
 .burger{display:block}
 .pump,.qgrid{grid-template-columns:1fr}
 .hero .badge{display:none}
 .step{border-right:0;border-bottom:3px solid #fff}.step:last-child{border-bottom:0}
 footer .wrap{grid-template-columns:1fr}
 form.q{grid-template-columns:1fr}
 .dock{display:flex}body{padding-bottom:72px}
 .cmp{aspect-ratio:4/3}
}
@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation:none!important;transition:none!important}
 .reveal{opacity:1!important;transform:none!important}
}

/* fotos reales con tratamiento rojo/negro */
.hero .ph{position:absolute;top:0;right:0;bottom:0;width:56%;z-index:0;pointer-events:none;clip-path:polygon(24% 0,100% 0,100% 100%,0 100%);overflow:hidden;background:#000}
.hero .ph img{width:100%;height:112%;object-fit:cover;object-position:20% 50%;opacity:1;will-change:transform}
.hero .ph::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#0b0b0bcc,transparent 40%)}
.hero .vt{position:absolute;z-index:2;right:14px;bottom:110px;writing-mode:vertical-rl;font:400 .95rem var(--f-d);letter-spacing:.3em;text-transform:uppercase;color:#fff;text-shadow:0 0 6px #000}
.facts{list-style:none;margin:2.4rem auto 0;padding:0;position:relative;z-index:2;display:flex;flex-wrap:wrap;gap:0;width:min(1240px,100% - 2.5rem);border-top:3px solid #fff}
.facts li{flex:1 1 180px;padding:.9rem 1rem .4rem 0;font-size:.9rem;color:var(--mute);line-height:1.3}
.facts b{display:block;font:400 clamp(1.6rem,3vw,2.4rem)/1 var(--f-d);color:#fff;text-transform:uppercase;letter-spacing:.03em}
.tape{position:absolute;left:-2%;right:-2%;bottom:0;height:16px;z-index:3;background:repeating-linear-gradient(-45deg,#f6d200 0 18px,#0b0b0b 18px 36px);transform:rotate(-.6deg)}
.duo{display:grid;grid-template-columns:1.5fr 1fr;gap:1.2rem;align-items:start}
.duo figure,.mbph figure{margin:0;position:relative;border:4px solid #fff;overflow:hidden;background:#000}
.duo .sm{margin-top:3.5rem;transform:rotate(1.2deg);border-color:var(--red)}
.duo img,.mbph img{display:block;width:100%;height:auto}
.duo figcaption,.mbph figcaption{position:absolute;left:0;bottom:0;right:0;padding:2.2rem 1rem .8rem;background:linear-gradient(0deg,#000e,transparent);font-size:.9rem;color:#ddd}
.duo figcaption b,.mbph figcaption{font-family:var(--f-d);letter-spacing:.06em;text-transform:uppercase;color:#fff}
.duo figcaption b{display:block;font-size:1.25rem}
.mbph{display:grid;gap:1rem}.mbph figure:nth-child(2){width:78%;justify-self:end;margin-top:-3rem;border-color:var(--red)}
mark{background:#f6d200;color:#000;padding:0 .3em}
@media(max-width:700px){.duo{grid-template-columns:1fr}.duo .sm{margin-top:0;transform:none}.hero .ph{width:100%;height:46svh;bottom:auto;clip-path:polygon(0 0,100% 0,100% 100%,0 86%)}.hero .vt{display:none}.hero .ph img{height:100%}.hero h1{font-size:clamp(3.6rem,19vw,6rem)}.facts li{flex-basis:44%}.hero{padding-bottom:40px}}
.facts{background:#0b0b0bd9}.facts li{color:#d8d4cb}.facts mark{display:inline-block;line-height:1.1}.hero .kick{text-shadow:0 0 8px #000,0 0 3px #000}

/* ficha técnica motobombas */
.specs{margin-top:3.5rem}
.tbl{border:3px solid #fff;background:var(--ink2)}
.tr{display:grid;grid-template-columns:1.2fr 1fr .8fr 1fr 2fr;gap:1rem;padding:.9rem 1.1rem;border-top:1px solid var(--line);align-items:baseline}
.tr:first-child{border-top:0}
.tr b{font:400 1.5rem/1 var(--f-d);text-transform:uppercase;letter-spacing:.04em}
.tr span:nth-child(2){font:400 1.35rem/1 var(--f-d);color:var(--red);letter-spacing:.03em}
.tr.th{background:#fff;color:#000;font:400 .95rem/1 var(--f-d);letter-spacing:.14em;text-transform:uppercase}
.tr.th span:nth-child(2){color:#000;font:inherit}
@media(max-width:700px){.tr.th{display:none}.tr{grid-template-columns:1fr 1fr;gap:.3rem 1rem}.tr b{grid-column:1/-1}.tr span:last-child{grid-column:1/-1;color:var(--mute)}}
@media(max-width:1200px){.hero .badge{display:none}}

/* móvil iter 5: etiquetas en la ficha, kicker sin cortes */
@media(max-width:700px){
 .tr span:nth-child(3)::before{content:"Descarga ";color:var(--mute);font:600 .7rem var(--f-b);letter-spacing:.14em;text-transform:uppercase}
 .tr span:nth-child(4)::before{content:"Motor ";color:var(--mute);font:600 .7rem var(--f-b);letter-spacing:.14em;text-transform:uppercase}
 .hero .kick{letter-spacing:.16em;font-size:.78rem;line-height:1.3}
 .hero .kick::before{width:1.5rem;flex:none}
}

h2.d{--j:1;position:relative}h2.d::after{content:"";display:block;width:5.5rem;height:5px;margin-top:.7rem;background:var(--red,#e30613);transform:scaleX(var(--j));transform-origin:left}
