/* Kuntur Data · capa tecnológica y de motion (v2026-11)
   Se carga después de kd.css. Todo lo que oculta contenido depende de html.kd-js,
   que solo existe si hay JavaScript y el usuario no pidió movimiento reducido. */

:root{
  --k-950:#0B2429;--k-900:#0F2F35;--k-850:#143E46;--k-700:#1C5A63;--k-500:#3E7F88;
  --sky:#90CAE7;--gold:#E8B348;--cream:#F7F5EE;--stone:#C0BEB6;--ink:#0F2F35;--ink-2:#3D545C;--muted:#55666A;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --ease-out:cubic-bezier(.16,1,.3,1);
}

/* Lenis */
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}

/* Tipografía técnica: etiquetas en monoespaciada */
.kd .eti{font-family:var(--mono);font-weight:500;font-size:12px;letter-spacing:.16em;display:inline-flex;align-items:center;gap:10px}
.kd main .eti::before{content:"";flex:none;width:6px;height:6px;background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 18%,transparent)}
.kd .crumb{font-family:var(--mono);font-weight:500;font-size:12px;letter-spacing:.12em}
.kd .mono{font-family:var(--mono)}

/* Retícula de fondo en secciones oscuras */
.kd .hero,.kd #valles,.kd .sol,.kd .deep,.kd main>section.on-dark{position:relative;isolation:isolate}
.kd .hero::after,.kd #valles::before,.kd .sol::after,.kd .deep::before,.kd main>section.on-dark:not(.hero)::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:linear-gradient(rgba(144,202,231,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(144,202,231,.07) 1px,transparent 1px);
  background-size:56px 56px;background-position:-1px -1px;
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 70% 40%,#000 0%,transparent 75%);
          mask-image:radial-gradient(ellipse 80% 70% at 70% 40%,#000 0%,transparent 75%)}
.kd .hero>.wrap,.kd #valles>.wrap,.kd .sol>.wrap,.kd .deep>.wrap,.kd main>section.on-dark>.wrap{position:relative;z-index:2}

/* Campo de datos (canvas) y HUD del hero */
.kd-field{position:absolute;inset:0;width:100%;height:100%;z-index:1;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 35%,#000 70%);
          mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 35%,#000 70%)}
@media (max-width:900px){.kd-field{-webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.5) 50%,transparent 85%);mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.5) 50%,transparent 85%)}}
.kd-hud{position:absolute;inset:clamp(16px,3vw,32px);z-index:2;pointer-events:none;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:rgba(144,202,231,.75)}
.kd-hud i{position:absolute;width:18px;height:18px;border-color:rgba(144,202,231,.45);border-style:solid;border-width:0}
.kd-hud i:nth-child(1){top:0;left:0;border-top-width:1px;border-left-width:1px}
.kd-hud i:nth-child(2){top:0;right:0;border-top-width:1px;border-right-width:1px}
.kd-hud i:nth-child(3){bottom:0;left:0;border-bottom-width:1px;border-left-width:1px}
.kd-hud i:nth-child(4){bottom:0;right:0;border-bottom-width:1px;border-right-width:1px}
.kd-hud .rd{position:absolute;right:28px;bottom:96px;display:flex;flex-direction:column;align-items:flex-end;gap:6px;text-align:right}
.kd-hud .rd span{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.kd-hud .live{width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 0 rgba(232,179,72,.6);animation:kdlive 2s ease-out infinite}
.kd-hud .scan{position:absolute;top:0;bottom:0;left:0;width:1px;background:linear-gradient(180deg,transparent,rgba(144,202,231,.55),transparent);opacity:0}
@keyframes kdlive{0%{box-shadow:0 0 0 0 rgba(232,179,72,.55)}100%{box-shadow:0 0 0 10px rgba(232,179,72,0)}}
@media (max-width:700px){.kd-hud .rd{display:none}}

/* Barra de progreso de lectura */
.kd-progress{position:fixed;top:0;left:0;right:0;height:2px;z-index:200;pointer-events:none;transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,var(--sky),var(--gold))}

/* Cursor de precisión (solo puntero fino) */
.kd-cursor{position:fixed;top:0;left:0;z-index:300;pointer-events:none;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;
  border:1px solid rgba(255,255,255,.9);mix-blend-mode:difference;opacity:0;transition:width .35s var(--ease-out),height .35s var(--ease-out),margin .35s var(--ease-out),opacity .3s,background-color .3s}
.kd-cursor::after{content:"";position:absolute;left:50%;top:50%;width:3px;height:3px;margin:-1.5px 0 0 -1.5px;border-radius:50%;background:#fff}
.kd-cursor.is-on{opacity:1}
.kd-cursor.is-link{width:64px;height:64px;margin:-32px 0 0 -32px;background:rgba(255,255,255,.12)}
@media (hover:none),(pointer:coarse){.kd-cursor{display:none}}

/* Spotlight que sigue al puntero en tarjetas */
.kd-spot{position:relative;isolation:isolate}
.kd-spot::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:1;opacity:0;transition:opacity .5s var(--ease-out);
  background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(144,202,231,.18),transparent 62%)}
.cream .kd-spot::after,.cream2 .kd-spot::after,.on-light .kd-spot::after{background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(28,90,99,.10),transparent 62%)}
.kd-spot:hover::after{opacity:1}
.kd-spot::before{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;z-index:1;padding:1px;opacity:0;transition:opacity .5s var(--ease-out);
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(144,202,231,.9),transparent 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.kd-spot:hover::before{opacity:1}
.valle{transform-style:preserve-3d;will-change:transform}
.valle .vin{z-index:2}

/* Botones: brillo y respuesta más suaves */
.kd .btn{position:relative;overflow:hidden;isolation:isolate;transition:transform .5s var(--ease-out),background .3s ease,color .3s ease,border-color .3s ease}
.kd .btn .ar{transition:transform .5s var(--ease-out)}
.kd .btn-gold::before,.kd .btn-cream::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;transform:translateX(-120%) skewX(-20deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent)}
.kd .btn-gold:hover::before,.kd .btn-cream:hover::before{transition:transform .9s var(--ease-out);transform:translateX(120%) skewX(-20deg)}

/* Líneas para SplitText */
.kd-line{padding-bottom:.06em;margin-bottom:-.06em}
.kd-sline{position:absolute;top:-1.5px;left:0;right:0;height:1.5px;background:var(--k-700);transform-origin:0 50%}

/* Navegación por secciones: estado activo */
.alt a.is-on span{background:var(--sky);box-shadow:0 0 0 4px rgba(144,202,231,.2)}
.sub a{position:relative}
.sub a.is-on{background:rgba(144,202,231,.14)}
.sub a.is-on::after{content:"";position:absolute;left:14px;right:14px;bottom:6px;height:1.5px;background:var(--gold)}

/* Ocultamiento inicial solo con JS y movimiento permitido */
.kd-js .hero .ct path{stroke-dasharray:1;stroke-dashoffset:1}
/* Entrada del hero en CSS puro: visible desde el primer cuadro, sin esperar al JS */
@keyframes kdin{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
.kd-pre>*{animation:kdin 1.25s cubic-bezier(.16,1,.3,1) both}
.kd-pre>*:nth-child(2){animation-delay:.07s}.kd-pre>*:nth-child(3){animation-delay:.16s}
.kd-pre>*:nth-child(4){animation-delay:.24s}.kd-pre>*:nth-child(5){animation-delay:.32s}.kd-pre>*:nth-child(6){animation-delay:.4s}
}

/* Pie: fila legal */
.kd-legal{border-top:1px solid rgba(192,190,182,.22);margin-top:28px;padding-top:22px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 24px;font-size:13px}
.kd-legal ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px 20px}
.kd-legal p{margin:0;max-width:62ch;line-height:1.5}
.kd-legal button{font:inherit;color:#F7F5EE;background:none;border:0;padding:0;cursor:pointer}
.kd-legal button:hover{color:var(--sky)}

/* Aviso de cookies (Consent Mode v2) */
#kuntur-consent{position:fixed;left:16px;bottom:96px;z-index:250;max-width:420px;width:calc(100% - 32px);
  background:rgba(11,36,41,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);color:#F7F5EE;
  border:1px solid rgba(144,202,231,.25);border-radius:16px;padding:20px 20px 18px;box-shadow:0 24px 60px -20px rgba(0,0,0,.6);
  font:14.5px/1.55 'DM Sans',system-ui,sans-serif}
#kuntur-consent[hidden]{display:none}
#kuntur-consent .kc-t{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--sky);margin:0 0 10px;display:flex;align-items:center;gap:8px}
#kuntur-consent .kc-t::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--gold)}
#kuntur-consent p{margin:0 0 16px;color:#D9DCD6}
#kuntur-consent a{color:var(--gold)}
#kuntur-consent .kc-botones{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
#kuntur-consent button{font:inherit;font-weight:600;min-height:42px;padding:0 18px;border-radius:999px;cursor:pointer;border:1px solid rgba(247,245,238,.4);background:transparent;color:#F7F5EE;transition:background .3s,border-color .3s}
#kuntur-consent button:hover{border-color:#F7F5EE}
#kuntur-consent button.kc-aceptar{background:var(--gold);border-color:var(--gold);color:#143E46}
#kuntur-consent button.kc-aceptar:hover{background:#F0C463}
#kuntur-consent button:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
@media (max-width:640px){#kuntur-consent{left:16px;right:16px;bottom:84px;max-width:none;width:auto}}

/* Páginas legales */
.lg-hero{padding-top:clamp(140px,16vw,200px);padding-bottom:clamp(56px,7vw,96px)}
.lg-meta{display:flex;flex-wrap:wrap;gap:10px 28px;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#C0BEB6;margin:0;padding:0;list-style:none}
.lg-meta b{color:#F7F5EE;font-weight:500}
.lg-grid{display:grid;grid-template-columns:260px minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
.toc{position:sticky;top:32px;display:flex;flex-direction:column;gap:2px;border-left:1px solid #DAD6CB;padding-left:0}
.toc p{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 12px 18px}
.toc a{position:relative;display:flex;gap:12px;padding:8px 12px 8px 18px;font-size:14px;line-height:1.35;color:var(--muted);text-decoration:none;transition:color .3s}
.toc a span{font-family:var(--mono);font-size:11px;color:#8A9A9E;padding-top:2px;min-width:18px}
.toc a::before{content:"";position:absolute;left:-1px;top:0;bottom:0;width:2px;background:var(--k-700);transform:scaleY(0);transform-origin:50% 0;transition:transform .5s var(--ease-out)}
.toc a:hover{color:var(--ink)}
.toc a.is-on{color:var(--ink)}
.toc a.is-on span{color:var(--k-700)}
.toc a.is-on::before{transform:scaleY(1)}
.legal{max-width:72ch;color:var(--ink-2);font-size:17px;line-height:1.7}
.legal section{scroll-margin-top:32px;padding-bottom:12px}
.legal section+section{border-top:1px solid #E2DDD1;padding-top:36px;margin-top:36px}
.legal h2{font-family:'Barlow',system-ui,sans-serif;font-weight:700;font-size:clamp(24px,2.4vw,30px);line-height:1.2;color:var(--ink);margin:0 0 16px;display:flex;gap:14px;align-items:baseline}
.legal h2 .n{font-family:var(--mono);font-weight:500;font-size:13px;color:var(--k-700);letter-spacing:.06em;flex:none}
.legal h3{font-family:'Barlow',system-ui,sans-serif;font-weight:600;font-size:19px;color:var(--ink);margin:28px 0 8px}
.legal p{margin:0 0 14px}
.legal ul{margin:0 0 14px;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.legal li{position:relative;padding-left:20px}
.legal li::before{content:"";position:absolute;left:0;top:11px;width:6px;height:6px;background:var(--k-700)}
.legal a{color:var(--k-700);font-weight:500;text-underline-offset:3px}
.legal a:hover{color:var(--ink)}
.legal strong{color:var(--ink);font-weight:600}
.legal code{overflow-wrap:anywhere;font-family:var(--mono);font-size:13px;background:#EFEBE0;border:1px solid #DAD6CB;border-radius:6px;padding:2px 6px;word-break:break-all;color:var(--ink)}
.legal .tbox{margin:18px 0 20px}
.legal table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.55}
.legal th{font-family:var(--mono);font-weight:500;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-align:left;padding:14px 16px;border-bottom:1.5px solid var(--k-700);background:#FBFAF6}
.legal td{padding:14px 16px;border-bottom:1px solid #E2DDD1;color:var(--ink-2);vertical-align:top}
.legal tr:last-child td{border-bottom:0}
.legal td:first-child{color:var(--ink);font-weight:500}
.legal .destacado{background:#0F2F35;color:#F7F5EE;border-radius:12px;padding:22px 24px;margin:6px 0 18px;border-left:3px solid var(--gold)}
.legal .destacado p{color:#F7F5EE;margin:0}
.lg-foot{display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;margin-top:56px;padding-top:28px;border-top:1px solid #DAD6CB}
@media (max-width:900px){.lg-grid{grid-template-columns:minmax(0,1fr)}.toc{position:static;border-left:0;display:none}}

@media (prefers-reduced-motion:reduce){
  .kd-hud .live{animation:none}
  .kd .btn-gold::before,.kd .btn-cream::before{display:none}
  .kd-cursor{display:none}
}
.foot .wrap>.kd-legal{flex-basis:100%;width:100%}
@media (max-width:760px){.faq .wrap>div[style*="span 2"]{grid-column:auto!important}}
/* Pie unificado (antes solo en la home) */
.foot h3{font-family:'Barlow',system-ui,sans-serif;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#90CAE7;margin:0 0 14px}
.foot ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;font-size:15px}
.foot .kd-legal ul{flex-direction:row;flex-wrap:wrap;gap:8px 20px;font-size:13px}
/* Tablas legales en celular: cada fila es una tarjeta con etiquetas */
@media (max-width:700px){
.legal .tbox{background:none;border:0;border-radius:0;overflow:visible}
.legal table,.legal tbody,.legal tr,.legal td{display:block;width:100%}
.legal tr:first-child:has(th){display:none}
.legal tr{background:#FFFFFF;border:1px solid #DAD6CB;border-radius:12px;padding:6px 18px;margin-bottom:12px}
.legal td{padding:12px 0;border-bottom:1px solid #EFEBE0}
.legal tr td:last-child{border-bottom:0}
.legal td::before{content:attr(data-label);display:block;font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--k-700);margin-bottom:4px}
.legal td:first-child{color:var(--ink);font-weight:500}
.legal tr:has(td:nth-child(3)) td:first-child{font-family:'Barlow',system-ui,sans-serif;font-weight:700;font-size:18px}
}
@media (max-width:700px){.lg-hero{min-height:100svh!important;align-items:center;padding-top:120px;padding-bottom:120px}}

/* Barra inferior en celular: el CTA «Pedir diagnóstico inicial» en una sola línea (7 nov 2026) */
@media (max-width:480px){.bar .btn{white-space:nowrap;padding:0 14px;font-size:14px}.bar{gap:4px}}
@media (max-width:374px){.bar .btn{padding:0 10px;font-size:13px}}
.bar .cta-sh{display:none}
@media (max-width:480px){.bar .cta-lg{display:none}.bar .cta-sh{display:inline}}
