/* Manrope alojada en el sitio (variable, pesos 400 a 800). Licencia SIL OFL 1.1: ver fuentes/OFL.txt */
@font-face{font-family:Manrope;font-style:normal;font-weight:400 800;font-display:swap;src:url(fuentes/manrope-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* Paleta del logo: fondo blanco, grafito y naranja. Los tintes salen de esos dos colores. */
:root{
  --blanco:#FFFFFF;
  --grafito:#22252A;
  --naranja:#FF5A1F;
  --naranja-claro:#FFEDE5;
  --naranja-oscuro:#D94512;
  --grafito-suave:#5B5F66;
  --grafito-claro:#F2F2F3;
  --borde:2.5px solid var(--grafito);
  --sombra:5px 5px 0 var(--grafito);
  --radio:18px;
  --lado:20px; /* margen lateral de todo el sitio */
  --ancho:1180px; /* ancho del contenido de todo el sitio */
  --entre:36px; /* mitad del espacio vertical entre secciones */
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--blanco);color:var(--grafito);font-family:Manrope,system-ui,sans-serif;font-size:17px;line-height:1.5;overflow-x:hidden}
a{color:inherit}
.contenedor{max-width:var(--ancho);margin:0 auto;padding:0 var(--lado)}

/* ---------- Botones (se hunden al tocarlos) ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;font:800 16px Manrope,system-ui,sans-serif;padding:15px 24px;border-radius:14px;border:var(--borde);cursor:pointer;text-decoration:none;transition:transform .08s,box-shadow .08s;white-space:nowrap}
.btn-naranja{background:var(--naranja);color:var(--blanco);box-shadow:0 5px 0 var(--grafito)}
.btn-blanco{background:var(--blanco);color:var(--grafito);box-shadow:0 5px 0 var(--grafito)}
.btn-grafito{background:var(--grafito);color:var(--blanco);box-shadow:0 5px 0 var(--naranja);border-color:var(--grafito)}
.btn:hover{transform:translateY(-2px);box-shadow:0 7px 0 var(--grafito)}
.btn-grafito:hover{box-shadow:0 7px 0 var(--naranja)}
.btn:active{transform:translateY(5px);box-shadow:0 0 0 var(--grafito)}

/* ---------- Menú ---------- */
header.menu{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);border-bottom:1.5px solid var(--grafito-claro)}
.menu .contenedor{display:flex;align-items:center;justify-content:space-between;height:74px}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo svg{width:42px;height:42px}
.logo:hover .libro{animation:tambaleo .5s ease}
.logo:hover .libro:nth-child(2){animation-delay:.06s}
.logo:hover .libro:nth-child(3){animation-delay:.12s}
@keyframes tambaleo{30%{transform:translateX(4px) rotate(-3deg)}60%{transform:translateX(-3px) rotate(2deg)}}
.libro{transform-box:fill-box;transform-origin:center}
.logo b{font-size:25px;letter-spacing:-.6px;font-weight:800}
.logo b span{font-weight:500}
.menu nav{display:flex;gap:28px;font-weight:700;font-size:15px}
.menu nav a{text-decoration:none;position:relative}
.menu nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:3px;background:var(--naranja);border-radius:3px;transition:right .2s}
.menu nav a:hover::after{right:0}
.menu .btn{padding:10px 16px;font-size:14px;box-shadow:0 4px 0 var(--grafito)}
.wa{width:18px;height:18px}

/* ---------- Hero ---------- */
.hero{padding:56px 0 0}
.hero-grilla{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
h1{font-size:clamp(38px,4.6vw,60px);line-height:1.03;letter-spacing:-2.4px;font-weight:800;margin-bottom:20px}
.bajada{font-size:20px;color:var(--grafito-suave);max-width:540px}
.bajada b{color:var(--grafito)}

.microtexto{font-size:14px;color:var(--grafito-suave);margin-top:12px;display:flex;gap:16px;flex-wrap:wrap}
.microtexto span::before{content:"✓ ";color:var(--naranja);font-weight:800}

/* ---------- Secciones ---------- */
section{padding:var(--entre) 0}
[id]{scroll-margin-top:90px}
.titulo-seccion{text-align:center;max-width:780px;margin:0 auto 40px}
.titulo-seccion h2{font-size:clamp(32px,4.5vw,52px);letter-spacing:-1.6px;line-height:1.05;font-weight:800;margin:14px 0}
.titulo-seccion p{font-size:19px;color:var(--grafito-suave)}
.etiqueta{display:inline-block;font-weight:800;font-size:13px;letter-spacing:.6px;text-transform:uppercase;color:var(--naranja-oscuro)}

.porque,.demo,.final{width:calc(100% - 2*var(--lado));max-width:calc(var(--ancho) - 2*var(--lado));margin-left:auto;margin-right:auto}
.porque{background:var(--grafito);color:var(--blanco);border-radius:36px;margin-top:var(--entre);margin-bottom:var(--entre);padding:72px 0}
.porque .titulo-seccion p{color:#C9CBCF}
.porque .etiqueta{color:var(--naranja)}

/* ---------- Un día sin / con sistema ---------- */
.comparar-cab{display:flex;justify-content:center;margin-bottom:34px}
.interruptor{display:inline-grid;grid-template-columns:1fr 1fr;border:var(--borde);border-radius:99px;padding:5px;background:var(--blanco);position:relative;box-shadow:0 5px 0 var(--grafito)}
.interruptor button{position:relative;z-index:1;font:800 16px Manrope,system-ui,sans-serif;border:0;background:none;padding:12px 26px;border-radius:99px;cursor:pointer;color:var(--grafito);transition:color .25s}
.interruptor button.activo{color:var(--blanco)}
.interruptor .bolita{position:absolute;top:5px;bottom:5px;left:5px;width:calc((100% - 10px)/2);border-radius:99px;background:var(--grafito);transition:transform .3s cubic-bezier(.3,.7,.3,1),background .3s}
.interruptor.con .bolita{background:var(--naranja);transform:translateX(100%)}
.momentos{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.momento{border:var(--borde);border-radius:20px;padding:22px;background:var(--blanco);transition:background .35s,color .35s,transform .35s;min-height:230px;display:flex;flex-direction:column}
.momento .hora{font-weight:800;font-size:13px;color:var(--grafito-suave);transition:color .35s}
.momento h3{font-size:19px;letter-spacing:-.4px;line-height:1.2;margin:8px 0 12px}
.momento .res{font-size:15px;font-weight:600;margin-top:auto;padding-top:12px;border-top:2px dashed currentColor}
.momento .res span{display:block}
.momento .res .r-con{display:none}
.comparar.con .momento{background:var(--naranja-claro)}
.comparar.con .momento .res .r-sin{display:none}
.comparar.con .momento .res .r-con{display:block}
.comparar.con .momento .res{animation:pop .4s ease}
@keyframes pop{from{opacity:0;transform:translateY(6px)}}
.comparar .icono-res{font-weight:800;margin-right:4px}
.comparar:not(.con) .icono-res::before{content:"✕";color:var(--grafito-suave)}
.comparar.con .icono-res::before{content:"✓";color:var(--naranja)}

/* ---------- Demo del escáner ---------- */
.demo{background:var(--grafito);color:var(--blanco);border-radius:36px;margin-top:var(--entre);margin-bottom:var(--entre);padding:72px 0}
.demo .titulo-seccion p{color:#C9CBCF}
.demo .etiqueta{color:var(--naranja)}
.panel{display:grid;animation:aparecer .35s ease;grid-template-columns:1fr 1.25fr;gap:40px;align-items:center;background:var(--blanco);color:var(--grafito);border-radius:28px;padding:40px;border:var(--borde);box-shadow:0 10px 0 var(--naranja)}
@keyframes aparecer{from{opacity:0;transform:translateY(14px)}}
.panel h3{font-size:34px;letter-spacing:-1px;line-height:1.08;margin-bottom:14px}
.panel ul{list-style:none;margin:18px 0 0;display:grid;gap:10px}
.panel li{display:flex;gap:10px;font-weight:600}
.panel li::before{content:"";flex:none;width:22px;height:22px;border-radius:7px;background:var(--naranja) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/14px no-repeat;margin-top:2px}

.estante-escena{background:var(--naranja-claro);border:var(--borde);border-radius:20px;padding:24px;position:relative;overflow:hidden}
.estante{display:flex;align-items:flex-end;gap:5px;height:170px;border-bottom:8px solid var(--grafito);padding:0 6px;position:relative}
.lomo{border:2px solid var(--grafito);border-radius:4px 4px 0 0;writing-mode:vertical-rl;transform:rotate(180deg);font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;padding:6px 0;transition:background .25s,color .25s}
.lomo.n{background:var(--naranja);color:var(--blanco)}
.lomo.g{background:var(--grafito);color:var(--blanco)}
.lomo.b{background:var(--blanco)}
.lomo.leido{outline:3px solid var(--naranja);outline-offset:2px}
.rayo{position:absolute;top:-10px;bottom:-4px;width:6px;background:var(--naranja);box-shadow:0 0 18px 6px rgba(255,90,31,.55);border-radius:4px;left:0;animation:barrido 4.5s ease-in-out infinite}
@keyframes barrido{0%{left:0}50%{left:calc(100% - 6px)}100%{left:0}}
.camara{position:absolute;top:14px;right:16px;background:var(--grafito);color:var(--blanco);font-size:12px;font-weight:800;padding:6px 10px;border-radius:99px;display:flex;gap:6px;align-items:center}
.camara i{width:8px;height:8px;border-radius:50%;background:var(--naranja);animation:latido 1s infinite}
@keyframes latido{50%{transform:scale(1.7);opacity:.4}}
.tabla{margin-top:18px;background:var(--blanco);border:2px solid var(--grafito);border-radius:12px;overflow:hidden;font-size:13px}
.tabla div{display:grid;grid-template-columns:2fr 1.4fr .7fr;gap:8px;padding:8px 12px;border-bottom:1.5px solid var(--grafito-claro);font-weight:600}
.tabla div:first-child{background:var(--grafito);color:var(--blanco);font-weight:800}
.tabla div:last-child{border:0}
.tabla .nueva{animation:entrar .5s ease}
@keyframes entrar{from{background:var(--naranja);color:var(--blanco)}}

.foto-panel{border:var(--borde);border-radius:20px;overflow:hidden;position:relative;aspect-ratio:4/3;box-shadow:6px 6px 0 var(--grafito)}
.foto-panel img{width:100%;height:100%;object-fit:cover}
.foto-panel .tel{position:absolute;right:18px;bottom:-30px;width:150px;background:var(--grafito);border-radius:22px;padding:8px;border:2px solid var(--grafito);box-shadow:4px 4px 0 var(--naranja);transform:rotate(4deg)}
.foto-panel .tel div{background:var(--blanco);border-radius:15px;padding:12px 10px 40px;font-size:11px;font-weight:700;display:grid;gap:6px}
.foto-panel .tel span{display:block;height:8px;border-radius:4px;background:var(--grafito-claro)}
.foto-panel .tel span.n{background:var(--naranja);width:70%}
.foto-panel .tel b{background:var(--naranja);color:#fff;border-radius:8px;padding:6px;text-align:center;font-size:10px}

/* ---------- La promesa (bento) ---------- */
.bento{display:grid;grid-template-columns:repeat(6,1fr);grid-auto-rows:minmax(150px,auto);gap:18px}
.caja{border:var(--borde);border-radius:24px;padding:28px;position:relative;overflow:hidden}
.caja h3{font-size:26px;letter-spacing:-.8px;line-height:1.1;margin-bottom:10px}
.caja p{font-size:16px;opacity:.85}
.c-grande{grid-column:span 4;grid-row:span 2;background:var(--naranja);color:var(--blanco);display:flex;flex-direction:column;justify-content:center}
.c-grande h3{font-size:clamp(34px,4vw,54px);letter-spacing:-1.8px;max-width:560px}
.c-grande .moneda{position:static;flex:none;align-self:flex-start;margin-bottom:22px;width:84px;height:84px;border-radius:50%;background:var(--blanco);color:var(--naranja);border:var(--borde);display:grid;place-items:center;font-size:36px;font-weight:800;box-shadow:5px 5px 0 var(--grafito)}
.c-foto{grid-column:span 2;grid-row:span 2;padding:0}
.c-foto img{width:100%;height:100%;object-fit:cover;display:block}
.c-grafito{grid-column:span 3;background:var(--grafito);color:var(--blanco)}
.c-clara{grid-column:span 3;background:var(--naranja-claro)}

/* ---------- Pasos ---------- */
.pasos{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.pasos.tres{grid-template-columns:repeat(3,1fr)}
.paso{border:var(--borde);border-radius:24px;padding:30px 26px;background:var(--blanco);box-shadow:var(--sombra)}
.paso .num{width:58px;height:58px;border-radius:16px;background:var(--naranja);color:var(--blanco);border:var(--borde);display:grid;place-items:center;font-size:28px;font-weight:800;margin-bottom:18px;box-shadow:0 4px 0 var(--grafito)}
.paso:nth-child(2) .num{background:var(--grafito)}
.paso h3{font-size:22px;letter-spacing:-.5px;margin-bottom:8px}
.paso p{color:var(--grafito-suave);font-size:16px}



/* ---------- Preguntas ---------- */
.preguntas{display:grid;gap:14px}
details{border:var(--borde);border-radius:18px;background:var(--blanco);transition:box-shadow .2s}
details[open]{box-shadow:var(--sombra)}
summary{list-style:none;cursor:pointer;padding:20px 24px;font-weight:800;font-size:18px;display:flex;justify-content:space-between;align-items:center;gap:16px}
summary::-webkit-details-marker{display:none}
summary .mas{flex:none;width:34px;height:34px;border-radius:10px;background:var(--naranja-claro);display:grid;place-items:center;font-size:22px;transition:transform .25s,background .2s}
details[open] summary .mas{transform:rotate(45deg);background:var(--naranja);color:var(--blanco)}
details p{padding:0 24px 22px;color:var(--grafito-suave);max-width:780px}

/* ---------- Llamado final ---------- */
.final{background:var(--naranja);border:var(--borde);border-radius:36px;display:grid;grid-template-columns:1.3fr 1fr;overflow:hidden;color:var(--blanco)}
.final .txt{padding:56px}
.final h2{font-size:clamp(34px,4.6vw,60px);letter-spacing:-2px;line-height:1.02;margin-bottom:18px}
.final p{font-size:19px;max-width:520px;margin-bottom:30px}
.final .botones{display:flex;gap:14px;flex-wrap:wrap}
.final .foto-final{border-left:var(--borde);min-height:260px;position:relative}
.final .foto-final img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

footer{padding:36px 0 40px;font-size:14px;color:var(--grafito-suave)}
footer .contenedor{display:flex;justify-content:space-between;gap:10px 20px;flex-wrap:wrap;align-items:center}
.pie-links{display:flex;gap:6px 18px;flex-wrap:wrap;font-size:13px}

/* Aparición al bajar */
.js .revelar{opacity:0;transition:opacity .5s ease}
.js .revelar.ver{opacity:1}

/* ---------- Anchos intermedios y celular ---------- */
@media (max-width:980px){
  .hero-grilla,.panel,.final{grid-template-columns:1fr}
  .bento{grid-template-columns:1fr 1fr}
  .c-grande{grid-column:span 2}
  .c-foto{grid-column:span 2;grid-row:span 1;height:260px}
  .c-grafito,.c-clara{grid-column:span 1}
  .pasos{grid-template-columns:1fr 1fr}
  .final .foto-final{border-left:0;border-top:0;min-height:240px}
  .final .txt{padding:44px 32px 36px}
}
@media (max-width:760px){
  .pasos.tres,.pasos.filas{grid-template-columns:1fr}
  .momentos{grid-template-columns:1fr}
  .momento{min-height:0}
}
@media (max-width:600px){
  :root{--lado:16px;--entre:28px}
  body{font-size:16px}
  h1{letter-spacing:-1.6px}
  .bento{grid-template-columns:1fr}
  .c-grande,.c-grafito,.c-clara,.c-foto{grid-column:span 1}
  .pasos{grid-template-columns:1fr}
  .c-grande .moneda{width:68px;height:68px;font-size:28px}
  .porque,.demo{padding:48px 0;border-radius:26px}
  .final{border-radius:26px}
  .panel{padding:22px}
  .panel h3{font-size:27px}
  .interruptor button{padding:11px 16px;font-size:15px}
  .final .txt{padding:36px 22px 28px}
  .final p{margin-bottom:22px}
  .foto-panel .tel{display:none}
}
/* ---------- Sitio de varias páginas ---------- */
.menu nav a.aqui::after{right:0}
.intro-pagina{padding:56px 0 12px}
.intro-pagina h1{font-size:clamp(34px,5vw,58px);letter-spacing:-1.8px;line-height:1.06;font-weight:800;margin:14px 0;text-wrap:balance}
.intro-pagina .titulo-seccion{max-width:820px;margin-bottom:0}
section.demo + section.demo{margin-top:0}
.productos{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.producto{display:flex;flex-direction:column;border:var(--borde);border-radius:24px;padding:30px;background:var(--blanco);text-decoration:none;box-shadow:var(--sombra);transition:transform .2s,box-shadow .2s}
.producto:hover{transform:translate(-3px,-3px);box-shadow:8px 8px 0 var(--grafito)}
.producto.oscuro{background:var(--grafito);color:var(--blanco)}
.producto h3{font-size:32px;letter-spacing:-1px;margin:8px 0 10px}
.producto p{font-size:16px;opacity:.85;margin-bottom:18px}
.producto .ir{margin-top:auto;font-weight:800;color:var(--naranja)}
@media (max-width:600px){
  .solo-compu{display:none!important}
  .productos{grid-template-columns:1fr}
  .intro-pagina{padding:36px 0 8px}
  .comparar-cab{display:none}
  .comparar .momento{background:var(--naranja-claro)}
  .comparar .momento .res .r-sin,.comparar .momento .res .r-con{display:block}
  .comparar .momento .res .r-con{margin-top:12px}
  .comparar .momento .res .r-sin::before,.comparar .momento .res .r-con::before{display:block;font-size:12px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;margin-bottom:2px}
  .comparar .momento .res .r-sin::before{content:"Sin Liberstock";color:var(--grafito-suave)}
  .comparar .momento .res .r-con::before{content:"Con Liberstock";color:var(--naranja-oscuro)}
  .comparar .r-sin .icono-res::before{content:"✕";color:var(--grafito-suave)}
  .comparar .r-con .icono-res::before{content:"✓";color:var(--naranja)}
}
/* ---------- 21-oct: hero con el escáner, estados, escalera ---------- */
.hero .etiqueta{margin-bottom:12px}
.botones-hero{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}
.hero .microtexto{margin-top:18px}
.estado{align-self:flex-start;display:inline-block;font-size:12px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;padding:4px 10px;border-radius:99px;border:2px solid currentColor}
.estado.listo{color:var(--naranja)}
.estado.armando{color:var(--grafito-suave);border-style:dashed}
.producto.oscuro .estado.armando{color:#C9CBCF}
.datos-fijos{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.datos-fijos li{border:var(--borde);border-radius:18px;padding:20px;background:var(--blanco);color:var(--grafito)}
.datos-fijos b{font-size:34px;white-space:nowrap;letter-spacing:-1px;color:var(--naranja)}
.datos-fijos .para-vos{margin-top:8px;font-weight:700}
.datos-fijos small{display:block;margin-top:8px;font-size:12px;opacity:.7}
@media (min-width:1200px){
  .datos-fijos{grid-template-columns:repeat(4,1fr)}
}
@media (max-width:600px){
  .botones-hero{flex-direction:column}
  .botones-hero .btn{justify-content:center}
  .hero-grilla{gap:32px}
  .estante-escena{padding:14px}
  .estante{gap:3px;padding:0 3px}
  .datos-fijos{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.js .revelar{opacity:1}}

/* Antes eran style="" sueltos en los HTML */
.sec-cierre{padding-bottom:56px}
.sec-prueba{background:var(--naranja-claro);border-top:var(--borde);border-bottom:var(--borde);padding:72px 0;margin:var(--entre) 0}
.contenedor.angosto{max-width:760px}
.titulo-seccion.izq{text-align:left;max-width:720px;margin-left:auto;margin-right:auto}
.sep-arriba{margin-top:24px}
.sube-boton{margin-top:-8px}
.foto-panel .tel span.corto{width:60%}
.estante .lomo:nth-child(1){height:150px;width:30px}
.estante .lomo:nth-child(2){height:128px;width:26px}
.estante .lomo:nth-child(3){height:140px;width:32px}
.estante .lomo:nth-child(4){height:118px;width:24px}
.estante .lomo:nth-child(5){height:156px;width:34px}
.estante .lomo:nth-child(6){height:134px;width:28px}
.estante .lomo:nth-child(7){height:146px;width:30px}
.estante .lomo:nth-child(8){height:122px;width:26px}
.estante .lomo:nth-child(9){height:150px;width:30px}

/* Texto corrido de las páginas legales */
.angosto h2{margin:28px 0 10px}
.angosto h2:first-child{margin-top:0}
.angosto p{margin-bottom:12px}
.angosto ul{margin:0 0 12px;padding-left:22px}
.angosto li{margin-bottom:8px}

/* ---------- Bento de tres cajas (llena el ancho) ---------- */
.bento.tres{grid-template-columns:repeat(3,1fr)}
.bento.tres .c-grande{grid-column:span 2;grid-row:span 2}
.bento.tres .c-grafito,.bento.tres .c-clara{grid-column:span 1}
@media (max-width:980px){.bento.tres{grid-template-columns:1fr 1fr}.bento.tres .c-grande{grid-column:span 2;grid-row:auto}}
@media (max-width:600px){.bento.tres{grid-template-columns:1fr}.bento.tres .c-grande{grid-column:span 1}}
.panel>div:first-child{align-self:center}
.foto-panel{align-self:stretch;aspect-ratio:auto;min-height:300px}
@media (max-width:980px){.foto-panel{aspect-ratio:4/3;min-height:0}}

/* ---------- Portada: software y página conectados (dibujo fijo) ---------- */
.conexion{display:grid;justify-items:center;gap:18px;max-width:420px;width:100%;margin:0 auto}
.mini{width:100%;border:var(--borde);border-radius:20px;padding:16px 18px;background:var(--blanco);box-shadow:var(--sombra)}
.mini.sw{background:var(--grafito);color:var(--blanco);border-color:var(--grafito)}
.mini h4{font-size:13px;text-transform:uppercase;letter-spacing:.6px;color:var(--naranja);margin-bottom:8px}
.mini .fila{display:flex;justify-content:space-between;gap:10px;font-size:15px;font-weight:700;padding:7px 0;border-bottom:1.5px dashed rgba(255,255,255,.25)}
.mini .fila:last-child{border-bottom:0}
.mini .fila b{color:var(--naranja)}
.mini .ficha{display:grid;gap:2px;margin-bottom:12px}
.mini .ficha b{font-size:20px}
.mini .ficha span{color:var(--grafito-suave);font-size:14px}
.mini .ficha em{font-style:normal;font-weight:800;color:var(--naranja-oscuro);font-size:14px}
.falso-btn{display:block;text-align:center;background:var(--naranja);color:var(--blanco);border:var(--borde);border-radius:12px;padding:10px;font-weight:800;font-size:14px}
.flecha{font-size:30px;font-weight:800;color:var(--naranja);line-height:1}
.conexion .aclara{font-size:13px;color:var(--grafito-suave)}

/* ---------- Menú de celular (tres rayitas y panel al costado) ---------- */
.hamb,.cajon,.fondo-menu{display:none}
.hamb{width:46px;height:46px;border:var(--borde);border-radius:12px;background:var(--blanco);cursor:pointer;padding:0;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.hamb i{display:block;width:22px;height:3px;background:var(--grafito);border-radius:2px}
.cajon .cerrar{align-self:flex-end;width:44px;height:44px;border:var(--borde);border-radius:12px;background:var(--blanco);font-size:20px;font-weight:800;cursor:pointer;color:var(--grafito)}
.cajon nav{display:flex;flex-direction:column;margin:8px 0 18px}
.cajon nav a{padding:14px 4px;font-size:19px;font-weight:800;text-decoration:none;border-bottom:1.5px solid var(--grafito-claro)}
.cajon nav a.aqui{color:var(--naranja-oscuro)}
.cajon .btn{justify-content:center}
@media (max-width:900px){
  .menu nav,.menu .contenedor>.btn{display:none}
  .hamb{display:flex}
  .fondo-menu{display:block;position:fixed;inset:0;background:rgba(34,37,42,.55);z-index:40;opacity:0;visibility:hidden;transition:opacity .2s,visibility .2s}
  .cajon{display:flex;flex-direction:column;position:fixed;top:0;right:0;bottom:0;width:min(330px,86vw);background:var(--blanco);border-left:var(--borde);z-index:41;padding:16px 20px 24px;transform:translateX(100%);visibility:hidden;transition:transform .22s,visibility .22s;overflow-y:auto}
  .menu-abierto{overflow:hidden}
  .menu-abierto .cajon{transform:none;visibility:visible}
  .menu-abierto .fondo-menu{opacity:1;visibility:visible}
}

/* ---------- Beneficios (seis columnas: 3 arriba y 2 abajo, siempre cierra parejo) ---------- */
.beneficios{display:grid;grid-template-columns:repeat(6,1fr);gap:18px}
.beneficio{grid-column:span 2;border:var(--borde);border-radius:22px;padding:26px;background:var(--blanco)}
.beneficio:nth-child(n+4){grid-column:span 3;background:var(--naranja-claro)}
.beneficio h3{font-size:22px;letter-spacing:-.5px;line-height:1.15;margin-bottom:8px}
.beneficio p{color:var(--grafito-suave)}
@media (max-width:980px){.beneficios{grid-template-columns:1fr 1fr}.beneficio,.beneficio:nth-child(n+4){grid-column:span 1}.beneficio:last-child{grid-column:span 2}}
@media (max-width:600px){.beneficios{grid-template-columns:1fr}.beneficio:last-child{grid-column:span 1}}

.nota{text-align:center;max-width:720px;margin:28px auto 0}

.beneficios.seis .beneficio:nth-child(n+4){grid-column:span 2;background:var(--blanco)}
@media (max-width:980px){.beneficios.seis .beneficio:nth-child(n),.beneficios.seis .beneficio:last-child{grid-column:span 1}}

/* ---------- Pasos en filas (número a la izquierda, texto a la derecha) ---------- */
.pasos.filas{grid-template-columns:1fr 1fr}
.pasos.filas .paso{display:grid;grid-template-columns:58px 1fr;gap:4px 20px;align-items:start}
.pasos.filas .paso .num{grid-row:span 2;margin-bottom:0}
.pasos.filas .paso h3{align-self:end;margin-bottom:0}
@media (max-width:760px){.pasos.filas .paso{padding:24px 22px}}

/* ---------- Portada a anchos medianos: todo centrado ---------- */
@media (min-width:601px) and (max-width:980px){
  .hero-grilla>div:first-child{text-align:center}
  .hero .bajada{margin-left:auto;margin-right:auto}
  .hero .botones-hero,.hero .microtexto{justify-content:center}
}

/* ---------- Escáner en celular: todo entra ---------- */
.camara{position:static;align-self:flex-start;margin-bottom:12px;width:max-content}
.estante-escena{display:flex;flex-direction:column}
.estante{width:100%}
@media (max-width:600px){
  .demo .panel{padding:16px}
  .estante-escena{padding:12px}
  .estante .lomo:nth-child(n){flex:1 1 0;min-width:0;width:auto;font-size:9.5px;padding:4px 0}
  .tabla{font-size:11px}
  .tabla div{grid-template-columns:1.5fr 1.5fr .5fr;gap:6px;padding:7px 8px}
  .tabla span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
}
@media (max-width:760px){.pasos.filas{grid-template-columns:1fr}}

/* ---------- Ajustes finos de lectura ---------- */
.titulo-seccion h2{line-height:1.12}
.final h2{line-height:1.08}
.producto h3{line-height:1.1}
.sec-prueba{padding:56px 0}
@media (max-width:600px){.producto h3{font-size:26px}.sec-prueba{padding:36px 0}}
.sin-excel{display:block;margin-top:22px;border:var(--borde);border-radius:24px;padding:28px 30px;background:var(--grafito);color:var(--blanco);box-shadow:var(--sombra);text-decoration:none}
.sin-excel h3{font-size:22px;letter-spacing:-.5px;margin-bottom:8px}
.sin-excel p{color:#C9CBCF;font-size:16px}
.sin-excel b{color:var(--naranja);white-space:nowrap}
@media (max-width:760px){.sin-excel{padding:24px 22px}}
.c-grande.c-blanca{background:var(--blanco);color:var(--grafito)}
.c-grande.c-blanca p{color:var(--grafito-suave)}
.c-grande.c-blanca .moneda{background:var(--naranja);color:var(--blanco)}
.resalta{background:var(--naranja);color:var(--grafito);font-weight:700;padding:.05em .25em;border-radius:6px;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* Precios: tabla comparable, tarjetas en celular, notas y franja de pequeños vendedores */
.pr-tabla{border:var(--borde);border-radius:var(--radio);box-shadow:var(--sombra);overflow:hidden;background:var(--blanco)}
.pr-fila{display:grid;grid-template-columns:150px 1fr 1fr}
.pr-fila > div{padding:18px 22px;min-width:0}
.pr-fila + .pr-fila{border-top:1.5px solid var(--grafito-claro)}
.pr-fila > div + div{border-left:1.5px solid var(--grafito-claro)}
.pr-etiq{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--grafito-suave);display:flex;align-items:center}
.pr-encabezado{background:var(--grafito);color:var(--blanco)}
.pr-encabezado > div + div{border-left-color:var(--grafito-suave)}
.pr-encabezado h3{font-size:22px;font-weight:800}
.pr-encabezado small,.pr-tope small{display:block;color:#C9CBCF;font-size:14px;font-weight:500;margin-top:2px}
.pr-monto{font-size:28px;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.01em;line-height:1.1}
.pr-desde{display:block;font-size:14px;font-weight:600;color:var(--grafito-suave);letter-spacing:0;margin-bottom:2px}
.pr-unidad{font-size:15px;font-weight:600;color:var(--grafito-suave)}
.pr-incluye ul{list-style:none;display:grid;gap:8px;font-size:15px;font-weight:600}
.pr-incluye li::before{content:"● ";color:var(--naranja)}
.pr-acciones > div{display:flex;align-items:center}
.pr-notas{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:28px}
.pr-nota{border:1.5px solid var(--grafito-claro);border-radius:14px;padding:16px 18px;background:var(--grafito-claro)}
.pr-nota h4{font-size:16px;font-weight:800;margin-bottom:4px}
.pr-nota p{font-size:15px;color:var(--grafito-suave)}
.pr-vendedores{display:grid;grid-template-columns:1.3fr 1fr;gap:24px;align-items:center;margin-top:28px;border:var(--borde);border-radius:var(--radio);padding:26px;background:var(--naranja-claro)}
.pr-eti{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--naranja-oscuro)}
.pr-vendedores h3{margin:6px 0 8px;font-size:24px;line-height:1.2;font-weight:800;text-wrap:balance}
.pr-vendedores p{color:var(--grafito-suave)}
.pr-lado{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.pr-vendedores .pr-desde{color:var(--naranja-oscuro)}
.pr-lanzamiento{display:flex;gap:12px;align-items:flex-start;margin-top:28px;background:var(--naranja-claro);border:var(--borde);border-radius:14px;padding:14px 18px;font-weight:800}
.pr-punto{flex:none;width:12px;height:12px;border-radius:50%;background:var(--naranja);margin-top:6px}
.pr-celu{display:none}
@media (max-width:720px){
  .pr-tabla{display:none}
  .pr-celu{display:flex;flex-direction:column;gap:18px}
  .pr-tarjeta{border:var(--borde);border-radius:var(--radio);box-shadow:var(--sombra);overflow:hidden;background:var(--blanco)}
  .pr-tope{background:var(--grafito);color:var(--blanco);padding:16px 18px}
  .pr-tope h3{font-size:21px;font-weight:800}
  .pr-dos{display:grid;grid-template-columns:1fr 1fr}
  .pr-dos > div{padding:14px 18px;min-width:0}
  .pr-dos > div + div{border-left:1.5px solid var(--grafito-claro)}
  .pr-mini{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--grafito-suave);margin-bottom:4px}
  .pr-tarjeta .pr-monto{font-size:22px}
  .pr-tarjeta .pr-unidad{font-size:13px}
  .pr-cuerpo{border-top:1.5px solid var(--grafito-claro);padding:14px 18px 20px;display:flex;flex-direction:column;gap:16px}
  .pr-cuerpo .btn{justify-content:center}
  .pr-notas,.pr-vendedores{grid-template-columns:1fr}
  .pr-vendedores{padding:20px}
  .pr-lado .btn{width:100%;justify-content:center}
}
.pr-incluye ul{font-weight:500;color:var(--grafito-suave)}
.pr-incluye li{padding-left:24px;position:relative}
.pr-incluye li::before{content:"✓";position:absolute;left:0;font-weight:800;color:var(--naranja-oscuro)}
.pr-incluye{background:var(--grafito-claro)}

/* ---------- Quién está detrás (Inicio) ---------- */
.quien{display:flex;align-items:center;gap:40px;max-width:900px}
.quien-foto{width:190px;height:190px;flex:none;border-radius:50%;border:var(--borde);box-shadow:var(--sombra);object-fit:cover;display:block}
.quien-txt h2{font-size:clamp(28px,4vw,40px);letter-spacing:-1.2px;line-height:1.08;font-weight:800;margin:10px 0 12px}
.quien-txt p{font-size:19px;color:var(--grafito-suave);margin-bottom:22px}
@media (max-width:700px){
  .quien{flex-direction:column;text-align:center;gap:22px}
  .quien-foto{width:150px;height:150px}
}

/* Capturas del software */
.captura{margin:36px auto 0;max-width:900px}
.captura picture{display:block;border:var(--borde);border-radius:14px;overflow:hidden;background:var(--grafito-claro);box-shadow:var(--sombra)}
.captura picture::before{content:"";display:block;height:26px;background:var(--grafito-claro) radial-gradient(circle,var(--grafito-suave) 0 4px,transparent 5px) 14px 50%/20px 20px repeat-x;background-size:20px 26px;border-bottom:2px solid var(--grafito)}
.captura img{display:block;width:100%;height:auto}
.captura figcaption{margin-top:14px;font-size:15px;color:var(--grafito-suave);text-align:center}
@media (max-width:600px){
  .captura{max-width:270px}
  .captura picture{border-radius:28px;border-width:5px}
  .captura picture::before{display:none}
}

/* ---------- Para quién: dos productos separados ---------- */
.pq-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:stretch}
.pq-card{display:flex;flex-direction:column;gap:18px;min-width:0;border:var(--borde);border-radius:22px;padding:28px;background:var(--blanco)}
.pq-card.oscuro{background:var(--grafito);color:var(--blanco)}
.pq-card.oscuro .etiqueta{color:var(--naranja)}
.pq-card h2{font-size:30px;letter-spacing:-.7px;line-height:1.1;margin:4px 0}
.pq-card .frase{color:var(--grafito-suave);font-size:16px}
.pq-card.oscuro .frase{color:#C9CBCF}
.pq-lista{list-style:none;flex:1;display:flex;flex-direction:column}
.pq-lista li{padding:13px 0;border-top:1.5px solid var(--grafito-claro);display:flex;flex-direction:column;gap:2px}
.pq-card.oscuro .pq-lista li{border-top-color:#3A3E45}
.pq-lista b{font-size:16px;font-weight:800}
.pq-lista span{font-size:15px;color:var(--grafito-suave);line-height:1.4}
.pq-card.oscuro .pq-lista span{color:#C9CBCF}
.pq-acciones{display:flex;flex-wrap:wrap;gap:14px 18px;align-items:center}
.pq-card .btn{white-space:normal;text-align:center;justify-content:center}
.pq-card.oscuro .btn-blanco{border-color:var(--blanco);box-shadow:0 5px 0 var(--naranja)}
.pq-mas{font-weight:700;font-size:15px;color:inherit;text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:1px}
.pq-nota{text-align:center;max-width:720px;margin:24px auto 0;color:var(--grafito-suave)}
@media (max-width:760px){
  .pq-grid{grid-template-columns:1fr}
  .pq-card{padding:22px 20px}
  .pq-card h2{font-size:26px}
  .pq-acciones .btn{width:100%}
}
.pr-lanz-cuerpo{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}
.pr-barra{height:14px;border:var(--borde);border-radius:99px;background:var(--blanco);overflow:hidden}
.pr-relleno{display:block;height:100%;width:0;background:var(--naranja);transition:width .6s ease}
.pr-lugares{font-weight:700;color:var(--grafito-suave);font-size:15px}
.pr-barra[hidden],.pr-lugares[hidden]{display:none}

/* Aviso de estadísticas (lo crea clarity.js) */
.aviso-est{position:fixed;left:12px;right:12px;bottom:12px;z-index:60;max-width:560px;margin:0 auto;background:var(--blanco);border:var(--borde);border-radius:var(--radio);box-shadow:var(--sombra);padding:14px 16px;display:flex;flex-direction:column;gap:12px}
.aviso-est p{margin:0;font-size:15px;line-height:1.4}
.aviso-est a{color:var(--naranja-oscuro);font-weight:700}
.aviso-est-botones{display:flex;gap:10px}
.aviso-est-botones .btn{flex:1;justify-content:center;padding:11px 12px;font-size:15px;box-shadow:0 3px 0 var(--grafito)}
.aviso-est a:focus-visible,.aviso-est .btn:focus-visible,#cambiar-estadisticas:focus-visible{outline:3px solid var(--naranja);outline-offset:3px}
#cambiar-estadisticas{white-space:normal;text-align:left;margin:6px 0;padding:11px 16px;font-size:15px}