/* ==========================================================================
   PROLUXCAR · Landing de detallado automotriz
   Sistema de diseño: negro grafito + cromo + rojo señal · tipografía condensada
   Mobile-first (base = móvil; mejoras en min-width: 640 / 960 / 1200)
   Índice: 0 Tokens · 1 Base · 2 Utilidades · 3 Botones · 4 Loader · 5 Header/Menú
           6 Hero · 7 Ticker · 8 Manifiesto · 9 Sistema · 10 Pulido · 11 Selector
           12 Catálogo · 13 Modal/Drawer · 14 Mayoreo · 15 Proceso · 16 FAQ
           17 Cierre · 18 Contacto · 19 Footer · 20 Flotantes · 21 Movimiento reducido
   ========================================================================== */

/* 0 · TOKENS -------------------------------------------------------------- */
:root{
  --bg:#050506; --bg-2:#0a0b0e; --bg-3:#10121a; --card:#0d0f14;
  --line:rgba(255,255,255,.09); --line-2:rgba(255,255,255,.17);
  --txt:#f3f5f9; --mut:#9aa1ad; --dim:#69707d;
  --red:#ff2a3d; --red-d:#b8101e; --red-rgb:255,42,61;
  --tint:255,42,61;                     /* color dinámico (lo cambia el JS por etapa/producto) */
  --f-d:"Barlow Condensed","Arial Narrow","Roboto Condensed",Impact,sans-serif;
  --f-b:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-m:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --ease:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.76,0,.24,1);
  --gut:clamp(1.25rem,4.2vw,3.5rem);
  --max:1440px;
  --hdr:4.4rem;
  --stick:.75rem;
  --chrome:linear-gradient(180deg,#fff 8%,#c8cdd8 48%,#7b8290 100%);
}

/* 1 · BASE ---------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;background:var(--bg)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
html.is-loading{overflow:hidden}
body{margin:0;min-height:100vh;background:var(--bg);color:var(--txt);font:400 1rem/1.6 var(--f-b);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,canvas{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
button{cursor:pointer;background:none;border:0;padding:0}
ul,ol{list-style:none;margin:0;padding:0}
h1,h2,h3,h4,p,figure,dl,dd{margin:0}
::selection{background:var(--red);color:#fff}
:focus-visible{outline:2px solid #fff;outline-offset:3px;border-radius:2px}
.skip{position:fixed;left:1rem;top:-5rem;z-index:10001;padding:.8rem 1.1rem;background:#fff;color:#000;font-weight:600;transition:top .3s}
.skip:focus{top:1rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mono{font-family:var(--f-m);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:500}
.ico{width:1.2em;height:1.2em;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* 2 · UTILIDADES / TIPOGRAFÍA -------------------------------------------- */
.container{width:min(100% - 2*var(--gut),var(--max));margin-inline:auto}
.sec{position:relative;padding-block:clamp(5rem,11vw,9.5rem)}
.sec__head{max-width:62rem;margin-bottom:clamp(2.2rem,5vw,4rem)}
.sec__head .lead{margin-top:1.4rem}
.sec__head--row{display:grid;gap:1.4rem;max-width:none}
.eyebrow{display:inline-flex;align-items:center;gap:.7rem;margin-bottom:1.4rem;color:var(--mut)}
.eyebrow span{color:var(--red)}
.h2{font:800 clamp(2.7rem,9vw,6.4rem)/.9 var(--f-d);text-transform:uppercase;letter-spacing:-.005em}
.h2 em,.manifesto__text b,.finale__title em{font-style:normal}
.h2+.lead,.finale__title+.lead{margin-top:1.5rem}
.lead{font-size:clamp(1rem,.45vw + .95rem,1.2rem);line-height:1.6;color:var(--mut);max-width:38rem}
/* partición de texto (palabras con máscara) */
.w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.wi{display:inline-block;will-change:transform}
.wi.is-em{background:var(--chrome);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.js [data-split]:not(.is-split){visibility:hidden}
.js [data-reveal]{opacity:0;transform:translate3d(0,42px,0)}
.js [data-reveal].is-in{opacity:1;transform:none}
.ticks{display:grid;gap:.8rem;margin-block:1.6rem 2rem}
.ticks li{position:relative;padding-left:1.7rem;color:var(--mut);line-height:1.5}
.ticks li::before{content:"";position:absolute;left:0;top:.5em;width:.7rem;height:.7rem;border:1.5px solid var(--red);transform:rotate(45deg)}
.grain{position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1s steps(5) infinite}
@keyframes grain{0%{background-position:0 0}20%{background-position:-60px 40px}40%{background-position:50px -80px}60%{background-position:-90px -30px}80%{background-position:70px 60px}100%{background-position:0 0}}
[data-prices="off"] .js-price{display:none!important}

/* roll: texto que "rueda" al pasar el cursor */
.roll{display:inline-block;overflow:hidden;height:1.2em;line-height:1.2em;vertical-align:middle}
.roll__in{display:flex;flex-direction:column;transition:transform .6s var(--ease)}
.roll__in>span{display:block;white-space:nowrap}
a:hover>.roll>.roll__in,a:hover .roll__in,button:hover .roll__in,.btn:hover .roll__in{transform:translateY(-50%)}

/* 3 · BOTONES ------------------------------------------------------------- */
.btn{--h:3.4rem;position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.85rem;min-height:var(--h);padding:0 1.75rem;font:700 .98rem/1 var(--f-d);letter-spacing:.13em;text-transform:uppercase;color:#fff;isolation:isolate;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .5s var(--ease)}
.btn::before{content:"";position:absolute;inset:8px 10px -8px;z-index:-2;background:var(--red);filter:blur(22px);opacity:0;transition:opacity .5s}
.btn--primary::before{opacity:.42}
.btn--primary:hover::before{opacity:.75}
.btn__bg{position:absolute;inset:0;z-index:-1;overflow:hidden;clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));transition:transform .5s var(--ease)}
.btn--primary .btn__bg{background:linear-gradient(120deg,var(--red),var(--red-d))}
.btn__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 32%,rgba(255,255,255,.4) 50%,transparent 68%);transform:translateX(-130%)}
.btn:hover .btn__bg::after{transform:translateX(130%);transition:transform .95s var(--ease)}
.btn--ghost .btn__bg{background:var(--line-2)}
.btn--ghost .btn__bg::before{content:"";position:absolute;inset:1px;background:#0b0c10;clip-path:polygon(0 0,calc(100% - 13px) 0,100% 13px,100% 100%,13px 100%,0 calc(100% - 13px));transition:background .4s}
.btn--ghost:hover .btn__bg{background:var(--red)}
.btn--ghost:hover .btn__bg::before{background:#14070a}
.btn--lg{--h:3.9rem;padding:0 2.2rem;font-size:1.06rem}
.btn--sm{--h:2.7rem;padding:0 1.25rem;font-size:.86rem}
.btn--block{display:flex;width:100%}
.btn .ico{width:1.15em;height:1.15em;transition:transform .5s var(--ease)}
.btn:hover .ico{transform:translateX(5px)}
.btn:active{transform:scale(.97)}
.btn__txt{display:inline-flex;align-items:center}

/* 4 · LOADER -------------------------------------------------------------- */
.loader{position:fixed;inset:0;z-index:10000;color:#fff;overflow:hidden;pointer-events:all}
.loader__panel{position:absolute;left:0;right:0;height:50.2%;background:#030304}
.loader__panel--t{top:0}
.loader__panel--b{bottom:0}
.loader__core{position:absolute;left:50%;top:50%;width:min(62vw,230px);aspect-ratio:1;transform:translate(-50%,-50%)}
.loader__ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.loader__ring circle{fill:none}
.loader__track{stroke:rgba(255,255,255,.1);stroke-width:1}
.loader__bar{stroke:var(--red);stroke-width:2.2;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;filter:drop-shadow(0 0 6px rgba(255,42,61,.9))}
.loader__dash{stroke:rgba(255,255,255,.28);stroke-width:.8;stroke-dasharray:1.5 5;transform-origin:center;animation:spin 14s linear infinite}
.loader__logo{position:absolute;inset:17%;width:66%;height:66%;object-fit:contain;opacity:0;transform:scale(.7) rotate(-30deg)}
.loader__count{position:absolute;left:var(--gut);bottom:calc(var(--gut) * .8);display:flex;align-items:flex-start;gap:.2rem;font:800 clamp(5rem,22vw,11rem)/.78 var(--f-d);letter-spacing:-.02em;color:#fff;font-size:clamp(5rem,22vw,11rem)}
.loader__count i{font:500 1rem/1 var(--f-m);font-style:normal;color:var(--red);margin-top:.5rem}
.loader__tag{position:absolute;right:var(--gut);top:calc(var(--gut) * .8);color:var(--mut)}
@keyframes spin{to{transform:rotate(360deg)}}

/* 5 · HEADER + MENÚ ------------------------------------------------------- */
.hdr{position:fixed;top:0;left:0;right:0;z-index:100;transition:transform .7s var(--ease)}
.hdr.is-hidden{transform:translateY(-105%)}
.hdr__bar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1rem;height:var(--hdr);width:min(100% - 2*var(--gut),var(--max));margin-inline:auto}
.hdr__bar::before{content:"";position:absolute;inset:0 calc(-1 * var(--gut));z-index:-1;background:rgba(5,5,6,.66);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);border-bottom:1px solid var(--line);opacity:0;transition:opacity .5s}
.hdr.is-solid .hdr__bar::before{opacity:1}
.brand{display:inline-flex;align-items:center;gap:.7rem;font:800 1.55rem/1 var(--f-d);letter-spacing:.09em;text-transform:uppercase}
.brand img{width:2.5rem;height:2.5rem;object-fit:contain;transition:transform 1s var(--ease)}
.brand:hover img{transform:rotate(180deg)}
.hdr__nav{display:none}
.hdr__actions{display:flex;align-items:center;gap:.7rem}
.hdr__cta{display:none}
.cartbtn{position:relative;display:inline-flex;align-items:center;gap:.55rem;height:2.7rem;padding:0 .95rem;border:1px solid var(--line-2);border-radius:999px;background:rgba(255,255,255,.04);font:600 .86rem/1 var(--f-d);letter-spacing:.1em;text-transform:uppercase;transition:border-color .4s,background .4s}
.cartbtn:hover{border-color:var(--red);background:rgba(255,42,61,.1)}
.cartbtn__label{display:none}
.cartbtn__count{display:grid;place-items:center;min-width:1.35rem;height:1.35rem;padding:0 .3rem;border-radius:999px;background:var(--red);color:#fff;font:700 .72rem/1 var(--f-m)}
.cartbtn__count.bump{animation:bump .6s var(--ease)}
@keyframes bump{40%{transform:scale(1.5)}}
.burger{position:relative;width:2.9rem;height:2.9rem;border:1px solid var(--line-2);border-radius:50%;background:rgba(255,255,255,.04)}
.burger span{position:absolute;left:50%;top:50%;width:1.15rem;height:1.5px;background:#fff;transition:transform .55s var(--ease)}
.burger span:first-child{transform:translate(-50%,-4px)}
.burger span:last-child{transform:translate(-50%,4px)}
.burger[aria-expanded="true"] span:first-child{transform:translate(-50%,0) rotate(45deg)}
.burger[aria-expanded="true"] span:last-child{transform:translate(-50%,0) rotate(-45deg)}
.hdr__progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:transparent}
.hdr__progress i{display:block;height:100%;background:linear-gradient(90deg,var(--red),#fff);transform-origin:left;transform:scaleX(0)}
.menu{position:fixed;inset:0;z-index:99;display:flex;flex-direction:column;justify-content:center;padding:6rem var(--gut) 2rem;background:rgba(5,5,6,.98);visibility:hidden;clip-path:inset(0 0 100% 0);transition:clip-path .85s var(--ease-io),visibility 0s .85s}
.menu.is-open{visibility:visible;clip-path:inset(0);transition:clip-path .85s var(--ease-io),visibility 0s 0s}
.menu li{overflow:hidden}
.menu a{transform:translateY(105%);transition:transform .9s var(--ease)}
.menu.is-open a{transform:none;transition-delay:calc(.3s + var(--i,0) * .07s)}
.menu__foot{opacity:0;transition:opacity .6s .7s}
.menu.is-open .menu__foot{opacity:1}
.menu ul{display:grid;gap:.2rem}
.menu a{display:flex;align-items:baseline;gap:1rem;padding:.35rem 0;font:800 clamp(3rem,15vw,5.5rem)/1 var(--f-d);text-transform:uppercase;border-bottom:1px solid var(--line)}
.menu a small{color:var(--red)}
.menu__foot{margin-top:2rem;color:var(--mut)}

/* 6 · HERO ---------------------------------------------------------------- */
.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:calc(var(--hdr) + 2rem) 0 7.5rem;overflow:hidden;isolation:isolate;background:var(--bg)}
.hero__gl{position:absolute;inset:0;width:100%;height:100%;z-index:-3;background:radial-gradient(60% 60% at 70% 40%,#16080b,#050506)}
.hero__shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(5,5,6,.78) 0%,rgba(5,5,6,.2) 55%,rgba(5,5,6,.35) 100%),linear-gradient(0deg,#050506 0%,transparent 28%)}
.hero__grid{position:absolute;inset:0;z-index:-1;opacity:.5;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:radial-gradient(70% 70% at 50% 40%,#000,transparent);mask-image:radial-gradient(70% 70% at 50% 40%,#000,transparent)}
.hero__inner{position:relative;display:grid;gap:2.5rem;width:min(100% - 2*var(--gut),var(--max));margin-inline:auto;align-items:center}
.kicker{display:inline-flex;align-items:center;gap:.7rem;margin-bottom:1.4rem;color:var(--txt)}
.kicker i{width:.55rem;height:.55rem;border-radius:50%;background:var(--red);box-shadow:0 0 0 0 rgba(255,42,61,.7);animation:dot 2.2s ease-out infinite}
@keyframes dot{to{box-shadow:0 0 0 .7rem rgba(255,42,61,0)}}
.hero__title{font:900 clamp(3.6rem,19.5vw,8.4rem)/.84 var(--f-d);text-transform:uppercase;letter-spacing:-.012em}
.hl{display:block;overflow:hidden;padding:.02em .04em .07em;margin:0 -.04em}
.hl__in{display:block;will-change:transform}
.hl__in--chrome{background:linear-gradient(100deg,#aeb5c4 10%,#fff 38%,#e6e9f0 52%,#9aa2b3 72%,#fff 92%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:shine 7s linear infinite}
@keyframes shine{to{background-position:-260% 0}}
.hero__sub{margin-top:1.6rem;max-width:34rem;font-size:clamp(1.02rem,.5vw + .95rem,1.25rem);line-height:1.6;color:#c3c8d2}
.hero__cta{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2rem}
.js [data-hero]{opacity:0;transform:translateY(30px)}
.hero__visual{position:relative;width:min(100%,520px);aspect-ratio:1;margin-inline:auto;justify-self:center}
.badge{position:absolute;inset:4%;display:grid;place-items:center}
.badge__logo{position:relative;z-index:2;width:72%;height:72%;object-fit:contain;filter:drop-shadow(0 0 50px rgba(255,42,61,.28));animation:breathe 7s ease-in-out infinite}
@keyframes breathe{50%{transform:scale(1.035)}}
.badge__ring{position:absolute;inset:0;width:100%;height:100%;animation:spin 48s linear infinite}
.badge__ring text{fill:rgba(255,255,255,.7);font:500 15px var(--f-m);letter-spacing:.08em}
.badge__orbit{position:absolute;inset:11%;border:1px dashed rgba(255,255,255,.2);border-radius:50%;animation:spin 36s linear infinite reverse}
.badge__orbit::after{content:"";position:absolute;top:-5px;left:50%;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--red);box-shadow:0 0 18px 4px rgba(255,42,61,.8)}
.hcard{position:absolute;z-index:3;width:30%;border:1px solid var(--line-2);border-radius:6px;overflow:hidden;background:#000;box-shadow:0 30px 60px -20px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.6)}
.hcard img{width:100%;aspect-ratio:4/5;object-fit:cover;animation:floaty 7s ease-in-out infinite}
.hcard--a{left:-4%;top:50%}
.hcard--b{right:-2%;top:2%;width:32%}
.hcard--c{right:8%;bottom:-6%;width:26%}
.hcard--b img{animation-delay:-2.3s}.hcard--c img{animation-delay:-4.6s}
@keyframes floaty{50%{transform:translateY(-9px) scale(1.03)}}
.htag{position:absolute;z-index:4;display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .8rem;border:1px solid var(--line-2);border-radius:999px;background:rgba(5,5,6,.7);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);white-space:nowrap}
.htag i{width:.45rem;height:.45rem;border-radius:50%;background:var(--red)}
.htag--1{left:2%;top:10%}.htag--2{right:-1%;top:46%}.htag--3{left:22%;bottom:-3%}
.hero__foot{position:absolute;left:0;right:0;bottom:1.4rem;display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;width:min(100% - 2*var(--gut),var(--max));margin-inline:auto}
.hero__facts{display:flex;flex-wrap:wrap;gap:.4rem 1.6rem;color:var(--mut)}
.hero__facts b{color:#fff;font-weight:500}
.cue{display:none;align-items:center;gap:.9rem;color:var(--mut)}
.cue i{position:relative;width:1px;height:3.2rem;background:var(--line-2);overflow:hidden}
.cue i::after{content:"";position:absolute;left:0;top:-100%;width:100%;height:100%;background:#fff;animation:cue 2.2s var(--ease-io) infinite}
@keyframes cue{to{top:100%}}
.js .hero__foot{opacity:0}

/* 7 · TICKER -------------------------------------------------------------- */
.ticker{position:relative;overflow:hidden;padding:1.4rem 0;background:var(--bg-2);border-block:1px solid var(--line)}
.ticker__row{display:flex;overflow:hidden}
.ticker__track{display:flex;flex:none;align-items:center;gap:clamp(1.2rem,3vw,2.6rem);padding-right:clamp(1.2rem,3vw,2.6rem);white-space:nowrap;will-change:transform}
.ticker__row--a .ticker__track{font:800 clamp(3rem,9vw,7.5rem)/1 var(--f-d);text-transform:uppercase;color:transparent;-webkit-text-stroke:1.2px rgba(255,255,255,.55)}
.ticker__row--a i{color:var(--red);-webkit-text-stroke:0;font-style:normal;font-size:.5em}
.ticker__row--b{margin-top:.4rem}
.ticker__row--b .ticker__track{font:600 clamp(1rem,2.2vw,1.5rem)/1 var(--f-m);letter-spacing:.2em;text-transform:uppercase;color:var(--mut)}
.ticker__row--b i{color:var(--red);font-style:normal}

/* 8 · MANIFIESTO ---------------------------------------------------------- */
.manifesto{background:var(--bg);padding-block:clamp(6rem,14vw,12rem)}
.manifesto__text{max-width:21em;font:700 clamp(2.1rem,6.2vw,5.2rem)/1.02 var(--f-d);text-transform:uppercase;letter-spacing:0}
.mw{display:inline-block}
.js .mw{opacity:.14}
.mw.is-b{color:var(--red)}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:0;margin-top:clamp(3.5rem,8vw,7rem);border-top:1px solid var(--line)}
.stats li{padding:1.6rem 1rem 1.6rem 0;border-bottom:1px solid var(--line)}
.stats li:nth-child(odd){padding-right:1rem}
.stats li:nth-child(even){padding-left:1.2rem;border-left:1px solid var(--line)}
.stats b{display:block;font:800 clamp(3.2rem,11vw,6.6rem)/.9 var(--f-d);letter-spacing:-.01em;background:var(--chrome);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.stats span:not([data-count]){display:block;margin-top:.7rem;max-width:15rem;color:var(--mut);font-size:.9rem;line-height:1.4}

/* 9 · SISTEMA (escena anclada en escritorio) ------------------------------ */
.sys{position:relative;background:var(--bg-2);padding-block:clamp(5rem,11vw,9rem);border-block:1px solid var(--line);overflow:clip}
.sys__glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(55% 60% at 78% 55%,rgba(var(--tint),.2),transparent 70%);transition:background .2s}
.sys__wrap{position:relative}
.sys__head{margin-bottom:2.6rem}
.sys__num{display:none}
.sys__rail{display:none}
.sys__list{display:grid;gap:4.5rem}
.stage{display:grid;gap:1.6rem}
.stage__idx{color:var(--mut);margin-bottom:1rem}
.stage__idx b{color:rgb(var(--tint));font-weight:500}
.stage__title{font:900 clamp(3rem,13vw,5.4rem)/.86 var(--f-d);text-transform:uppercase;letter-spacing:-.01em}
.stage__lead{margin-top:1.2rem;max-width:30rem;color:#c3c8d2;font-size:1.05rem;line-height:1.55}
.stage__prods{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.5rem}
.stage__prods button{display:inline-flex;align-items:baseline;gap:.5rem;padding:.65rem 1rem;border:1px solid var(--line-2);border-radius:999px;background:rgba(255,255,255,.03);font:600 .9rem/1 var(--f-b);transition:border-color .35s,background .35s,transform .45s var(--ease)}
.stage__prods button small{color:var(--mut);font-size:.72rem;font-weight:500}
.stage__prods button:hover{border-color:rgb(var(--tint));background:rgba(var(--tint),.12);transform:translateY(-2px)}
.stage__tip{display:flex;gap:.9rem;align-items:baseline;margin-top:1.5rem;padding-top:1.2rem;border-top:1px dashed var(--line-2);color:var(--mut);font-size:.92rem;max-width:30rem}
.stage__tip b{color:rgb(var(--tint));flex:none}
.stage__media{position:relative;aspect-ratio:4/5;max-height:72vh;border:1px solid var(--line-2);border-radius:6px;overflow:hidden;background:#000;box-shadow:0 40px 90px -40px rgba(var(--tint),.55)}
.stage__media img{width:100%;height:100%;object-fit:cover}
.hud{position:absolute;left:.8rem;right:.8rem;bottom:.8rem;display:flex;flex-wrap:wrap;gap:.4rem}
.hud span{padding:.5rem .7rem;border:1px solid var(--line-2);border-radius:999px;background:rgba(5,5,6,.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff}

/* 10 · PULE LA PINTURA ---------------------------------------------------- */
.polish{background:var(--bg)}
.polish__grid{display:grid;gap:2.4rem;align-items:center}
.polish__meter{margin-top:1.8rem;max-width:26rem}
.meter{height:4px;background:var(--line-2);border-radius:4px;overflow:hidden}
.meter i{display:block;height:100%;width:100%;transform-origin:left;transform:scaleX(0);background:linear-gradient(90deg,var(--red),#fff)}
.polish__meter p{margin-top:.7rem;color:var(--mut)}
.polish__meter b{color:#fff;font-weight:500}
.polish__cta{margin-top:2rem;display:grid;gap:1rem;justify-items:start}
.polish__hint{color:var(--mut)}
.polish__panel{position:relative;aspect-ratio:4/3.3;border:1px solid var(--line-2);border-radius:8px;overflow:hidden;background:#000;touch-action:none;box-shadow:0 50px 120px -50px rgba(255,42,61,.45);user-select:none;-webkit-user-select:none}
.polish__panel canvas{position:absolute;inset:0;width:100%;height:100%}
.polish__panel #pDull{transition:opacity 1.1s var(--ease)}
.polish__panel.is-done #pDull{opacity:0;pointer-events:none}
.polish__panel::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 36%,rgba(255,255,255,.4) 50%,transparent 64%);transform:translateX(-130%)}
.polish__panel.is-done::after{animation:sweep 1.6s var(--ease) forwards}
@keyframes sweep{to{transform:translateX(130%)}}
.polish__tag{position:absolute;left:.9rem;top:.9rem;z-index:3;display:inline-flex;align-items:center;gap:.6rem;padding:.55rem .85rem;border:1px solid var(--line-2);border-radius:999px;background:rgba(5,5,6,.7);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.polish__tag i{width:.5rem;height:.5rem;border-radius:50%;background:var(--red)}
.polish__panel.is-done .polish__tag i{background:#3ddc84;box-shadow:0 0 12px #3ddc84}
.polish__pad{position:absolute;left:0;top:0;z-index:4;width:5.2rem;height:5.2rem;margin:-2.6rem 0 0 -2.6rem;display:grid;place-items:center;border:1px solid rgba(255,255,255,.7);border-radius:50%;background:rgba(255,255,255,.08);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none;opacity:0;transform:scale(.4);transition:opacity .3s,transform .5s var(--ease)}
.polish__pad.is-on{opacity:1;transform:scale(1)}
.polish__pad span{color:#fff}
.polish__reset{position:absolute;right:.9rem;bottom:.9rem;z-index:3;padding:.55rem .85rem;border:1px solid var(--line-2);border-radius:999px;background:rgba(5,5,6,.7);color:var(--mut);transition:color .3s,border-color .3s}
.polish__reset:hover{color:#fff;border-color:#fff}
.polish__corner{position:absolute;z-index:3;width:1.1rem;height:1.1rem;border:0 solid rgba(255,255,255,.7);pointer-events:none}
.polish__corner--tl{left:.5rem;top:.5rem;border-width:1px 0 0 1px;display:none}
.polish__corner--tr{right:.5rem;top:.5rem;border-width:1px 1px 0 0}
.polish__corner--bl{left:.5rem;bottom:.5rem;border-width:0 0 1px 1px}
.polish__corner--br{right:.5rem;bottom:.5rem;border-width:0 1px 1px 0;display:none}

/* 11 · SELECTOR ----------------------------------------------------------- */
.finder{background:var(--bg-2);border-top:1px solid var(--line)}
.finder__chips{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:2rem}
.schip{padding:.85rem 1.3rem;border:1px solid var(--line-2);border-radius:999px;background:rgba(255,255,255,.03);font:700 .95rem/1 var(--f-d);letter-spacing:.1em;text-transform:uppercase;color:var(--mut);transition:color .35s,background .35s,border-color .35s,transform .5s var(--ease)}
.schip:hover{color:#fff;border-color:var(--red);transform:translateY(-2px)}
.schip.is-on{color:#fff;border-color:transparent;background:linear-gradient(120deg,var(--red),var(--red-d));box-shadow:0 14px 34px -14px rgba(255,42,61,.9)}
.fres{display:grid;gap:1.6rem;padding:clamp(1.2rem,3vw,2.2rem);border:1px solid var(--line);border-radius:8px;background:linear-gradient(180deg,var(--bg-3),var(--card))}
.fres__intro h3{font:800 clamp(2.6rem,8vw,4.6rem)/.9 var(--f-d);text-transform:uppercase;margin:.5rem 0 1rem}
.fres__intro>p{color:var(--mut);max-width:30rem}
.fres__intro .mono{color:var(--red)}
.fres__tips{display:grid;gap:.7rem;margin-top:1.4rem}
.fres__tips li{position:relative;padding-left:1.6rem;color:#c3c8d2;font-size:.95rem;line-height:1.5}
.fres__tips li::before{content:"";position:absolute;left:0;top:.55em;width:.65rem;height:.65rem;border:1.5px solid var(--red);transform:rotate(45deg)}
.fres__prods{display:grid;gap:.8rem}
.fprod{display:grid;grid-template-columns:5.2rem 1fr;gap:1rem;align-items:center;padding:.8rem;border:1px solid var(--line);border-radius:6px;background:rgba(255,255,255,.02);transition:border-color .4s,background .4s}
.fprod:hover{border-color:rgba(var(--tint),.6);background:rgba(var(--tint),.06)}
.fprod__img{position:relative;width:5.2rem;aspect-ratio:1;border-radius:4px;overflow:hidden;background:#000}
.fprod__img img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.fprod:hover .fprod__img img{transform:scale(1.12)}
.fprod__txt .mono{color:rgb(var(--tint))}
.fprod__txt h4{font:800 1.55rem/1 var(--f-d);text-transform:uppercase;margin:.2rem 0 .3rem}
.fprod__txt p{color:var(--mut);font-size:.88rem;line-height:1.4}
.fprod__add{grid-column:1/-1;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.6rem;border:1px solid var(--line-2);border-radius:999px;font:700 .82rem/1 var(--f-d);letter-spacing:.12em;text-transform:uppercase;transition:background .35s,border-color .35s}
.fprod__add:hover{background:var(--red);border-color:var(--red)}

/* 12 · CATÁLOGO ----------------------------------------------------------- */
.cat{background:var(--bg)}
.cat__bar{position:sticky;top:var(--stick);z-index:30;display:grid;gap:.8rem;margin-bottom:1.2rem;padding:.8rem;border:1px solid var(--line);border-radius:10px;background:rgba(10,11,14,.82);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:top .6s var(--ease)}
.cat__chips{display:flex;gap:.45rem;overflow-x:auto;scrollbar-width:none;padding-bottom:.1rem}
.cat__chips::-webkit-scrollbar{display:none}
.fchip{flex:none;display:inline-flex;align-items:center;gap:.45rem;padding:.62rem .85rem;border:1px solid var(--line-2);border-radius:999px;font:700 .8rem/1 var(--f-d);letter-spacing:.1em;text-transform:uppercase;color:var(--mut);transition:color .3s,background .3s,border-color .3s}
.fchip i{font:500 .68rem/1 var(--f-m);font-style:normal;padding:.2rem .4rem;border-radius:999px;background:rgba(255,255,255,.08)}
.fchip:hover{color:#fff;border-color:var(--red)}
.fchip.is-on{color:#fff;border-color:transparent;background:linear-gradient(120deg,var(--red),var(--red-d))}
.search{position:relative;display:flex;align-items:center}
.search .ico{position:absolute;left:.9rem;color:var(--mut);pointer-events:none}
.search input{width:100%;height:2.8rem;padding:0 1rem 0 2.6rem;border:1px solid var(--line-2);border-radius:999px;background:rgba(255,255,255,.04);outline:0;transition:border-color .3s}
.search input:focus{border-color:var(--red)}
.cat__count{margin-bottom:1.4rem;color:var(--mut)}
.cat__count b{color:#fff;font-weight:500}
.cat__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.pcard{position:relative;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:var(--card);transition:border-color .5s,box-shadow .6s var(--ease)}
.pcard:hover{border-color:rgba(var(--tint),.65);box-shadow:0 30px 70px -40px rgba(var(--tint),.8)}
.pcard.is-hidden{display:none}
.pcard__open{position:relative;display:block;width:100%;text-align:left;overflow:hidden}
.pcard__media{display:block;aspect-ratio:4/5;overflow:hidden;background:#000;transform-style:preserve-3d;transition:transform .5s var(--ease)}
.pcard__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.3s var(--ease)}
.pcard:hover .pcard__media img{transform:scale(1.08)}
.pcard__glare{position:absolute;inset:0;pointer-events:none;opacity:0;background:radial-gradient(260px circle at var(--gx,50%) var(--gy,30%),rgba(255,255,255,.22),transparent 60%);transition:opacity .4s;mix-blend-mode:overlay}
.pcard:hover .pcard__glare{opacity:1}
.pcard__cat{position:absolute;left:.5rem;top:.5rem;max-width:calc(100% - 1rem);padding:.4rem .55rem;border:1px solid var(--line-2);border-radius:999px;background:rgba(5,5,6,.72);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:.6rem;letter-spacing:.1em}
.pcard__view{position:absolute;right:.5rem;bottom:.5rem;padding:.45rem .65rem;border-radius:999px;background:#fff;color:#000;font-size:.62rem;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .5s var(--ease)}
.pcard:hover .pcard__view{opacity:1;transform:none}
.pcard__body{display:flex;flex-direction:column;flex:1;gap:.35rem;padding:.8rem .85rem .9rem}
.pcard__type{color:rgb(var(--tint));font-size:.62rem}
.pcard__name{font:800 1.5rem/.95 var(--f-d);text-transform:uppercase;letter-spacing:.005em}
.pcard__meta{display:flex;flex-wrap:wrap;gap:.3rem .6rem;color:var(--mut);font-size:.6rem}
.pcard__foot{display:grid;gap:.6rem;margin-top:auto;padding-top:.8rem;border-top:1px dashed var(--line)}
.pcard__price{display:grid;line-height:1.05}
.pcard__price small{font:500 .58rem/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}
.pcard__price b{font:800 1.9rem/1 var(--f-d);letter-spacing:-.01em;margin-top:.2rem}
.pcard__price em{font:400 .66rem/1.3 var(--f-b);font-style:normal;color:var(--mut)}
.pcard__add{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;min-height:2.5rem;padding:0 .9rem;border:1px solid rgba(255,42,61,.6);border-radius:999px;background:rgba(255,42,61,.1);font:700 .8rem/1 var(--f-d);letter-spacing:.12em;text-transform:uppercase;transition:background .35s,border-color .35s,transform .45s var(--ease)}
.pcard__add .ico{width:1.1em;height:1.1em}
.pcard__add:hover{background:var(--red);border-color:var(--red)}
.pcard__add.is-added{background:#fff;color:#000;border-color:#fff}
.cat__empty{padding:3rem 0;text-align:center;color:var(--mut)}
.cat__foot{display:grid;gap:1.4rem;margin-top:3rem;justify-items:center;text-align:center}
.cat__note{max-width:34rem;color:var(--dim);font-size:.84rem}
.cat__actions{display:flex;flex-wrap:wrap;gap:.9rem;justify-content:center}

/* 13 · MODAL + DRAWER ----------------------------------------------------- */
dialog{color:var(--txt)}
dialog::backdrop{background:rgba(3,3,4,.8);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.modal,.drawer{border:0;padding:0;margin:0;max-width:none;max-height:none;width:100%;height:100%;background:transparent;overflow:hidden}
.modal[open]{display:grid;place-items:center;padding:1rem}
.modal__shell{position:relative;display:grid;width:min(1080px,100%);max-height:calc(100dvh - 2rem);overflow:auto;border:1px solid var(--line-2);border-radius:10px;background:linear-gradient(180deg,var(--bg-3),var(--bg-2));box-shadow:0 60px 140px -30px rgba(var(--tint),.45)}
.modal__close{position:absolute;right:.8rem;top:.8rem;z-index:5;display:grid;place-items:center;width:2.7rem;height:2.7rem;border:1px solid var(--line-2);border-radius:50%;background:rgba(5,5,6,.7);transition:background .3s,border-color .3s,transform .5s var(--ease)}
.modal__close:hover{background:var(--red);border-color:var(--red);transform:rotate(90deg)}
.modal__media{position:relative;aspect-ratio:4/4.2;background:#000}
.modal__media img{width:100%;height:100%;object-fit:cover}
.modal__body{display:grid;align-content:start;gap:1rem;padding:1.4rem 1.4rem 1.8rem}
.pm__cat{color:rgb(var(--tint))}
.pm__title{font:900 clamp(3rem,10vw,5rem)/.86 var(--f-d);text-transform:uppercase}
.pm__type{color:var(--mut);margin-top:-.2rem}
.pm__desc{color:#c3c8d2;line-height:1.6}
.pm__specs{display:grid;border-top:1px solid var(--line)}
.pm__specs div{display:grid;grid-template-columns:8.5rem 1fr;gap:1rem;padding:.75rem 0;border-bottom:1px solid var(--line);font-size:.92rem}
.pm__specs dt{color:var(--mut);font:500 .68rem/1.6 var(--f-m);letter-spacing:.12em;text-transform:uppercase}
.pm__specs dd{color:var(--txt)}
.pm__price{display:flex;align-items:baseline;gap:.8rem;flex-wrap:wrap}
.pm__price b{font:900 3.4rem/1 var(--f-d)}
.pm__price span{color:var(--mut);font-size:.85rem}
.pm__buy{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}
.qty{display:inline-flex;align-items:center;height:3.1rem;border:1px solid var(--line-2);border-radius:999px;overflow:hidden}
.qty button{width:2.9rem;height:100%;display:grid;place-items:center;font-size:1.2rem;transition:background .3s}
.qty button:hover{background:rgba(255,255,255,.1)}
.qty output{min-width:2.4rem;text-align:center;font:600 1rem var(--f-m)}
.pm__ask{color:var(--mut);font-size:.85rem;text-decoration:underline;text-underline-offset:4px}
.pm__ask:hover{color:#fff}
.drawer[open]{display:block}
.drawer__shell{position:fixed;right:0;top:0;bottom:0;display:flex;flex-direction:column;width:min(460px,100%);background:var(--bg-2);border-left:1px solid var(--line-2);box-shadow:-40px 0 120px -40px rgba(255,42,61,.35)}
.drawer__head{display:flex;align-items:center;justify-content:space-between;padding:1.3rem 1.4rem;border-bottom:1px solid var(--line)}
.drawer__head .mono{color:var(--red)}
.drawer__head h2{font:900 2.6rem/.9 var(--f-d);text-transform:uppercase}
.drawer__head .modal__close{position:static}
.drawer__list{flex:1;overflow:auto;padding:1rem 1.4rem}
.cempty{display:grid;gap:1rem;justify-items:start;padding:2rem 0;color:var(--mut)}
.citem{display:grid;grid-template-columns:4.2rem 1fr;gap:.9rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.citem img{width:4.2rem;aspect-ratio:1;object-fit:cover;border-radius:4px;background:#000}
.citem h3{font:800 1.35rem/1 var(--f-d);text-transform:uppercase}
.citem p{color:var(--mut);font-size:.8rem;margin-top:.2rem}
.citem__row{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-top:.6rem}
.citem .qty{height:2.4rem}
.citem .qty button{width:2.3rem}
.citem__sum{font:800 1.4rem/1 var(--f-d)}
.citem__rm{color:var(--dim);font-size:.72rem;text-decoration:underline;text-underline-offset:3px}
.citem__rm:hover{color:#fff}
.citem__warn{display:block;margin-top:.4rem;color:#ffb347;font-size:.74rem}
.drawer__foot{display:grid;gap:.9rem;padding:1.2rem 1.4rem 1.4rem;border-top:1px solid var(--line);background:var(--bg-3)}
.drawer__total{display:flex;align-items:baseline;justify-content:space-between}
.drawer__total b{font:900 2.6rem/1 var(--f-d)}
.drawer__note{color:var(--dim);font-size:.78rem;line-height:1.45}
.drawer__clear{justify-self:center;color:var(--dim)}
.drawer__clear:hover{color:#fff}
@keyframes mIn{from{opacity:0;transform:translateY(40px) scale(.97)}}
@keyframes dIn{from{transform:translateX(100%)}}
.modal[open] .modal__shell{animation:mIn .7s var(--ease)}
.drawer[open] .drawer__shell{animation:dIn .7s var(--ease)}
.modal.is-closing .modal__shell{opacity:0;transform:translateY(30px) scale(.97);transition:.35s var(--ease)}
.drawer.is-closing .drawer__shell{transform:translateX(100%);transition:.4s var(--ease)}

/* 14 · MAYOREO + CAPACITACIÓN --------------------------------------------- */
.bulk{background:var(--bg-2);border-top:1px solid var(--line)}
.bulk__grid{display:grid;gap:1rem}
.panel{position:relative;overflow:hidden;padding:clamp(1.5rem,3.4vw,2.8rem);border:1px solid var(--line);border-radius:8px;background:linear-gradient(180deg,var(--bg-3),var(--card))}
.panel__tag{color:var(--red);margin-bottom:1.4rem}
.panel--price::before{content:"";position:absolute;right:-30%;top:-30%;width:90%;aspect-ratio:1;background:radial-gradient(circle,rgba(255,42,61,.35),transparent 65%);pointer-events:none}
.bulk__big{position:relative;display:grid;gap:.2rem;margin-bottom:.4rem}
.bulk__big>span{font:500 .8rem var(--f-m);letter-spacing:.2em;text-transform:uppercase;color:var(--mut)}
.bulk__big b{font:900 clamp(6.5rem,24vw,11rem)/.82 var(--f-d);letter-spacing:-.02em;background:var(--chrome);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.bulk__big small{color:var(--mut);font-size:.9rem}
.panel__title{font:800 clamp(2.2rem,5.5vw,3.6rem)/.92 var(--f-d);text-transform:uppercase}
.panel__lead{margin-top:1rem;color:var(--mut);max-width:34rem}
.phscale{margin:1.8rem 0 1.6rem}
.phscale__bar{position:relative;height:12px;border-radius:99px;background:linear-gradient(90deg,#ff3b4e 0%,#ff8a4c 20%,#f2f4f8 50%,#7fc0ff 78%,#4d7dff 100%);box-shadow:0 0 34px -6px rgba(255,42,61,.55)}
.phscale__dot{position:absolute;top:50%;left:0;width:24px;height:24px;margin:-12px 0 0 -12px;border-radius:50%;background:#fff;box-shadow:0 0 0 6px rgba(255,255,255,.14),0 0 30px 8px rgba(255,255,255,.5);animation:sweepDot 7s cubic-bezier(.65,0,.35,1) infinite alternate}
@keyframes sweepDot{from{left:0}to{left:100%}}
.phscale__cols{display:grid;gap:1.1rem;margin-top:1.5rem}
.phscale__col{padding-left:1rem;border-left:2px solid var(--c)}
.phscale__col b{display:block;font:800 1.7rem/1 var(--f-d);text-transform:uppercase;color:var(--c)}
.phscale__col span{display:block;margin-top:.4rem;color:var(--mut);font-size:.85rem;line-height:1.45}
.phscale__col--acid{--c:#ff4d5e}.phscale__col--neutral{--c:#f2f4f8}.phscale__col--alk{--c:#6aaeff}
.rules{display:grid;gap:0;margin:0 0 1.8rem;border-top:1px solid var(--line)}
.rules li{display:grid;grid-template-columns:3rem 1fr;gap:.8rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.rules b{color:var(--red);font-weight:500;padding-top:.3rem}
.rules h4{font:800 1.4rem/1 var(--f-d);text-transform:uppercase}
.rules p{margin-top:.3rem;color:var(--mut);font-size:.9rem;line-height:1.5}

/* 15 · PROCESO ------------------------------------------------------------ */
.proc{background:var(--bg)}
.proc__list{position:relative;display:grid;gap:2.2rem;padding-left:2.2rem;--p:0}
.proc__list::before,.proc__list::after{content:"";position:absolute;left:.4rem;top:.4rem;bottom:.4rem;width:2px;background:var(--line-2)}
.proc__list::after{background:linear-gradient(180deg,var(--red),#fff);transform-origin:top;transform:scaleY(var(--p))}
.proc__step{position:relative}
.proc__step::before{content:"";position:absolute;left:-2.2rem;top:.55rem;width:.85rem;height:.85rem;border:2px solid var(--red);background:var(--bg);transform:rotate(45deg)}
.proc__step b{color:var(--red);font-weight:500}
.proc__step h3{margin:.4rem 0 .5rem;font:800 clamp(2rem,6vw,3rem)/.95 var(--f-d);text-transform:uppercase}
.proc__step p{color:var(--mut);max-width:20rem}

/* 16 · FAQ ---------------------------------------------------------------- */
.faq{background:var(--bg-2);border-top:1px solid var(--line)}
.faq__grid{display:grid;gap:2rem}
.faq__list{border-top:1px solid var(--line)}
.faq__item{border-bottom:1px solid var(--line)}
.faq__q{display:flex;align-items:center;justify-content:space-between;gap:1.2rem;width:100%;padding:1.5rem 0;text-align:left;font:700 clamp(1.4rem,3.4vw,2rem)/1.1 var(--f-d);text-transform:uppercase;letter-spacing:.01em;transition:color .3s}
.faq__q:hover{color:var(--red)}
.faq__ico{position:relative;flex:none;width:2.2rem;height:2.2rem;border:1px solid var(--line-2);border-radius:50%;transition:background .4s,border-color .4s,transform .6s var(--ease)}
.faq__ico::before,.faq__ico::after{content:"";position:absolute;left:50%;top:50%;width:.8rem;height:1.5px;background:#fff;transform:translate(-50%,-50%)}
.faq__ico::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .5s var(--ease)}
.faq__item.is-open .faq__ico{background:var(--red);border-color:var(--red);transform:rotate(180deg)}
.faq__item.is-open .faq__ico::after{transform:translate(-50%,-50%) rotate(0)}
.faq__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .6s var(--ease)}
.faq__a>div{overflow:hidden;visibility:hidden;transition:visibility 0s .6s}
.faq__item.is-open .faq__a{grid-template-rows:1fr}
.faq__item.is-open .faq__a>div{visibility:visible;transition-delay:0s}
.faq__a p{padding:0 0 1.6rem;max-width:42rem;color:var(--mut)}

/* 17 · CIERRE ------------------------------------------------------------- */
.finale{position:relative;display:grid;place-items:center;min-height:100svh;padding-block:6rem;text-align:center;overflow:hidden;isolation:isolate;background:#050506;border-top:1px solid var(--line)}
.finale__bg{position:absolute;left:50%;top:50%;z-index:-2;width:min(160vw,1300px);aspect-ratio:1;margin:calc(min(160vw,1300px) / -2) 0 0 calc(min(160vw,1300px) / -2);opacity:.1;animation:spin 140s linear infinite}
.finale__bg img{width:100%;height:100%;object-fit:contain}
.finale__glow{position:absolute;inset:0;z-index:-1;background:radial-gradient(50% 45% at 50% 55%,rgba(255,42,61,.3),transparent 70%)}
.finale__title{margin:.4rem 0 1.4rem;font:900 clamp(4rem,17vw,16rem)/.82 var(--f-d);text-transform:uppercase;letter-spacing:-.015em}
.finale .lead{margin-inline:auto}
.finale__cta{display:flex;flex-wrap:wrap;gap:.9rem;justify-content:center;margin-top:2.2rem}
.finale .eyebrow{justify-content:center}

/* 18 · CONTACTO ----------------------------------------------------------- */
.contact{background:var(--bg-2);border-top:1px solid var(--line)}
.contact__grid{display:grid;gap:2.6rem;align-items:start}
.contact__info{display:grid;gap:0;margin-top:2rem;border-top:1px solid var(--line)}
.contact__info li{display:flex;justify-content:space-between;gap:1rem;padding:1.1rem 0;border-bottom:1px solid var(--line)}
.contact__info span{color:var(--mut)}
.contact__info a,.contact__info b{font:800 1.5rem/1 var(--f-d);letter-spacing:.04em;text-transform:uppercase}
.contact__info a:hover{color:var(--red)}
.form{display:grid;gap:1.3rem;padding:clamp(1.3rem,3vw,2.4rem);border:1px solid var(--line-2);border-radius:10px;background:linear-gradient(180deg,var(--bg-3),var(--card));box-shadow:0 60px 120px -60px rgba(255,42,61,.4)}
.form__title{font:900 2.4rem/.9 var(--f-d);text-transform:uppercase}
.field{display:grid;gap:.55rem;border:0;margin:0;padding:0;min-width:0}
.field legend{padding:0 0 .6rem}
.field label,.field legend{color:var(--mut);font:500 .7rem/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase}
.field input[type="text"],.field textarea{width:100%;padding:1rem;border:1px solid var(--line-2);border-radius:4px;background:rgba(255,255,255,.03);outline:0;transition:border-color .3s,box-shadow .3s,background .3s;resize:vertical}
.field input[type="text"]:focus,.field textarea:focus{border-color:var(--red);box-shadow:0 0 0 4px rgba(255,42,61,.15);background:rgba(255,255,255,.05)}
.field.has-err input{border-color:#ff6b6b}
.field__err{min-height:0;color:#ff8a8a;font-size:.8rem}
.opts{display:flex;flex-wrap:wrap;gap:.5rem}
.opt{position:relative}
.opt input{position:absolute;opacity:0;pointer-events:none}
.opt span{display:inline-flex;align-items:center;padding:.7rem 1rem;border:1px solid var(--line-2);border-radius:999px;font-size:.88rem;color:var(--mut);cursor:pointer;transition:color .3s,background .3s,border-color .3s}
.opt:hover span{color:#fff;border-color:rgba(255,42,61,.7)}
.opt input:checked+span{color:#fff;border-color:transparent;background:linear-gradient(120deg,var(--red),var(--red-d))}
.opt input:focus-visible+span{outline:2px solid #fff;outline-offset:3px}
.form__order{padding:.9rem 1rem;border:1px dashed rgba(255,42,61,.7);border-radius:4px;background:rgba(255,42,61,.07);font-size:.9rem}
.form__note{text-align:center;color:var(--dim);font-size:.82rem}

/* 19 · FOOTER ------------------------------------------------------------- */
.foot{position:relative;background:#030304;border-top:1px solid var(--line);overflow:hidden}
.foot__top{display:grid;gap:2rem;padding-block:4rem 2rem}
.foot__brand p{max-width:24rem;margin-top:1rem;color:var(--mut)}
.foot__nav .mono{color:var(--red);margin-bottom:1rem}
.foot__nav ul{display:grid;gap:.5rem}
.foot__nav a{color:var(--mut);transition:color .3s}
.foot__nav a:hover{color:#fff}
.foot__word{overflow:hidden;line-height:.8;text-align:center;padding-top:1rem}
.foot__word span{display:block;font:900 clamp(5rem,22.2vw,28rem)/.8 var(--f-d);text-transform:uppercase;letter-spacing:-.02em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.2);background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,0) 70%);-webkit-background-clip:text;background-clip:text;padding-bottom:.04em}
.js .foot__word span{transform:translateY(60%);opacity:0}
.foot__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;padding-block:1.4rem 5.5rem;border-top:1px solid var(--line);color:var(--dim)}
.foot__bottom a:hover{color:#fff}

/* 20 · FLOTANTES ---------------------------------------------------------- */
.wa-float{position:fixed;right:max(1rem,env(safe-area-inset-right));bottom:max(1rem,env(safe-area-inset-bottom));z-index:95;display:flex;align-items:center;gap:.7rem}
.wa-float__btn{display:grid;place-items:center;width:3.7rem;height:3.7rem;border-radius:50%;background:#25d366;color:#fff;box-shadow:0 14px 34px -8px rgba(37,211,102,.7);animation:waRing 2.8s ease-out infinite;transition:transform .5s var(--ease)}
.wa-float:hover .wa-float__btn{transform:scale(1.1) rotate(-8deg)}
.wa-float__btn svg{width:1.9rem;height:1.9rem}
.wa-float__tip{display:none;padding:.7rem 1rem;border:1px solid var(--line-2);border-radius:999px;background:rgba(5,5,6,.85);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);font:700 .85rem/1 var(--f-d);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
@keyframes waRing{0%{box-shadow:0 14px 34px -8px rgba(37,211,102,.7),0 0 0 0 rgba(37,211,102,.5)}100%{box-shadow:0 14px 34px -8px rgba(37,211,102,.7),0 0 0 1.1rem rgba(37,211,102,0)}}
.cartpill{position:fixed;left:max(1rem,env(safe-area-inset-left));bottom:max(1rem,env(safe-area-inset-bottom));z-index:95;display:inline-flex;align-items:center;gap:.6rem;height:3.2rem;padding:0 1.1rem;border-radius:999px;background:var(--red);color:#fff;font:700 .9rem/1 var(--f-d);letter-spacing:.1em;text-transform:uppercase;box-shadow:0 16px 36px -10px rgba(255,42,61,.8)}
.cartpill[hidden]{display:none}
.cartpill{animation:pillIn .8s var(--ease)}
@keyframes pillIn{from{opacity:0;transform:translateY(20px) scale(.9)}}
.cartpill b{display:grid;place-items:center;min-width:1.5rem;height:1.5rem;padding:0 .35rem;border-radius:99px;background:#fff;color:#000;font:700 .74rem/1 var(--f-m)}
.toast{position:fixed;left:50%;bottom:6.2rem;z-index:9000;display:flex;align-items:center;gap:1rem;max-width:calc(100% - 2rem);padding:.85rem 1.1rem;border:1px solid var(--line-2);border-radius:999px;background:rgba(10,11,14,.92);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-size:.9rem;opacity:0;pointer-events:none;transform:translate(-50%,20px);transition:opacity .4s,transform .6s var(--ease)}
.toast.is-on{opacity:1;pointer-events:auto;transform:translate(-50%,0)}
.toast button{color:var(--red);font:700 .82rem/1 var(--f-d);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.cursor{position:fixed;left:0;top:0;z-index:9500;display:none;pointer-events:none}
.cursor__dot,.cursor__ring{position:absolute;left:0;top:0;border-radius:50%;pointer-events:none}
.cursor__dot{width:6px;height:6px;margin:-3px 0 0 -3px;background:var(--red)}
.cursor__ring{display:grid;place-items:center;width:44px;height:44px;margin:-22px 0 0 -22px;border:1px solid rgba(255,255,255,.45);transition:width .5s var(--ease),height .5s var(--ease),margin .5s var(--ease),background .4s,border-color .4s}
.cursor__ring span{font:500 .62rem/1 var(--f-m);letter-spacing:.14em;text-transform:uppercase;color:#fff;opacity:0;transition:opacity .3s}
.cursor.is-link .cursor__ring{width:64px;height:64px;margin:-32px 0 0 -32px;background:rgba(255,42,61,.18);border-color:var(--red)}
.cursor.is-view .cursor__ring{width:84px;height:84px;margin:-42px 0 0 -42px;background:rgba(255,42,61,.9);border-color:var(--red)}
.cursor.is-view .cursor__ring span{opacity:1}
.cursor.is-hide{opacity:0}
.hud-sec{position:fixed;left:1rem;top:50%;z-index:80;display:none;align-items:center;gap:.9rem;color:var(--dim);writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg);pointer-events:none}
.hud-sec i{width:1px;height:2.4rem;background:currentColor}

/* RESPONSIVE (mobile-first: sólo mejoras hacia arriba) --------------------- */
@media (min-width:640px){
  .cat__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}
  .cartbtn__label{display:inline}
  .hdr__cta{display:block}
  .stats{grid-template-columns:repeat(4,1fr)}
  .stats li,.stats li:nth-child(odd),.stats li:nth-child(even){padding:1.8rem 1.4rem 1.8rem 1.4rem;border-left:1px solid var(--line)}
  .stats li:first-child{border-left:0;padding-left:0}
  .phscale__cols{grid-template-columns:1fr 1.7fr 1.2fr;gap:1.6rem}
  .fprod{grid-template-columns:5.2rem 1fr auto}
  .fprod__add{grid-column:auto;padding:0 1.2rem}
  .pcard__foot{grid-template-columns:1fr auto;align-items:end}
  .pcard__body{padding:1rem 1.05rem 1.1rem}
  .pcard__name{font-size:1.7rem}
  .wa-float__tip{display:block;opacity:0;transform:translateX(10px);transition:opacity .4s,transform .6s var(--ease);pointer-events:none}
  .wa-float:hover .wa-float__tip,.wa-float.is-tip .wa-float__tip{opacity:1;transform:none}
  .toast{bottom:2rem}
}
@media (min-width:960px){
  :root{--hdr:5rem}
  .hero__inner{grid-template-columns:1.12fr .88fr;gap:2rem}
  .hero__title{font-size:clamp(6rem,10.2vw,11.2rem)}
  .hero__visual{width:min(100%,640px);justify-self:end}
  .hero{padding-bottom:6.5rem}
  .cue{display:inline-flex}
  .polish__grid{grid-template-columns:.85fr 1.15fr;gap:clamp(2.5rem,5vw,5rem)}
  .polish__corner--tl,.polish__corner--br{display:block}
  .fres{grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,4vw,4rem)}
  .sec__head--row{grid-template-columns:1.4fr .8fr;align-items:end}
  .cat__bar{grid-template-columns:1fr 16rem;align-items:center}
  .cat__chips{flex-wrap:wrap;overflow:visible}
  .cat__grid{gap:1.2rem}
  .modal__shell{grid-template-columns:.9fr 1.1fr}
  .modal__media{aspect-ratio:auto;min-height:100%}
  .modal__body{padding:2.6rem}
  .bulk__grid{grid-template-columns:.8fr 1.2fr}
  .proc__list{grid-template-columns:repeat(4,1fr);gap:2rem;padding:3.2rem 0 0}
  .proc__list::before,.proc__list::after{left:0;right:0;top:.4rem;bottom:auto;width:auto;height:2px}
  .proc__list::after{transform-origin:left;transform:scaleX(var(--p))}
  .proc__step::before{left:0;top:-3.2rem}
  .faq__grid{grid-template-columns:.9fr 1.1fr;gap:clamp(2rem,6vw,6rem)}
  .faq__grid .sec__head{position:sticky;top:7rem;margin-bottom:0}
  .contact__grid{grid-template-columns:.9fr 1.1fr;gap:clamp(2.5rem,6vw,6rem)}
  .foot__top{grid-template-columns:1.6fr 1fr 1fr}
}
/* escena anclada (escritorio): sólo si el JS activó el pin */
@media (min-width:960px){
  .has-pin .sys{padding:0}
  .has-pin .sys__pin{position:relative;height:100vh;min-height:660px;display:flex;align-items:center;overflow:hidden}
  .has-pin .sys__wrap{display:flex;flex-direction:column;justify-content:center;gap:clamp(1rem,2.6vh,2.2rem)}
  .has-pin .sys__head{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:end;margin:0}
  .has-pin .sys__head .eyebrow{margin:0 0 .6rem}
  .has-pin .sys__head .h2{font-size:clamp(2.2rem,3.8vw,3.7rem);max-width:none}
  .has-pin .sys__body{position:relative;height:clamp(380px,56vh,540px);margin-bottom:2.4rem}
  .has-pin .sys__num{display:block;position:absolute;left:-.5%;bottom:-9%;z-index:0;font:900 clamp(13rem,28vw,26rem)/.72 var(--f-d);color:transparent;-webkit-text-stroke:1px rgba(var(--tint),.16);pointer-events:none;overflow:hidden}
  .has-pin .sys__num span{display:block}
  .has-pin .sys__list{position:relative;z-index:1;display:block;height:100%}
  .has-pin .stage{position:absolute;inset:0;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);align-items:center}
  .has-pin .stage__title{font-size:clamp(3.4rem,6.6vw,6.4rem)}
  .has-pin .stage__media{height:100%;aspect-ratio:auto;max-height:none}
  .has-pin .sys__rail{position:absolute;left:0;right:0;bottom:-2.3rem;display:flex;justify-content:space-between;z-index:2}
  .has-pin .sys__rail::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--line-2)}
  .has-pin .sys__fill{position:absolute;left:0;right:0;top:-.5px;height:2px;background:rgb(var(--tint));transform-origin:left;transform:scaleX(var(--p,0));box-shadow:0 0 12px rgba(var(--tint),.9)}
  .has-pin .sys__rail button{position:relative;padding:.9rem 0 0;color:var(--dim);transition:color .3s}
  .has-pin .sys__rail button:hover,.sys__rail button.is-on{color:#fff}
  .has-pin .sys__rail button::before{content:"";position:absolute;left:0;top:-3px;width:7px;height:7px;background:var(--bg-2);border:1px solid var(--dim);transform:rotate(45deg);transition:background .3s,border-color .3s}
  .has-pin .sys__rail button.is-on::before{background:rgb(var(--tint));border-color:rgb(var(--tint))}
}
@media (min-width:1200px){
  .hdr__nav{display:block}
  .hdr__nav ul{display:flex;gap:.3rem}
  .hdr__nav a{display:block;padding:.6rem 1rem;font:600 .98rem/1 var(--f-d);letter-spacing:.14em;text-transform:uppercase;color:var(--mut);transition:color .3s}
  .hdr__nav a:hover{color:#fff}
  .burger{display:none}
  .cat__grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .hud-sec{display:flex}
}
@media (hover:hover) and (pointer:fine){
  .cursor{display:block}
}
@media (max-width:1199px){
  .hdr__cta{display:none}
}
@media (max-width:959px){
  .hcard--a{left:-2%}
  .htag--2{right:0}
}

/* 21 · MOVIMIENTO REDUCIDO ------------------------------------------------ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .js [data-reveal],.js [data-hero],.js .hero__foot,.js .hl__in,.js .w .wi,.js .mw,.js .foot__word span{opacity:1!important;transform:none!important}
  .js [data-split]:not(.is-split){visibility:visible}
  .grain,.loader{display:none}
}
.no-anim .loader{display:none}
.no-anim [data-reveal],.no-anim [data-hero],.no-anim .hero__foot,.no-anim .hl__in,.no-anim .w .wi,.no-anim .mw,.no-anim .foot__word span{opacity:1!important;transform:none!important}
.no-anim [data-split]{visibility:visible!important}

/* imágenes tipo diapositiva: se muestran completas, sin recortar el texto del producto */
.pcard[data-fit] .pcard__media{background:var(--mbg,#000)}
.pcard[data-fit] .pcard__media img{object-fit:contain}
.pcard[data-fit]:hover .pcard__media img{transform:scale(1.03)}
.modal__media[data-fit]{background:var(--mbg,#000)}
.modal__media[data-fit] img{object-fit:contain}

/* rejillas seguras en móvil: una columna que nunca excede el viewport */
.contact__grid,.faq__grid,.polish__grid,.bulk__grid,.hero__inner,.foot__top,.fres,.stage,.sys__body{grid-template-columns:minmax(0,1fr)}
.contact__grid>*,.faq__grid>*,.polish__grid>*,.bulk__grid>*,.hero__inner>*,.foot__top>*,.fres>*,.stage>*{min-width:0}
.contact__info li{flex-wrap:wrap;align-items:baseline}
.btn--block{padding:0 1.2rem;white-space:normal}
@media (min-width:960px){
  .hero__inner{grid-template-columns:1.12fr .88fr}
  .polish__grid{grid-template-columns:.85fr 1.15fr}
  .fres{grid-template-columns:.9fr 1.1fr}
  .bulk__grid{grid-template-columns:.8fr 1.2fr}
  .faq__grid{grid-template-columns:.9fr 1.1fr}
  .contact__grid{grid-template-columns:.9fr 1.1fr}
  .foot__top{grid-template-columns:1.6fr 1fr 1fr}
  .has-pin .stage{grid-template-columns:1fr 1fr}
}
@media (max-width:420px){
  .btn--lg{padding:0 1.3rem;font-size:.96rem;letter-spacing:.1em}
  .cat__actions,.hero__cta,.finale__cta{width:100%}
  .cat__actions .btn,.hero__cta .btn,.finale__cta .btn{flex:1 1 100%;max-width:100%}
}