/* KODEUZ BOARDROOM v2 — Manual de Marca v1.0
   Obsidiana #0B0D14 · Voltaje #6534FF · Ámbar #FFB43D · Coral #FF5470 · Lila #9B7BFF
   Display: Archivo · Cuerpo: Inter · Mono: JetBrains Mono
   Atmósfera: vidrio sobre obsidiana, luz de gradiente, iconografía monoline. */
:root{
  --bg:#0B0D14; --panel:rgba(255,255,255,.035); --panel2:rgba(255,255,255,.055);
  --ink:#F2F1F6; --ink2:rgba(242,241,246,.62); --ink3:rgba(242,241,246,.38);
  --line:rgba(255,255,255,.09); --line2:rgba(255,255,255,.16);
  --accent:101,52,255;                    /* lo pisa JS con el acento de la industria */
  --voltaje:101,52,255; --ambar:255,180,61; --coral:255,84,112; --lila:155,123,255;
  --grad:linear-gradient(120deg,#6534FF 0%,#9B7BFF 32%,#FF5470 66%,#FFB43D 100%);
  --gradA:linear-gradient(120deg,rgb(var(--accent)),#FFB43D);
  --glass:0 1px 0 rgba(255,255,255,.06) inset, 0 24px 60px -30px rgba(0,0,0,.8);
  --ease:cubic-bezier(.16,1,.3,1);
  --font:'Inter',system-ui,sans-serif; --display:'Archivo',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{min-height:100%;background:var(--bg)}
body{font-family:var(--font);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden}
button{font-family:inherit;cursor:pointer;border:0;background:none;color:inherit}
a{color:inherit;text-decoration:none}
.mono{font-family:var(--mono)}
.wrap{max-width:1100px;margin:0 auto;padding:0 30px;position:relative;z-index:2}

/* ---- iconos monoline ---- */
.ki{width:20px;height:20px;flex:none;vertical-align:middle}

/* ---- atmósfera de fondo ---- */
.bgfx{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.orb{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5}
.o1{width:640px;height:640px;left:-180px;top:-220px;background:radial-gradient(circle,rgba(var(--voltaje),.34),transparent 65%)}
.o2{width:560px;height:560px;right:-160px;top:24vh;background:radial-gradient(circle,rgba(var(--accent),.26),transparent 65%)}
.o3{width:520px;height:520px;left:30vw;bottom:-260px;background:radial-gradient(circle,rgba(var(--ambar),.13),transparent 65%)}
.bgfx .mark{position:absolute;right:-70px;bottom:-60px;opacity:.05;color:rgb(var(--accent))}
.bgfx .mark .ki{width:460px;height:460px;stroke-width:.9}
.bgfx::after{content:'';position:absolute;inset:0;background:
  linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);
  background-size:72px 72px;mask-image:radial-gradient(ellipse 90% 80% at 50% 30%,#000 30%,transparent 78%)}

/* ---- tipografía de escena ---- */
.kicker{display:flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--ink2);margin-bottom:18px}
.kicker::before{content:'';width:26px;height:2px;border-radius:2px;background:var(--gradA)}
.cover .kicker,.picker .kicker{justify-content:center}
.h1{font-family:var(--display);font-weight:700;font-size:clamp(30px,4.6vw,56px);letter-spacing:-.035em;line-height:1.04}
.h1.xl{font-size:clamp(40px,6.4vw,80px);font-weight:800}
.grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.sub{color:var(--ink2);font-size:16.5px;margin-top:18px;max-width:62ch;line-height:1.6}
.sub.center{margin-left:auto;margin-right:auto;text-align:center}
.foot{margin-top:26px;font-family:var(--mono);font-size:11px;color:var(--ink3)}
.close-options{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.close-option{min-width:150px;padding:11px 16px;border:1px solid rgba(var(--accent),.45);border-radius:10px;background:rgba(var(--accent),.07);font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;text-align:center;color:rgb(var(--accent))}
.concept-label,.evidence-label{display:inline-flex;align-items:center;width:max-content;max-width:100%;font-family:var(--mono);text-transform:uppercase}
.concept-label{margin-top:15px;padding:7px 12px;border:1px solid rgba(var(--accent),.42);border-radius:999px;font-size:10.5px;letter-spacing:.14em;color:rgb(var(--accent));background:rgba(var(--accent),.07)}
.evidence-label{margin-top:14px;padding:6px 10px;border:1px solid var(--line2);border-radius:7px;font-size:9.5px;letter-spacing:.11em;color:var(--ink3);background:var(--panel)}

/* ---- topbar ---- */
.topbar{position:sticky;top:0;z-index:40;background:rgba(11,13,20,.78);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.topbar .row{display:flex;align-items:center;gap:18px;height:58px;max-width:1180px;margin:0 auto;padding:0 30px}
.brandlogo{height:20px}
.tbind{display:flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;color:var(--ink2);white-space:nowrap}
.tbind .ki{width:17px;height:17px;color:rgb(var(--accent))}
.dots{display:flex;gap:7px;margin-left:auto}
.dot{width:8px;height:8px;border-radius:50%;background:var(--ink3);transition:.25s var(--ease);padding:0}
.dot.on{background:var(--gradA);transform:scale(1.45);box-shadow:0 0 12px rgba(var(--accent),.8)}
.navbtns{display:flex;gap:6px}
.navbtns button{font-size:15px;color:var(--ink2);border:1px solid var(--line2);border-radius:9px;padding:5px 14px;transition:.18s;background:var(--panel)}
.navbtns button:hover:not(:disabled){color:#fff;border-color:rgba(var(--accent),.7);box-shadow:0 0 18px rgba(var(--accent),.25)}
.navbtns button:disabled{opacity:.25;cursor:default}

#stage{position:relative;z-index:2;animation:rise .6s var(--ease)}
@keyframes rise{from{opacity:0;transform:translateY(16px)}to{opacity:1}}
.act{padding:70px 30px 96px}

/* ---- portada ---- */
.cover{position:relative;z-index:2;min-height:calc(100vh - 58px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 24px}
.clogo{height:30px;margin-bottom:44px}
.covicon{width:92px;height:92px;border-radius:26px;display:flex;align-items:center;justify-content:center;margin-bottom:30px;
  background:linear-gradient(160deg,rgba(var(--accent),.22),rgba(var(--accent),.05));
  border:1px solid rgba(var(--accent),.4);box-shadow:0 0 60px rgba(var(--accent),.35), var(--glass);color:#fff}
.covicon .ki{width:44px;height:44px;stroke-width:1.3}
.covmeta{margin-top:48px;font-family:var(--mono);font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink3)}

/* ---- selector ---- */
.picker{position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px 24px}
.plogo{height:26px;margin-bottom:34px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:13px;max-width:990px;width:100%;margin-top:44px}
.pk{display:flex;flex-direction:column;align-items:flex-start;gap:10px;background:var(--panel);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:16px;padding:20px;transition:.22s var(--ease);text-align:left;box-shadow:var(--glass)}
.pk:hover{border-color:rgba(var(--da,101,52,255),.7);transform:translateY(-3px);box-shadow:0 0 40px -8px rgba(var(--da,101,52,255),.45), var(--glass)}
.pk .ico{width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:rgb(var(--da,101,52,255));background:rgba(var(--da,101,52,255),.12);border:1px solid rgba(var(--da,101,52,255),.3)}
.pk .ico .ki{width:21px;height:21px}
.pk .nm{font-family:var(--display);font-weight:600;font-size:15.5px;letter-spacing:-.01em}
.pk .rdy{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:rgb(var(--da,101,52,255))}
.pk .rdy.off{color:var(--ink3)}
.hint{margin-top:36px;font-size:13px;color:var(--ink3)}

/* ---- señales (acto 2) ---- */
.sigs{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:13px;margin-top:40px}
.sig{position:relative;background:var(--panel);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:15px;padding:19px 20px;box-shadow:var(--glass);overflow:hidden}
.sig::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--gradA)}
.sig .k{font-size:14.5px;color:var(--ink);line-height:1.55}
.journey{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:38px}
.journey::before{content:'';position:absolute;left:8%;right:8%;top:31px;height:2px;background:linear-gradient(90deg,rgb(var(--accent)),rgba(var(--accent),.22));z-index:0}
.jstep{position:relative;z-index:1;display:flex;align-items:flex-start;gap:12px;min-height:126px;padding:20px 18px;border:1px solid var(--line);border-radius:16px;background:var(--panel);box-shadow:var(--glass)}
.jnum{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-family:var(--mono);font-size:9px;color:#fff;background:rgb(var(--accent));box-shadow:0 0 0 6px var(--bg)}
.jtitle{font-family:var(--display);font-weight:700;font-size:15px;color:var(--ink)}
.jtext{font-size:12.5px;line-height:1.5;color:var(--ink2);margin-top:7px}
.punch{margin-top:46px;font-family:var(--display);font-weight:700;font-size:clamp(21px,2.7vw,31px);letter-spacing:-.02em;line-height:1.28;max-width:36ch;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---- organigrama (acto 3) ---- */
.org{margin-top:36px;display:flex;flex-direction:column;align-items:center}
.onode{background:var(--panel2);backdrop-filter:blur(10px);border:1px solid var(--line2);border-radius:15px;padding:15px 30px;text-align:center;font-family:var(--display);font-weight:600;font-size:16px;box-shadow:var(--glass)}
.onode span{display:block;font-family:var(--mono);font-weight:400;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);margin-top:5px}
.onode.dir{border:1px solid transparent;background:
  linear-gradient(var(--bg),var(--bg)) padding-box, var(--grad) border-box;
  box-shadow:0 0 50px -6px rgba(var(--accent),.55), var(--glass);width:min(520px,92%);padding:17px 28px}
.onode.dir strong{display:block;font-size:17px}
.onode.dir small{display:block;font-family:var(--body);font-weight:400;font-size:12px;line-height:1.45;color:var(--ink2);margin:7px auto 0;max-width:56ch}
.onode.dir span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.ovline{width:1px;height:30px;background:linear-gradient(rgba(var(--accent),.8),rgba(var(--accent),.15))}
.ohline{width:min(900px,92%);height:1px;background:linear-gradient(90deg,transparent,rgba(var(--accent),.5),transparent);margin:22px 0 0}
.obranches{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;width:min(1050px,100%);margin-top:18px}
.obranch{display:flex;flex-direction:column;gap:8px;background:rgba(10,12,19,.52);border:1px solid var(--line);border-radius:14px;padding:14px;min-width:0}
.odept{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;text-transform:uppercase;color:rgb(var(--accent));margin-bottom:2px}
.odept .ki{width:16px;height:16px}
.odept b{margin-left:auto;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:rgba(var(--accent),.14);font-size:9px}
.agent-card{background:var(--panel);backdrop-filter:blur(6px);border:1px solid var(--line);border-radius:10px;padding:10px 11px;box-shadow:var(--glass);min-width:0}
.agent-name{font-family:var(--display);font-weight:600;font-size:12.5px;line-height:1.25;color:var(--ink)}
.agent-summary{font-size:10.5px;line-height:1.38;color:var(--ink3);margin-top:4px}
.branch-note{font-size:10.5px;line-height:1.4;color:var(--ink3);padding:10px;border:1px dashed var(--line2);border-radius:9px}

/* ---- radiografías (4-6) ---- */
.kpis{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.kpi{font-family:var(--mono);font-size:12px;color:var(--ink);background:rgba(var(--accent),.12);border:1px solid rgba(var(--accent),.4);border-radius:999px;padding:8px 17px;box-shadow:0 0 24px -10px rgba(var(--accent),.5)}
.sols{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:17px;margin-top:36px}
.sol{background:var(--panel);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:18px;padding:26px;display:flex;flex-direction:column;gap:13px;box-shadow:var(--glass);transition:.22s var(--ease)}
.sol:hover{transform:translateY(-2px);border-color:var(--line2)}
.sol.hero{border:1px solid transparent;background:
  linear-gradient(rgba(18,20,30,.92),rgba(18,20,30,.92)) padding-box, linear-gradient(140deg,rgba(var(--accent),.85),rgba(var(--ambar),.55)) border-box;
  box-shadow:0 0 44px -10px rgba(var(--accent),.4), var(--glass)}
.sol .plat{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;background:var(--gradA);-webkit-background-clip:text;background-clip:text;color:transparent}
.sol h4{font-family:var(--display);font-size:18.5px;letter-spacing:-.015em;font-weight:600}
.sol .lbl{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);margin-bottom:4px}
.sol .txt{font-size:13.5px;color:var(--ink2);line-height:1.55}
.sol .prob .txt{color:var(--ink)}
.sol .metric{margin-top:auto;font-family:var(--display);font-weight:700;font-size:16.5px;color:rgb(var(--ambar))}

/* ---- workforce (7) ---- */
.fichas{display:grid;grid-template-columns:repeat(auto-fit,minmax(285px,1fr));gap:12px;margin-top:28px}
.ficha{background:rgba(11,13,20,.78);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:15px;padding:18px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--glass);transition:.22s var(--ease)}
.ficha:hover{transform:translateY(-2px)}
.ficha.lead{border:1px solid transparent;background:
  linear-gradient(rgba(18,20,30,.92),rgba(18,20,30,.92)) padding-box, var(--grad) border-box;
  box-shadow:0 0 50px -8px rgba(var(--accent),.5), var(--glass)}
.fh{display:flex;align-items:center;gap:13px}
.avatar{width:44px;height:44px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;color:#fff;
  background:radial-gradient(circle at 32% 28%,rgba(var(--accent),.85),rgba(var(--accent),.18));
  border:1px solid rgba(var(--accent),.5);box-shadow:0 0 22px -4px rgba(var(--accent),.6)}
.avatar .ki{width:21px;height:21px;stroke-width:1.3}
.cargo{font-family:var(--display);font-weight:600;font-size:15.5px;letter-spacing:-.01em}
.dept{font-family:var(--mono);font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:rgb(var(--accent));margin-top:3px}
.rol{font-size:13.5px;color:var(--ink2);line-height:1.55}
.fns{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.fns li{font-size:12.5px;color:var(--ink2);line-height:1.5}
.fns li::marker{color:rgb(var(--ambar))}
.ff{margin-top:auto;display:flex;flex-direction:column;gap:9px}
.cns{display:flex;flex-wrap:wrap;gap:6px}
.cn{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;letter-spacing:.05em;text-transform:uppercase;border:1px solid var(--line2);border-radius:999px;padding:5px 11px;color:var(--ink2);background:var(--panel)}
.cn .ki{width:12.5px;height:12.5px;color:rgb(var(--accent))}
.rep{font-family:var(--mono);font-size:10.5px;color:var(--ink3)}
.unity{margin-top:24px;display:grid;grid-template-columns:1.15fr .85fr;gap:18px;align-items:stretch}
.unity-map,.unity-rules{border:1px solid var(--line);border-radius:16px;background:rgba(11,13,20,.74);box-shadow:var(--glass)}
.unity-map{padding:18px;display:grid;gap:14px}
.unity-core{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 16px;border:1px solid rgba(var(--accent),.48);border-radius:12px;background:rgba(var(--accent),.08)}
.unity-core strong{font-family:var(--display);font-size:19px;letter-spacing:.04em}
.unity-core span{font-family:var(--mono);font-size:10px;line-height:1.45;letter-spacing:.06em;color:var(--ink2);text-align:right}
.unity-fronts{display:grid;grid-template-columns:repeat(5,1fr);gap:7px}
.unity-front{padding:9px 6px;border:1px solid var(--line);border-radius:9px;background:var(--panel);font-family:var(--mono);font-size:9.5px;letter-spacing:.04em;text-align:center;color:var(--ink2)}
.unity-rules{padding:14px 16px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.unity-rule{display:flex;align-items:flex-start;gap:8px;padding:8px;border-radius:8px;color:var(--ink2);font-size:11.5px;line-height:1.4}
.unity-rule .ki{width:14px;height:14px;flex:none;margin-top:1px;color:rgb(var(--accent))}
.unity-team .fichas{grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:18px}
.unity-team .ficha{padding:13px;gap:7px;min-width:0}
.unity-team .avatar{width:34px;height:34px}.unity-team .avatar .ki{width:16px;height:16px}
.unity-team .cargo{font-size:13px}.unity-team .dept{font-size:8.5px}.unity-team .rol{font-size:11.5px;line-height:1.42}
.unity-team .fns,.unity-team .cns{display:none}.unity-team .rep{font-size:8.5px}

/* ---- demo (8) ---- */
.demo .h1{margin-bottom:10px}
.demorow{display:flex;gap:60px;align-items:center;flex-wrap:wrap;margin-top:48px}
.qr{width:min(300px,70vw);border-radius:20px;border:1px solid transparent;
  background:linear-gradient(var(--bg),var(--bg)) padding-box, var(--grad) border-box;
  box-shadow:0 0 70px -14px rgba(var(--accent),.6)}
.dsteps{display:flex;flex-direction:column;gap:22px;max-width:430px}
.dstep{font-size:17px;color:var(--ink2);line-height:1.55}
.dstep b{font-family:var(--display);font-size:19px;margin-right:10px;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---- retorno (9) ---- */
.anchor{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:42px;max-width:880px}
.an{background:var(--panel);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--glass)}
.alab{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3)}
.aval{font-family:var(--display);font-weight:700;font-size:clamp(19px,2.4vw,27px);margin-top:10px;letter-spacing:-.02em}
.aval span{font-size:12.5px;font-weight:400;color:var(--ink3);font-family:var(--font);margin-left:6px;letter-spacing:0}
.aval.acc{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.abar{height:9px;border-radius:99px;margin-top:18px;background:rgba(255,255,255,.06)}
.abar.h{width:100%;background:rgba(255,255,255,.3)}
.abar.a{width:22%;background:var(--grad);box-shadow:0 0 16px rgba(var(--accent),.6)}
.medlbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);margin-top:28px}
.measure-note{margin-top:24px;max-width:62ch;padding:13px 16px;border-left:2px solid rgb(var(--accent));background:rgba(10,12,19,.72);font-size:13px;line-height:1.5;color:var(--ink2)}
.roi{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:17px;margin-top:18px}
.roic{background:var(--panel);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:var(--glass)}
.roic .k{font-family:var(--display);font-weight:600;font-size:15.5px;letter-spacing:-.01em}
.roic .n{font-size:12.5px;color:var(--ink2);margin-top:9px;line-height:1.55}

/* ---- plan (10) ---- */
.fases{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:17px;margin-top:40px;counter-reset:fase}
.fase{position:relative;background:var(--panel);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:18px;padding:26px;box-shadow:var(--glass);overflow:hidden}
.fase::after{counter-increment:fase;content:counter(fase,decimal-leading-zero);position:absolute;right:14px;top:6px;font-family:var(--display);font-weight:800;font-size:52px;letter-spacing:-.04em;opacity:.07}
.fn{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;background:var(--gradA);-webkit-background-clip:text;background-clip:text;color:transparent}
.ft{font-family:var(--display);font-weight:600;font-size:17.5px;margin-top:9px;letter-spacing:-.01em}
.fd{font-size:13px;color:var(--ink2);margin-top:9px;line-height:1.6}
.objwrap{margin-top:44px;border-top:1px solid var(--line);padding-top:24px}
.objwrap summary{font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);cursor:pointer}
.objwrap summary:hover{color:var(--ink2)}
.objs{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:15px;margin-top:22px}
.obje{background:var(--panel);border:1px solid var(--line);border-radius:15px;padding:19px}
.oq{font-family:var(--display);font-weight:600;font-size:14px}
.oa{font-size:12.5px;color:var(--ink2);margin-top:9px;line-height:1.55}

/* ---- notas del presentador ---- */
.notebar{position:fixed;bottom:0;left:0;right:0;z-index:50;background:rgba(15,17,26,.96);border-top:1px solid transparent;
  border-image:var(--grad) 1;padding:15px 30px;font-size:13.5px;color:var(--ink2);backdrop-filter:blur(12px)}
.notebar b{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;margin-right:12px;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---- impresión ---- */
@media print{
  body{background:#0B0D14 !important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .topbar,.notebar,.bgfx{display:none}
  .printact{page-break-after:always;padding-top:30px}
  .cover{min-height:auto;padding:80px 24px}
}
@media (max-width:760px){
  .scene.org-scene .wrap{width:100vw;max-width:100vw;padding-left:22px;padding-right:22px}
  .scene.org-scene .h1{font-size:36px;line-height:1.02;max-width:100%;overflow-wrap:anywhere}
  .scene.org-scene .h1 .grad{display:block}
  .scene.org-scene .sub{font-size:14px;line-height:1.55;width:calc(100% - 14px);max-width:100%}
  .org{width:calc(100% - 18px);margin:24px auto 0}.onode{padding:12px 18px}.onode.dir{width:100%}.onode.dir small{font-size:11px}
  .ohline{margin-top:16px}.obranches{width:100%;grid-template-columns:1fr;gap:8px;margin-top:12px}
  .obranch{padding:11px}.agent-summary{font-size:10px}
  .scene.org-scene{overflow:auto;justify-content:flex-start}.scene.org-scene .wrap{padding-top:42px;padding-bottom:70px}
  .anchor{grid-template-columns:1fr}
  .demorow{gap:30px}
  .bgfx .mark{display:none}
}

/* ============================================================
   v3 CINE — escenas con imagen protagonista, mundos por dominio,
   reveals de documental y dolor protagonista en radiografías.
   ============================================================ */
.scene{position:relative;min-height:calc(100vh - 58px);overflow:auto;display:flex;flex-direction:column;justify-content:flex-start;z-index:2}
.scene .sc{position:relative;z-index:3;width:100%}
.scene .shot{position:absolute;inset:-4%;background-size:cover;background-position:center;z-index:0;animation:kb 28s ease-out forwards;filter:saturate(.7) brightness(.72)}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.09)}}
.scene .world{position:absolute;inset:0;z-index:1;background:rgb(var(--w,var(--accent)));mix-blend-mode:color;opacity:.34}
.scene .tint{position:absolute;inset:0;z-index:2;background:
  linear-gradient(180deg,rgba(8,10,16,.9) 0%,rgba(8,10,16,.62) 34%,rgba(8,10,16,.72) 68%,rgba(8,10,16,.98) 100%),
  radial-gradient(ellipse 120% 95% at 12% 42%,rgba(8,10,16,.9),rgba(8,10,16,.2) 62%)}
.scene.world{--accent:var(--w)}   /* el mundo tiñe todos los acentos del acto */
.scene .act{padding:52px 30px 72px}
.scene.center{align-items:center;text-align:center;justify-content:center}

/* reveals escalonados (documental) */
.r1,.r2,.r3,.r4,.r5,.r6{opacity:0;animation:reveal .9s var(--ease) both}
.r1{animation-delay:.08s}.r2{animation-delay:.22s}.r3{animation-delay:.38s}
.r4{animation-delay:.54s}.r5{animation-delay:.7s}.r6{animation-delay:.86s}
@keyframes reveal{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

/* legibilidad sobre fotografía */
.has-img .sub{color:rgba(242,241,246,.8)}
.has-img .sig,.has-img .ficha,.has-img .chip,.has-img .onode,.has-img .an,.has-img .roic,.has-img .fase,.has-img .obje{background:rgba(13,15,23,.66);backdrop-filter:blur(14px)}
.has-img .kpi{background:rgba(13,15,23,.6);border-color:rgba(var(--accent),.55)}
.has-img .cover{min-height:calc(100vh - 58px)}

/* dolor protagonista (radiografías) */
.lead{margin-top:26px;max-width:800px}
.lead-lbl{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgb(var(--accent))}
.lead-prob{font-family:var(--display);font-weight:650;font-size:clamp(21px,2.35vw,29px);letter-spacing:-.02em;line-height:1.25;margin-top:10px;color:#fff;max-width:48ch}
.lead-sol{margin-top:17px;background:rgba(10,12,19,.86);backdrop-filter:blur(16px);border:1px solid var(--line);border-left:3px solid rgb(var(--accent));border-radius:0 14px 14px 0;padding:16px 19px;box-shadow:var(--glass);max-width:760px}
.lead-sol .lbl{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);margin-bottom:6px}
.lead-sol .txt{font-size:14px;color:var(--ink);line-height:1.5;max-width:66ch}
.lead-meta{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:14px}
.fr-plat{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:rgb(var(--accent))}
.lead-meta .metric{font-family:var(--display);font-weight:700;font-size:15px;color:rgb(var(--ambar))}

/* los otros frentes — filas editoriales, no cards */
.frows{margin-top:24px;max-width:800px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.frows .medlbl{grid-column:1/-1;margin:0 0 2px}
.frow{border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:13px 14px;background:rgba(10,12,19,.72);display:block;min-width:0}
.fr-t{font-family:var(--display);font-weight:600;font-size:14.5px;letter-spacing:-.01em}
.fr-t .fr-plat{display:block;margin-bottom:5px}
.fr-b{font-size:12px;color:var(--ink2);line-height:1.45;margin-top:7px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* selector con miniaturas de mundo */
.pk{position:relative;overflow:hidden}
.pk-img{background-size:cover;background-position:center}
.pk .pkv{position:absolute;inset:0;border-radius:inherit}
.pk-img .pkv{background:linear-gradient(180deg,rgba(11,13,20,.5),rgba(11,13,20,.88))}
.pk>*{position:relative;z-index:1}
.pk-img .ico{background:rgba(13,15,23,.55);backdrop-filter:blur(6px)}

/* impresión y móvil */
@media print{
  .scene{min-height:auto;page-break-after:always}
  .scene .shot{animation:none;inset:0}
  .r1,.r2,.r3,.r4,.r5,.r6{animation:none;opacity:1}
}
@media (max-width:760px){
  .frow{grid-template-columns:1fr}
  .lead-prob{font-size:22px}
}

/* ---- navegación completa (fix navegabilidad) ---- */
.btn{display:inline-flex;align-items:center;gap:8px;margin-top:34px;font-family:var(--display);font-weight:600;font-size:15px;color:#fff;
  padding:13px 28px;border-radius:999px;border:1px solid transparent;cursor:pointer;
  background:linear-gradient(rgba(18,20,30,.85),rgba(18,20,30,.85)) padding-box, var(--grad) border-box;
  box-shadow:0 0 34px -8px rgba(var(--accent),.55), var(--glass);transition:.2s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:0 0 46px -6px rgba(var(--accent),.75), var(--glass)}
.changeInd{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);
  border:1px solid var(--line2);border-radius:9px;padding:7px 13px;background:var(--panel);transition:.18s;white-space:nowrap}
.changeInd:hover{color:#fff;border-color:rgba(var(--accent),.7);box-shadow:0 0 16px rgba(var(--accent),.25)}
.edge{position:fixed;top:50%;transform:translateY(-50%);z-index:45;width:52px;height:96px;
  font-size:34px;line-height:1;color:rgba(242,241,246,.5);background:rgba(13,15,23,.42);backdrop-filter:blur(8px);
  border:1px solid var(--line);cursor:pointer;transition:.2s var(--ease)}
.edge.left{left:0;border-radius:0 16px 16px 0;border-left:0}
.edge.right{right:0;border-radius:16px 0 0 16px;border-right:0}
.edge:hover{color:#fff;background:rgba(13,15,23,.75);border-color:rgba(var(--accent),.6);box-shadow:0 0 26px rgba(var(--accent),.3)}
.navhint{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);z-index:44;
  font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:rgba(242,241,246,.4);
  background:rgba(13,15,23,.5);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:999px;padding:7px 16px;pointer-events:none;white-space:nowrap}
@media print{.edge,.navhint{display:none}}
@media (max-width:760px){.edge{width:40px;height:76px;font-size:26px}.navhint{font-size:9px;padding:6px 11px}.changeInd{display:none}}

/* ============================================================
   PANTALLAS DEL SISTEMA — mocks HTML con datos demo
   ============================================================ */
.radgrid{margin-top:6px}
.radgrid.has-mock{display:grid;grid-template-columns:1.04fr .86fr;gap:46px;align-items:start}
.wfgrid.has-mock{display:grid;grid-template-columns:1fr 350px;gap:42px;align-items:start;margin-top:36px}
.wfgrid.has-mock .fichas{margin-top:0;grid-template-columns:repeat(auto-fit,minmax(255px,1fr))}
.mockcap{margin-top:12px;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;color:var(--ink3);text-align:center}

.mock{border-radius:20px;overflow:hidden;background:rgba(13,15,23,.82);backdrop-filter:blur(16px);
  border:1px solid transparent;
  background:linear-gradient(rgba(13,15,23,.85),rgba(13,15,23,.85)) padding-box, linear-gradient(150deg,rgba(var(--accent),.65),rgba(255,255,255,.12) 60%,rgba(var(--ambar),.4)) border-box;
  box-shadow:0 30px 70px -25px rgba(0,0,0,.85), 0 0 44px -12px rgba(var(--accent),.35)}
.mocktag{margin-left:auto;font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:rgb(var(--ambar));border:1px solid rgba(var(--ambar),.5);border-radius:999px;padding:3px 9px}

/* teléfono — conversación agente IA */
.mockphone{max-width:370px;width:100%;margin:0 auto}
.mp-head{display:flex;align-items:center;gap:11px;padding:14px 16px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.03)}
.mp-av{width:36px;height:36px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;color:#fff;
  background:radial-gradient(circle at 32% 28%,rgba(var(--accent),.85),rgba(var(--accent),.2));border:1px solid rgba(var(--accent),.5)}
.mp-av .ki{width:17px;height:17px}
.mp-name{font-family:var(--display);font-weight:600;font-size:13.5px}
.mp-status{font-family:var(--mono);font-size:9.5px;color:rgb(47,214,138);margin-top:2px}
.mp-chat{padding:16px 14px;display:flex;flex-direction:column;gap:9px}
.bub{max-width:86%;padding:10px 13px;font-size:12.5px;line-height:1.5;border-radius:13px;color:var(--ink)}
.bub.in{align-self:flex-start;background:rgba(255,255,255,.07);border:1px solid var(--line);border-bottom-left-radius:4px}
.bub.out{align-self:flex-end;background:rgba(var(--accent),.16);border:1px solid rgba(var(--accent),.4);border-bottom-right-radius:4px}
.bub.qb{padding:0;background:none;border:0;max-width:92%}
.qcard{background:rgba(255,255,255,.05);border:1px solid rgba(var(--accent),.45);border-radius:13px;padding:13px 15px;min-width:230px}
.qt{font-family:var(--mono);font-size:9.5px;letter-spacing:.1em;text-transform:uppercase;color:rgb(var(--accent));margin-bottom:9px}
.ql{display:flex;justify-content:space-between;gap:14px;font-size:12px;color:var(--ink2);padding:3px 0}
.ql b{color:var(--ink);font-weight:500;white-space:nowrap}
.qtot{display:flex;justify-content:space-between;margin-top:9px;padding-top:9px;border-top:1px solid var(--line);font-size:12.5px}
.qtot b{font-family:var(--display);font-weight:700;color:rgb(var(--ambar))}
.rep-ul{margin:9px 0 9px 0;padding-left:17px;display:flex;flex-direction:column;gap:6px}
.rep-ul li::marker{color:rgb(var(--ambar))}

/* ventana — tablero del sistema */
.mockwin{width:100%}
.mw-bar{display:flex;align-items:center;gap:6px;padding:11px 15px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.03)}
.mw-bar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.14)}
.mw-bar i:first-child{background:rgba(255,84,112,.65)}
.mw-t{margin-left:9px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.mw-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}
.mw-kpi{background:rgba(13,15,23,.6);padding:13px 15px}
.mw-kpi .v{font-family:var(--display);font-weight:700;font-size:19px;color:rgb(var(--accent))}
.mw-kpi .k{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);margin-top:4px}
.mw-head,.mw-row{display:grid;grid-template-columns:1fr 1.1fr 1fr 1.3fr;gap:10px;padding:9px 15px;align-items:center}
.mw-head{font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);border-bottom:1px solid var(--line)}
.mw-row{font-size:12px;color:var(--ink2);border-bottom:1px solid rgba(255,255,255,.05)}
.mw-row span:first-child{font-family:var(--mono);font-size:11px;color:var(--ink)}
.pill{justify-self:start;font-family:var(--mono);font-size:9.5px;letter-spacing:.04em;border-radius:999px;padding:3px 10px;white-space:nowrap}
.pill.ok{color:rgb(47,214,138);background:rgba(47,214,138,.1);border:1px solid rgba(47,214,138,.35)}
.pill.warn{color:rgb(255,180,61);background:rgba(255,180,61,.1);border:1px solid rgba(255,180,61,.35)}
.pill.bad{color:rgb(255,84,112);background:rgba(255,84,112,.1);border:1px solid rgba(255,84,112,.35)}
.mw-alert{display:flex;gap:11px;align-items:flex-start;margin:13px 15px 15px;padding:12px 14px;border-radius:12px;
  background:rgba(var(--accent),.1);border:1px solid rgba(var(--accent),.4);font-size:12px;line-height:1.5;color:var(--ink)}
.mw-alert .ki{width:16px;height:16px;flex:none;margin-top:2px;color:rgb(var(--accent))}

@media (max-width:900px){
  .radgrid.has-mock,.wfgrid.has-mock{grid-template-columns:1fr}
  .radr,.wfr{max-width:420px}
}

/* ---- el caso financiero: fugas + calculadora breakeven ---- */
.fugas{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:13px;margin-top:16px;max-width:1000px}
.fuga{display:flex;gap:12px;align-items:flex-start;background:var(--panel);backdrop-filter:blur(8px);
  border:1px solid var(--line);border-left:3px solid rgb(255,84,112);border-radius:14px;padding:15px 17px;
  font-size:13.5px;line-height:1.55;color:var(--ink);box-shadow:var(--glass)}
.fuga .fx{flex:none;margin-top:1px;color:rgb(255,84,112)}
.fuga .fx .ki{width:16px;height:16px}
.bkcalc{margin-top:34px;max-width:760px;border-radius:20px;padding:26px 28px;
  background:linear-gradient(rgba(13,15,23,.8),rgba(13,15,23,.8)) padding-box, var(--grad) border-box;
  border:1px solid transparent;box-shadow:0 0 44px -12px rgba(var(--accent),.4), var(--glass)}
.bk-t{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.bk-in{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}
.bk-in label{display:flex;flex-direction:column;gap:7px;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink3)}
.bk-in input{background:rgba(255,255,255,.06);border:1px solid var(--line2);border-radius:11px;padding:11px 14px;
  color:#fff;font-family:var(--display);font-weight:600;font-size:19px;width:100%;outline:none;transition:.15s}
.bk-in input:focus{border-color:rgba(var(--accent),.8);box-shadow:0 0 18px rgba(var(--accent),.3)}
.bk-out{margin-top:20px;font-size:16.5px;color:var(--ink2);line-height:1.6}
.bk-out b{font-family:var(--display);font-weight:700;font-size:26px;color:rgb(var(--ambar));margin:0 4px}
.bk-out #bkU{color:var(--ink)}
.bk-d{display:block;font-size:13.5px;color:var(--ink3);margin-top:4px}
.bk-d b{font-size:15px;color:var(--ink2)}
.bk-q{margin-top:16px;padding-top:16px;border-top:1px solid var(--line);font-family:var(--display);font-weight:600;font-size:15.5px;color:#fff}
@media (max-width:700px){.bk-in{grid-template-columns:1fr}}
@media print{.bk-in input{border:1px solid #555}}

/* ---- caso financiero: dos columnas con panel del sistema ---- */
.fingrid.has-mock{display:grid;grid-template-columns:1.04fr .9fr;gap:46px;align-items:start}
.fingrid .fugas{max-width:none;grid-template-columns:1fr}
.fingrid .bkcalc{max-width:none}
.compact-finance .act{padding-top:38px;padding-bottom:72px}
.compact-finance .h1{font-size:clamp(30px,3.8vw,48px)}
.compact-finance .anchor{margin-top:22px}
.compact-finance .an{padding:14px 16px}
.compact-finance .fingrid{gap:28px}
.compact-finance .fugas{gap:8px;margin-top:10px}
.compact-finance .fuga{padding:10px 12px;font-size:12.5px;line-height:1.4}
.compact-finance .bkcalc{margin-top:14px;padding:18px 20px}
.compact-finance .bk-in{margin-top:12px}.compact-finance .bk-out{margin-top:12px}.compact-finance .bk-q{margin-top:10px;padding-top:10px}
.compact-finance .measure-note{display:none}
@media (max-width:900px){.fingrid.has-mock{grid-template-columns:1fr}.finr{max-width:460px}}

/* ---- identidad del cliente (perfiles de empresa) ---- */
.covbrand{width:104px;height:104px;border-radius:26px;display:flex;align-items:center;justify-content:center;margin-bottom:26px;overflow:hidden;
  background:rgba(13,15,23,.55);backdrop-filter:blur(10px);
  border:1px solid rgba(var(--accent),.55);box-shadow:0 0 60px rgba(var(--accent),.35), var(--glass)}
.covbrand .colo{width:78px;height:78px;object-fit:contain}
.marcas{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:20px}
.marca{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2);
  border:1px solid rgba(var(--accent),.45);background:rgba(13,15,23,.5);backdrop-filter:blur(6px);border-radius:999px;padding:6px 14px}
.tbx{color:var(--ink3);font-size:12px;margin:0 -6px}
.tblogo{height:26px;width:26px;object-fit:contain;border-radius:6px}

/* ============================================================
   LEGIBILIDAD — escala tipográfica mayor y espacios más útiles
   ============================================================ */
.sub{font-size:18px;max-width:66ch}
.sig .k{font-size:15.5px}
.kpi{font-size:13px;padding:9px 18px}
.lead-prob{font-size:clamp(21px,2.35vw,29px)}
.lead-sol .txt{font-size:14px;line-height:1.5}
.fr-t{font-size:15.5px}
.fr-b{font-size:12px;line-height:1.45}
.frow{padding:13px 14px}
.sol h4{font-size:19.5px}.sol .txt{font-size:14.5px}
.rol{font-size:14.5px}.fns li{font-size:13.5px}
.bub{font-size:13.5px}.mw-row{font-size:13px}.mw-kpi .v{font-size:20px}
.mw-alert{font-size:13px}
.roic .k{font-size:16.5px}.roic .n{font-size:13.5px;line-height:1.6}
.fuga{font-size:14.5px}
.fd{font-size:14px}.oq{font-size:15px}.oa{font-size:13.5px;line-height:1.6}
.bk-out{font-size:17.5px}
.scene .act{padding:52px 30px 72px}
.radgrid.has-mock{gap:38px}

/* los mocks son pantallas: siempre oscuros, con su propia paleta fija */
.mock{--ink:#F2F1F6;--ink2:rgba(242,241,246,.66);--ink3:rgba(242,241,246,.4);
  --line:rgba(255,255,255,.09);--line2:rgba(255,255,255,.16);--panel:rgba(255,255,255,.035)}

/* ============================================================
   TEMA CLARO — para marcas de identidad clara (KZC.theme:"light")
   Ej: Santo Domingo Motors — blanco / amarillo / negro
   ============================================================ */
body.light{
  --bg:#FAFAF7; --panel:rgba(17,18,22,.035); --panel2:rgba(17,18,22,.055);
  --ink:#15161A; --ink2:rgba(21,22,26,.68); --ink3:rgba(21,22,26,.45);
  --line:rgba(17,18,22,.12); --line2:rgba(17,18,22,.2);
  --glass:0 1px 0 rgba(255,255,255,.7) inset, 0 22px 50px -28px rgba(17,18,22,.28);
}
body.light .bgfx .orb{opacity:.24}
body.light .bgfx::after{background:
  linear-gradient(rgba(17,18,22,.035) 1px,transparent 1px),
  linear-gradient(90deg,rgba(17,18,22,.035) 1px,transparent 1px);background-size:72px 72px}
body.light .grad{background:linear-gradient(115deg,#15161A 0%,#15161A 45%,rgb(var(--accent)) 110%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
body.light .punch{background:linear-gradient(115deg,#15161A 0%,#3d3a2a 55%,rgb(var(--accent)) 120%);
  -webkit-background-clip:text;background-clip:text;color:transparent}
body.light .topbar{background:rgba(250,250,247,.85);border-bottom:1px solid var(--line)}
body.light .navbtns button{background:#fff;border-color:var(--line2)}
body.light .dot{background:rgba(17,18,22,.25)}
body.light .scene .tint{background:
  linear-gradient(180deg,rgba(250,250,247,.92) 0%,rgba(250,250,247,.55) 26%,rgba(250,250,247,.6) 60%,rgba(250,250,247,.98) 100%),
  radial-gradient(ellipse 130% 100% at 16% 45%,rgba(250,250,247,.75),transparent 62%)}
body.light .scene .world{opacity:.16}
body.light .has-img .sig,body.light .has-img .ficha,body.light .has-img .chip,body.light .has-img .onode,
body.light .has-img .an,body.light .has-img .roic,body.light .has-img .fase,body.light .has-img .obje,
body.light .lead-sol,body.light .fuga{background:rgba(255,255,255,.88);backdrop-filter:blur(10px)}
body.light .has-img .kpi{background:rgba(255,255,255,.85);color:var(--ink);border-color:rgba(var(--accent),.7)}
body.light .has-img .sub{color:rgba(21,22,26,.75)}
body.light .lead-prob{color:#15161A}
body.light .onode.dir{background:linear-gradient(#fff,#fff) padding-box, linear-gradient(120deg,rgb(var(--accent)),#15161A) border-box;
  box-shadow:0 0 44px -8px rgba(var(--accent),.6), var(--glass)}
body.light .onode.dir span{background:none;color:#8a7000;-webkit-background-clip:initial}
body.light .covbrand,body.light .marca{background:rgba(255,255,255,.85)}
body.light .marca{color:var(--ink2)}
body.light .edge{background:rgba(255,255,255,.7);color:rgba(21,22,26,.6);border-color:var(--line)}
body.light .edge:hover{color:#15161A;background:#fff}
body.light .navhint{background:rgba(255,255,255,.75);color:rgba(21,22,26,.55);border-color:var(--line)}
body.light .notebar{background:rgba(255,255,255,.96);color:var(--ink2)}
body.light .bkcalc{background:linear-gradient(#fff,#fff) padding-box, linear-gradient(120deg,rgb(var(--accent)),#15161A) border-box}
body.light .bk-t{background:none;-webkit-background-clip:initial;color:#8a7000}
body.light .bk-in input{background:#F4F4F0;color:#15161A;border-color:var(--line2)}
body.light .bk-out b{color:#B8860B}
body.light .bk-q{color:#15161A}
body.light .lead-meta .metric,body.light .sol .metric{color:#B8860B}
body.light .btn{background:linear-gradient(#15161A,#15161A) padding-box, linear-gradient(120deg,rgb(var(--accent)),#15161A) border-box;color:#fff}
body.light .abar.h{background:rgba(17,18,22,.25)}
body.light .abar.a{background:linear-gradient(90deg,rgb(var(--accent)),#15161A)}
body.light .aval.acc{background:none;-webkit-background-clip:initial;color:#8a7000}

/* ---- tema claro v2: papel limpio, fotos solo en portada y en las pantallas demo ---- */
body.light .scene:not(.center) .shot,
body.light .scene:not(.center) .world{display:none}
body.light .scene.center .shot{opacity:.9}
body.light .scene:not(.center) .tint{background:none}
body.light .scene:not(.center){background:
  radial-gradient(ellipse 90% 60% at 82% 8%,rgba(var(--brand,255,205,0),.10),transparent 60%),
  radial-gradient(ellipse 70% 50% at 8% 92%,rgba(17,18,22,.05),transparent 60%)}
body.light .sig,body.light .sol,body.light .ficha,body.light .chip,body.light .onode,
body.light .an,body.light .roic,body.light .fase,body.light .obje,body.light .fuga,
body.light .lead-sol,body.light .kpi,body.light .jstep,body.light .obranch,body.light .agent-card{background:#fff;border-color:rgba(17,18,22,.1);
  box-shadow:0 14px 34px -18px rgba(17,18,22,.22), 0 1px 0 rgba(255,255,255,.8) inset}
body.light .brandlogo{filter:brightness(0)}
body.light .obranch{background:rgba(255,255,255,.92)}
body.light .agent-card{box-shadow:none}
body.light .agent-summary,body.light .branch-note{color:rgba(21,22,26,.62)}
body.light .jnum{box-shadow:0 0 0 6px #FAFAF7;color:#fff}
body.light .journey::before{background:linear-gradient(90deg,rgb(var(--brand,255,205,0)),rgba(17,18,22,.18))}
body.light .kpi{color:var(--ink);border:1px solid rgba(var(--brand,255,205,0),.9)}
body.light .frow{border-top-color:rgba(17,18,22,.14)}
body.light .frow{background:#fff;border-color:rgba(17,18,22,.1);box-shadow:0 12px 28px -20px rgba(17,18,22,.24)}
body.light .fr-p{color:rgba(21,22,26,.85)}
body.light .fr-s{color:rgba(21,22,26,.62)}
body.light .medlbl{color:rgba(21,22,26,.5)}
body.light .mockcap{color:rgba(21,22,26,.5)}
body.light .close-option{color:#745f00;background:rgba(var(--brand,255,205,0),.1);border-color:rgba(var(--brand,255,205,0),.62)}
body.light .concept-label{color:#745f00;background:rgba(var(--brand,255,205,0),.12);border-color:rgba(var(--brand,255,205,0),.62)}
body.light .evidence-label{color:rgba(21,22,26,.62);background:#fff;border-color:rgba(17,18,22,.14)}
body.light .unity-map,body.light .unity-rules{background:#fff;border-color:rgba(17,18,22,.1);box-shadow:0 14px 34px -18px rgba(17,18,22,.22)}
body.light .unity-core{background:rgba(var(--brand,255,205,0),.1);border-color:rgba(var(--brand,255,205,0),.72)}
body.light .unity-front{background:#FAFAF7;border-color:rgba(17,18,22,.1);color:rgba(21,22,26,.7)}
body.light .unity-core span,body.light .unity-rule{color:rgba(21,22,26,.67)}
/* los mocks conservan el color VIVO de la marca por dentro */
body.light .mock{--accent:var(--brand,255,205,0)}
body.light .covbrand{border-color:rgba(var(--brand,255,205,0),.8);box-shadow:0 0 44px rgba(var(--brand,255,205,0),.4), var(--glass)}
body.light .marca{border-color:rgba(var(--brand,255,205,0),.7)}
body.light .abar.a{background:linear-gradient(90deg,rgb(var(--brand,255,205,0)),#15161A)}
body.light .sig::before{background:linear-gradient(180deg,rgb(var(--brand,255,205,0)),#15161A)}
body.light .fuga{border-left-color:#C0392B}
body.light .fuga .fx{color:#C0392B}
body.light .pill.warn{color:#8a6d00;background:rgba(255,205,0,.14);border-color:rgba(178,140,0,.5)}

/* ---- acceso contextual a demos vivas ---- */
.demo-launch{position:absolute;top:54px;right:30px;z-index:7;display:flex;align-items:center;gap:12px;min-width:270px;
  padding:11px 13px;border:1px solid rgba(var(--brand,255,205,0),.72);border-radius:14px;text-decoration:none;
  color:var(--ink);background:rgba(255,255,255,.82);backdrop-filter:blur(14px);box-shadow:0 14px 34px -20px rgba(17,18,22,.35);
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.demo-launch:hover{transform:translateY(-2px);box-shadow:0 18px 38px -18px rgba(17,18,22,.42);border-color:rgb(var(--brand,255,205,0))}
.demo-launch:focus-visible{outline:3px solid rgba(var(--brand,255,205,0),.5);outline-offset:3px}
.demo-launch-pulse{width:10px;height:10px;border-radius:50%;background:#17B978;box-shadow:0 0 0 0 rgba(23,185,120,.45);animation:demoPulse 2s infinite;flex:none}
.demo-launch span:nth-child(2){display:grid;gap:2px;font-size:12px;font-weight:700;line-height:1.2}
.demo-launch small{font-family:var(--mono);font-size:8px;letter-spacing:.16em;color:rgba(21,22,26,.52)}
.demo-launch b{margin-left:auto;font-family:var(--mono);font-size:9px;letter-spacing:.12em;color:#7a6300;white-space:nowrap}
@keyframes demoPulse{70%{box-shadow:0 0 0 8px rgba(23,185,120,0)}100%{box-shadow:0 0 0 0 rgba(23,185,120,0)}}
@media (prefers-reduced-motion:reduce){.demo-launch-pulse{animation:none}.demo-launch{transition:none}}

/* ---- lectura movil: una sola columna, sin lienzo horizontal ---- */
@media (max-width:760px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  .topbar .row{height:58px;padding:0 16px;gap:10px;min-width:0}
  .brandlogo{height:18px;flex:none}
  .topbar .row{overflow:hidden}.tbind{flex:1;min-width:0;font-size:10px;gap:6px;overflow:hidden;text-overflow:ellipsis}
  .tbind span{overflow:hidden;text-overflow:ellipsis}
  .dots{gap:5px;margin-left:auto;flex:none}
  .dot{width:6px;height:6px}
  .navbtns{display:none}

  .scene,.scene .sc{width:100%;max-width:100%;min-width:0;overflow-x:hidden}
  .scene .act,.wrap{width:100%;max-width:100%;padding-left:30px;padding-right:30px}
  .scene .act{padding-top:52px;padding-bottom:84px}
  .kicker{font-size:9.5px;letter-spacing:.19em;line-height:1.5;margin-bottom:14px}
  .h1,.scene.org-scene .h1{font-size:31px;line-height:1.05;max-width:100%;overflow-wrap:anywhere}
  .sub{font-size:15px;line-height:1.55;margin-top:14px;max-width:100%;overflow-wrap:anywhere}
  .concept-label,.evidence-label{display:block;font-size:8.5px;line-height:1.45;width:100%;max-width:100%;white-space:normal;overflow-wrap:anywhere}
  .demo-launch{position:relative;top:auto;right:auto;width:100%;min-width:0;margin:18px 0 6px;padding:12px}
  .close-options{display:grid;grid-template-columns:1fr;width:100%}.close-option{min-width:0}

  .lead{width:100%;max-width:100%;margin-top:22px}
  .lead-prob{font-size:20px;line-height:1.3;max-width:100%;overflow-wrap:anywhere}
  .lead-sol{width:100%;padding:14px 16px}
  .lead-sol .txt{font-size:13px}
  .lead-meta{display:block;margin-top:12px}
  .lead-meta .fr-plat{display:block;overflow-wrap:anywhere;line-height:1.5}
  .lead-meta .metric{display:block;margin-top:8px;font-size:14px;line-height:1.4}
  .frows{width:100%;grid-template-columns:1fr;gap:9px;margin-top:20px}
  .kpis{display:grid;grid-template-columns:1fr;width:100%;max-width:100%}.kpi{max-width:100%;white-space:normal;overflow-wrap:anywhere;border-radius:12px}

  .sigs,.sols,.fichas,.fases,.objs,.fugas,.anchor,.journey{grid-template-columns:1fr}
  .journey::before{left:14px;right:auto;top:20px;bottom:20px;width:2px;height:auto}
  .jstep{min-height:0;padding:16px}
  .fichas{gap:10px}.ficha{padding:16px;min-width:0}.rol{font-size:13px;overflow-wrap:anywhere}
  .unity{grid-template-columns:1fr;margin-top:18px}.unity-core{display:block}.unity-core span{display:block;text-align:left;margin-top:6px}
  .unity-fronts{grid-template-columns:repeat(2,1fr)}.unity-rules{grid-template-columns:1fr}
  .unity-team .fichas{grid-template-columns:1fr}.unity-team .ficha{padding:14px}
  .fases{gap:12px;margin-top:30px}.fase{padding:22px}
  .anchor{gap:12px;margin-top:28px}
  .bkcalc{padding:20px 18px}
  .fingrid.has-mock,.radgrid.has-mock,.wfgrid.has-mock{width:100%;max-width:100%;min-width:0;gap:24px}
  .mock,.radr,.wfr,.finr{width:100%;max-width:100%;min-width:0}
  .onode,.obranch,.agent-card,.an,.fuga,.fase,.unity-map,.unity-rules,.bkcalc{max-width:100%;min-width:0;overflow-wrap:anywhere}
  .mw-head,.mw-row{grid-template-columns:1fr 1fr;overflow:hidden}
  .mw-head>*:nth-child(n+3),.mw-row>*:nth-child(n+3){display:none}

  .edge{width:28px;height:70px;font-size:22px;background:rgba(13,15,23,.72)}
  .navhint{display:none}
}