/* KRONOS · landing nueva (mockup). Usa las mismas variables de color y tipografía de la página actual. */

/* ---------- HERO: escenario con tableros reales que van rotando ---------- */
.nv-stage{position:relative;padding:6px 0 74px;}
.nv-frame{background:#fff;border:1px solid var(--border);border-radius:18px;box-shadow:0 44px 90px -34px rgba(20,24,31,.38);overflow:hidden;}
.nv-bar{display:flex;align-items:center;gap:7px;padding:11px 16px;border-bottom:1px solid var(--border);background:#F3F4F7;}
.nv-bar .d{width:10px;height:10px;border-radius:50%;flex:none;}
.nv-bar .d.r{background:#EC6A5E;} .nv-bar .d.y{background:#F4BF4F;} .nv-bar .d.g{background:#61C554;}
.nv-url{margin-left:10px;font:600 .72rem var(--font-mono);color:var(--muted);}
.nv-label{margin-left:auto;font:700 .72rem var(--font-body);color:var(--blue);background:var(--blue-soft);padding:4px 11px;border-radius:20px;transition:opacity .35s;white-space:nowrap;}
.nv-slides{position:relative;aspect-ratio:1140/700;background:#EEF0F3;overflow:hidden;}
.nv-slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top left;opacity:0;transform:scale(1.035);transition:opacity .9s ease,transform 7s ease;}
.nv-slide.on{opacity:1;transform:scale(1);}
.nv-dots{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:7px;z-index:2;}
.nv-dots i{width:7px;height:7px;border-radius:50%;background:rgba(20,24,31,.25);transition:all .3s;cursor:pointer;}
.nv-dots i.on{width:22px;border-radius:6px;background:var(--blue);}
.nv-float{position:absolute;z-index:3;animation:nvfloat 7s ease-in-out infinite;}
.nv-float.hk-card{padding:15px 18px;}
.nv-float.hk-card .val{font-size:1.35rem;margin-top:4px;}
.nv-float.hk-card .delta{margin-top:6px;font-size:.78rem;}
.nv-float.hk-card .spark{height:24px;margin-top:6px;}
.nv-top{position:relative;}
.nv-f1{left:-38px;bottom:-28px;width:200px;}
.nv-f2{right:-22px;top:56px;width:196px;animation-delay:-2.3s;}
.nv-f3{right:28px;bottom:-46px;width:262px;padding:13px 15px;animation-delay:-4.6s;}
.nv-f3 .ha-head{margin-bottom:8px;} .nv-f3 .ha-q{font-size:.8rem;padding:8px 10px;margin-bottom:6px;} .nv-f3 .ha-a{font-size:.76rem;line-height:1.35;padding:8px 10px;}
@keyframes nvfloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-9px);}}
.nv-modules{display:flex;flex-wrap:wrap;gap:8px;margin-top:78px;}
.nv-modules .hpill{font-size:.82rem;padding:5px 12px 5px 6px;}
@media(max-width:960px){
  .nv-float{position:static;width:auto;margin-top:12px;animation:none;}
  .nv-modules{margin-top:18px;}
}

/* ---------- EL PROBLEMA: flujo a colores ---------- */
.nv-flow{display:grid;grid-template-columns:1fr 40px 1fr 40px 1fr;gap:6px;align-items:stretch;}
.nv-node{position:relative;border-radius:20px;padding:28px 26px 26px;color:#fff;overflow:hidden;box-shadow:0 26px 50px -28px rgba(20,24,31,.45);}
.nv-node::after{content:'';position:absolute;right:-40px;top:-40px;width:150px;height:150px;border-radius:50%;background:rgba(255,255,255,.12);}
.nv-node.n1{background:linear-gradient(135deg,#2F5FD0,#6C8FEF);}
.nv-node.n2{background:linear-gradient(135deg,#B87508,#E3A22C);}
.nv-node.n3{background:linear-gradient(135deg,#D3342B,#F0716A);}
.nv-ico{width:50px;height:50px;border-radius:15px;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;margin-bottom:16px;}
.nv-ico svg{width:26px;height:26px;color:#fff;}
.nv-step{font:700 .72rem var(--font-mono);letter-spacing:.14em;opacity:.88;}
.nv-node h3{color:#fff;font-family:var(--font-body);font-weight:800;font-size:1.28rem;margin:8px 0 10px;letter-spacing:-.01em;}
.nv-node p{color:rgba(255,255,255,.94);font-size:.96rem;margin:0;position:relative;z-index:1;}
.nv-arrow{display:flex;align-items:center;justify-content:center;color:var(--muted);}
.nv-arrow svg{width:34px;height:34px;stroke-dasharray:5 4;animation:nvdash 1.2s linear infinite;}
@keyframes nvdash{to{stroke-dashoffset:-18;}}
.nv-outcome{margin-top:26px;border-radius:18px;background:var(--ink);color:#fff;padding:22px 28px;display:flex;flex-wrap:wrap;gap:14px 30px;align-items:center;}
.nv-outcome b{font-family:var(--font-body);font-size:1.02rem;}
.nv-outcome span.c{display:inline-flex;align-items:center;gap:9px;font-size:.94rem;color:rgba(255,255,255,.92);}
.nv-outcome span.c i{width:11px;height:11px;border-radius:50%;flex:none;}
@media(max-width:900px){
  .nv-flow{grid-template-columns:1fr;}
  .nv-arrow{height:34px;} .nv-arrow svg{transform:rotate(90deg);}
}

/* ---------- GALERÍA DE TABLEROS en movimiento ---------- */
.nv-gal{padding:72px 0 78px;overflow:hidden;background:linear-gradient(180deg,var(--bg),#EEF2FB 55%,var(--bg));}
.nv-gal .section-head{max-width:760px;}
.nv-mask{-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);margin-top:14px;}
.nv-marq{display:flex;gap:20px;width:max-content;animation:nvm 75s linear infinite;padding:12px 0;}
.nv-marq.rev{animation-direction:reverse;animation-duration:90s;}
.nv-gal:hover .nv-marq{animation-play-state:paused;}
@keyframes nvm{to{transform:translateX(calc(-50% - 10px));}}
.nv-card{width:430px;flex:none;background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden;box-shadow:0 26px 50px -30px rgba(20,24,31,.4);transition:transform .25s;}
.nv-card:hover{transform:translateY(-6px);}
.nv-card img{display:block;width:100%;aspect-ratio:1140/700;object-fit:cover;object-position:top left;}
.nv-card .cap{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:11px 16px;font:700 .86rem var(--font-body);color:var(--ink);border-top:1px solid var(--border);}
.nv-card .cap span{font-weight:600;font-size:.74rem;color:var(--muted);}
.nv-gal-note{text-align:center;color:var(--muted);font-size:.88rem;margin-top:22px;}

/* ---------- SEGURIDAD ---------- */
.nv-sec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
@media(max-width:960px){.nv-sec-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:620px){.nv-sec-grid{grid-template-columns:1fr;}}
.nv-sc{background:#fff;border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:0 18px 40px -30px rgba(20,24,31,.35);}
.nv-sc .ic{width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
.nv-sc .ic svg{width:23px;height:23px;}
.nv-sc h3{font-family:var(--font-body);font-weight:800;font-size:1.06rem;margin:0 0 8px;}
.nv-sc p{color:var(--muted);font-size:.92rem;margin:0;}
.nv-sec-stats{margin-top:22px;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
@media(max-width:760px){.nv-sec-stats{grid-template-columns:1fr;}}
.nv-stat{background:var(--ink);color:#fff;border-radius:16px;padding:22px 24px;}
.nv-stat b{display:block;font-family:var(--font-display);font-size:2rem;line-height:1;margin-bottom:8px;}
.nv-stat span{font-size:.88rem;color:rgba(255,255,255,.82);}
.nv-sec-cta{margin-top:26px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;}
.nv-sec-cta small{color:var(--muted);font-size:.88rem;}

/* ---------- PRECIOS: cuatro planes con regalos ---------- */
.pricing.nv-4{grid-template-columns:repeat(4,1fr);gap:16px;align-items:stretch;}
@media(max-width:1100px){.pricing.nv-4{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){.pricing.nv-4{grid-template-columns:1fr;}}
.pricing.nv-4 .plan{display:flex;flex-direction:column;}
.pricing.nv-4 .plan ul{margin-bottom:16px;}
.nv-impl{font-size:.8rem;color:var(--muted);margin:-2px 0 14px;}
.nv-impl b{color:var(--ink);}
.nv-gift{background:var(--green-soft);border-radius:12px;padding:12px 14px;margin:auto 0 18px;}
.nv-gift .t{font:800 .7rem var(--font-body);letter-spacing:.1em;color:var(--green);margin-bottom:6px;}
.nv-gift ul{margin:0 0 8px!important;gap:6px!important;}
.nv-gift li{font-size:.82rem!important;color:var(--ink);}
.nv-gift li::before{content:'+'!important;color:var(--green)!important;font-weight:900;}
.nv-gift .v{font:800 .76rem var(--font-body);color:var(--green);}
.nv-fine{margin-top:16px;color:var(--muted);font-size:.84rem;text-align:center;}

@media(prefers-reduced-motion:reduce){
  .nv-float,.nv-marq,.nv-arrow svg{animation:none!important;}
  .nv-slide{transition:opacity .2s;}
}

/* correcciones: los regalos con negritas no se parten en columnas */
.nv-gift li{display:block!important;position:relative;padding-left:15px;}
.nv-gift li::before{position:absolute;left:0;top:0;}
/* hero: tarjetas flotantes que tapan menos el tablero */
.nv-f1{left:-46px;bottom:-40px;width:190px;}
.nv-f2{right:-30px;top:-22px;width:186px;}
.nv-f3{right:10px;bottom:-58px;width:246px;}
.nv-modules{margin-top:92px;}