/* Importadora Solidaria — landing de equipos. Tokens del manual de marca. */
:root{
  --medianoche:#051D43; --abismo:#030F26; --solidario:#2F8AFD; --solidario-osc:#1F6FD6;
  --cielo:#9CC8FF; --hielo:#EEF3FA; --blanco:#fff; --acero:#5B6E8C;
  --cta:var(--solidario); --cta-texto:#fff;
  --f-titular:"Poppins",system-ui,sans-serif; --f-texto:"Poppins",system-ui,sans-serif; --f-dato:"IBM Plex Mono",ui-monospace,monospace;
  --t-h1:clamp(2.1rem,5.2vw,4.2rem); --t-h2:clamp(1.9rem,4.4vw,3.4rem); --t-cuerpo:clamp(1rem,1.1vw,1.08rem);
  --chaflan:16px; --radio:6px;
  --esp:clamp(64px,9vw,128px);
  --curva:cubic-bezier(.2,.7,.2,1);
}
/* Tema del recorrido (scroll-world) */
:root,.sw-root{--sw-bg:#C9D8EE;--sw-ink:#fff;--sw-ink-soft:#C6D4EA;--sw-accent:#2F8AFD;--sw-font-display:var(--f-titular);--sw-font-body:var(--f-texto);}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:auto;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--f-texto);color:var(--medianoche);background:var(--hielo);overflow-x:clip;line-height:1.55}
img{max-width:100%;display:block}
a{color:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.contenedor{width:min(1240px,100% - 32px);margin-inline:auto}
.pendiente{background:#FFE45C;color:#051D43;font-family:var(--f-dato);font-size:.8rem;padding:2px 6px}

/* ===== Botones ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 28px;background:var(--cta);color:var(--cta-texto);font-family:var(--f-titular);font-weight:900;font-size:1.05rem;letter-spacing:.01em;text-transform:uppercase;text-decoration:none;border:0;cursor:pointer;
  clip-path:polygon(0 0,calc(100% - var(--chaflan)) 0,100% var(--chaflan),100% 100%,var(--chaflan) 100%,0 calc(100% - var(--chaflan)));
  transition:background .25s var(--curva),transform .25s var(--curva)}
.btn:hover{background:#5AA2FF}
.btn:active{transform:scale(.97)}
.btn:focus-visible,.chip:focus-visible,.interruptor input:focus-visible+.interruptor__pista{outline:3px solid var(--cielo);outline-offset:3px}
.btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.btn--chico{min-height:44px;padding:10px 18px;font-size:.88rem;--chaflan:11px}
.btn--wa{text-transform:none}

/* ===== Cabecera ===== */
.cab{position:fixed;top:0;left:0;right:0;z-index:90;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px clamp(16px,4vw,48px);
  background:color-mix(in srgb,#fff 72%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid color-mix(in srgb,var(--medianoche) 8%,transparent)}
.cab__logo img{height:34px;width:auto}
.cab__logo-oscuro{display:none}
.cab__nav{display:flex;gap:28px;font-size:.92rem;font-weight:500}
.cab__nav a{text-decoration:none;padding:10px 0}
.cab__nav a:hover{color:var(--solidario-osc)}
@media (max-width:760px){.cab__nav{display:none}.cab__logo img{height:28px}}

/* ===== Recorrido (scroll-world) ===== */
.recorrido{position:relative}
.sw-topbar{display:none}
.sw-sky{background:linear-gradient(180deg,#EEF3FA 0%,#B9CDEB 45%,#2A4B80 78%,#051D43 100%)}
.sw-sky__grad,.sw-sky__glow,.sw-particles{display:none}
.sw-scrollbar{top:auto;bottom:0;height:4px;background:color-mix(in srgb,var(--solidario) 20%,transparent)}
.sw-copylayer::before{display:none}
.sw-copy{top:auto;bottom:clamp(32px,7vh,80px);width:min(40vw,470px);padding:30px 32px 32px;background:color-mix(in srgb,var(--medianoche) 92%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,26px 100%,0 calc(100% - 26px))}
.sw-copy__num{font-family:var(--f-dato);color:var(--cielo)}
.sw-copy__eyebrow{font-family:var(--f-dato);font-weight:600;letter-spacing:.14em;color:var(--cielo);margin-top:14px}
.sw-copy__title{font-weight:900;text-transform:uppercase;letter-spacing:-.025em;line-height:.95;font-size:clamp(1.9rem,3.6vw,3.1rem);color:#fff;text-shadow:none}
.sw-copy__title em{font-style:normal;color:var(--solidario)}
.sw-copy__body{color:#D5E1F3;text-shadow:none}
.sw-copy__tags li{font-family:var(--f-dato);font-weight:600;font-size:.78rem;color:var(--cielo);background:transparent;border:1px solid var(--solidario);border-radius:0;padding:6px 10px}
.sw-copy__cta{gap:10px}
.sw-btn{border-radius:0;font-family:var(--f-titular);font-weight:900;text-transform:uppercase;font-size:.95rem;min-height:48px;display:inline-flex;align-items:center;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.sw-btn--primary{background:var(--solidario);color:#fff}
.sw-btn--ghost{background:#fff;color:var(--medianoche);border:0}
.sw-route__label{color:var(--medianoche);font-family:var(--f-dato)}
.sw-hint{color:#fff;font-family:var(--f-dato);font-weight:600;left:auto;right:clamp(24px,5vw,64px);transform:none}
.sw-hint i{border-color:color-mix(in srgb,#fff 55%,transparent)}
@media (max-width:860px){
  .sw-copy{width:auto;padding:18px 18px 20px;bottom:calc(20px + env(safe-area-inset-bottom))}
  .sw-copy__num{display:none}
  .sw-copy__eyebrow{margin-top:0;font-size:.72rem}
  .sw-copy__title{font-size:clamp(1.45rem,6.6vw,2.1rem);margin-top:8px}
  .sw-copy__body{font-size:.92rem;line-height:1.45;margin-top:8px}
  .sw-copy__tags{display:none}
  .sw-copy__cta{margin-top:14px}
  .sw-route,.sw-hint{display:none}
  .sw-scene__video,.sw-scene__still{object-position:58% 50%}
}
/* Al terminar el recorrido, se apaga su interfaz fija */
body.fuera-recorrido .sw-copylayer,body.fuera-recorrido .sw-route,body.fuera-recorrido .sw-hint,body.fuera-recorrido .sw-scrollbar,body.fuera-recorrido .sw-stage,body.fuera-recorrido .sw-sky{visibility:hidden}
.recorrido__sinjs{padding:140px 16px 80px;text-align:center}

.tras-recorrido{position:relative;z-index:70;background:var(--hielo)}

/* ===== Beneficios ===== */
.beneficios{background:var(--medianoche);color:#fff;padding:28px 16px}
.beneficios ul{list-style:none;margin:0 auto;padding:0;max-width:1240px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.beneficios li{display:flex;align-items:center;gap:12px;justify-content:center}
.beneficios p{margin:0;font-weight:900;text-transform:uppercase;line-height:1.1;font-size:.92rem}
.beneficios b{display:block;color:var(--cielo);font-weight:500;font-size:.78rem;letter-spacing:.08em}
.hex{flex-shrink:0;width:52px;height:58px;display:grid;place-items:center;background:var(--solidario);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.hex svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:760px){.beneficios ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 10px}.beneficios li{justify-content:flex-start}}

/* ===== Catálogo ===== */
.catalogo{padding:var(--esp) 0;background:var(--hielo);
  background-image:linear-gradient(30deg,transparent 49.6%,rgba(47,138,253,.07) 50%,transparent 50.4%),linear-gradient(-30deg,transparent 49.6%,rgba(47,138,253,.07) 50%,transparent 50.4%);background-size:80px 46px}
.etiqueta{font-family:var(--f-dato);font-weight:600;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;color:var(--solidario-osc);margin:0 0 12px}
.etiqueta--clara{color:var(--cielo)}
h2{font-family:var(--f-titular);font-weight:900;text-transform:uppercase;letter-spacing:-.03em;line-height:.95;font-size:var(--t-h2);margin:0}
h2 span{color:var(--solidario-osc)}
.catalogo__cab{max-width:760px}
.catalogo__intro{font-size:var(--t-cuerpo);color:#34507E;margin:16px 0 0}
.filtros{position:sticky;top:64px;z-index:5;margin:36px 0 20px;padding:14px 0;background:color-mix(in srgb,var(--hielo) 92%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.filtros__chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
.filtros__chips::-webkit-scrollbar{display:none}
.chip{flex-shrink:0;min-height:44px;padding:8px 16px;border:1.5px solid var(--cielo);background:#fff;color:var(--medianoche);font:600 .9rem var(--f-texto);cursor:pointer;border-radius:999px;transition:background .2s,color .2s,border-color .2s}
.chip small{font-family:var(--f-dato);font-size:.72rem;color:var(--acero);margin-left:4px}
.chip:hover{border-color:var(--solidario)}
.chip.is-activo{background:var(--medianoche);border-color:var(--medianoche);color:#fff}
.chip.is-activo small{color:var(--cielo)}
.filtros__fila{display:flex;gap:16px;align-items:center;margin-top:10px;flex-wrap:wrap}
.buscar{flex:1 1 260px;display:flex;align-items:center;gap:10px;min-height:48px;padding:0 14px;background:#fff;border:1.5px solid var(--cielo)}
.buscar:focus-within{border-color:var(--solidario)}
.buscar svg{width:20px;height:20px;fill:none;stroke:var(--acero);stroke-width:2;stroke-linecap:round}
.buscar input{flex:1;border:0;outline:0;font:500 1rem var(--f-texto);color:var(--medianoche);background:transparent;min-width:0}
.interruptor{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:.95rem;cursor:pointer;min-height:44px}
.interruptor input{position:absolute;opacity:0}
.interruptor__pista{width:46px;height:26px;border-radius:999px;background:#C9D5E8;position:relative;transition:background .2s}
.interruptor__pista::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:transform .2s var(--curva)}
.interruptor input:checked+.interruptor__pista{background:var(--solidario-osc)}
.interruptor input:checked+.interruptor__pista::after{transform:translateX(20px)}
.resultado{font-family:var(--f-dato);font-size:.85rem;color:var(--acero);margin:0 0 16px}
.grilla{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.prod{background:#fff;display:flex;flex-direction:column;border:1px solid #DCE5F2;transition:transform .3s var(--curva),box-shadow .3s var(--curva),border-color .3s}
.prod:hover{transform:translateY(-4px);box-shadow:0 18px 40px -22px rgba(5,29,67,.45);border-color:var(--cielo)}
.prod__foto{position:relative;aspect-ratio:1;background:radial-gradient(circle at 50% 60%,#fff 0%,#F2F6FB 70%);overflow:hidden}
.prod__foto img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--curva)}
.prod:hover .prod__foto img{transform:scale(1.04)}
.prod__estado{position:absolute;left:12px;top:12px;font-family:var(--f-dato);font-weight:600;font-size:.72rem;letter-spacing:.06em;padding:4px 8px}
.prod__estado--stock{background:var(--solidario-osc);color:#fff}
.prod__estado--pedido{background:#fff;color:#34507E;border:1px solid var(--cielo)}
.prod__cuerpo{padding:16px 16px 18px;display:flex;flex-direction:column;gap:10px;flex:1}
.prod__paso{font-family:var(--f-dato);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--acero)}
.prod__nombre{margin:0;font-size:1rem;font-weight:700;line-height:1.25}
.prod__pie{margin-top:auto;display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.prod__precio{font-family:var(--f-titular);font-weight:900;font-size:1.4rem;line-height:1;letter-spacing:-.02em}
.prod__precio small{font-size:.8rem;font-weight:700;margin-left:3px}
.prod__precio--consultar{font-size:1.05rem;color:#34507E}
.prod__btn{min-height:44px;padding:10px 14px;font-size:.8rem;--chaflan:10px}
.prod__btn svg{width:18px;height:18px}
.vacio{padding:30px 0;font-size:1.05rem}
@media (max-width:600px){
  .grilla{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .prod__cuerpo{padding:12px 12px 14px;gap:8px}
  .prod__paso{display:none}
  .prod__nombre{font-size:.86rem}
  .prod__pie{flex-direction:column;align-items:stretch;gap:10px}
  .prod__precio{font-size:1.2rem}
  .prod__btn{width:100%}
  .prod__estado{left:8px;top:8px;font-size:.62rem;padding:3px 6px}
  .filtros{top:56px}
}
.js .prod{opacity:0;transform:translateY(16px)}
.js .prod.is-visible{opacity:1;transform:none;transition:opacity .5s var(--curva),transform .5s var(--curva),box-shadow .3s,border-color .3s}
.js .prod.is-visible:hover{transform:translateY(-4px)}

/* ===== Envíos ===== */
.envios{background:var(--medianoche);color:#fff;padding:var(--esp) 0;position:relative;overflow:hidden}
.envios::before{content:"";position:absolute;right:-120px;top:-160px;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(47,138,253,.35),rgba(47,138,253,0) 65%)}
.envios__grid{position:relative;display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center}
.envios h2 span{color:var(--solidario)}
.envios__bloque p:not(.etiqueta){color:#C6D4EA;font-size:var(--t-cuerpo);margin:18px 0 28px;max-width:46ch}
.sucursales{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.sucursal{display:flex;flex-direction:column;gap:6px;padding:20px 22px;background:#0A2A5C;border-left:4px solid var(--solidario)}
.sucursal__ciudad{font-weight:900;text-transform:uppercase;font-size:1.3rem;letter-spacing:-.01em}
@media (max-width:860px){.envios__grid{grid-template-columns:1fr}}

/* ===== Cierre ===== */
.cierre{padding:var(--esp) 0;text-align:center;background:linear-gradient(180deg,var(--hielo),#DCE8F8)}
.cierre__in{display:flex;flex-direction:column;align-items:center;gap:20px}
.cierre__iso{width:84px;height:auto;filter:drop-shadow(0 10px 18px rgba(47,138,253,.35))}
.cierre__iso{background:var(--medianoche);padding:14px;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);width:104px}
.cierre h2{max-width:16ch}
.cierre p{max-width:52ch;margin:0;color:#34507E;font-size:var(--t-cuerpo)}

/* ===== Pie ===== */
.pie{background:var(--abismo);color:#C6D4EA;padding:44px 0 calc(44px + env(safe-area-inset-bottom));font-size:.88rem}
.pie__in{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.pie img{height:36px;width:auto;margin-bottom:6px}
.pie p{margin:0}
.pie__nota{color:#8A9BB8;font-size:.8rem}

@media (prefers-reduced-motion:reduce){
  .js .prod{opacity:1;transform:none}
  .btn,.prod,.prod__foto img{transition:none}
}
