/* JEM Electromecánica · versión sobria: fotografía real + dibujo técnico. Un solo acento (naranja de marca). */
:root{--bg:#0d0f11;--panel:#14171a;--panel2:#1b1f23;--line:#ffffff24;--bone:#eeece7;--ink:#0d0f11;--or:#ee6a1f;--mut:#9aa2a9;--mutd:#58606a;
  --display:"Barlow Condensed",system-ui,sans-serif;--body:"Barlow",system-ui,sans-serif;--ease:cubic-bezier(.23,1,.32,1);--eio:cubic-bezier(.77,0,.175,1)}
*{box-sizing:border-box;margin:0;padding:0}
html{overflow-x:clip}
body{font:400 18px/1.6 var(--body);background:var(--bg);color:#fff}
body.protect{-webkit-user-select:none;user-select:none}
img,svg,canvas{-webkit-user-drag:none}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--or);outline-offset:3px}
.wrap{max-width:1320px;margin:auto;padding:0 32px}
h1,h2,h3{font-family:var(--display);font-weight:700;text-transform:uppercase;line-height:.96;letter-spacing:.015em}
h2{font-size:clamp(40px,5.2vw,78px)}
.eb{display:flex;align-items:center;gap:14px;font:600 13px var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--or);margin-bottom:22px}
.eb::before{content:"";width:34px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform 1s var(--ease)}
.in .eb::before,.hero.go .eb::before{transform:scaleX(1)}
.ln{display:block;overflow:hidden;padding:.03em 0 .07em}
.ln>span{display:block;transform:translateY(105%);transition:transform 1s var(--ease);transition-delay:calc(var(--i,0)*90ms)}
.in .ln>span,.hero.go .ln>span{transform:none}
.rv{opacity:0;transform:translateY(22px);transition:opacity .9s var(--ease),transform .9s var(--ease);transition-delay:var(--d,0s)}
.in .rv,.hero.go .rv{opacity:1;transform:none}
.btn{display:inline-flex;align-items:center;gap:12px;padding:17px 30px;background:var(--or);color:#fff;border:1px solid var(--or);border-radius:2px;font:600 14px var(--body);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;transition:background-color .25s,border-color .25s,color .25s,transform .16s var(--ease)}
.btn:active{transform:scale(.98)}
.btn.ghost{background:transparent;border-color:#ffffff66}
@media (hover:hover) and (pointer:fine){.btn:hover{background:#fff;border-color:#fff;color:var(--ink)}.btn.ghost:hover{background:#fff;color:var(--ink)}}

.topbar{border-bottom:1px solid var(--line);color:var(--mut);font:500 13px var(--body);letter-spacing:.04em;padding:9px 0}
.topbar .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.nav{position:sticky;top:0;z-index:50;background:#0d0f11e6;backdrop-filter:blur(12px);border-bottom:1px solid var(--line);transition:transform .45s var(--ease)}
.nav.hide{transform:translateY(-100%)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:28px;height:78px}
.brand img{height:50px;width:auto;border-radius:2px}
.nav ul{display:flex;gap:34px;list-style:none;font:500 14px var(--body);letter-spacing:.16em;text-transform:uppercase}
.nav ul a{position:relative;padding:6px 0;color:#d7dce0;white-space:nowrap}
.nav ul a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--or);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
@media (hover:hover) and (pointer:fine){.nav ul a:hover{color:#fff}.nav ul a:hover::after{transform:scaleX(1)}}
.nav .btn{padding:13px 22px;font-size:13px}

/* Hero */
.hero{position:relative;overflow:hidden;background:var(--bg)}
.hgrid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:50px;align-items:center;padding-top:60px;padding-bottom:70px;min-height:min(780px,calc(100svh - 150px))}
.hero h1{font-size:clamp(46px,5.6vw,96px);line-height:.94}
.hero .lead{margin:26px 0 34px;max-width:30em;color:#c3c9ce;font-size:19px}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.hphoto{position:relative;aspect-ratio:4/3;margin-right:-32px;overflow:hidden;clip-path:inset(0 0 0 0)}
.hphoto img{width:100%;height:100%;object-fit:cover;transform:scale(1.18);transition:transform 2.6s var(--ease);animation:kb 22s ease-in-out 2.6s infinite alternate}
.hero.go .hphoto img{transform:scale(1.04)}
.hphoto::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0d0f11 0,transparent 22%),linear-gradient(0deg,#0d0f1199,transparent 40%);pointer-events:none}
@keyframes kb{from{transform:scale(1.04)}to{transform:scale(1.11) translate(-1.2%,-.8%)}}
.hphoto svg{position:absolute;inset:0;width:100%;height:100%;z-index:2}
.hphoto svg line{stroke:#fff;stroke-width:1;vector-effect:non-scaling-stroke;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .9s var(--ease);transition-delay:calc(1.6s + var(--k)*.45s)}
.hero.go .hphoto svg line{stroke-dashoffset:0}
.co{position:absolute;z-index:3;transform:translate(-50%,-50%)}
.co i{display:block;width:12px;height:12px;border-radius:50%;background:var(--or);box-shadow:0 0 0 0 #ee6a1f99;opacity:0;transition:opacity .4s calc(1.5s + var(--k)*.45s);animation:pulse 2.4s ease-out infinite}
.hero.go .co i{opacity:1}
@keyframes pulse{0%{box-shadow:0 0 0 0 #ee6a1faa}100%{box-shadow:0 0 0 16px #ee6a1f00}}
.cl{position:absolute;z-index:3;font:600 12px var(--body);letter-spacing:.14em;text-transform:uppercase;color:#fff;background:#0d0f11d9;border-left:2px solid var(--or);padding:6px 10px;opacity:0;transform:translateY(6px);transition:opacity .6s,transform .6s var(--ease);transition-delay:calc(1.9s + var(--k)*.45s);white-space:nowrap}
.hero.go .cl{opacity:1;transform:none}
.htag{position:absolute;z-index:3;right:5%;top:6%;background:var(--or);font:600 13px var(--body);letter-spacing:.18em;text-transform:uppercase;padding:9px 14px}
.stats{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);background:var(--panel)}
.stats div{padding:26px 32px;border-right:1px solid var(--line)}
.stats div:last-child{border:0}
.stats b{display:block;font:700 clamp(32px,3.4vw,48px) var(--display);color:var(--or);line-height:1;letter-spacing:.02em}
.stats span{font:500 12px var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--mut)}

/* Sectores */
.sect{border-bottom:1px solid var(--line);overflow:hidden;padding:20px 0;background:var(--bg)}
.sect .track{display:flex;width:max-content;will-change:transform}
.sect span{font:500 15px var(--body);letter-spacing:.3em;text-transform:uppercase;color:#aab1b8;padding:0 30px;white-space:nowrap}
.sect span::after{content:"";display:inline-block;width:6px;height:6px;margin-left:60px;background:var(--or);transform:rotate(45deg);vertical-align:middle}

.sec{padding:130px 0}
.sec.light{background:var(--bone);color:var(--ink)}
.sec.light .eb{color:#c4510f}

/* Nosotros */
.ngrid{display:grid;grid-template-columns:5fr 6fr;gap:80px;align-items:center}
.nphoto{position:relative;aspect-ratio:4/5;overflow:hidden;clip-path:inset(0 0 100% 0);transition:clip-path 1.4s var(--eio)}
.in .nphoto{clip-path:inset(0)}
.nphoto img{width:100%;height:100%;object-fit:cover;transform:scale(1.25);transition:transform 2.2s var(--ease)}
.in .nphoto img{transform:scale(1)}
.nphoto figcaption{position:absolute;left:0;bottom:0;background:var(--or);color:#fff;font:600 12px var(--body);letter-spacing:.18em;text-transform:uppercase;padding:10px 16px}
.ntext p{color:#444b52;margin:26px 0 0;max-width:34em;font-size:19px}
.mv{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:40px;border-top:1px solid #0d0f1f33}
.mv div{padding:24px 28px 0 0}
.mv div+div{padding-left:28px;border-left:1px solid #0d0f1f33}
.mv h3{font-size:26px;margin-bottom:8px;color:#c4510f}
.mv p{margin:0;font-size:17px}
.nums{display:grid;grid-template-columns:repeat(4,1fr);margin-top:60px;border-top:1px solid #0d0f1f33}
.nums div{padding:22px 20px 0 0}
.nums b{display:block;font:700 clamp(46px,5vw,76px) var(--display);line-height:1;letter-spacing:.01em}
.nums span{font:500 12px var(--body);letter-spacing:.18em;text-transform:uppercase;color:#59616a}

/* Servicios */
.svc{background:var(--panel)}
.shead{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:60px}
.shead p{max-width:28em;color:var(--mut)}
.sgrid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:start}
.slist{border-top:1px solid var(--line)}
.sitem{border-bottom:1px solid var(--line)}
.sitem>button{all:unset;box-sizing:border-box;width:100%;display:flex;align-items:center;gap:18px;padding:26px 0;cursor:pointer;color:#7b848c;transition:color .3s}
.sitem>button:focus-visible{outline:2px solid var(--or);outline-offset:2px}
.sitem strong{flex:1;font:700 clamp(28px,3.2vw,46px) var(--display);text-transform:uppercase;letter-spacing:.015em;line-height:1}
.sitem em{font:500 12px var(--body);font-style:normal;letter-spacing:.18em;text-transform:uppercase;color:inherit;opacity:.8}
.sitem .bar{flex:none;width:34px;height:2px;background:currentColor;transition:width .5s var(--ease),background-color .3s}
.sitem.on>button{color:#fff}.sitem.on .bar{width:70px;background:var(--or)}
.sbody{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease)}
.sitem.on .sbody{grid-template-rows:1fr}
.sbody>div{overflow:hidden}
.sbody p{color:#b5bcc2;max-width:32em;padding:0 0 10px}
.sbody .btn{margin:18px 0 30px}
.sfig{position:sticky;top:104px;aspect-ratio:5/4;background:var(--bg);overflow:hidden}
.sfig>div{position:absolute;inset:0;opacity:0;clip-path:inset(0 0 0 100%);transition:clip-path 1s var(--eio),opacity .6s}
.sfig>div.on{opacity:1;clip-path:inset(0)}
.sfig img{width:100%;height:100%;object-fit:cover;transform:scale(1.12);transition:transform 6s linear}
.sfig>div.on img{transform:scale(1.02)}
.sfig .cap{position:absolute;left:0;bottom:0;background:#0d0f11e0;border-left:3px solid var(--or);padding:12px 18px;font:600 13px var(--body);letter-spacing:.18em;text-transform:uppercase}
.sfig .tech{display:grid;place-items:center;background:radial-gradient(60% 60% at 50% 50%,#1d2227,#0d0f11)}
.sfig .tech svg{width:78%;height:auto}

/* Dibujo técnico: líneas finas que se dibujan */
.tk{fill:none;stroke:#fff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.tk.o{stroke:var(--or)}.tk.m{stroke:#ffffff66}
.on .tk,.vis .tk{animation:dr 7s var(--eio) infinite}
@keyframes dr{0%{stroke-dashoffset:1}35%,88%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}
.tt{font:600 7px var(--body);letter-spacing:.14em;fill:var(--or);text-transform:uppercase}
.light .tk{stroke:var(--ink)}

/* Proceso */
.proc{background:var(--bg)}
.pgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:64px}
.stn{position:relative;aspect-ratio:3/4;overflow:hidden;background:var(--panel)}
.stn img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(1) brightness(.5);transform:scale(1.06);transition:filter 1s var(--ease),transform 5s linear}
.stn::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0d0f11f0,transparent 62%)}
.stn.on img{filter:none;transform:scale(1.14)}
.stn .tech{position:absolute;inset:0;display:grid;place-items:center;background:radial-gradient(60% 60% at 50% 45%,#1d2227,#0d0f11)}
.stn .tech svg{width:84%;margin-top:-18%}
.stn figcaption{position:absolute;z-index:2;left:22px;right:22px;bottom:22px}
.stn h3{font-size:clamp(24px,2.3vw,32px);margin-bottom:6px}
.stn p{font-size:15px;color:#b7bec4;line-height:1.45;max-height:0;opacity:0;overflow:hidden;transition:max-height .7s var(--ease),opacity .7s}
.stn.on p{max-height:140px;opacity:1}
.stn .k{position:absolute;z-index:2;left:22px;top:20px;font:600 12px var(--body);letter-spacing:.2em;color:#fff;text-transform:uppercase}
.stn .pb{position:absolute;z-index:3;left:0;bottom:0;height:3px;width:100%;background:var(--or);transform:scaleX(0);transform-origin:left}
.stn.on .pb{animation:fillb var(--dur,3.2s) linear forwards}
@keyframes fillb{to{transform:scaleX(1)}}

/* Calidad */
.ql{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px;align-items:center}
.seal{position:relative;width:min(100%,440px);aspect-ratio:1;margin:auto}
.seal svg{width:100%;height:100%;overflow:visible}
.seal .ring{transform-origin:50% 50%;animation:spin 40s linear infinite}
.seal text.r{font:600 15px var(--body);letter-spacing:.4em;fill:var(--ink);text-transform:uppercase}
@keyframes spin{to{transform:rotate(360deg)}}
.seal .ck{stroke-dasharray:90;stroke-dashoffset:90}
.in .seal .ck{animation:ck 5s ease-in-out infinite}
@keyframes ck{0%,10%{stroke-dashoffset:90}40%,88%{stroke-dashoffset:0}100%{stroke-dashoffset:90}}
.pil{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:44px;border-top:1px solid #0d0f1f33}
.pil div{padding:26px 28px 26px 0;border-bottom:1px solid #0d0f1f33;position:relative}
.pil div:nth-child(even){padding-left:28px;border-left:1px solid #0d0f1f33}
.pil div::after{content:"";position:absolute;left:0;top:-1px;height:2px;width:46px;background:var(--or)}
.pil h3{font-size:clamp(24px,2.3vw,32px);margin-bottom:8px}
.pil p{color:#444b52;font-size:17px}

/* Mapa */
.map{background:#090b0c;overflow:hidden}
.mgrid{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;align-items:center}
.cnt{margin-top:30px;font:500 13px var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--mut)}
.cnt b{display:block;font:700 clamp(84px,10vw,150px) var(--display);color:var(--or);letter-spacing:0;line-height:.9}
.mapsvg{width:min(100%,640px);margin:auto;display:block;overflow:visible}
.mapsvg .dot{fill:#7b858d;animation:dotp 3.6s ease-in-out infinite;animation-delay:var(--d)}
@keyframes dotp{0%,100%{opacity:.16}50%{opacity:.62}}
.mapsvg .rt{fill:none;stroke:var(--or);stroke-width:1.5;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s var(--ease)}
.mapsvg .pt circle.p{fill:var(--or);transform-box:fill-box;transform-origin:center;transform:scale(0);transition:transform .5s var(--ease) .7s}
.mapsvg .pt text{font:600 14px var(--body);fill:#e6e9ec;letter-spacing:.14em;opacity:0;transition:opacity .4s .8s;text-transform:uppercase}
.mapsvg .on .rt{stroke-dashoffset:0}.mapsvg .on circle.p{transform:scale(1)}.mapsvg .on text{opacity:1}
.mapsvg .hq .pp{fill:none;stroke:var(--or);transform-box:fill-box;transform-origin:center;animation:ping 2.6s ease-out infinite}
@keyframes ping{from{transform:scale(1);opacity:.8}to{transform:scale(5);opacity:0}}
.mapsvg .hq text{font:700 14px var(--body);fill:#fff;letter-spacing:.16em}
.mapsvg .tr{fill:#fff;opacity:0}
.mapsvg .on .tr{opacity:1;animation:ride 3.6s ease-in-out infinite;animation-delay:var(--d2)}
@keyframes ride{from{offset-distance:0%}to{offset-distance:100%}}

/* Cotizador */
.quote{background:var(--panel)}
.qgrid{display:grid;grid-template-columns:1.05fr .95fr;gap:80px;align-items:center}
.qform{display:grid;gap:30px}
.quote .sub{color:var(--mut);margin-top:18px;max-width:30em}
fieldset{border:0}
legend{font:600 12px var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--mut);margin-bottom:14px;padding:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{cursor:pointer}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips span{display:inline-block;padding:12px 18px;border:1px solid #ffffff3d;border-radius:2px;font:500 15px var(--body);letter-spacing:.06em;transition:background-color .2s,border-color .2s,color .2s}
.chips input:checked+span{background:var(--or);border-color:var(--or);color:#fff}
.chips input:focus-visible+span{outline:2px solid #fff;outline-offset:2px}
@media (hover:hover) and (pointer:fine){.chips span:hover{border-color:#fff}}
.qcap label{display:flex;justify-content:space-between;align-items:baseline;font:600 12px var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--mut);margin-bottom:14px}
.qcap b{font:700 28px var(--display);letter-spacing:.02em;color:#fff}
.qcap input{width:100%;appearance:none;-webkit-appearance:none;height:2px;background:#ffffff40;cursor:grab}
.qcap input::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;background:var(--or);border:0;border-radius:50%;cursor:grab}
.qcap input::-moz-range-thumb{width:20px;height:20px;background:var(--or);border:0;border-radius:50%;cursor:grab}
.qout{border:1px solid var(--line);padding:26px;background:var(--bg)}
.qout p{color:#c8ced3;margin-bottom:20px;min-height:3.2em}
.qbtns{display:flex;gap:10px;flex-wrap:wrap}
.qviz{aspect-ratio:1;border:1px solid var(--line);background:radial-gradient(60% 60% at 50% 50%,#1d2227,#0d0f11);display:grid;place-items:center;position:relative;overflow:hidden}
.qviz svg{width:84%;height:auto;transition:transform .7s var(--ease)}
.qviz .tag2{position:absolute;left:18px;bottom:16px;font:600 12px var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--or)}

/* FAQ */
.fgrid{display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}
.qa{border-top:1px solid #0d0f1f40}.qa:last-child{border-bottom:1px solid #0d0f1f40}
.qa button{all:unset;box-sizing:border-box;width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 0;cursor:pointer;font:700 clamp(22px,2.4vw,32px) var(--display);text-transform:uppercase;letter-spacing:.015em;line-height:1.1}
.qa button:focus-visible{outline:2px solid #c4510f;outline-offset:2px}
.qa i{flex:none;position:relative;width:26px;height:26px}
.qa i::before,.qa i::after{content:"";position:absolute;left:3px;right:3px;top:12px;height:2px;background:currentColor;transition:transform .45s var(--ease)}
.qa i::after{transform:rotate(90deg)}
.qa.open i::after{transform:rotate(0)}.qa.open button{color:#c4510f}
.ans{display:grid;grid-template-rows:0fr;transition:grid-template-rows .55s var(--ease)}
.ans>div{overflow:hidden}.ans p{padding:0 50px 28px 0;color:#444b52;max-width:36em}
.qa.open .ans{grid-template-rows:1fr}

/* Final */
.fin{position:relative;overflow:hidden;min-height:92svh;display:grid;place-items:center;text-align:center;padding:100px 0;background:linear-gradient(180deg,var(--bg),#241208 90%)}
.fin canvas{position:absolute;inset:0;width:100%;height:100%}
.fin .in2{position:relative}
.big{font:700 clamp(140px,26vw,400px) var(--display);line-height:.82;color:var(--or);letter-spacing:.01em;font-variant-numeric:tabular-nums}
.fin .lab{font:600 13px var(--body);letter-spacing:.28em;text-transform:uppercase;color:#f1cdb2;margin-top:8px}
.msg{margin-top:50px;opacity:0;transform:translateY(34px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.fin.live .msg{opacity:1;transform:none}
.msg h2{font-size:clamp(40px,6vw,92px);max-width:11em;margin:0 auto}
.msg p{margin:22px auto 36px;max-width:30em;color:#e7cdb8}
.acts{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.acts .btn.ghost{background:#ffffff14}
footer{background:#070809;padding:80px 0 34px;border-top:1px solid var(--line)}
.fcols{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:50px;padding-bottom:60px}
.fcols img{height:64px;width:auto;border-radius:2px;margin-bottom:20px}
.fcols p,.fcols a{color:#9aa2a9;font-size:16px;display:block}
.fcols h4{font:600 12px var(--body);letter-spacing:.22em;text-transform:uppercase;color:#fff;margin-bottom:16px}
@media (hover:hover) and (pointer:fine){.fcols a:hover{color:var(--or)}}
.fbot{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:26px;color:#6c757d;font-size:14px}

.float{position:fixed;left:18px;bottom:18px;z-index:70;display:flex;align-items:center;gap:12px;background:#0d0f11;border:1px solid #ffffff44;color:#fff;font:600 13px var(--body);letter-spacing:.14em;text-transform:uppercase;padding:13px 20px 13px 16px;border-radius:2px;box-shadow:0 14px 30px -10px #000c;transition:border-color .25s,background-color .25s}
.float svg{width:20px;height:20px;color:var(--or)}
@media (hover:hover) and (pointer:fine){.float:hover{border-color:var(--or);background:var(--or)}.float:hover svg{color:#fff}}

#wm{position:fixed;inset:0;z-index:9999;pointer-events:none;overflow:hidden}
#wm div{position:absolute;inset:-50%;transform:rotate(-28deg);display:flex;flex-wrap:wrap;gap:90px 70px;align-content:flex-start;font:600 20px var(--body);color:rgba(150,160,170,.13);letter-spacing:.2em;white-space:nowrap}
.tag{position:fixed;bottom:18px;right:18px;z-index:10000;background:#fff;color:#000;font:600 11px var(--body);letter-spacing:.14em;text-transform:uppercase;padding:9px 12px;pointer-events:none}
@media print{body.protect{display:none}}

@media (max-width:1100px){
  .nav ul{display:none}
  .hgrid{grid-template-columns:1fr;gap:34px;padding-top:44px;min-height:0}.hphoto{margin:0 -32px}
  .ngrid,.sgrid,.ql,.mgrid,.qgrid,.fgrid{grid-template-columns:1fr;gap:44px}
  .sfig{position:relative;top:auto;order:-1}.shead{flex-direction:column;align-items:flex-start;gap:18px}
  .pgrid{grid-template-columns:1fr 1fr}.stn{aspect-ratio:4/5}
  .qviz{max-width:380px;margin:auto;order:-1}
  .fcols{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
  body{font-size:17px}.wrap{padding:0 20px}.sec{padding:84px 0}.topbar .wrap span:last-child{display:none}
  .hphoto{margin:0 -20px}.cl{font-size:10px;padding:4px 7px}.stats div{padding:16px 14px}
  .mv{grid-template-columns:1fr}.mv div+div{padding-left:0;border-left:0;border-top:1px solid #0d0f1f33;margin-top:22px}
  .nums{grid-template-columns:1fr 1fr}.pil{grid-template-columns:1fr}.pil div:nth-child(even){padding-left:0;border-left:0}
  .pgrid{grid-template-columns:1fr}.stn{aspect-ratio:16/11}.fcols{grid-template-columns:1fr}
  .float span{display:none}.float{padding:14px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
  .ln>span,.rv{transform:none;opacity:1}.nphoto{clip-path:none}.tk{stroke-dashoffset:0}.stn img{filter:none}
}
.stn:not(.on) .tk{stroke-dashoffset:0;opacity:.3;animation:none}
.sfig .tech .cap,.stn .tech{z-index:1}
.brand,.lg{display:grid;place-items:center;overflow:hidden;background:var(--bone);border-radius:2px}
.brand{width:140px;height:52px}.nav .brand img{width:140px;height:140px;max-width:none;border-radius:0}
.lg{width:220px;height:80px;margin-bottom:22px}.fcols .lg img{width:220px;height:220px;max-width:none;margin:0;border-radius:0}
.brand,.lg{display:block}
.nav .brand img{margin:-44px 0 0}.fcols .lg img{margin:-70px 0 0}

/* ---- Entrega ---- */
@media (min-width:1101px){.hgrid{grid-template-columns:minmax(0,5.6fr) minmax(0,6.4fr)}}
.hero h1{font-size:clamp(46px,5.2vw,84px)}
.brand{background:none;width:auto;height:auto;overflow:visible;display:block}
.nav .brand img{height:44px;width:auto;max-width:none;margin:0;border-radius:0}
.flogo{height:60px;width:auto;margin-bottom:22px}
.seal .ck{stroke-dasharray:1;stroke-dashoffset:1}
.in .seal .ck{animation:ck2 5s ease-in-out infinite}
@keyframes ck2{0%,10%{stroke-dashoffset:1}40%,88%{stroke-dashoffset:0}100%{stroke-dashoffset:1}}
.pinx,.pinx.map,.pinx.fin{position:relative;overflow:visible;height:calc(100svh + var(--x,200svh))}
.stk{position:sticky;top:0;height:100svh;overflow:hidden;width:100%}
.map .stk{display:flex;align-items:center;background:#090b0c}
.map .mgrid{width:100%}
.fin.pinx{display:block;min-height:0;padding:0;background:#0d0f11;place-items:normal;justify-items:stretch}
.fin .stk{display:grid;place-items:center;text-align:center;
  background:radial-gradient(140% 95% at 50% 118%,color-mix(in oklab,#ee6a1f calc(var(--a,0)*75%),transparent) 0%,transparent 72%),radial-gradient(70% 55% at 12% 100%,color-mix(in oklab,#ff8a3d calc(var(--a,0)*40%),transparent),transparent),radial-gradient(70% 55% at 88% 100%,color-mix(in oklab,#ff8a3d calc(var(--a,0)*40%),transparent),transparent),linear-gradient(180deg,#0d0f11,#1d0d05 92%)}
.fin .stk canvas{position:absolute;inset:0;width:100%;height:100%}
.fin .msg{opacity:var(--b,0);transform:translateY(calc((1 - var(--b,0))*34px));transition:none;pointer-events:none;margin-top:36px}
.fin.live .msg{pointer-events:auto}
.fin .big{transform:scale(calc(1 - var(--b,0)*.5));transform-origin:50% 0;margin-bottom:calc(var(--b,0)*-9svh)}
.fin .lab{opacity:calc(1 - var(--b,0)*.5)}
.mapsvg{max-height:78svh}
.mapsvg .dot{animation:none;opacity:.38}
/* ---- Cotizador en 3 pasos + ficha ---- */
.quote .wrap{max-width:1360px}
.qhead{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:54px}
.qhead .sub{max-width:27em;margin:0;color:var(--mut)}
.qwrap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start}
.wiz{background:var(--bg);border:1px solid var(--line);padding:34px}
.steps{display:flex;list-style:none;margin-bottom:34px}
.steps li{position:relative;flex:1;display:flex;align-items:center;gap:12px;font:600 13px var(--body);letter-spacing:.18em;text-transform:uppercase;color:#68717a;padding-bottom:16px;border-bottom:2px solid #ffffff22;cursor:pointer;transition:color .3s}
.steps li b{width:28px;height:28px;border:1.5px solid currentColor;border-radius:50%;display:grid;place-items:center;font:600 13px var(--body);letter-spacing:0;transition:background-color .3s,border-color .3s,color .3s}
.steps li::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:100%;background:var(--or);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.steps li.on,.steps li.done{color:#fff}.steps li.on::after,.steps li.done::after{transform:scaleX(1)}
.steps li.done b{background:var(--or);border-color:var(--or)}.steps li.on b{border-color:var(--or);color:var(--or)}
.panes{min-height:400px}
.pane{display:none}
.pane.on{display:block;animation:paneIn .55s var(--ease)}
@keyframes paneIn{from{opacity:0;transform:translateX(26px)}to{opacity:1;transform:none}}
.pane h3{font-size:clamp(26px,2.6vw,36px);margin-bottom:22px}
.pcards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.pc{all:unset;box-sizing:border-box;position:relative;aspect-ratio:4/3;cursor:pointer;overflow:hidden;background:var(--panel);border:1px solid var(--line);display:block}
.pc img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.85) brightness(.55);transition:filter .5s,transform 1.2s var(--ease)}
.pc::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#0d0f11ee,transparent 65%)}
.pc span{position:absolute;z-index:2;left:14px;right:14px;bottom:12px;font:700 20px var(--display);text-transform:uppercase;letter-spacing:.02em;line-height:1.05}
.pc i{position:absolute;z-index:2;right:10px;top:10px;width:24px;height:24px;border:1.5px solid #ffffff88;border-radius:50%;transition:background-color .3s,border-color .3s}
.pc[aria-checked=true]{border-color:var(--or);box-shadow:0 0 0 1px var(--or)}
.pc[aria-checked=true] img{filter:none;transform:scale(1.08)}
.pc[aria-checked=true] i{background:var(--or);border-color:var(--or)}
.pc[aria-checked=true] i::after{content:"";position:absolute;left:7px;top:3px;width:6px;height:11px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.pc:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (hover:hover) and (pointer:fine){.pc:hover img{filter:grayscale(.3) brightness(.75)}}
.cap label{display:flex;justify-content:space-between;align-items:baseline;font:600 12px var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--mut);margin-bottom:16px}
.cap b{font:700 34px var(--display);letter-spacing:.02em;color:#fff;text-transform:none}
.cap input{width:100%;appearance:none;-webkit-appearance:none;height:2px;background:#ffffff40;cursor:grab}
.cap input::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;background:var(--or);border:0;border-radius:50%;cursor:grab}
.cap input::-moz-range-thumb{width:22px;height:22px;background:var(--or);border:0;border-radius:50%;cursor:grab}
.hint{margin-top:16px;font:500 14px var(--body);color:var(--or);letter-spacing:.04em;min-height:1.6em}
.wiz fieldset{margin-top:28px}
.wiz legend{font:600 12px var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--mut);margin-bottom:12px;padding:0}
.seg{display:flex}.seg label{flex:1;cursor:pointer}
.seg input{position:absolute;opacity:0;pointer-events:none}
.seg span{display:block;text-align:center;padding:13px 10px;border:1px solid #ffffff3d;margin-left:-1px;font:500 15px var(--body);transition:background-color .2s,border-color .2s}
.seg label:first-child span{margin-left:0}
.seg input:checked+span{background:var(--or);border-color:var(--or);position:relative;z-index:1}
.seg input:focus-visible+span{outline:2px solid #fff;outline-offset:2px}
.fld{margin-top:28px}.fld label{display:block;font:600 12px var(--body);letter-spacing:.22em;text-transform:uppercase;color:var(--mut);margin-bottom:8px}
.fld input{width:100%;background:transparent;border:0;border-bottom:1px solid #ffffff55;color:#fff;font:400 20px var(--body);padding:8px 0;border-radius:0;outline:0;transition:border-color .25s}
.fld input:focus{border-color:var(--or)}.fld input::placeholder{color:#58606a}
.two{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.wnav{display:flex;justify-content:space-between;gap:12px;margin-top:30px}
.wnav .btn:disabled{opacity:.3;pointer-events:none}
.ficha{position:sticky;top:104px;background:var(--bone);color:var(--ink);padding:24px 28px 28px;box-shadow:0 30px 60px -30px #000}
.fh{display:flex;justify-content:space-between;font:600 11px var(--body);letter-spacing:.24em;text-transform:uppercase;color:#59616a;border-bottom:1px solid #0d0f1f33;padding-bottom:12px}
.fd{margin:8px 0 4px;aspect-ratio:16/8;display:grid;place-items:center;overflow:hidden}
.fd svg{width:70%;height:100%;transition:transform .7s var(--ease)}
.ficha .tk{stroke:var(--ink)}.ficha .tk.o{stroke:#c4510f}.ficha .tk.m{stroke:#0d0f1f66}
.fl div{display:flex;justify-content:space-between;gap:16px;padding:10px 6px;border-top:1px solid #0d0f1f22;font-size:16px}
.fl dt{color:#59616a;font:600 11px var(--body);letter-spacing:.2em;text-transform:uppercase;padding-top:5px;white-space:nowrap}
.fl dd{text-align:right;font-weight:500}
.fl div.fl-ch{animation:flash 1.1s var(--ease)}
@keyframes flash{0%{background:#ee6a1f55}100%{background:transparent}}
.fn{font-size:13px;color:#59616a;margin:14px 0 18px}
.fa{display:grid;gap:10px}.fa .btn{justify-content:center}
.ficha .btn.ghost{border-color:#0d0f1f66;color:var(--ink)}
@media (hover:hover) and (pointer:fine){.ficha .btn.ghost:hover{background:var(--ink);color:#fff;border-color:var(--ink)}}
@media (max-width:1100px){.qwrap{grid-template-columns:1fr}.ficha{position:relative;top:auto}.qhead{flex-direction:column;align-items:flex-start;gap:16px}.panes{min-height:0}}
@media (max-width:640px){.wiz{padding:22px}.pcards{grid-template-columns:1fr 1fr}.two{grid-template-columns:1fr;gap:0}.steps li span{display:none}.steps li{justify-content:center}.pc span{font-size:17px}}
.cnt .st2{display:block;margin-top:12px;text-transform:none;letter-spacing:.02em;font-size:15px;color:#6f7981}
@media (max-width:1100px){
  .map .mgrid{gap:6px;align-content:center}
  .map h2{font-size:clamp(30px,8vw,48px)}.cnt{margin-top:10px}.cnt b{font-size:60px;display:inline;margin-right:12px}
  .mapsvg{max-height:50svh;max-width:70vw}
  .big{font-size:clamp(120px,40vw,260px)}.fin .msg h2{font-size:clamp(34px,9vw,60px)}.fin .msg p{margin:14px auto 22px}
}
@media (prefers-reduced-motion:reduce){.pinx{height:auto}.stk{position:relative;height:auto;min-height:100svh}.fin .msg{opacity:1;transform:none}}

.skip{position:absolute;left:-999px;top:8px;z-index:100;background:#fff;color:#000;padding:10px 16px;font:600 14px var(--body)}.skip:focus{left:8px}

.topbar a{color:inherit}.topbar a:hover{color:#fff}
.mbtn{display:none;flex:none;width:48px;height:48px;background:transparent;border:1px solid #ffffff55;border-radius:2px;cursor:pointer;position:relative}
.mbtn i,.mbtn i::before,.mbtn i::after{position:absolute;left:13px;right:13px;height:2px;background:#fff;content:"";transition:transform .35s var(--ease),opacity .2s}
.mbtn i{top:23px}.mbtn i::before{left:0;right:0;top:-7px}.mbtn i::after{left:0;right:0;top:7px}
.nav.open .mbtn i{background:transparent}.nav.open .mbtn i::before{transform:translateY(7px) rotate(45deg)}.nav.open .mbtn i::after{transform:translateY(-7px) rotate(-45deg)}
.mpanel{display:none}
@media (max-width:1100px){
  .mbtn{display:block}
  .mpanel{position:absolute;left:0;right:0;top:100%;background:#0d0f11fa;border-bottom:1px solid var(--line);padding:8px 24px 22px;max-height:calc(100svh - 120px);overflow:auto}
  .nav.open .mpanel{display:block;animation:paneIn .35s var(--ease)}
  .mpanel a{display:block;padding:15px 0;border-bottom:1px solid var(--line);font:700 26px var(--display);text-transform:uppercase;letter-spacing:.02em}
  .nav .wrap{gap:14px}.nav .wrap .btn{margin-left:auto}
}
@media (max-width:520px){.nav .wrap>.btn{display:none}.mbtn{margin-left:auto}}