/* Generado por build/build-apartados.js: los apartados de apartados/ (Jesús), cada uno bajo su contenedor. No editar a mano. */
/* Generado por build/ a partir de apartados/comun/css/locodea.css, apartados/paneles-de-datos/css/paneles.css. No editar a mano. */
/* ---- aislamiento frente a css/style.css (generado) ---- */
.pj-bi .bot{background:revert;box-shadow:revert}
.pj-bi .brand{font-weight:revert;letter-spacing:revert;color:revert;font-size:revert}
.pj-bi .btn{position:revert;justify-content:revert;height:revert;cursor:revert;font-size:revert}
.pj-bi .case{background:revert;box-shadow:revert;flex-direction:revert;transition:revert}
.pj-bi .cta{display:revert;grid-template-columns:revert;gap:revert;align-items:revert}
.pj-bi .device{width:revert;max-width:revert;overflow:revert;transform:revert}
.pj-bi .dot{display:revert;width:revert;height:revert;border-radius:revert;background:revert;flex:revert;margin-top:initial}
.pj-bi .flow{flex-direction:revert}
.pj-bi .fl{display:revert;flex-direction:revert;align-items:revert}
.pj-bi .hero{isolation:revert;display:revert;flex-direction:revert;align-items:revert;text-align:revert;gap:revert}
.pj-bi .hero::after{content:none}
.pj-bi .hero::before{content:none}
.pj-bi .lb{color:revert;font-weight:revert}
.pj-bi .link{font-size:revert}
.pj-bi .logo{display:revert;align-items:revert;gap:revert}
.pj-bi .nav-in{pointer-events:revert;transition:revert;z-index:revert;position:revert}
.pj-bi .nav{left:revert;right:revert;padding:initial;pointer-events:revert}
.pj-bi .num{margin-top:initial;font-size:revert;font-weight:revert;letter-spacing:revert;line-height:revert;color:revert}
.pj-bi .num::after{content:none}
.pj-bi .sub{text-wrap:revert;margin-inline:initial;margin:initial;position:revert;z-index:revert}
.pj-bi .tilt{position:revert;transform:revert;transform-style:revert;transition:revert;will-change:revert}
.pj-bi .tilt::after{content:none}
.pj-bi .vctl{z-index:revert}
/* ---- apartados/comun/css/locodea.css ---- */
/* locodea. — sistema de diseño «Web Design - locodea» (paleta Bronce).
   Un solo tema (claro), por decisión del sistema. COMPARTIDO por todos los apartados de la web (../comun/css/). */

.pj-bi{
  --paper:#fff; --ink:#1b1816; --ink-90:rgba(27,24,22,.9); --ink-65:rgba(27,24,22,.65); --ink-45:rgba(27,24,22,.45); --ink-10:rgba(27,24,22,.1); --ink-5:rgba(27,24,22,.05);
  --bronze:#b07a4a; --bronze-hover:#9c6a3e; --bronze-deep:#8e5e34; --bronze-text:#8a5a30; --bronze-light:#d9b48c; --bronze-soft:rgba(176,122,74,.14);
  --sand:#f1ebe2; --sand-2:#f8f4ee; --sand-3:#e8dccb; --dark:#1b1816; --dark-deep:#12100e; --on-dark:#fff; --on-dark-70:rgba(255,255,255,.7); --on-dark-45:rgba(255,255,255,.45);
  --ok:#01d062; --warn:#febc2e;
  /* semáforo de los paneles (visuales de datos, nunca texto de interfaz) */
  --st-ok:#4f8a64; --st-mid:#d19a3e; --st-bad:#c2553f;
  --radius-sm:12px; --radius-md:20px; --radius-lg:24px; --radius-xl:32px; --radius-pill:99px;
  --shadow-ring:0 0 0 1px rgba(27,24,22,.05);
  --shadow-card:0 0 0 1px rgba(27,24,22,.05),0 1px 2px rgba(0,0,0,.03);
  --shadow-lift:0 24px 48px -16px rgba(80,55,30,.22),0 0 0 1px rgba(27,24,22,.05);
  --shadow-glow:0 0 0 1px rgba(255,255,255,.1),0 40px 80px -30px rgba(176,122,74,.35);
  --font:"DM Sans","Inter","Helvetica Neue",Arial,sans-serif;
  --container:1240px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
.pj-bi *{box-sizing:border-box}
.pj-bi [hidden]{display:none!important}
.pj-bi{scroll-behavior:smooth}
.pj-bi{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.5 var(--font);-webkit-font-smoothing:antialiased;padding-inline:16px;overflow-x:hidden}
.pj-bi h1,.pj-bi h2,.pj-bi h3,.pj-bi h4{font-weight:500;line-height:1.08;letter-spacing:-.04em;margin:0;text-wrap:balance;color:var(--ink-90)}
.pj-bi h1{font-size:clamp(44px,7vw,76px)}
/* la segunda parte del titular de cada apartado, en bronce con brillo, como en Power Apps y Power Automate (.lx-g) */
.pj-bi .hero h1 em{font-style:normal;background:linear-gradient(100deg,#b9834f 0%,#8e5e34 28%,#e6c39b 48%,#a8723f 64%,#8e5e34 82%,#c99464 100%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:h-brillo 7s linear infinite}
@keyframes h-brillo{from{background-position:0 0}to{background-position:-240% 0}}
@media (prefers-reduced-motion:reduce){.pj-bi .hero h1 em{animation:none}}
.pj-bi h2{font-size:clamp(36px,5vw,56px)}
.pj-bi h3{font-size:clamp(26px,3.4vw,34px);letter-spacing:-.03em}
.pj-bi h4{font-size:20px;line-height:1.2;letter-spacing:-.02em}
.pj-bi p{margin:0}
.pj-bi b,.pj-bi strong{font-weight:500}
.pj-bi a{color:inherit}
.pj-bi button,.pj-bi input,.pj-bi select{font:inherit;color:inherit}
.pj-bi button{cursor:pointer}
.pj-bi :focus-visible{outline:2px solid var(--bronze);outline-offset:3px}
.pj-bi img,.pj-bi video,.pj-bi canvas{max-width:100%;display:block}
.pj-bi .num{font-variant-numeric:tabular-nums}

.pj-bi .wrap{max-width:var(--container);margin-inline:auto}
.pj-bi .logo{font-weight:600;letter-spacing:-.03em;font-size:22px;line-height:1;text-decoration:none;color:var(--ink)}
.pj-bi .logo b{color:var(--bronze);font-weight:600}
.pj-bi b.dot{color:var(--bronze);font-weight:inherit}   /* el punto de «locodea.» dentro de un texto */
.pj-bi section{padding-block:48px}

/* chip → titular → entradilla → botones */
.pj-bi .head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;max-width:780px;margin-inline:auto}
.pj-bi .head.left{align-items:flex-start;text-align:left;margin-inline:0}
.pj-bi .chip{display:inline-flex;align-items:center;gap:8px;font:500 13.5px/1.2 var(--font);color:var(--bronze-text);background:var(--paper);box-shadow:var(--shadow-card);padding:8px 14px;border-radius:var(--radius-pill)}
.pj-bi .sub{font-size:18px;line-height:1.5;color:var(--ink-65);max-width:56ch}
.pj-bi .btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.pj-bi .head.left .btns{justify-content:flex-start}
.pj-bi .btn{display:inline-flex;align-items:center;gap:8px;font:500 15px/1.2 var(--font);padding:14px 22px;border-radius:var(--radius-pill);border:0;text-decoration:none;transition:background .2s,transform .2s;white-space:nowrap}
.pj-bi .btn:active{transform:scale(.98)}
.pj-bi .btn-ink{background:var(--ink);color:var(--on-dark)}
.pj-bi .btn-ink:hover{background:#2e2925}
.pj-bi .btn-ghost{background:var(--bronze-soft);color:var(--bronze-text)}
.pj-bi .btn-ghost:hover{background:rgba(176,122,74,.22)}
.pj-bi .btn-bronze{background:var(--bronze);color:var(--on-dark)}
.pj-bi .btn-bronze:hover{background:var(--bronze-hover)}
.pj-bi .btn-sm{padding:10px 16px;font-size:14px}
.pj-bi .link{color:var(--bronze-text);font-weight:500;text-decoration:none;display:inline-flex;gap:6px;align-items:center}
.pj-bi .link:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- navegación ---------- */
.pj-bi .nav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 12px);z-index:30;margin-top:12px}
.pj-bi .nav-in{max-width:var(--container);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:10px 10px 10px 22px}
.pj-bi .nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.pj-bi .nav li a{display:block;font:500 15px/1.2 var(--font);color:var(--ink-65);text-decoration:none;padding:10px 14px;border-radius:var(--radius-pill)}
.pj-bi .nav li a:hover{color:var(--ink)}
.pj-bi .nav li a[aria-current]{color:var(--ink);background:var(--sand)}
.pj-bi .nav .btn{padding:11px 18px}
@media (max-width:900px){.pj-bi .nav ul{display:none}}

/* ---------- dispositivos ---------- */
.pj-bi .device{background:var(--paper);border-radius:var(--radius-md);box-shadow:var(--shadow-lift);padding:10px}
.pj-bi .device-bar{display:flex;align-items:center;gap:6px;padding:4px 6px 10px}
.pj-bi .device-bar i{width:10px;height:10px;border-radius:50%;background:var(--sand-3)}
.pj-bi .device-bar span{margin-left:10px;font:500 12px/1 var(--font);color:var(--ink-45);background:var(--sand-2);border-radius:var(--radius-pill);padding:6px 12px;flex:1;max-width:320px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.pj-bi .screen{position:relative;border-radius:12px;overflow:hidden;background:var(--sand-2);aspect-ratio:16/9}
.pj-bi .screen video,.pj-bi .screen img{width:100%;height:100%;object-fit:cover}
.pj-bi .vctl{position:absolute;right:14px;bottom:14px;display:flex;gap:8px}
.pj-bi .vctl button{border:0;background:rgba(18,16,14,.72);color:var(--on-dark);backdrop-filter:blur(8px);font:500 13.5px/1 var(--font);padding:9px 14px;border-radius:var(--radius-pill)}
.pj-bi .vctl button:hover{background:rgba(18,16,14,.9)}
@media (max-width:640px){.pj-bi .vctl{right:8px;bottom:8px}.pj-bi .vctl button{padding:7px 11px;font-size:12.5px}}

/* ---------- tarjetas, píldoras, listas ---------- */
.pj-bi .card{background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-lg);padding:24px;display:flex;flex-direction:column;gap:10px}
.pj-bi .card p{color:var(--ink-65)}
.pj-bi .ic{width:40px;height:40px;border-radius:var(--radius-sm);background:var(--bronze-soft);color:var(--bronze-text);display:grid;place-items:center;font:500 15px/1 var(--font);flex:none}
.pj-bi .pills{display:flex;flex-wrap:wrap;gap:8px}
.pj-bi .pill{font:500 13.5px/1.2 var(--font);padding:7px 12px;border-radius:var(--radius-pill);background:var(--paper);box-shadow:var(--shadow-card);color:var(--ink-65)}
.pj-bi .pill.hot{background:var(--bronze-soft);box-shadow:none;color:var(--bronze-text)}
.pj-bi .qlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.pj-bi .qlist li{display:flex;gap:12px;align-items:baseline;color:var(--ink-90)}
.pj-bi .qlist li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--bronze);transform:translateY(-2px)}
.pj-bi .qlabel{font:500 13.5px/1.2 var(--font);color:var(--ink-45)}
.pj-bi .panel-sand{border-radius:var(--radius-xl);background:var(--sand);padding:48px}
@media (max-width:760px){.pj-bi .panel-sand{padding:24px}}

/* ---------- panel oscuro (uno por página) ---------- */
.pj-bi .night{border-radius:var(--radius-xl);background:radial-gradient(55% 45% at 50% 100%,rgba(176,122,74,.35),transparent 70%),var(--dark);color:var(--on-dark);padding:96px 48px}
.pj-bi .night h2,.pj-bi .night h3,.pj-bi .night h4{color:var(--on-dark)}
.pj-bi .night .chip{background:rgba(255,255,255,.06);box-shadow:0 0 0 1px rgba(255,255,255,.1);color:var(--bronze-light)}
.pj-bi .night .sub{color:var(--on-dark-70)}
.pj-bi .grad{background:linear-gradient(90deg,#ebd0ae,var(--bronze) 45%,var(--bronze-deep));-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:980px){.pj-bi .night{padding:64px 20px}}

/* ---------- preguntas frecuentes ---------- */
.pj-bi .faq{max-width:820px;margin:48px auto 0;display:flex;flex-direction:column;gap:12px}
.pj-bi .faq details{background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-lg);padding:0 24px}
.pj-bi .faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;font:500 18px/1.3 var(--font);letter-spacing:-.01em}
.pj-bi .faq summary::-webkit-details-marker{display:none}
.pj-bi .faq summary::after{content:"+";flex:none;width:32px;height:32px;border-radius:50%;background:var(--sand);display:grid;place-items:center;font-size:20px;line-height:1;color:var(--bronze-text);transition:transform .25s}
.pj-bi .faq details[open] summary::after{transform:rotate(45deg)}
.pj-bi .faq details p{color:var(--ink-65);padding-bottom:22px;max-width:65ch}

/* ---------- llamada final + pie ---------- */
.pj-bi .cta{border-radius:var(--radius-xl);background:linear-gradient(134deg,var(--sand),#c99b70 50%,var(--sand) 92%);padding:96px 24px;text-align:center}
.pj-bi .cta .sub{color:var(--ink-90)}
.pj-bi footer{max-width:var(--container);margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-block:32px 48px;color:var(--ink-45);font-size:14px}

/* ---------- notas de diseño (solo equipo) ---------- */
.pj-bi .note{max-width:var(--container);margin:0 auto 16px;background:#fffaf2;border-radius:var(--radius-md);box-shadow:0 0 0 1px rgba(176,122,74,.35);padding:16px 20px;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:14.5px;color:var(--ink-90);text-align:left}
.pj-bi .note b{grid-row:span 2;font:500 12px/1 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--bronze-text);background:var(--bronze-soft);padding:7px 10px;border-radius:var(--radius-pill);align-self:start}
.pj-bi .note ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.pj-bi .night .note{background:rgba(255,255,255,.05);box-shadow:0 0 0 1px rgba(217,180,140,.4);color:var(--on-dark-70)}
.pj-bi .night .note b{color:var(--bronze-light);background:rgba(217,180,140,.12)}
body:not(.notes-on) .pj-bi .note,body:not(.notes-on) .pj-bi .only-notes{display:none}
.pj-bi .notes-toggle{position:fixed;right:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);z-index:40;border:0;background:var(--ink);color:var(--on-dark);font:500 14px/1 var(--font);padding:12px 16px;border-radius:var(--radius-pill);box-shadow:0 12px 30px -10px rgba(0,0,0,.4);display:flex;align-items:center;gap:10px}
.pj-bi .notes-toggle i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35)}
body.notes-on .pj-bi .notes-toggle i{background:var(--bronze)}

/* ---------- visor ampliado ---------- */
.pj-bi .lb{position:fixed;inset:0;z-index:60;background:rgba(18,16,14,.86);display:grid;place-items:center;padding:24px;cursor:zoom-out}
.pj-bi .lb img,.pj-bi .lb video{max-height:86vh;width:auto;max-width:100%;border-radius:14px;box-shadow:var(--shadow-glow)}
.pj-bi .lb p{color:var(--on-dark-70);font-size:14px;margin-top:12px;text-align:center}

@media (prefers-reduced-motion:reduce){.pj-bi *{transition:none!important;animation:none!important}.pj-bi{scroll-behavior:auto}}

/* móvil (locodea-web, 2026-10-05): los tres botones del vídeo, en una línea y centrados dentro de la pantalla */
@media (max-width:640px){.pj-bi .vctl{left:8px;justify-content:center;gap:5px}.pj-bi .vctl button{white-space:nowrap;padding:6px 9px;font-size:11.5px}}

/* ---- apartados/paneles-de-datos/css/paneles.css ---- */
/* Apartado «Paneles de datos» — estilos propios. Los tokens y componentes comunes están en ../comun/css/locodea.css */

/* ---------- 1 · Portada + vídeo ---------- */
.pj-bi .hero{margin-top:16px;border-radius:var(--radius-xl);padding:80px 24px 0;overflow:hidden;position:relative;
  background:radial-gradient(60% 40% at 50% 100%,rgba(176,122,74,.45),transparent 70%),linear-gradient(180deg,var(--paper),var(--sand-2) 35%,var(--sand-3))}
.pj-bi .hero-pbi{width:64px;height:64px;display:block;margin-inline:auto;filter:drop-shadow(0 10px 18px rgba(178,84,0,.22))}
.pj-bi .stage-video{max-width:1080px;margin:48px auto 0;perspective:1800px;position:relative}
.pj-bi .device.pj-tilt{--t:1;transform-origin:50% 100%;transform:rotateX(calc(var(--t) * 14deg)) scale(calc(1 - var(--t) * .05));transition:transform .08s linear;border-radius:var(--radius-md) var(--radius-md) 0 0;padding:10px 10px 0;will-change:transform}
.pj-bi .device.pj-tilt .screen{border-radius:12px;box-shadow:0 0 0 1px rgba(27,24,22,.07)}
.pj-bi .screen.dark{background:var(--dark)}
.pj-bi .facts{display:grid;grid-template-columns:repeat(3,1fr);max-width:1080px;margin:0 auto;background:var(--paper);box-shadow:var(--shadow-ring);border-radius:0 0 var(--radius-md) var(--radius-md);position:relative;z-index:1}
.pj-bi .facts div{padding:18px 24px;display:flex;flex-direction:column;gap:2px}
.pj-bi .facts div+div{box-shadow:-1px 0 0 var(--ink-5)}
.pj-bi .facts strong{font-size:26px;letter-spacing:-.03em;line-height:1.1}
.pj-bi .facts span{font-size:14px;color:var(--ink-65)}
.pj-bi .hero-foot{height:56px}
@media (max-width:640px){.pj-bi .hero{padding:56px 16px 0}.pj-bi .hero-pbi{width:52px;height:52px}.pj-bi .facts{grid-template-columns:1fr}.pj-bi .facts div+div{box-shadow:0 -1px 0 var(--ink-5)}}

/* capítulos del vídeo (segmentos proporcionales a su duración) */
.pj-bi .chapters{list-style:none;margin:0;padding:12px 4px 10px;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
.pj-bi .chapters::-webkit-scrollbar{display:none}
.pj-bi .chapters li{flex:var(--d) 0 0;min-width:92px}
.pj-bi .chapters button{width:100%;border:0;background:none;padding:6px 4px 4px;border-radius:10px;display:flex;flex-direction:column;gap:7px;text-align:left;color:var(--ink-45);font:500 13px/1.2 var(--font);transition:color .2s,background .2s}
.pj-bi .chapters button:hover{color:var(--ink);background:var(--sand-2)}
.pj-bi .chapters .bar{display:block;height:4px;border-radius:4px;background:var(--ink-10);overflow:hidden}
.pj-bi .chapters .bar i{display:block;height:100%;width:var(--p,0%);background:var(--bronze);border-radius:4px}
.pj-bi .chapters .lab{display:flex;flex-direction:column;gap:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12.5px}
.pj-bi .chapters time{font-size:11.5px;color:var(--ink-45);font-variant-numeric:tabular-nums;font-weight:400}
.pj-bi .chapters [aria-current="true"]{color:var(--ink)}
@media (max-width:640px){.pj-bi .chapters li{min-width:96px}}

/* ---------- 2 · Cómo funciona (flujo) ---------- */
.pj-bi .flow{position:relative;display:grid;grid-template-columns:1fr 1.05fr 1.3fr;gap:64px;align-items:center;margin-top:48px;padding:64px 56px 44px;border-radius:var(--radius-xl);
  background:radial-gradient(55% 55% at 50% 110%,rgba(176,122,74,.22),transparent 70%),linear-gradient(180deg,var(--paper),var(--sand-2))}
.pj-bi .flow::before{content:"";position:absolute;inset:0;border-radius:inherit;background-image:radial-gradient(rgba(176,122,74,.16) 1px,transparent 1.2px);background-size:22px 22px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%);pointer-events:none}
.pj-bi .flow-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:0}
.pj-bi .flow-lines .fl{fill:none;stroke:rgba(176,122,74,.32);stroke-width:2;stroke-dasharray:3 7;stroke-linecap:round;transition:stroke .4s}
.pj-bi .flow[data-step="1"] .fl[data-col="1"],.pj-bi .flow[data-step="2"] .fl,.pj-bi .flow[data-step="3"] .fl[data-col="3"]{stroke:rgba(176,122,74,.7)}
.pj-bi .fdot{fill:var(--bronze);filter:drop-shadow(0 0 4px rgba(176,122,74,.6))}
.pj-bi .fcol{position:relative;z-index:1;transition:opacity .45s var(--ease),transform .45s var(--ease)}
.pj-bi .flow[data-step] .fcol{opacity:.55}
.pj-bi .flow[data-step="1"] .f-src,.pj-bi .flow[data-step="2"] .f-hub,.pj-bi .flow[data-step="3"] .f-out{opacity:1;transform:translateY(-4px)}
.pj-bi .f-src{display:flex;flex-direction:column;gap:12px}
.pj-bi .src-card{display:flex;align-items:center;gap:12px;background:var(--paper);border-radius:16px;box-shadow:var(--shadow-card);padding:12px 14px;min-width:0}
.pj-bi .src-card:nth-child(even){margin-left:22px;margin-right:-22px}
.pj-bi .src-card div{min-width:0}
.pj-bi .src-card b{display:block;font-size:14px;font-weight:500;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-bi .src-card span:not(.src-ic){font-size:12.5px;color:var(--ink-45)}
.pj-bi .src-ic{flex:none;width:40px;height:40px;border-radius:12px;background:var(--sand-2);display:grid;place-items:center}
.pj-bi .src-ic img{width:24px;height:24px}
.pj-bi .hub{background:var(--paper);border-radius:28px;box-shadow:var(--shadow-lift);padding:22px 22px 18px;display:flex;flex-direction:column;gap:14px}
.pj-bi .hub-top{display:flex;align-items:center;gap:14px}
.pj-bi .hub-logo{width:44px;height:44px;flex:none}
.pj-bi .hub-top b{display:block;font-size:22px;font-weight:500;letter-spacing:-.02em;line-height:1.1}
.pj-bi .hub-top span{font-size:14px;color:var(--ink-65)}
.pj-bi .model{position:relative;height:170px;background:var(--sand-2);border-radius:18px}
.pj-bi .m-lines{position:absolute;inset:0;width:100%;height:100%}
.pj-bi .m-lines path{fill:none;stroke:var(--bronze);stroke-width:1.6;opacity:.55;vector-effect:non-scaling-stroke}
.pj-bi .m-node{position:absolute;transform:translate(-50%,-50%);font:500 12.5px/1 var(--font);background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:8px 12px;white-space:nowrap}
.pj-bi .m-c{left:50%;top:50%;background:var(--bronze);color:#fff;box-shadow:0 8px 18px -8px rgba(176,122,74,.8);padding:10px 16px;font-size:13.5px}
.pj-bi .m-1{left:20%;top:16.5%}.pj-bi .m-2{left:80%;top:16.5%}.pj-bi .m-3{left:20%;top:83.5%}.pj-bi .m-4{left:80%;top:83.5%}
.pj-bi .flow[data-step="2"] .m-c{animation:hubPulse 1.8s ease-out infinite}
@keyframes hubPulse{0%{box-shadow:0 0 0 0 rgba(176,122,74,.5)}100%{box-shadow:0 0 0 14px rgba(176,122,74,0)}}
.pj-bi .hub-sync{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-65)}
.pj-bi .hub-sync i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px rgba(1,208,98,.15)}
.pj-bi .out-stage{position:relative;perspective:1400px;padding:0 10px 30px 0}
.pj-bi .laptop{transform:rotateY(-12deg) rotateX(5deg);transform-origin:60% 50%;transition:transform .8s var(--ease)}
.pj-bi .flow[data-step="3"] .laptop,.pj-bi .out-stage:hover .laptop{transform:rotateY(-4deg) rotateX(2deg)}
.pj-bi .lp-screen{background:var(--dark);border-radius:14px 14px 4px 4px;padding:9px;box-shadow:var(--shadow-lift)}
.pj-bi .lp-screen img{border-radius:6px;aspect-ratio:16/9;width:100%;height:auto;object-fit:cover}
.pj-bi .lp-base{height:12px;margin:0 -7%;border-radius:0 0 14px 14px;background:linear-gradient(180deg,#d9cbb8,#bfae97);box-shadow:0 18px 28px -14px rgba(80,55,30,.45)}
.pj-bi .mini-phone{position:absolute;right:-6px;bottom:0;width:128px;background:var(--paper);border-radius:20px;box-shadow:var(--shadow-lift),inset 0 0 0 4px var(--ink);padding:14px 12px 10px;display:flex;flex-direction:column;gap:2px;animation:float 6s ease-in-out infinite}
.pj-bi .mini-phone span{font-size:10px;color:var(--ink-65)}
.pj-bi .mini-phone b{font-size:19px;letter-spacing:-.03em;line-height:1.1}
.pj-bi .mini-phone em{font-style:normal;font-size:10px;color:var(--bronze-text)}
.pj-bi .mini-phone svg{width:100%;margin-top:4px}
.pj-bi .flow-steps{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.05fr 1.3fr;gap:64px;list-style:none;margin:8px 0 0;padding:0;position:relative;z-index:1}
.pj-bi .flow-steps li{display:flex;gap:14px;align-items:flex-start;padding:16px;border-radius:var(--radius-lg);transition:background .35s,box-shadow .35s}
.pj-bi .flow-steps .n{flex:none;width:36px;height:36px;border-radius:12px;background:var(--bronze-soft);color:var(--bronze-text);display:grid;place-items:center;font:500 15px/1 var(--font);transition:background .35s,color .35s}
.pj-bi .flow-steps h4{font-size:18px;margin-bottom:4px}
.pj-bi .flow-steps p{color:var(--ink-65);font-size:15px}
.pj-bi .flow[data-step="1"] .flow-steps li[data-col="1"],.pj-bi .flow[data-step="2"] .flow-steps li[data-col="2"],.pj-bi .flow[data-step="3"] .flow-steps li[data-col="3"]{background:var(--paper);box-shadow:var(--shadow-card)}
.pj-bi .flow[data-step="1"] li[data-col="1"] .n,.pj-bi .flow[data-step="2"] li[data-col="2"] .n,.pj-bi .flow[data-step="3"] li[data-col="3"] .n{background:var(--bronze);color:#fff}
@media (max-width:1000px){
  .pj-bi .flow{grid-template-columns:1fr;gap:40px;padding:36px 20px 24px}
  .pj-bi .flow-steps{display:contents}
  .pj-bi .f-src{order:2}.pj-bi .flow-steps li[data-col="1"]{order:1}
  .pj-bi .f-hub{order:4}.pj-bi .flow-steps li[data-col="2"]{order:3}
  .pj-bi .f-out{order:6}.pj-bi .flow-steps li[data-col="3"]{order:5}
  .pj-bi .src-card:nth-child(even){margin-left:0;margin-right:0}
  .pj-bi .flow[data-step] .fcol{opacity:1;transform:none}
  .pj-bi .laptop{transform:none}
}

/* donde ya trabajas: una sola fila */
.pj-bi .where{display:grid;grid-template-columns:1fr 1.1fr 1.1fr 1.1fr;gap:12px;margin-top:16px;align-items:stretch}
.pj-bi .where-h{display:flex;flex-direction:column;justify-content:center;gap:6px;padding:8px 8px 8px 4px}
.pj-bi .where-h b{font-size:22px;font-weight:500;letter-spacing:-.03em;line-height:1.15}
.pj-bi .where-h>span{color:var(--ink-65);font-size:15px}
.pj-bi .where-h .vid-link{align-self:flex-start;margin-top:8px}
.pj-bi .w-mini{margin:0;display:flex;gap:14px;align-items:center;background:var(--sand-2);border-radius:var(--radius-lg);padding:14px}
.pj-bi .w-mini figcaption h4{font-size:16px;margin-bottom:2px}
.pj-bi .w-mini figcaption p{font-size:13.5px;color:var(--ink-65);line-height:1.4}
.pj-bi .w-vis{flex:none;width:96px;height:96px;border-radius:16px;background:#fff;box-shadow:var(--shadow-card);position:relative;overflow:hidden}
.pj-bi .phone-mini{width:64px;border-radius:14px;box-shadow:var(--shadow-card),inset 0 0 0 3px var(--ink);padding:16px 8px 8px;display:flex;flex-direction:column;gap:1px;margin-inline:16px}
.pj-bi .phone-mini span{font-size:8px;color:var(--ink-65)}
.pj-bi .phone-mini b{font-size:13px;letter-spacing:-.03em;line-height:1.1}
.pj-bi .phone-mini em{font-style:normal;font-size:8px;color:var(--bronze-text)}
.pj-bi .teams-mini img:first-child{position:absolute;left:8px;top:8px;width:18px;height:18px}
.pj-bi .teams-mini .tm-shot{position:absolute;left:8px;right:8px;bottom:10px;width:calc(100% - 16px);aspect-ratio:16/9;object-fit:cover;border-radius:6px;box-shadow:0 0 0 1px var(--ink-5)}
.pj-bi .mail-mini{display:flex;align-items:center;gap:8px;padding:10px}
.pj-bi .mail-mini i{flex:none;width:8px;height:8px;border-radius:50%;background:var(--st-bad)}
.pj-bi .mail-mini span{font-size:10px;color:var(--ink-65);line-height:1.35}
.pj-bi .mail-mini b{display:block;font-size:10.5px;color:var(--ink);font-weight:500}
@media (max-width:1100px){.pj-bi .where{grid-template-columns:1fr 1fr}.pj-bi .where-h{grid-column:1/-1}}
@media (max-width:640px){.pj-bi .where{grid-template-columns:1fr}}

/* ---------- 3 · Casos de uso (portfolio) ---------- */
.pj-bi .port{display:grid;grid-template-columns:300px 1fr;gap:24px;margin-top:28px;align-items:center}
.pj-bi .port-list{display:flex;flex-direction:column;gap:6px;position:sticky;top:96px}
.pj-bi .pcase{border:0;background:transparent;text-align:left;padding:10px 14px 10px 20px;border-radius:18px;display:flex;flex-direction:column;gap:3px;position:relative;transition:background .2s,box-shadow .2s}
.pj-bi .pcase::before{content:"";position:absolute;left:8px;top:14px;bottom:14px;width:3px;border-radius:3px;background:transparent;transition:background .2s}
.pj-bi .pcase b{font:500 17px/1.2 var(--font);letter-spacing:-.02em;color:var(--ink-90)}
.pj-bi .pcase span{font-size:14px;line-height:1.35;color:var(--ink-65)}
.pj-bi .pcase:hover{background:var(--sand-2)}
.pj-bi .pcase[aria-selected="true"]{background:var(--paper);box-shadow:var(--shadow-lift)}
.pj-bi .pcase[aria-selected="true"]::before{background:var(--bronze)}
.pj-bi .pcase em{font-style:normal;font:500 11.5px/1 var(--font);color:var(--bronze-text);background:var(--bronze-soft);border-radius:var(--radius-pill);padding:4px 8px;align-self:flex-start;margin-top:4px}
.pj-bi .port-view{min-width:0;border-radius:var(--radius-xl);background:var(--sand);padding:20px}
.pj-bi .port-view .screen{cursor:zoom-in}
.pj-bi .port-view .screen img,.pj-bi .port-view .screen video{transition:opacity .25s}
.pj-bi .pg-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;margin-top:12px}
.pj-bi .pg-tile{border:0;background:var(--paper);border-radius:12px;padding:5px 5px 7px;box-shadow:var(--shadow-card);display:flex;flex-direction:column;gap:5px;text-align:left;min-width:0;transition:box-shadow .2s,transform .2s}
.pj-bi .pg-tile:hover{transform:translateY(-2px)}
.pj-bi .pg-tile[aria-pressed="true"]{box-shadow:0 0 0 2px var(--bronze)}
.pj-bi .pg-tile img,.pj-bi .pg-tile .pg-ic{border-radius:8px;aspect-ratio:16/9;width:100%;height:auto;object-fit:cover;display:block}
.pj-bi .pg-tile .pg-ic{display:grid;place-items:center;background:var(--dark);color:var(--on-dark);font:500 12px/1 var(--font)}
.pj-bi .pg-tile .pg-ic.v::before{content:"";border-left:11px solid #fff;border-top:7px solid transparent;border-bottom:7px solid transparent}
.pj-bi .pg-tile.feat .pg-ic{background:radial-gradient(80% 80% at 50% 100%,rgba(176,122,74,.55),transparent 70%),var(--dark);font-size:15px;letter-spacing:.04em}
.pj-bi .pg-tile.feat span:last-child{color:var(--bronze-text)}
.pj-bi .pg-tile span{font:500 11.5px/1.25 var(--font);color:var(--ink-65);padding-inline:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-bi .media-cap{font-size:13px;color:var(--ink-45);margin-top:10px;text-align:center}
.pj-bi .plant-inline{position:absolute;inset:0;background:radial-gradient(60% 50% at 50% 100%,rgba(176,122,74,.16),transparent 70%),var(--sand-2);cursor:grab;touch-action:none}
.pj-bi .plant-inline canvas{width:100%!important;height:100%!important}
.pj-bi .plant-hint{position:absolute;left:12px;top:10px;font-size:12px;color:var(--ink-45);pointer-events:none}
.pj-bi .plant-mini{position:absolute;left:12px;bottom:12px;background:#fff;border-radius:14px;box-shadow:var(--shadow-lift);padding:10px 14px;display:grid;grid-template-columns:auto auto;gap:2px 12px;align-items:baseline;min-width:200px;pointer-events:none}
.pj-bi .plant-mini b{grid-column:1/-1;font-size:13.5px;font-weight:500}
.pj-bi .plant-mini #bi-pcSec{grid-column:1/-1;font-size:11.5px;color:var(--ink-65)}
.pj-bi .plant-mini #bi-pcOee{font-size:26px;letter-spacing:-.03em;font-weight:500}
.pj-bi .plant-mini #bi-pcObj{font-size:11px;color:var(--ink-65)}
.pj-bi .plant-mini .pc-bar{grid-column:1/-1;height:5px;border-radius:5px;background:var(--sand);overflow:hidden}
.pj-bi .plant-mini .pc-bar i{display:block;height:100%;border-radius:5px;background:var(--st-bad);transition:width .5s var(--ease)}
.pj-bi .plant-mini #bi-pcNote{grid-column:1/-1;font-size:11px;color:var(--ink-65);max-width:240px}
.pj-bi .plant-mini .pc-kv{display:none}
.pj-bi .plant-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:1060px){
  .pj-bi .port{grid-template-columns:1fr;gap:16px}
  .pj-bi .port-list{position:static;flex-direction:row;overflow-x:auto;gap:8px;padding:4px 2px 8px;scrollbar-width:none}
  .pj-bi .port-list::-webkit-scrollbar{display:none}
  .pj-bi .pcase{flex:0 0 220px;background:var(--sand-2)}
  .pj-bi .port-view{padding:16px}
  }

/* ---------- 4 · Personalización ---------- */
.pj-bi .brand{display:grid;grid-template-columns:.85fr 1.3fr;gap:40px;align-items:center;background:var(--sand-2);border-radius:var(--radius-xl);padding:40px}
.pj-bi .brand-txt{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.pj-bi .brand-txt .sub{font-size:17px}
.pj-bi .skins{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;width:100%;max-width:440px}
.pj-bi .skin{border:0;padding:6px 6px 10px;background:var(--paper);border-radius:16px;box-shadow:var(--shadow-card);display:flex;flex-direction:column;gap:8px;text-align:left;transition:transform .2s,box-shadow .2s}
.pj-bi .skin img{border-radius:10px;aspect-ratio:16/9;width:100%;height:auto;object-fit:cover}
.pj-bi .skin span{display:flex;align-items:center;gap:8px;font:500 12.5px/1.2 var(--font);color:var(--ink-65);padding-inline:4px}
.pj-bi .skin i{width:10px;height:10px;border-radius:50%;flex:none}
.pj-bi .skin:hover{transform:translateY(-2px)}
.pj-bi .skin[aria-pressed="true"]{box-shadow:0 0 0 2px var(--bronze)}
.pj-bi #bi-youImg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:980px){.pj-bi .brand{grid-template-columns:1fr;padding:20px;gap:24px}}

/* ---------- 5 · locodea. AI ---------- */
.pj-bi .ai{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center}
.pj-bi .ai-txt{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.pj-bi .lgo{font-weight:600;letter-spacing:-.03em;color:var(--ink)}
.pj-bi .lgo b{color:var(--bronze);font-weight:600}
.pj-bi .ai-pick{display:flex;flex-wrap:wrap;gap:8px}
.pj-bi .ai-pick button{display:inline-flex;align-items:center;gap:10px;border:0;background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:9px 16px 9px 10px;font:500 15px/1 var(--font);color:var(--ink-90);transition:box-shadow .2s,background .2s}
.pj-bi .ai-pick img{width:24px;height:24px;object-fit:contain}
.pj-bi .ai-pick button:hover{box-shadow:0 0 0 1px rgba(176,122,74,.45)}
.pj-bi .ai-pick button[aria-checked="true"]{box-shadow:0 0 0 2px var(--bronze),var(--shadow-card)}
.pj-bi .ai-sugg{display:flex;flex-wrap:wrap;gap:8px}
.pj-bi .ai-sugg button{border:0;background:transparent;box-shadow:0 0 0 1px var(--ink-10);border-radius:var(--radius-pill);padding:9px 14px;font:500 14px/1.2 var(--font);color:var(--ink-90);text-align:left}
.pj-bi .ai-sugg button:hover{box-shadow:0 0 0 1px rgba(176,122,74,.6)}
.pj-bi .ai-sugg button[aria-pressed="true"]{background:var(--ink);color:#fff;box-shadow:none}
.pj-bi .chat{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lift);display:flex;flex-direction:column;min-height:440px;overflow:hidden}
.pj-bi .chat-head{display:flex;gap:12px;align-items:center;padding:14px 18px;box-shadow:inset 0 -1px 0 var(--ink-5);font-size:14px}
.pj-bi .chat-head div{display:flex;flex-direction:column;line-height:1.25}
.pj-bi .chat-head div span{font-size:12.5px;color:var(--ink-45)}
.pj-bi .ai-av{width:40px;height:40px;border-radius:12px;background:var(--sand-2);display:grid;place-items:center;flex:none}
.pj-bi .ai-av img{width:24px;height:24px;object-fit:contain}
.pj-bi .chat-pbi{width:22px;height:22px;margin-left:auto}
.pj-bi .chat-body{flex:1;padding:18px;display:flex;flex-direction:column;gap:12px}
.pj-bi .msg{max-width:88%;border-radius:18px;padding:12px 14px;font-size:14.5px;line-height:1.45;animation:rise .45s var(--ease) both}
.pj-bi .msg.me{align-self:flex-end;background:var(--ink);color:#fff;border-bottom-right-radius:6px}
.pj-bi .msg.bot{align-self:flex-start;background:var(--sand-2);border-bottom-left-radius:6px}
.pj-bi .msg.bot b{font-weight:500}
.pj-bi .msg svg{display:block;width:100%;margin-top:10px}
.pj-bi .msg-who{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-45);margin-bottom:4px}
.pj-bi .msg-who img{width:14px;height:14px;object-fit:contain}
.pj-bi .msg-src{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:12px;color:var(--ink-65);background:#fff;box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:5px 10px}
.pj-bi .msg-src img{width:14px;height:14px}
.pj-bi .typing{display:inline-flex;gap:4px}
.pj-bi .typing i{width:6px;height:6px;border-radius:50%;background:var(--ink-45);animation:blink 1s infinite}
.pj-bi .typing i:nth-child(2){animation-delay:.15s}.pj-bi .typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{50%{opacity:.2}}
.pj-bi .chat-input{margin:0 14px 14px;background:var(--sand-2);border-radius:var(--radius-pill);padding:12px 16px;font-size:14px;color:var(--ink-45);display:flex;justify-content:space-between;align-items:center}
.pj-bi .chat-input i{width:28px;height:28px;border-radius:50%;background:var(--bronze)}
@media (max-width:980px){.pj-bi .ai{grid-template-columns:1fr}}

/* ---------- caso real (plantilla) ---------- */
.pj-bi .only-notes .case{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center;border-radius:var(--radius-xl);padding:32px;outline:2px dashed rgba(176,122,74,.45);outline-offset:-2px}
.pj-bi .case-ph{display:grid;place-items:center;color:var(--on-dark-70);font-size:15px}
.pj-bi .case-txt{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.pj-bi .case-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;width:100%}
.pj-bi .case-kpis b{display:block;font-size:30px;letter-spacing:-.03em}
.pj-bi .case-kpis span{font-size:13px;color:var(--ink-65)}
@media (max-width:900px){.pj-bi .only-notes .case{grid-template-columns:1fr}}

/* ---------- 6 · Preguntas + las cuentas ---------- */
.pj-bi .qa{max-width:820px;margin:40px auto 0}
.pj-bi .qa .faq{margin:0;max-width:none}
.pj-bi .calc-card{position:sticky;top:96px;border-radius:var(--radius-xl);background:radial-gradient(70% 45% at 50% 100%,rgba(176,122,74,.32),transparent 70%),linear-gradient(180deg,var(--paper),var(--sand-2));box-shadow:var(--shadow-ring);padding:28px;display:flex;flex-direction:column;gap:16px}
.pj-bi .calc-card h3{font-size:26px}
.pj-bi .rng{display:grid;grid-template-columns:1fr auto;gap:6px 12px;align-items:baseline;font-size:14.5px}
.pj-bi .rng output{font-weight:500;font-size:16px}
.pj-bi .rng input{grid-column:1/-1;width:100%;accent-color:var(--bronze);height:22px}
.pj-bi .calc-res{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:16px 18px;display:flex;flex-direction:column;gap:2px}
.pj-bi .calc-res>span{font-size:13.5px;color:var(--ink-65)}
.pj-bi .calc-res>b{font-size:44px;letter-spacing:-.045em;line-height:1.05}
.pj-bi .calc-res p{font-size:14px;color:var(--ink-65)}
.pj-bi .calc-card .btn{align-self:flex-start}
.pj-bi .fine{font-size:12.5px;color:var(--ink-45);max-width:60ch}


/* ---------- enlaces a vídeo ---------- */
.pj-bi .vid-link{display:inline-flex;align-items:center;gap:14px;border:0;background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:8px 20px 8px 8px;font:400 15px/1.3 var(--font);color:var(--ink-65);text-align:left;transition:box-shadow .2s}
.pj-bi .vid-link b{color:var(--ink);font-weight:500}
.pj-bi .vid-link:hover{box-shadow:0 0 0 1px rgba(176,122,74,.45),var(--shadow-card)}
.pj-bi .vid-link.sm{padding:6px 16px 6px 6px;font-size:14px;gap:10px}
.pj-bi .vid-link.sm .play{width:30px;height:30px}
.pj-bi .vid-link.sm .play::after{left:12px;top:9px;border-left-width:9px;border-top-width:6px;border-bottom-width:6px}
.pj-bi .play{flex:none;width:40px;height:40px;border-radius:50%;background:var(--bronze);position:relative}
.pj-bi .play::after{content:"";position:absolute;left:16px;top:12px;border-left:12px solid #fff;border-top:8px solid transparent;border-bottom:8px solid transparent}

@keyframes float{50%{transform:translateY(-8px)}}
@keyframes rise{from{opacity:.4;transform:translateY(10px)}}

/* Generado por build/ a partir de apartados/comun/css/locodea.css, apartados/portales-para-clientes/css/portales.css. No editar a mano. */
/* ---- aislamiento frente a css/style.css (generado) ---- */
.pj-pp .bot{background:revert;box-shadow:revert}
.pj-pp .btn{position:revert;justify-content:revert;height:revert;cursor:revert;font-size:revert}
.pj-pp .cmp{padding:initial;border-bottom:revert;font-size:revert}
.pj-pp .cmp:last-child{border-bottom:revert}
.pj-pp .cta{display:revert;grid-template-columns:revert;gap:revert;align-items:revert}
.pj-pp .device{width:revert;max-width:revert;overflow:revert;transform:revert}
.pj-pp .done{display:revert;gap:revert;align-items:revert;padding:initial;border-radius:revert;background:revert;font-size:revert;color:revert;line-height:revert}
.pj-pp .dot{display:revert;width:revert;height:revert;border-radius:revert;background:revert;flex:revert;margin-top:initial}
.pj-pp .flow{flex-direction:revert}
.pj-pp .fl{display:revert;flex-direction:revert;align-items:revert}
.pj-pp .hero{isolation:revert;display:revert;flex-direction:revert;align-items:revert;text-align:revert;gap:revert}
.pj-pp .hero::after{content:none}
.pj-pp .hero::before{content:none}
.pj-pp .lb{color:revert;font-weight:revert}
.pj-pp .link{font-size:revert}
.pj-pp .logo{display:revert;align-items:revert;gap:revert}
.pj-pp .nav-in{pointer-events:revert;transition:revert;z-index:revert;position:revert}
.pj-pp .nav{left:revert;right:revert;padding:initial;pointer-events:revert}
.pj-pp .ph{width:revert;border:revert;display:revert;flex-direction:revert;gap:revert;transform:revert}
.pj-pp .role{top:revert;left:revert}
.pj-pp .sub{text-wrap:revert;margin-inline:initial;margin:initial;position:revert;z-index:revert}
.pj-pp .team{grid-template-columns:revert}
.pj-pp .tilt{position:revert;transform:revert;transform-style:revert;transition:revert;will-change:revert}
.pj-pp .tilt::after{content:none}
.pj-pp .vctl{z-index:revert}
/* ---- apartados/comun/css/locodea.css ---- */
/* locodea. — sistema de diseño «Web Design - locodea» (paleta Bronce).
   Un solo tema (claro), por decisión del sistema. COMPARTIDO por todos los apartados de la web (../comun/css/). */

.pj-pp{
  --paper:#fff; --ink:#1b1816; --ink-90:rgba(27,24,22,.9); --ink-65:rgba(27,24,22,.65); --ink-45:rgba(27,24,22,.45); --ink-10:rgba(27,24,22,.1); --ink-5:rgba(27,24,22,.05);
  --bronze:#b07a4a; --bronze-hover:#9c6a3e; --bronze-deep:#8e5e34; --bronze-text:#8a5a30; --bronze-light:#d9b48c; --bronze-soft:rgba(176,122,74,.14);
  --sand:#f1ebe2; --sand-2:#f8f4ee; --sand-3:#e8dccb; --dark:#1b1816; --dark-deep:#12100e; --on-dark:#fff; --on-dark-70:rgba(255,255,255,.7); --on-dark-45:rgba(255,255,255,.45);
  --ok:#01d062; --warn:#febc2e;
  /* semáforo de los paneles (visuales de datos, nunca texto de interfaz) */
  --st-ok:#4f8a64; --st-mid:#d19a3e; --st-bad:#c2553f;
  --radius-sm:12px; --radius-md:20px; --radius-lg:24px; --radius-xl:32px; --radius-pill:99px;
  --shadow-ring:0 0 0 1px rgba(27,24,22,.05);
  --shadow-card:0 0 0 1px rgba(27,24,22,.05),0 1px 2px rgba(0,0,0,.03);
  --shadow-lift:0 24px 48px -16px rgba(80,55,30,.22),0 0 0 1px rgba(27,24,22,.05);
  --shadow-glow:0 0 0 1px rgba(255,255,255,.1),0 40px 80px -30px rgba(176,122,74,.35);
  --font:"DM Sans","Inter","Helvetica Neue",Arial,sans-serif;
  --container:1240px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
.pj-pp *{box-sizing:border-box}
.pj-pp [hidden]{display:none!important}
.pj-pp{scroll-behavior:smooth}
.pj-pp{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.5 var(--font);-webkit-font-smoothing:antialiased;padding-inline:16px;overflow-x:hidden}
.pj-pp h1,.pj-pp h2,.pj-pp h3,.pj-pp h4{font-weight:500;line-height:1.08;letter-spacing:-.04em;margin:0;text-wrap:balance;color:var(--ink-90)}
.pj-pp h1{font-size:clamp(44px,7vw,76px)}
/* la segunda parte del titular de cada apartado, en bronce con brillo, como en Power Apps y Power Automate (.lx-g) */
.pj-pp .hero h1 em{font-style:normal;background:linear-gradient(100deg,#b9834f 0%,#8e5e34 28%,#e6c39b 48%,#a8723f 64%,#8e5e34 82%,#c99464 100%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:h-brillo 7s linear infinite}
@keyframes h-brillo{from{background-position:0 0}to{background-position:-240% 0}}
@media (prefers-reduced-motion:reduce){.pj-pp .hero h1 em{animation:none}}
.pj-pp h2{font-size:clamp(36px,5vw,56px)}
.pj-pp h3{font-size:clamp(26px,3.4vw,34px);letter-spacing:-.03em}
.pj-pp h4{font-size:20px;line-height:1.2;letter-spacing:-.02em}
.pj-pp p{margin:0}
.pj-pp b,.pj-pp strong{font-weight:500}
.pj-pp a{color:inherit}
.pj-pp button,.pj-pp input,.pj-pp select{font:inherit;color:inherit}
.pj-pp button{cursor:pointer}
.pj-pp :focus-visible{outline:2px solid var(--bronze);outline-offset:3px}
.pj-pp img,.pj-pp video,.pj-pp canvas{max-width:100%;display:block}
.pj-pp .num{font-variant-numeric:tabular-nums}

.pj-pp .wrap{max-width:var(--container);margin-inline:auto}
.pj-pp .logo{font-weight:600;letter-spacing:-.03em;font-size:22px;line-height:1;text-decoration:none;color:var(--ink)}
.pj-pp .logo b{color:var(--bronze);font-weight:600}
.pj-pp b.dot{color:var(--bronze);font-weight:inherit}   /* el punto de «locodea.» dentro de un texto */
.pj-pp section{padding-block:48px}

/* chip → titular → entradilla → botones */
.pj-pp .head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;max-width:780px;margin-inline:auto}
.pj-pp .head.left{align-items:flex-start;text-align:left;margin-inline:0}
.pj-pp .chip{display:inline-flex;align-items:center;gap:8px;font:500 13.5px/1.2 var(--font);color:var(--bronze-text);background:var(--paper);box-shadow:var(--shadow-card);padding:8px 14px;border-radius:var(--radius-pill)}
.pj-pp .sub{font-size:18px;line-height:1.5;color:var(--ink-65);max-width:56ch}
.pj-pp .btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.pj-pp .head.left .btns{justify-content:flex-start}
.pj-pp .btn{display:inline-flex;align-items:center;gap:8px;font:500 15px/1.2 var(--font);padding:14px 22px;border-radius:var(--radius-pill);border:0;text-decoration:none;transition:background .2s,transform .2s;white-space:nowrap}
.pj-pp .btn:active{transform:scale(.98)}
.pj-pp .btn-ink{background:var(--ink);color:var(--on-dark)}
.pj-pp .btn-ink:hover{background:#2e2925}
.pj-pp .btn-ghost{background:var(--bronze-soft);color:var(--bronze-text)}
.pj-pp .btn-ghost:hover{background:rgba(176,122,74,.22)}
.pj-pp .btn-bronze{background:var(--bronze);color:var(--on-dark)}
.pj-pp .btn-bronze:hover{background:var(--bronze-hover)}
.pj-pp .btn-sm{padding:10px 16px;font-size:14px}
.pj-pp .link{color:var(--bronze-text);font-weight:500;text-decoration:none;display:inline-flex;gap:6px;align-items:center}
.pj-pp .link:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- navegación ---------- */
.pj-pp .nav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 12px);z-index:30;margin-top:12px}
.pj-pp .nav-in{max-width:var(--container);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:10px 10px 10px 22px}
.pj-pp .nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.pj-pp .nav li a{display:block;font:500 15px/1.2 var(--font);color:var(--ink-65);text-decoration:none;padding:10px 14px;border-radius:var(--radius-pill)}
.pj-pp .nav li a:hover{color:var(--ink)}
.pj-pp .nav li a[aria-current]{color:var(--ink);background:var(--sand)}
.pj-pp .nav .btn{padding:11px 18px}
@media (max-width:900px){.pj-pp .nav ul{display:none}}

/* ---------- dispositivos ---------- */
.pj-pp .device{background:var(--paper);border-radius:var(--radius-md);box-shadow:var(--shadow-lift);padding:10px}
.pj-pp .device-bar{display:flex;align-items:center;gap:6px;padding:4px 6px 10px}
.pj-pp .device-bar i{width:10px;height:10px;border-radius:50%;background:var(--sand-3)}
.pj-pp .device-bar span{margin-left:10px;font:500 12px/1 var(--font);color:var(--ink-45);background:var(--sand-2);border-radius:var(--radius-pill);padding:6px 12px;flex:1;max-width:320px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.pj-pp .screen{position:relative;border-radius:12px;overflow:hidden;background:var(--sand-2);aspect-ratio:16/9}
.pj-pp .screen video,.pj-pp .screen img{width:100%;height:100%;object-fit:cover}
.pj-pp .vctl{position:absolute;right:14px;bottom:14px;display:flex;gap:8px}
.pj-pp .vctl button{border:0;background:rgba(18,16,14,.72);color:var(--on-dark);backdrop-filter:blur(8px);font:500 13.5px/1 var(--font);padding:9px 14px;border-radius:var(--radius-pill)}
.pj-pp .vctl button:hover{background:rgba(18,16,14,.9)}
@media (max-width:640px){.pj-pp .vctl{right:8px;bottom:8px}.pj-pp .vctl button{padding:7px 11px;font-size:12.5px}}

/* ---------- tarjetas, píldoras, listas ---------- */
.pj-pp .card{background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-lg);padding:24px;display:flex;flex-direction:column;gap:10px}
.pj-pp .card p{color:var(--ink-65)}
.pj-pp .ic{width:40px;height:40px;border-radius:var(--radius-sm);background:var(--bronze-soft);color:var(--bronze-text);display:grid;place-items:center;font:500 15px/1 var(--font);flex:none}
.pj-pp .pills{display:flex;flex-wrap:wrap;gap:8px}
.pj-pp .pill{font:500 13.5px/1.2 var(--font);padding:7px 12px;border-radius:var(--radius-pill);background:var(--paper);box-shadow:var(--shadow-card);color:var(--ink-65)}
.pj-pp .pill.hot{background:var(--bronze-soft);box-shadow:none;color:var(--bronze-text)}
.pj-pp .qlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.pj-pp .qlist li{display:flex;gap:12px;align-items:baseline;color:var(--ink-90)}
.pj-pp .qlist li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--bronze);transform:translateY(-2px)}
.pj-pp .qlabel{font:500 13.5px/1.2 var(--font);color:var(--ink-45)}
.pj-pp .panel-sand{border-radius:var(--radius-xl);background:var(--sand);padding:48px}
@media (max-width:760px){.pj-pp .panel-sand{padding:24px}}

/* ---------- panel oscuro (uno por página) ---------- */
.pj-pp .night{border-radius:var(--radius-xl);background:radial-gradient(55% 45% at 50% 100%,rgba(176,122,74,.35),transparent 70%),var(--dark);color:var(--on-dark);padding:96px 48px}
.pj-pp .night h2,.pj-pp .night h3,.pj-pp .night h4{color:var(--on-dark)}
.pj-pp .night .chip{background:rgba(255,255,255,.06);box-shadow:0 0 0 1px rgba(255,255,255,.1);color:var(--bronze-light)}
.pj-pp .night .sub{color:var(--on-dark-70)}
.pj-pp .grad{background:linear-gradient(90deg,#ebd0ae,var(--bronze) 45%,var(--bronze-deep));-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:980px){.pj-pp .night{padding:64px 20px}}

/* ---------- preguntas frecuentes ---------- */
.pj-pp .faq{max-width:820px;margin:48px auto 0;display:flex;flex-direction:column;gap:12px}
.pj-pp .faq details{background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-lg);padding:0 24px}
.pj-pp .faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;font:500 18px/1.3 var(--font);letter-spacing:-.01em}
.pj-pp .faq summary::-webkit-details-marker{display:none}
.pj-pp .faq summary::after{content:"+";flex:none;width:32px;height:32px;border-radius:50%;background:var(--sand);display:grid;place-items:center;font-size:20px;line-height:1;color:var(--bronze-text);transition:transform .25s}
.pj-pp .faq details[open] summary::after{transform:rotate(45deg)}
.pj-pp .faq details p{color:var(--ink-65);padding-bottom:22px;max-width:65ch}

/* ---------- llamada final + pie ---------- */
.pj-pp .cta{border-radius:var(--radius-xl);background:linear-gradient(134deg,var(--sand),#c99b70 50%,var(--sand) 92%);padding:96px 24px;text-align:center}
.pj-pp .cta .sub{color:var(--ink-90)}
.pj-pp footer{max-width:var(--container);margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-block:32px 48px;color:var(--ink-45);font-size:14px}

/* ---------- notas de diseño (solo equipo) ---------- */
.pj-pp .note{max-width:var(--container);margin:0 auto 16px;background:#fffaf2;border-radius:var(--radius-md);box-shadow:0 0 0 1px rgba(176,122,74,.35);padding:16px 20px;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:14.5px;color:var(--ink-90);text-align:left}
.pj-pp .note b{grid-row:span 2;font:500 12px/1 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--bronze-text);background:var(--bronze-soft);padding:7px 10px;border-radius:var(--radius-pill);align-self:start}
.pj-pp .note ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.pj-pp .night .note{background:rgba(255,255,255,.05);box-shadow:0 0 0 1px rgba(217,180,140,.4);color:var(--on-dark-70)}
.pj-pp .night .note b{color:var(--bronze-light);background:rgba(217,180,140,.12)}
body:not(.notes-on) .pj-pp .note,body:not(.notes-on) .pj-pp .only-notes{display:none}
.pj-pp .notes-toggle{position:fixed;right:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);z-index:40;border:0;background:var(--ink);color:var(--on-dark);font:500 14px/1 var(--font);padding:12px 16px;border-radius:var(--radius-pill);box-shadow:0 12px 30px -10px rgba(0,0,0,.4);display:flex;align-items:center;gap:10px}
.pj-pp .notes-toggle i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35)}
body.notes-on .pj-pp .notes-toggle i{background:var(--bronze)}

/* ---------- visor ampliado ---------- */
.pj-pp .lb{position:fixed;inset:0;z-index:60;background:rgba(18,16,14,.86);display:grid;place-items:center;padding:24px;cursor:zoom-out}
.pj-pp .lb img,.pj-pp .lb video{max-height:86vh;width:auto;max-width:100%;border-radius:14px;box-shadow:var(--shadow-glow)}
.pj-pp .lb p{color:var(--on-dark-70);font-size:14px;margin-top:12px;text-align:center}

@media (prefers-reduced-motion:reduce){.pj-pp *{transition:none!important;animation:none!important}.pj-pp{scroll-behavior:auto}}

/* móvil (locodea-web, 2026-10-05): los tres botones del vídeo, en una línea y centrados dentro de la pantalla */
@media (max-width:640px){.pj-pp .vctl{left:8px;justify-content:center;gap:5px}.pj-pp .vctl button{white-space:nowrap;padding:6px 9px;font-size:11.5px}}

/* ---- apartados/portales-para-clientes/css/portales.css ---- */
/* Apartado «Portales para clientes» — estilos propios. Los tokens y componentes comunes están en ../comun/css/locodea.css
   Portada, capítulos, flujo, portfolio e IA siguen el patrón de Paneles de datos para que los apartados se lean igual. */

/* ---------- 1 · Portada + vídeo ---------- */
.pj-pp .hero{margin-top:16px;border-radius:var(--radius-xl);padding:80px 24px 0;overflow:hidden;position:relative;
  background:radial-gradient(60% 40% at 50% 100%,rgba(176,122,74,.45),transparent 70%),linear-gradient(180deg,var(--paper),var(--sand-2) 35%,var(--sand-3))}
.pj-pp .hero-logo{width:64px;height:64px;display:block;margin-inline:auto;filter:drop-shadow(0 10px 18px rgba(90,60,200,.2))}
.pj-pp .stage-video{max-width:1080px;margin:48px auto 0;perspective:1800px;position:relative}
.pj-pp .device.pj-tilt{--t:1;transform-origin:50% 100%;transform:rotateX(calc(var(--t) * 14deg)) scale(calc(1 - var(--t) * .05));transition:transform .08s linear;padding:10px;will-change:transform}
.pj-pp .device.pj-tilt .screen{border-radius:12px;box-shadow:0 0 0 1px rgba(27,24,22,.07)}
.pj-pp .facts{display:grid;grid-template-columns:repeat(3,1fr);max-width:1080px;margin:0 auto;background:var(--paper);box-shadow:var(--shadow-ring);border-radius:0 0 var(--radius-md) var(--radius-md);position:relative;z-index:1}
.pj-pp .facts div{padding:18px 24px;display:flex;flex-direction:column;gap:2px}
.pj-pp .facts div+div{box-shadow:-1px 0 0 var(--ink-5)}
.pj-pp .facts strong{font-size:26px;letter-spacing:-.03em;line-height:1.1}
.pj-pp .facts span{font-size:14px;color:var(--ink-65)}
.pj-pp .hero-foot{height:56px}
@media (max-width:640px){.pj-pp .hero{padding:56px 16px 0}.pj-pp .hero-logo{width:52px;height:52px}.pj-pp .facts{grid-template-columns:1fr}.pj-pp .facts div+div{box-shadow:0 -1px 0 var(--ink-5)}}

.pj-pp .chapters{list-style:none;margin:0;padding:12px 4px 10px;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
.pj-pp .chapters::-webkit-scrollbar{display:none}
.pj-pp .chapters li{flex:var(--d) 0 0;min-width:92px}
.pj-pp .chapters button{width:100%;border:0;background:none;padding:6px 4px 4px;border-radius:10px;display:flex;flex-direction:column;gap:7px;text-align:left;color:var(--ink-45);font:500 13px/1.2 var(--font);transition:color .2s,background .2s}
.pj-pp .chapters button:hover{color:var(--ink);background:var(--sand-2)}
.pj-pp .chapters .bar{display:block;height:4px;border-radius:4px;background:var(--ink-10);overflow:hidden}
.pj-pp .chapters .bar i{display:block;height:100%;width:var(--p,0%);background:var(--bronze);border-radius:4px}
.pj-pp .chapters .lab{display:flex;flex-direction:column;gap:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12.5px}
.pj-pp .chapters time{font-size:11.5px;color:var(--ink-45);font-variant-numeric:tabular-nums;font-weight:400}
.pj-pp .chapters [aria-current="true"]{color:var(--ink)}
@media (max-width:640px){.pj-pp .chapters li{min-width:104px}}

/* ---------- 2 · Escaparate, ventanilla y trastienda ---------- */
.pj-pp .cmp{display:grid;grid-template-columns:1fr 1.12fr 1fr;gap:16px;margin-top:48px;align-items:stretch;position:relative}
.pj-pp .cmp-card{background:var(--sand-2);border-radius:var(--radius-xl);padding:16px 16px 24px;display:flex;flex-direction:column;gap:12px;transition:transform .35s var(--ease),box-shadow .35s}
.pj-pp .cmp-card:hover{transform:translateY(-4px)}
.pj-pp .cmp-card.hot{background:var(--paper);box-shadow:var(--shadow-lift),0 0 0 2px rgba(176,122,74,.35);transform:translateY(-10px)}
.pj-pp .cmp-card.hot:hover{transform:translateY(-14px)}
.pj-pp .cmp-card h3{font-size:26px;padding-inline:8px}
.pj-pp .cmp-tag{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin:4px 8px 0;font:500 13.5px/1.2 var(--font);color:var(--bronze-text);background:var(--bronze-soft);border-radius:var(--radius-pill);padding:7px 12px}
.pj-pp .cmp-tag img{width:18px;height:18px}
.pj-pp .cmp-vis{position:relative;background:var(--paper);border-radius:16px;box-shadow:var(--shadow-card);overflow:hidden;aspect-ratio:16/11}
.pj-pp .em-bar{height:26px;display:flex;align-items:center;gap:5px;padding:0 10px;box-shadow:inset 0 -1px 0 var(--ink-5);background:#fff;position:relative;z-index:2}
.pj-pp .em-bar i{width:7px;height:7px;border-radius:50%;background:var(--sand-3)}
.pj-pp .em-bar span{margin-left:8px;font-size:10.5px;color:var(--ink-45);background:var(--sand-2);border-radius:var(--radius-pill);padding:3px 10px;white-space:nowrap}
.pj-pp .em-hero{margin:10px;height:44%;border-radius:12px;background:radial-gradient(60% 70% at 50% 120%,rgba(176,122,74,.3),transparent 70%),linear-gradient(180deg,#fff,var(--sand-2) 40%,var(--sand-3));display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}
.pj-pp .em-hero b{font-weight:500;font-size:19px;letter-spacing:-.03em}
.pj-pp .em-hero span{width:46%;height:6px;border-radius:4px;background:rgba(27,24,22,.08)}
.pj-pp .em-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 10px}
.pj-pp .em-row span{height:46px;border-radius:10px;background:var(--sand)}
.pj-pp .em-eyes{position:absolute;right:10px;bottom:10px;display:flex;gap:4px}
.pj-pp .em-eyes i{width:22px;height:22px;border-radius:50%;background:var(--sand-2);box-shadow:0 0 0 2px #fff;position:relative}
.pj-pp .em-eyes i::after{content:"";position:absolute;left:7px;top:4px;width:8px;height:8px;border-radius:50%;background:rgba(27,24,22,.25);box-shadow:0 8px 0 2px rgba(27,24,22,.18)}
.pj-pp .pm-shot{position:absolute;left:0;right:0;top:26px;bottom:0;overflow:hidden}
.pj-pp .pm-shot img{position:absolute;inset:0;width:100%;height:auto;transition:opacity .5s var(--ease)}
.pj-pp .pm-shot .pm-2{opacity:0}
.pj-pp .pm-shot .pm-2.on{opacity:1}
.pj-pp .pm-type{position:absolute;display:none;align-items:center;background:#fff;color:var(--ink);font-weight:500;letter-spacing:.01em;white-space:nowrap}
.pj-pp .pm-type::after{content:"";width:1px;height:1.2em;background:var(--ink);margin-left:1px;animation:blink 1s steps(1) infinite}
.pj-pp .pm-type.on{display:flex}
.pj-pp .cmp-sys{display:flex;flex-wrap:wrap;gap:6px;padding-inline:8px}
.pj-pp .cmp-sys span{display:inline-flex;align-items:center;gap:6px;font:500 12.5px/1 var(--font);background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:6px 10px 6px 7px}
.pj-pp .cmp-sys img{width:16px;height:16px}
.pj-pp .cmp-sys .more{padding:6px 10px;color:var(--ink-65);background:transparent;box-shadow:0 0 0 1px var(--ink-10)}
.pj-pp .cmp-dl{margin:0;padding-inline:8px;display:flex;flex-direction:column;gap:10px}
.pj-pp .cmp-dl div{display:grid;grid-template-columns:118px 1fr;gap:10px;align-items:baseline}
.pj-pp .cmp-dl dt{font-size:13.5px;color:var(--ink-45)}
.pj-pp .cmp-dl dd{margin:0;font-size:15px;line-height:1.4;color:var(--ink-90)}
.pj-pp .cmp-eg{margin:auto 8px 0;font-size:13.5px;color:var(--ink-65);padding-top:12px;box-shadow:inset 0 1px 0 rgba(27,24,22,.08)}
.pj-pp .cmp-card.hot .cmp-eg{color:var(--bronze-text)}
.pj-pp .cmp-link{grid-column:2/4;height:28px;margin:-4px 14% 0;pointer-events:none}
.pj-pp .cmp-link svg{width:100%;height:100%;overflow:visible}
.pj-pp .cmp-link path{fill:none;stroke:var(--bronze);stroke-width:1.6;stroke-dasharray:4 6;vector-effect:non-scaling-stroke;animation:dash 1.4s linear infinite}
.pj-pp .cmp-same{grid-column:1/-1;display:flex;align-items:center;justify-content:center;gap:14px;max-width:760px;margin:0 auto;text-align:left;color:var(--ink-65);font-size:15.5px;background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:12px 22px 12px 14px}
.pj-pp .cmp-same img{width:30px;height:30px;flex:none}
.pj-pp .cmp-same b{color:var(--ink)}
@keyframes dash{to{stroke-dashoffset:-20}}
@media (max-width:980px){
  .pj-pp .cmp{grid-template-columns:1fr;max-width:560px;margin-inline:auto}
  .pj-pp .cmp-card.hot,.pj-pp .cmp-card.hot:hover{transform:none}
  .pj-pp .cmp-link{display:none}
  .pj-pp .cmp-same{border-radius:var(--radius-lg)}
}
@media (max-width:420px){.pj-pp .cmp-dl div{grid-template-columns:1fr;gap:2px}}

/* ---------- 3 · Cómo funciona (flujo) ---------- */
.pj-pp .flow{position:relative;display:grid;grid-template-columns:1fr 1.05fr 1.1fr;gap:64px;align-items:center;margin-top:48px;padding:64px 56px 44px;border-radius:var(--radius-xl);
  background:radial-gradient(55% 55% at 50% 110%,rgba(176,122,74,.22),transparent 70%),linear-gradient(180deg,var(--paper),var(--sand-2))}
.pj-pp .flow::before{content:"";position:absolute;inset:0;border-radius:inherit;background-image:radial-gradient(rgba(176,122,74,.16) 1px,transparent 1.2px);background-size:22px 22px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%);pointer-events:none}
.pj-pp .flow-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:0}
.pj-pp .flow-lines .fl{fill:none;stroke:rgba(176,122,74,.32);stroke-width:2;stroke-dasharray:3 7;stroke-linecap:round;transition:stroke .4s}
.pj-pp .flow[data-step="1"] .fl[data-col="1"],.pj-pp .flow[data-step="2"] .fl,.pj-pp .flow[data-step="3"] .fl[data-col="3"]{stroke:rgba(176,122,74,.7)}
.pj-pp .fdot{fill:var(--bronze);filter:drop-shadow(0 0 4px rgba(176,122,74,.6))}
.pj-pp .fcol{position:relative;z-index:1;transition:opacity .45s var(--ease),transform .45s var(--ease)}
.pj-pp .flow[data-step] .fcol{opacity:.55}
.pj-pp .flow[data-step="1"] .f-src,.pj-pp .flow[data-step="2"] .f-hub,.pj-pp .flow[data-step="3"] .f-out{opacity:1;transform:translateY(-4px)}
.pj-pp .f-src,.pj-pp .team{display:flex;flex-direction:column;gap:12px}
.pj-pp .src-card{display:flex;align-items:center;gap:12px;background:var(--paper);border-radius:16px;box-shadow:var(--shadow-card);padding:12px 14px;min-width:0}
.pj-pp .f-src .src-card:nth-child(2),.pj-pp .team .src-card:nth-child(2){margin-left:22px;margin-right:-22px}
.pj-pp .src-card div{min-width:0}
.pj-pp .src-card b{display:block;font-size:14px;font-weight:500;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-pp .src-card span:not(.src-ic){font-size:12.5px;color:var(--ink-45)}
.pj-pp .src-ic{flex:none;width:40px;height:40px;border-radius:12px;background:var(--sand-2);display:grid;place-items:center;color:var(--bronze-text)}
.pj-pp .src-ic img{width:24px;height:24px}
.pj-pp .src-ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pj-pp .hub{background:var(--paper);border-radius:28px;box-shadow:var(--shadow-lift);padding:22px 22px 18px;display:flex;flex-direction:column;gap:14px}
.pj-pp .hub-top{display:flex;align-items:center;gap:14px}
.pj-pp .hub-logo{width:44px;height:44px;flex:none}
.pj-pp .hub-top b{display:block;font-size:22px;font-weight:500;letter-spacing:-.02em;line-height:1.1}
.pj-pp .hub-top span{font-size:14px;color:var(--ink-65)}
.pj-pp .roles{display:grid;grid-template-columns:1fr 1fr;gap:8px;background:var(--sand-2);border-radius:18px;padding:10px}
.pj-pp .role{display:flex;flex-direction:column;gap:2px;background:var(--paper);box-shadow:var(--shadow-card);border-radius:12px;padding:9px 11px 9px 26px;font:500 13.5px/1.2 var(--font);position:relative}
.pj-pp .role i{position:absolute;left:11px;top:13px;width:7px;height:7px;border-radius:50%;background:var(--sand-3)}
.pj-pp .role em{font-style:normal;font-weight:400;font-size:11.5px;color:var(--ink-45)}
.pj-pp .role.key{background:var(--bronze);color:#fff;box-shadow:0 8px 18px -8px rgba(176,122,74,.8)}
.pj-pp .role.key i{background:#fff}
.pj-pp .role.key em{color:rgba(255,255,255,.8)}
.pj-pp .flow[data-step="2"] .role i{animation:rolePulse 2.4s ease-in-out infinite}
.pj-pp .flow[data-step="2"] .role:nth-child(2) i{animation-delay:.6s}.pj-pp .flow[data-step="2"] .role:nth-child(3) i{animation-delay:1.2s}
@keyframes rolePulse{0%,60%,100%{background:var(--sand-3)}20%,40%{background:var(--bronze)}}
.pj-pp .hub-sync{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-65)}
.pj-pp .hub-sync i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px rgba(1,208,98,.15)}
.pj-pp .flow-steps{grid-column:1/-1;display:grid;grid-template-columns:1fr 1.05fr 1.1fr;gap:64px;list-style:none;margin:8px 0 0;padding:0;position:relative;z-index:1}
.pj-pp .flow-steps li{display:flex;gap:14px;align-items:flex-start;padding:16px;border-radius:var(--radius-lg);transition:background .35s,box-shadow .35s}
.pj-pp .flow-steps .n{flex:none;width:36px;height:36px;border-radius:12px;background:var(--bronze-soft);color:var(--bronze-text);display:grid;place-items:center;font:500 15px/1 var(--font);transition:background .35s,color .35s}
.pj-pp .flow-steps h4{font-size:18px;margin-bottom:4px}
.pj-pp .flow-steps p{color:var(--ink-65);font-size:15px}
.pj-pp .flow[data-step="1"] .flow-steps li[data-col="1"],.pj-pp .flow[data-step="2"] .flow-steps li[data-col="2"],.pj-pp .flow[data-step="3"] .flow-steps li[data-col="3"]{background:var(--paper);box-shadow:var(--shadow-card)}
.pj-pp .flow[data-step="1"] li[data-col="1"] .n,.pj-pp .flow[data-step="2"] li[data-col="2"] .n,.pj-pp .flow[data-step="3"] li[data-col="3"] .n{background:var(--bronze);color:#fff}
@media (max-width:1000px){
  .pj-pp .flow{grid-template-columns:1fr;gap:40px;padding:36px 20px 24px}
  .pj-pp .flow-steps{display:contents}
  .pj-pp .f-src{order:2}.pj-pp .flow-steps li[data-col="1"]{order:1}
  .pj-pp .f-hub{order:4}.pj-pp .flow-steps li[data-col="2"]{order:3}
  .pj-pp .f-out{order:6}.pj-pp .flow-steps li[data-col="3"]{order:5}
  .pj-pp .f-src .src-card:nth-child(2),.pj-pp .team .src-card:nth-child(2){margin-left:0;margin-right:0}
  .pj-pp .flow[data-step] .fcol{opacity:1;transform:none}
}

/* ---------- 4 · Casos de uso (portfolio) ----------
   Pestañas de carpeta arriba y un solo panel: pantalla a la izquierda, explicación a la derecha. Todo cabe en una pantalla. */
.pj-pp .port{margin-top:32px}
.pj-pp .port-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pj-pp .ptab{border:0;text-align:left;display:grid;grid-template-columns:auto 1fr;gap:3px 14px;align-items:start;padding:14px 18px 15px;border-radius:24px 24px 0 0;background:var(--sand-2);color:inherit;position:relative;transition:background .2s}
.pj-pp .ptab:hover{background:#f4eee5}
.pj-pp .ptab[aria-selected="true"]{background:var(--sand)}
.pj-pp .ptab .n{grid-row:span 2;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font:500 14px/1 var(--font);background:var(--paper);color:var(--ink-45);box-shadow:var(--shadow-card);transition:background .2s,color .2s}
.pj-pp .ptab[aria-selected="true"] .n{background:var(--bronze);color:#fff;box-shadow:none}
.pj-pp .ptab b{font:500 17px/1.25 var(--font);letter-spacing:-.02em;color:var(--ink-90)}
.pj-pp .ptab-t{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.pj-pp .ptab>span:last-child{font-size:13.5px;line-height:1.35;color:var(--ink-65);display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.pj-pp .ptab em{font-style:normal;font:500 11.5px/1 var(--font);color:var(--bronze-text);background:var(--bronze-soft);border-radius:var(--radius-pill);padding:4px 8px}
.pj-pp .port-view{display:grid;grid-template-columns:minmax(0,1.36fr) minmax(0,1fr);gap:28px;align-items:start;border-radius:0 0 var(--radius-xl) var(--radius-xl);background:var(--sand);padding:20px 24px 24px}
.pj-pp .pv-media{min-width:0;position:relative}
.pj-pp .port-view .device{padding:8px}
.pj-pp .port-view .device-bar{padding:2px 4px 8px}
.pj-pp .port-view .screen{aspect-ratio:16/10;cursor:zoom-in;background:var(--sand-2)}
.pj-pp .port-view .screen.live{cursor:default}
.pj-pp .port-view .screen img{transition:opacity .25s}
.pj-pp .ph-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:32px;padding:14px;background:radial-gradient(60% 50% at 50% 100%,rgba(176,122,74,.22),transparent 70%),var(--sand-2)}
.pj-pp .ph{height:100%;aspect-ratio:390/844;border-radius:30px;background:var(--dark-deep);padding:7px;box-shadow:0 24px 48px -20px rgba(80,55,30,.5);flex:none}
.pj-pp .ph img{width:100%!important;height:100%!important;object-fit:cover;object-position:top;border-radius:24px;background:#fff}
.pj-pp .ph.demo-phone{--k:.6;height:auto;width:calc(390px * var(--k) + 14px);aspect-ratio:auto;overflow:hidden}
.pj-pp .demo-phone .fr{width:calc(390px * var(--k));height:calc(640px * var(--k));overflow:hidden;border-radius:24px}
.pj-pp .demo-phone iframe{width:390px;height:640px;border:0;background:#fff;transform:scale(var(--k));transform-origin:0 0;display:block}
.pj-pp .ph-note{max-width:250px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.pj-pp .ph-note b{font:500 20px/1.2 var(--font);letter-spacing:-.02em}
.pj-pp .ph-note p{font-size:14px;color:var(--ink-65);line-height:1.45}
.pj-pp .demo-desk{--k:.55;position:absolute;inset:0;overflow:hidden;background:#fff}
.pj-pp .demo-desk iframe{width:1280px;height:800px;border:0;transform:scale(var(--k));transform-origin:0 0;background:#fff}
.pj-pp .open-big{position:absolute;right:12px;bottom:12px;z-index:2;border:0;background:rgba(18,16,14,.78);color:#fff;backdrop-filter:blur(8px);font:500 13.5px/1 var(--font);padding:9px 14px;border-radius:var(--radius-pill)}
.pj-pp .open-big:hover{background:rgba(18,16,14,.92)}
.pj-pp .ph-note .open-big{position:static;background:var(--ink)}
.pj-pp .pg-strip{display:flex;gap:8px;margin-top:10px;overflow-x:auto;padding:2px 2px 4px;scrollbar-width:thin}
.pj-pp .pg-tile{flex:0 0 92px;border:0;background:var(--paper);border-radius:12px;padding:4px 4px 6px;box-shadow:var(--shadow-card);display:flex;flex-direction:column;gap:4px;text-align:left;min-width:0;transition:box-shadow .2s,transform .2s}
.pj-pp .pg-tile:hover{transform:translateY(-2px)}
.pj-pp .pg-tile[aria-pressed="true"]{box-shadow:0 0 0 2px var(--bronze)}
.pj-pp .pg-tile img,.pj-pp .pg-tile .pg-ic{border-radius:8px;aspect-ratio:16/10;width:100%;height:auto;object-fit:cover;object-position:top;display:block}
.pj-pp .pg-tile.mob img{object-position:50% 12%}
.pj-pp .pg-tile .pg-ic{display:grid;place-items:center;font:500 12px/1 var(--font);letter-spacing:.02em;color:var(--on-dark);background:radial-gradient(80% 80% at 50% 100%,rgba(176,122,74,.6),transparent 70%),var(--dark)}
.pj-pp .pg-tile.feat span:last-child{color:var(--bronze-text)}
.pj-pp .pg-tile span{font:500 11px/1.25 var(--font);color:var(--ink-65);padding-inline:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-pp .media-cap{font-size:12.5px;color:var(--ink-45);margin-top:6px;text-align:center}
.pj-pp .pv-info{display:flex;flex-direction:column;gap:12px;min-width:0;padding-top:4px}
.pj-pp .pv-info .pv-name{font-size:clamp(30px,3vw,40px);letter-spacing:-.04em}
.pj-pp .pv-lead{font:500 18px/1.35 var(--font);letter-spacing:-.015em;color:var(--ink-90)!important;margin-top:-4px}
.pj-pp .pv-info>p{color:var(--ink-65);font-size:14.5px;line-height:1.45}
.pj-pp .pv-info .qlist{gap:7px}
.pj-pp .pv-info .qlist li{font-size:14px;line-height:1.4}
.pj-pp .pv-meta{margin:0;display:flex;flex-direction:column;gap:8px;padding-top:12px;box-shadow:inset 0 1px 0 rgba(27,24,22,.08)}
.pj-pp .pv-meta div{display:grid;grid-template-columns:96px 1fr;gap:10px;align-items:baseline}
.pj-pp .pv-meta dt{font:500 13px/1.3 var(--font);color:var(--ink-45)}
.pj-pp .pv-meta dd{margin:0;font-size:14px;line-height:1.4;color:var(--ink-90)}
.pj-pp .pv-meta dd span{font:500 12.5px/1.2 var(--font);color:var(--ink-65);background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:5px 10px}
.pj-pp .pv-info .qlabel{margin-bottom:6px}
.pj-pp .specs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:0}
.pj-pp .specs div{background:var(--paper);border-radius:12px;padding:8px 10px 7px;box-shadow:var(--shadow-card)}
.pj-pp .specs dt{font-size:11px;color:var(--ink-45);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-pp .specs dd{margin:0;font:500 20px/1.1 var(--font);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.pj-pp .lb .lb-frame{display:block;border:0;border-radius:14px;background:#fff;box-shadow:var(--shadow-glow)}
.pj-pp .lb .lb-frame.desk{width:min(1280px,94vw);height:min(800px,84vh)}
.pj-pp .lb .lb-frame.phone{width:390px;max-width:94vw;height:min(844px,84vh)}
@media (max-width:1060px){
  .pj-pp .port-view{grid-template-columns:1fr;gap:20px;padding:16px}
  .pj-pp .port-tabs{display:flex;overflow-x:auto;scrollbar-width:none}
  .pj-pp .port-tabs::-webkit-scrollbar{display:none}
  .pj-pp .ptab{flex:0 0 250px}
}
@media (max-width:640px){.pj-pp .ph-note{display:none}.pj-pp .device-bar span{max-width:200px}.pj-pp .pv-meta div{grid-template-columns:1fr;gap:4px}}
@media (max-width:520px){.pj-pp .specs{grid-template-columns:repeat(2,1fr)}}

/* ---------- 5 · locodea. AI ---------- */
.pj-pp .ai{display:grid;grid-template-columns:1fr 1.1fr;gap:48px;align-items:center}
.pj-pp .ai-txt{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.pj-pp .lgo{font-weight:600;letter-spacing:-.03em;color:var(--ink)}
.pj-pp .lgo b{color:var(--bronze);font-weight:600}
.pj-pp .ai-pick{display:flex;flex-wrap:wrap;gap:8px}
.pj-pp .ai-pick button{display:inline-flex;align-items:center;gap:10px;border:0;background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:9px 16px 9px 10px;font:500 15px/1 var(--font);color:var(--ink-90);transition:box-shadow .2s,background .2s}
.pj-pp .ai-pick img{width:24px;height:24px;object-fit:contain}
.pj-pp .ai-pick button:hover{box-shadow:0 0 0 1px rgba(176,122,74,.45)}
.pj-pp .ai-pick button[aria-checked="true"]{box-shadow:0 0 0 2px var(--bronze),var(--shadow-card)}
.pj-pp .ai-sugg{display:flex;flex-wrap:wrap;gap:8px}
.pj-pp .ai-sugg button{border:0;background:transparent;box-shadow:0 0 0 1px var(--ink-10);border-radius:var(--radius-pill);padding:9px 14px;font:500 14px/1.2 var(--font);color:var(--ink-90);text-align:left}
.pj-pp .ai-sugg button:hover{box-shadow:0 0 0 1px rgba(176,122,74,.6)}
.pj-pp .ai-sugg button[aria-pressed="true"]{background:var(--ink);color:#fff;box-shadow:none}
.pj-pp .chat{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lift);display:flex;flex-direction:column;min-height:460px;overflow:hidden}
.pj-pp .chat-head{display:flex;gap:12px;align-items:center;padding:14px 18px;box-shadow:inset 0 -1px 0 var(--ink-5);font-size:14px}
.pj-pp .chat-head div{display:flex;flex-direction:column;line-height:1.25}
.pj-pp .chat-head div span{font-size:12.5px;color:var(--ink-45)}
.pj-pp .chip-ex{margin-left:auto;font:500 12px/1 var(--font);color:var(--ink-45);background:var(--sand-2);border-radius:var(--radius-pill);padding:6px 10px;white-space:nowrap}
.pj-pp .ai-av{width:40px;height:40px;border-radius:12px;background:var(--sand-2);display:grid;place-items:center;flex:none}
.pj-pp .ai-av img{width:24px;height:24px;object-fit:contain}
.pj-pp .chat-body{flex:1;padding:18px;display:flex;flex-direction:column;gap:12px}
.pj-pp .msg{max-width:90%;border-radius:18px;padding:12px 14px;font-size:14.5px;line-height:1.45;animation:rise .45s var(--ease) both}
.pj-pp .msg.me{align-self:flex-end;background:var(--ink);color:#fff;border-bottom-right-radius:6px}
.pj-pp .msg.bot{align-self:flex-start;background:var(--sand-2);border-bottom-left-radius:6px}
.pj-pp .msg.bot b{font-weight:500}
.pj-pp .msg-who{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-45);margin-bottom:4px}
.pj-pp .msg-who img{width:14px;height:14px;object-fit:contain}
.pj-pp .msg-src{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:12px;color:var(--ink-65);background:#fff;box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:5px 10px}
.pj-pp .msg-src img{width:14px;height:14px}
.pj-pp .mstep{display:grid;grid-template-columns:repeat(6,1fr);margin-top:12px;position:relative}
.pj-pp .mstep::before{content:"";position:absolute;left:8%;right:8%;top:6px;height:2px;background:linear-gradient(90deg,var(--ink) 0 67%,var(--sand-3) 67%)}
.pj-pp .mstep span{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:10.5px;color:var(--ink-45);text-align:center;position:relative}
.pj-pp .mstep i{width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px var(--sand-3)}
.pj-pp .mstep .done i{background:var(--ink);box-shadow:none}
.pj-pp .mstep .now{color:var(--bronze-text);font-weight:500}
.pj-pp .mstep .now i{background:var(--bronze);box-shadow:0 0 0 4px var(--bronze-soft)}
.pj-pp .mrows{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.pj-pp .mrows li{background:#fff;border-radius:12px;padding:9px 12px;display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:center;box-shadow:var(--shadow-card)}
.pj-pp .mrows b{font-size:13.5px}
.pj-pp .mrows span{grid-column:1;font-size:12.5px;color:var(--ink-65);line-height:1.35}
.pj-pp .mrows em{grid-column:2;grid-row:1/3;font-style:normal;font:500 11.5px/1 var(--font);color:var(--ink-65);background:var(--sand-2);border-radius:var(--radius-pill);padding:5px 9px;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.pj-pp .mrows em::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--warn)}
.pj-pp .mrows em.crit::before{background:var(--st-bad)}
.pj-pp .typing{display:inline-flex;gap:4px}
.pj-pp .typing i{width:6px;height:6px;border-radius:50%;background:var(--ink-45);animation:blink 1s infinite}
.pj-pp .typing i:nth-child(2){animation-delay:.15s}.pj-pp .typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{50%{opacity:.2}}
.pj-pp .chat-input{margin:0 14px 14px;background:var(--sand-2);border-radius:var(--radius-pill);padding:12px 16px;font-size:14px;color:var(--ink-45);display:flex;justify-content:space-between;align-items:center}
.pj-pp .chat-input i{width:28px;height:28px;border-radius:50%;background:var(--bronze)}
@media (max-width:980px){.pj-pp .ai{grid-template-columns:1fr}}
@media (max-width:480px){.pj-pp .mrows li{grid-template-columns:1fr}.pj-pp .mrows em{grid-column:1;grid-row:auto;justify-self:start}.pj-pp .chip-ex{display:none}}

@keyframes rise{from{opacity:.4;transform:translateY(10px)}}


/* móvil (locodea-web, 2026-10-05): en la burbuja del chat no caben los seis nombres de las etapas; quedan los puntos
   y solo el nombre de la etapa actual */
@media (max-width:640px){.pj-pp .mstep{grid-template-columns:repeat(6,minmax(0,1fr))}.pj-pp .mstep span:not(.now){font-size:0;gap:0}.pj-pp .mstep span.now{white-space:nowrap}}

/* Generado por build/ a partir de apartados/comun/css/locodea.css, apartados/locodea-ai/css/locodea-ai.css. No editar a mano. */
/* ---- aislamiento frente a css/style.css (generado) ---- */
.pj-ai .big{display:revert;place-items:revert;height:revert;border-radius:revert;background:revert;box-shadow:revert}
.pj-ai .bot{background:revert;box-shadow:revert}
.pj-ai .bs{align-items:revert;height:revert}
.pj-ai .btn{position:revert;justify-content:revert;height:revert;cursor:revert;font-size:revert}
.pj-ai .cases{display:revert;grid-template-columns:revert;gap:revert}
.pj-ai .cta{display:revert;grid-template-columns:revert;gap:revert;align-items:revert}
.pj-ai .device{width:revert;max-width:revert;overflow:revert;transform:revert}
.pj-ai .done{display:revert;gap:revert;align-items:revert;padding:initial;border-radius:revert;background:revert;font-size:revert;color:revert;line-height:revert}
.pj-ai .flow{flex-direction:revert}
.pj-ai .fl{display:revert;flex-direction:revert;align-items:revert}
.pj-ai .go{display:revert;align-items:revert;gap:revert;font-size:revert;font-weight:revert;color:revert;margin-top:initial}
.pj-ai .hero{isolation:revert;display:revert;flex-direction:revert;align-items:revert;text-align:revert;gap:revert}
.pj-ai .hero::after{content:none}
.pj-ai .hero::before{content:none}
.pj-ai .logo{display:revert;align-items:revert;gap:revert}
.pj-ai .nav-in{pointer-events:revert;transition:revert;z-index:revert;position:revert}
.pj-ai .nav{left:revert;right:revert;padding:initial;pointer-events:revert}
.pj-ai .pi{width:revert;color:revert}
.pj-ai .sub{text-wrap:revert;margin-inline:initial;margin:initial;position:revert;z-index:revert}
.pj-ai .tilt{position:revert;transform:revert;transform-style:revert;transition:revert;will-change:revert}
.pj-ai .tilt::after{content:none}
.pj-ai .vctl{z-index:revert}
/* ---- apartados/comun/css/locodea.css ---- */
/* locodea. — sistema de diseño «Web Design - locodea» (paleta Bronce).
   Un solo tema (claro), por decisión del sistema. COMPARTIDO por todos los apartados de la web (../comun/css/). */

.pj-ai{
  --paper:#fff; --ink:#1b1816; --ink-90:rgba(27,24,22,.9); --ink-65:rgba(27,24,22,.65); --ink-45:rgba(27,24,22,.45); --ink-10:rgba(27,24,22,.1); --ink-5:rgba(27,24,22,.05);
  --bronze:#b07a4a; --bronze-hover:#9c6a3e; --bronze-deep:#8e5e34; --bronze-text:#8a5a30; --bronze-light:#d9b48c; --bronze-soft:rgba(176,122,74,.14);
  --sand:#f1ebe2; --sand-2:#f8f4ee; --sand-3:#e8dccb; --dark:#1b1816; --dark-deep:#12100e; --on-dark:#fff; --on-dark-70:rgba(255,255,255,.7); --on-dark-45:rgba(255,255,255,.45);
  --ok:#01d062; --warn:#febc2e;
  /* semáforo de los paneles (visuales de datos, nunca texto de interfaz) */
  --st-ok:#4f8a64; --st-mid:#d19a3e; --st-bad:#c2553f;
  --radius-sm:12px; --radius-md:20px; --radius-lg:24px; --radius-xl:32px; --radius-pill:99px;
  --shadow-ring:0 0 0 1px rgba(27,24,22,.05);
  --shadow-card:0 0 0 1px rgba(27,24,22,.05),0 1px 2px rgba(0,0,0,.03);
  --shadow-lift:0 24px 48px -16px rgba(80,55,30,.22),0 0 0 1px rgba(27,24,22,.05);
  --shadow-glow:0 0 0 1px rgba(255,255,255,.1),0 40px 80px -30px rgba(176,122,74,.35);
  --font:"DM Sans","Inter","Helvetica Neue",Arial,sans-serif;
  --container:1240px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
.pj-ai *{box-sizing:border-box}
.pj-ai [hidden]{display:none!important}
.pj-ai{scroll-behavior:smooth}
.pj-ai{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.5 var(--font);-webkit-font-smoothing:antialiased;padding-inline:16px;overflow-x:hidden}
.pj-ai h1,.pj-ai h2,.pj-ai h3,.pj-ai h4{font-weight:500;line-height:1.08;letter-spacing:-.04em;margin:0;text-wrap:balance;color:var(--ink-90)}
.pj-ai h1{font-size:clamp(44px,7vw,76px)}
/* la segunda parte del titular de cada apartado, en bronce con brillo, como en Power Apps y Power Automate (.lx-g) */
.pj-ai .hero h1 em{font-style:normal;background:linear-gradient(100deg,#b9834f 0%,#8e5e34 28%,#e6c39b 48%,#a8723f 64%,#8e5e34 82%,#c99464 100%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:h-brillo 7s linear infinite}
@keyframes h-brillo{from{background-position:0 0}to{background-position:-240% 0}}
@media (prefers-reduced-motion:reduce){.pj-ai .hero h1 em{animation:none}}
.pj-ai h2{font-size:clamp(36px,5vw,56px)}
.pj-ai h3{font-size:clamp(26px,3.4vw,34px);letter-spacing:-.03em}
.pj-ai h4{font-size:20px;line-height:1.2;letter-spacing:-.02em}
.pj-ai p{margin:0}
.pj-ai b,.pj-ai strong{font-weight:500}
.pj-ai a{color:inherit}
.pj-ai button,.pj-ai input,.pj-ai select{font:inherit;color:inherit}
.pj-ai button{cursor:pointer}
.pj-ai :focus-visible{outline:2px solid var(--bronze);outline-offset:3px}
.pj-ai img,.pj-ai video,.pj-ai canvas{max-width:100%;display:block}
.pj-ai .num{font-variant-numeric:tabular-nums}

.pj-ai .wrap{max-width:var(--container);margin-inline:auto}
.pj-ai .logo{font-weight:600;letter-spacing:-.03em;font-size:22px;line-height:1;text-decoration:none;color:var(--ink)}
.pj-ai .logo b{color:var(--bronze);font-weight:600}
.pj-ai b.dot{color:var(--bronze);font-weight:inherit}   /* el punto de «locodea.» dentro de un texto */
.pj-ai section{padding-block:48px}

/* chip → titular → entradilla → botones */
.pj-ai .head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;max-width:780px;margin-inline:auto}
.pj-ai .head.left{align-items:flex-start;text-align:left;margin-inline:0}
.pj-ai .chip{display:inline-flex;align-items:center;gap:8px;font:500 13.5px/1.2 var(--font);color:var(--bronze-text);background:var(--paper);box-shadow:var(--shadow-card);padding:8px 14px;border-radius:var(--radius-pill)}
.pj-ai .sub{font-size:18px;line-height:1.5;color:var(--ink-65);max-width:56ch}
.pj-ai .btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.pj-ai .head.left .btns{justify-content:flex-start}
.pj-ai .btn{display:inline-flex;align-items:center;gap:8px;font:500 15px/1.2 var(--font);padding:14px 22px;border-radius:var(--radius-pill);border:0;text-decoration:none;transition:background .2s,transform .2s;white-space:nowrap}
.pj-ai .btn:active{transform:scale(.98)}
.pj-ai .btn-ink{background:var(--ink);color:var(--on-dark)}
.pj-ai .btn-ink:hover{background:#2e2925}
.pj-ai .btn-ghost{background:var(--bronze-soft);color:var(--bronze-text)}
.pj-ai .btn-ghost:hover{background:rgba(176,122,74,.22)}
.pj-ai .btn-bronze{background:var(--bronze);color:var(--on-dark)}
.pj-ai .btn-bronze:hover{background:var(--bronze-hover)}
.pj-ai .btn-sm{padding:10px 16px;font-size:14px}
.pj-ai .link{color:var(--bronze-text);font-weight:500;text-decoration:none;display:inline-flex;gap:6px;align-items:center}
.pj-ai .link:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- navegación ---------- */
.pj-ai .nav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 12px);z-index:30;margin-top:12px}
.pj-ai .nav-in{max-width:var(--container);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:10px 10px 10px 22px}
.pj-ai .nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.pj-ai .nav li a{display:block;font:500 15px/1.2 var(--font);color:var(--ink-65);text-decoration:none;padding:10px 14px;border-radius:var(--radius-pill)}
.pj-ai .nav li a:hover{color:var(--ink)}
.pj-ai .nav li a[aria-current]{color:var(--ink);background:var(--sand)}
.pj-ai .nav .btn{padding:11px 18px}
@media (max-width:900px){.pj-ai .nav ul{display:none}}

/* ---------- dispositivos ---------- */
.pj-ai .device{background:var(--paper);border-radius:var(--radius-md);box-shadow:var(--shadow-lift);padding:10px}
.pj-ai .device-bar{display:flex;align-items:center;gap:6px;padding:4px 6px 10px}
.pj-ai .device-bar i{width:10px;height:10px;border-radius:50%;background:var(--sand-3)}
.pj-ai .device-bar span{margin-left:10px;font:500 12px/1 var(--font);color:var(--ink-45);background:var(--sand-2);border-radius:var(--radius-pill);padding:6px 12px;flex:1;max-width:320px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.pj-ai .screen{position:relative;border-radius:12px;overflow:hidden;background:var(--sand-2);aspect-ratio:16/9}
.pj-ai .screen video,.pj-ai .screen img{width:100%;height:100%;object-fit:cover}
.pj-ai .vctl{position:absolute;right:14px;bottom:14px;display:flex;gap:8px}
.pj-ai .vctl button{border:0;background:rgba(18,16,14,.72);color:var(--on-dark);backdrop-filter:blur(8px);font:500 13.5px/1 var(--font);padding:9px 14px;border-radius:var(--radius-pill)}
.pj-ai .vctl button:hover{background:rgba(18,16,14,.9)}
@media (max-width:640px){.pj-ai .vctl{right:8px;bottom:8px}.pj-ai .vctl button{padding:7px 11px;font-size:12.5px}}

/* ---------- tarjetas, píldoras, listas ---------- */
.pj-ai .card{background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-lg);padding:24px;display:flex;flex-direction:column;gap:10px}
.pj-ai .card p{color:var(--ink-65)}
.pj-ai .ic{width:40px;height:40px;border-radius:var(--radius-sm);background:var(--bronze-soft);color:var(--bronze-text);display:grid;place-items:center;font:500 15px/1 var(--font);flex:none}
.pj-ai .pills{display:flex;flex-wrap:wrap;gap:8px}
.pj-ai .pill{font:500 13.5px/1.2 var(--font);padding:7px 12px;border-radius:var(--radius-pill);background:var(--paper);box-shadow:var(--shadow-card);color:var(--ink-65)}
.pj-ai .pill.hot{background:var(--bronze-soft);box-shadow:none;color:var(--bronze-text)}
.pj-ai .qlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.pj-ai .qlist li{display:flex;gap:12px;align-items:baseline;color:var(--ink-90)}
.pj-ai .qlist li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--bronze);transform:translateY(-2px)}
.pj-ai .qlabel{font:500 13.5px/1.2 var(--font);color:var(--ink-45)}
.pj-ai .panel-sand{border-radius:var(--radius-xl);background:var(--sand);padding:48px}
@media (max-width:760px){.pj-ai .panel-sand{padding:24px}}

/* ---------- panel oscuro (uno por página) ---------- */
.pj-ai .night{border-radius:var(--radius-xl);background:radial-gradient(55% 45% at 50% 100%,rgba(176,122,74,.35),transparent 70%),var(--dark);color:var(--on-dark);padding:96px 48px}
.pj-ai .night h2,.pj-ai .night h3,.pj-ai .night h4{color:var(--on-dark)}
.pj-ai .night .chip{background:rgba(255,255,255,.06);box-shadow:0 0 0 1px rgba(255,255,255,.1);color:var(--bronze-light)}
.pj-ai .night .sub{color:var(--on-dark-70)}
.pj-ai .grad{background:linear-gradient(90deg,#ebd0ae,var(--bronze) 45%,var(--bronze-deep));-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:980px){.pj-ai .night{padding:64px 20px}}

/* ---------- preguntas frecuentes ---------- */
.pj-ai .faq{max-width:820px;margin:48px auto 0;display:flex;flex-direction:column;gap:12px}
.pj-ai .faq details{background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-lg);padding:0 24px}
.pj-ai .faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;font:500 18px/1.3 var(--font);letter-spacing:-.01em}
.pj-ai .faq summary::-webkit-details-marker{display:none}
.pj-ai .faq summary::after{content:"+";flex:none;width:32px;height:32px;border-radius:50%;background:var(--sand);display:grid;place-items:center;font-size:20px;line-height:1;color:var(--bronze-text);transition:transform .25s}
.pj-ai .faq details[open] summary::after{transform:rotate(45deg)}
.pj-ai .faq details p{color:var(--ink-65);padding-bottom:22px;max-width:65ch}

/* ---------- llamada final + pie ---------- */
.pj-ai .cta{border-radius:var(--radius-xl);background:linear-gradient(134deg,var(--sand),#c99b70 50%,var(--sand) 92%);padding:96px 24px;text-align:center}
.pj-ai .cta .sub{color:var(--ink-90)}
.pj-ai footer{max-width:var(--container);margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-block:32px 48px;color:var(--ink-45);font-size:14px}

/* ---------- notas de diseño (solo equipo) ---------- */
.pj-ai .note{max-width:var(--container);margin:0 auto 16px;background:#fffaf2;border-radius:var(--radius-md);box-shadow:0 0 0 1px rgba(176,122,74,.35);padding:16px 20px;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:14.5px;color:var(--ink-90);text-align:left}
.pj-ai .note b{grid-row:span 2;font:500 12px/1 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--bronze-text);background:var(--bronze-soft);padding:7px 10px;border-radius:var(--radius-pill);align-self:start}
.pj-ai .note ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.pj-ai .night .note{background:rgba(255,255,255,.05);box-shadow:0 0 0 1px rgba(217,180,140,.4);color:var(--on-dark-70)}
.pj-ai .night .note b{color:var(--bronze-light);background:rgba(217,180,140,.12)}
body:not(.notes-on) .pj-ai .note,body:not(.notes-on) .pj-ai .only-notes{display:none}
.pj-ai .notes-toggle{position:fixed;right:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);z-index:40;border:0;background:var(--ink);color:var(--on-dark);font:500 14px/1 var(--font);padding:12px 16px;border-radius:var(--radius-pill);box-shadow:0 12px 30px -10px rgba(0,0,0,.4);display:flex;align-items:center;gap:10px}
.pj-ai .notes-toggle i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35)}
body.notes-on .pj-ai .notes-toggle i{background:var(--bronze)}

/* ---------- visor ampliado ---------- */
.pj-ai .lb{position:fixed;inset:0;z-index:60;background:rgba(18,16,14,.86);display:grid;place-items:center;padding:24px;cursor:zoom-out}
.pj-ai .lb img,.pj-ai .lb video{max-height:86vh;width:auto;max-width:100%;border-radius:14px;box-shadow:var(--shadow-glow)}
.pj-ai .lb p{color:var(--on-dark-70);font-size:14px;margin-top:12px;text-align:center}

@media (prefers-reduced-motion:reduce){.pj-ai *{transition:none!important;animation:none!important}.pj-ai{scroll-behavior:auto}}

/* móvil (locodea-web, 2026-10-05): los tres botones del vídeo, en una línea y centrados dentro de la pantalla */
@media (max-width:640px){.pj-ai .vctl{left:8px;justify-content:center;gap:5px}.pj-ai .vctl button{white-space:nowrap;padding:6px 9px;font-size:11.5px}}

/* ---- apartados/locodea-ai/css/locodea-ai.css ---- */
/* Apartado «locodea AI» — estilos propios (mismo formato que Paneles de datos) */

/* ---------- navegación: sin cortes de línea ---------- */
.pj-ai .nav li a{white-space:nowrap}
@media (max-width:1000px){.pj-ai .nav ul{display:none}}

/* ---------- 1 · Portada ---------- */
.pj-ai .hero{margin-top:16px;border-radius:var(--radius-xl);padding:80px 24px 0;overflow:hidden;position:relative;
  background:radial-gradient(60% 40% at 50% 100%,rgba(176,122,74,.45),transparent 70%),linear-gradient(180deg,var(--paper),var(--sand-2) 35%,var(--sand-3))}
.pj-ai .hero .head{gap:18px}
.pj-ai .ai-trio{display:flex;justify-content:center;margin-bottom:2px}
.pj-ai .ai-trio span{width:64px;height:64px;border-radius:20px;background:var(--paper);box-shadow:0 14px 28px -14px rgba(80,55,30,.35),var(--shadow-ring);display:grid;place-items:center;margin:0 -6px;position:relative}
.pj-ai .ai-trio span:nth-child(1){transform:rotate(-6deg) translateY(4px)}
.pj-ai .ai-trio span:nth-child(2){z-index:1;transform:translateY(-4px)}
.pj-ai .ai-trio span:nth-child(3){transform:rotate(6deg) translateY(4px)}
.pj-ai .ai-trio img{width:34px;height:34px;object-fit:contain}
.pj-ai .ai-name{font-size:22px;line-height:1;letter-spacing:-.03em;color:var(--ink)}
.pj-ai .ai-name b{font-weight:600}
.pj-ai .ai-name span{font-size:.78em;font-weight:500;letter-spacing:-.01em;color:var(--ink-45)}
.pj-ai .lc-dot{width:8px;height:8px;border-radius:50%;background:var(--bronze);box-shadow:0 0 0 4px var(--bronze-soft)}
.pj-ai .stage-video{max-width:1080px;margin:56px auto 0;perspective:1800px;position:relative}
.pj-ai .device.pj-tilt{--t:1;transform-origin:50% 100%;transform:rotateX(calc(var(--t) * 14deg)) scale(calc(1 - var(--t) * .05));transition:transform .08s linear;border-radius:var(--radius-md) var(--radius-md) 0 0;padding:10px 10px 0;will-change:transform}
.pj-ai .device.pj-tilt .screen{border-radius:12px 12px 0 0}
.pj-ai .facts{display:grid;grid-template-columns:repeat(3,1fr);max-width:1080px;margin:0 auto;background:var(--paper);box-shadow:var(--shadow-ring);border-radius:0 0 var(--radius-md) var(--radius-md);position:relative;z-index:1}
.pj-ai .facts div{padding:20px 24px;display:flex;flex-direction:column;gap:2px}
.pj-ai .facts div+div{box-shadow:-1px 0 0 var(--ink-5)}
.pj-ai .facts strong{font-size:28px;letter-spacing:-.03em;line-height:1.1}
.pj-ai .facts span{font-size:14px;color:var(--ink-65)}
.pj-ai .hero-foot{height:56px}
/* portada solo con el vídeo: la pantalla cierra por abajo */
.pj-ai .hero .device.pj-tilt{border-radius:var(--radius-md);padding:10px}
.pj-ai .hero .device.pj-tilt .screen{border-radius:12px}
@media (max-width:640px){.pj-ai .hero{padding:56px 16px 0}.pj-ai .facts{grid-template-columns:1fr}.pj-ai .facts div+div{box-shadow:0 -1px 0 var(--ink-5)}.pj-ai .ai-trio span{width:54px;height:54px;border-radius:17px}.pj-ai .ai-trio img{width:28px;height:28px}}

/* ---------- 2 · Cómo funciona (flujo) ---------- */
.pj-ai .flow{position:relative;display:grid;grid-template-columns:.95fr .95fr 1.35fr;gap:64px;align-items:center;margin-top:48px;padding:64px 56px 44px;border-radius:var(--radius-xl);
  background:radial-gradient(55% 55% at 50% 110%,rgba(176,122,74,.22),transparent 70%),linear-gradient(180deg,var(--paper),var(--sand-2))}
.pj-ai .flow::before{content:"";position:absolute;inset:0;border-radius:inherit;background-image:radial-gradient(rgba(176,122,74,.16) 1px,transparent 1.2px);background-size:22px 22px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 85%);mask-image:linear-gradient(180deg,#000,transparent 85%);pointer-events:none}
.pj-ai .flow-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:0}
.pj-ai .flow-lines .fl{fill:none;stroke:rgba(176,122,74,.32);stroke-width:2;stroke-dasharray:3 7;stroke-linecap:round;transition:stroke .4s}
.pj-ai .flow[data-step="1"] .fl[data-col="1"],.pj-ai .flow[data-step="2"] .fl,.pj-ai .flow[data-step="3"] .fl[data-col="3"]{stroke:rgba(176,122,74,.7)}
.pj-ai .fdot{fill:var(--bronze);filter:drop-shadow(0 0 4px rgba(176,122,74,.6))}
.pj-ai .fcol{position:relative;z-index:1;transition:opacity .45s var(--ease),transform .45s var(--ease)}
.pj-ai .flow[data-step] .fcol{opacity:.55}
.pj-ai .flow[data-step="1"] .f-ai,.pj-ai .flow[data-step="2"] .f-hub,.pj-ai .flow[data-step="3"] .f-env{opacity:1;transform:translateY(-4px)}
.pj-ai .f-ai{display:flex;flex-direction:column;gap:12px}
.pj-ai .ai-card{display:flex;align-items:center;gap:12px;background:var(--paper);border-radius:16px;box-shadow:var(--shadow-card);padding:12px 14px;min-width:0}
.pj-ai .ai-card:nth-child(2){margin-left:22px;margin-right:-22px}
.pj-ai .ai-card b{display:block;font-size:15px;font-weight:500;line-height:1.25}
.pj-ai .ai-card div span{font-size:12.5px;color:var(--ink-45)}
.pj-ai .ai-ic{flex:none;width:44px;height:44px;border-radius:12px;background:var(--sand-2);display:grid;place-items:center}
.pj-ai .ai-ic img{width:26px;height:26px;object-fit:contain}
.pj-ai .hub{background:var(--paper);border-radius:28px;box-shadow:var(--shadow-lift);padding:22px 22px 18px;display:flex;flex-direction:column;gap:16px}
.pj-ai .hub-top{display:flex;align-items:center;gap:14px}
.pj-ai .hub-top b{display:block;font-size:22px;font-weight:500;letter-spacing:-.02em;line-height:1.1}
.pj-ai .hub-top span{font-size:14px;color:var(--ink-65)}
.pj-ai .hub-dot{flex:none;width:48px;height:48px;border-radius:16px;background:var(--sand-2);display:grid;place-items:center;position:relative}
.pj-ai .hub-dot i{width:14px;height:14px;border-radius:50%;background:var(--bronze);box-shadow:0 0 0 6px var(--bronze-soft)}
.pj-ai .flow[data-step="2"] .hub-dot i{animation:hubPulse 1.8s ease-out infinite}
@keyframes hubPulse{0%{box-shadow:0 0 0 0 rgba(176,122,74,.55),0 0 0 6px var(--bronze-soft)}100%{box-shadow:0 0 0 16px rgba(176,122,74,0),0 0 0 6px var(--bronze-soft)}}
.pj-ai .hub-list{list-style:none;margin:0;padding:14px 16px;display:flex;flex-direction:column;gap:9px;background:var(--sand-2);border-radius:18px}
.pj-ai .hub-list li{display:flex;gap:10px;align-items:baseline;font-size:14.5px;color:var(--ink-90)}
.pj-ai .hub-list li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--bronze);transform:translateY(-2px)}
.pj-ai .hub-sync{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-65)}
.pj-ai .hub-sync i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 4px rgba(1,208,98,.15)}
.pj-ai .f-env{display:flex;flex-direction:column;gap:14px}
.pj-ai .env{background:var(--paper);border-radius:22px;box-shadow:var(--shadow-card);padding:14px 16px 16px;display:flex;flex-direction:column;gap:10px}
.pj-ai .env-ours{box-shadow:0 0 0 1.5px rgba(176,122,74,.45),var(--shadow-card)}
.pj-ai .env-ours .qlabel{color:var(--bronze-text)}
.pj-ai .env-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.pj-ai .env-grid span{display:flex;align-items:center;gap:8px;font:500 12.5px/1.15 var(--font);color:var(--ink-90);background:var(--sand-2);border-radius:12px;padding:8px 9px;min-width:0;min-height:40px}
.pj-ai .env-grid img{width:20px;height:20px;flex:none;object-fit:contain}
.pj-ai .flow-steps{grid-column:1/-1;display:grid;grid-template-columns:.95fr .95fr 1.35fr;gap:64px;list-style:none;margin:8px 0 0;padding:0;position:relative;z-index:1}
.pj-ai .flow-steps li{display:flex;gap:14px;align-items:flex-start;padding:16px;border-radius:var(--radius-lg);transition:background .35s,box-shadow .35s}
.pj-ai .flow-steps .n{flex:none;width:36px;height:36px;border-radius:12px;background:var(--bronze-soft);color:var(--bronze-text);display:grid;place-items:center;font:500 15px/1 var(--font);transition:background .35s,color .35s}
.pj-ai .flow-steps h4{font-size:18px;margin-bottom:4px}
.pj-ai .flow-steps p{color:var(--ink-65);font-size:15px}
.pj-ai .flow[data-step="1"] .flow-steps li[data-col="1"],.pj-ai .flow[data-step="2"] .flow-steps li[data-col="2"],.pj-ai .flow[data-step="3"] .flow-steps li[data-col="3"]{background:var(--paper);box-shadow:var(--shadow-card)}
.pj-ai .flow[data-step="1"] li[data-col="1"] .n,.pj-ai .flow[data-step="2"] li[data-col="2"] .n,.pj-ai .flow[data-step="3"] li[data-col="3"] .n{background:var(--bronze);color:#fff}
@media (max-width:1060px){
  .pj-ai .flow{grid-template-columns:1fr;gap:40px;padding:36px 20px 24px}
  .pj-ai .flow-steps{display:contents}
  .pj-ai .f-ai{order:2}.pj-ai .flow-steps li[data-col="1"]{order:1}
  .pj-ai .f-hub{order:4}.pj-ai .flow-steps li[data-col="2"]{order:3}
  .pj-ai .f-env{order:6}.pj-ai .flow-steps li[data-col="3"]{order:5}
  .pj-ai .ai-card:nth-child(2){margin-left:0;margin-right:0}
  .pj-ai .flow[data-step] .fcol{opacity:1;transform:none}
}
@media (max-width:480px){.pj-ai .env-grid{grid-template-columns:repeat(2,1fr)}}

/* ---------- 3 · Casos de uso ---------- */
.pj-ai .tabs{display:flex;gap:6px;margin:32px auto 0;overflow-x:auto;padding:6px;max-width:100%;width:max-content;background:var(--sand);border-radius:var(--radius-pill);scrollbar-width:none}
.pj-ai .tabs::-webkit-scrollbar{display:none}
.pj-ai .tab{border:0;background:transparent;font:500 15px/1.2 var(--font);color:var(--ink-65);padding:11px 18px;border-radius:var(--radius-pill);white-space:nowrap}
.pj-ai .tab:hover{color:var(--ink)}
.pj-ai .tab[aria-selected="true"]{background:var(--paper);color:var(--ink);box-shadow:var(--shadow-card)}
.pj-ai .show{display:grid;grid-template-columns:1fr 1.45fr;gap:40px;align-items:start;margin-top:24px;border-radius:var(--radius-xl);background:var(--sand);padding:48px}
.pj-ai .show-txt{display:flex;flex-direction:column;gap:20px;padding-top:6px}
.pj-ai .show-txt .sub{font-size:17px}
.pj-ai .qbtns{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.pj-ai .qbtn{border:0;text-align:left;background:var(--paper);box-shadow:var(--shadow-card);border-radius:18px;padding:13px 16px;font:500 15px/1.35 var(--font);color:var(--ink-90);display:flex;gap:12px;align-items:center;transition:box-shadow .2s,background .2s,color .2s}
.pj-ai .qbtn::before{content:"";flex:none;width:26px;height:26px;border-radius:50%;background:var(--bronze-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238A5A30' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M6 11l6-6 6 6'/%3E%3C/svg%3E") center/14px no-repeat}
.pj-ai .qbtn:hover{box-shadow:0 0 0 1px rgba(176,122,74,.45)}
.pj-ai .qbtn[aria-pressed="true"]{background:var(--ink);color:#fff;box-shadow:none}
.pj-ai .qbtn[aria-pressed="true"]::before{background-color:rgba(255,255,255,.14);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D9B48C' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M6 11l6-6 6 6'/%3E%3C/svg%3E")}
.pj-ai .ai-pick{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.pj-ai .ai-pick button{border:0;display:inline-flex;align-items:center;gap:8px;background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:9px 15px 9px 10px;font:500 14px/1.2 var(--font);color:var(--ink-65);transition:box-shadow .2s,color .2s}
.pj-ai .ai-pick img{width:20px;height:20px;object-fit:contain}
.pj-ai .ai-pick button:hover{color:var(--ink)}
.pj-ai .ai-pick button[aria-checked="true"]{color:var(--ink);box-shadow:0 0 0 2px var(--bronze)}

.pj-ai .chatw{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lift);display:flex;flex-direction:column;min-height:470px;overflow:hidden}
.pj-ai .cw-head{display:flex;gap:12px;align-items:center;padding:14px 16px 14px 18px;box-shadow:inset 0 -1px 0 var(--ink-5)}
.pj-ai .cw-logo{width:34px;height:34px;object-fit:contain;flex:none;transition:transform .35s var(--ease),opacity .2s}
.pj-ai .cw-logo.swap{transform:scale(.6);opacity:0}
.pj-ai .cw-who{display:flex;flex-direction:column;line-height:1.25;min-width:0;flex:1}
.pj-ai .cw-who b{font-size:16px;font-weight:500}
.pj-ai #ai-cwStatus{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--ink-45);white-space:nowrap;overflow:hidden}
.pj-ai #ai-cwStatus em{font-style:normal;overflow:hidden;text-overflow:ellipsis}
.pj-ai .cw-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--bronze);box-shadow:0 0 0 3px var(--bronze-soft)}
.pj-ai .chatw.off .cw-dot{background:var(--ink-10);box-shadow:none}
.pj-ai .chatw.busy .cw-dot{animation:dotPulse 1s ease-out infinite}
@keyframes dotPulse{0%{box-shadow:0 0 0 0 rgba(176,122,74,.6)}100%{box-shadow:0 0 0 9px rgba(176,122,74,0)}}
.pj-ai .cw-demo{flex:none;font-size:12px;padding:5px 10px}
.pj-ai .switch{flex:none;border:0;background:none;display:inline-flex;align-items:center;gap:8px;padding:4px;font:500 13px/1 var(--font);color:var(--ink-65)}
.pj-ai .sw-track{width:38px;height:22px;border-radius:99px;background:var(--bronze);position:relative;transition:background .25s}
.pj-ai .sw-track i{position:absolute;top:3px;left:19px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:left .25s var(--ease)}
.pj-ai .switch[aria-checked="false"] .sw-track{background:rgba(27,24,22,.22)}
.pj-ai .switch[aria-checked="false"] .sw-track i{left:3px}
.pj-ai .cw-body{flex:1;padding:18px;display:flex;flex-direction:column;gap:12px;min-height:290px}
.pj-ai .msg{max-width:90%;border-radius:18px;padding:12px 15px;font-size:15px;line-height:1.5;animation:rise .45s var(--ease) both}
.pj-ai .msg.me{align-self:flex-end;background:var(--ink);color:#fff;border-bottom-right-radius:6px}
.pj-ai .msg.bot{align-self:flex-start;background:var(--sand-2);border-bottom-left-radius:6px;display:flex;gap:10px;align-items:flex-start}
.pj-ai .msg.bot>img{width:22px;height:22px;object-fit:contain;flex:none;margin-top:1px}
.pj-ai .msg.bot b{font-weight:500;color:var(--ink)}
.pj-ai .msg.think{display:flex;align-items:center;gap:10px;color:var(--ink-65);font-size:14px;background:transparent;padding:4px 2px}
.pj-ai .msg.think img{width:20px;height:20px;object-fit:contain}
.pj-ai .cites{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.pj-ai .cite{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink-65);background:#fff;box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:5px 10px 5px 6px;animation:rise .35s var(--ease) both}
.pj-ai .cite img{width:16px;height:16px;object-fit:contain}
.pj-ai .cite:nth-child(2){animation-delay:.08s}.pj-ai .cite:nth-child(3){animation-delay:.16s}
.pj-ai .typing{display:inline-flex;gap:4px}
.pj-ai .typing i{width:6px;height:6px;border-radius:50%;background:var(--ink-45);animation:blink 1s infinite}
.pj-ai .typing i:nth-child(2){animation-delay:.15s}.pj-ai .typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{50%{opacity:.2}}
@keyframes rise{from{opacity:0;transform:translateY(10px)}}
.pj-ai .cw-input{margin:0 14px 14px;background:var(--sand-2);border-radius:var(--radius-pill);padding:12px 12px 12px 16px;font-size:14px;color:var(--ink-45);display:flex;justify-content:space-between;align-items:center;gap:12px}
.pj-ai .cw-input span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-ai .cw-input.typing-now{color:var(--ink)}
.pj-ai .cw-input i{flex:none;width:30px;height:30px;border-radius:50%;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M6 11l6-6 6 6'/%3E%3C/svg%3E") center/15px no-repeat}
.pj-ai .srcs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.pj-ai .srcs-g{background:rgba(255,255,255,.55);border-radius:20px;padding:10px 12px 12px;display:flex;flex-direction:column;gap:8px}
.pj-ai .srcs-g:last-child .qlabel{color:var(--bronze-text)}
.pj-ai .srcs-row{display:flex;flex-wrap:wrap;gap:6px}
.pj-ai .src{width:38px;height:38px;border-radius:12px;background:#fff;box-shadow:var(--shadow-card);display:grid;place-items:center;transition:box-shadow .3s,transform .3s var(--ease),opacity .3s;opacity:.55}
.pj-ai .src img{width:21px;height:21px;object-fit:contain}
.pj-ai .src.on{opacity:1;transform:translateY(-2px);box-shadow:0 0 0 2px var(--bronze),0 8px 16px -8px rgba(176,122,74,.6)}
.pj-ai .src.used{opacity:1;box-shadow:0 0 0 1.5px rgba(176,122,74,.55),var(--shadow-card)}
.pj-ai .chatw.off~.srcs .src{opacity:.3;filter:grayscale(1)}
@media (max-width:1060px){.pj-ai .show{grid-template-columns:1fr;padding:24px;gap:24px}.pj-ai .show-media{order:-1}}
@media (max-width:560px){.pj-ai .cw-demo{display:none}.pj-ai .srcs{grid-template-columns:1fr}.pj-ai .switch .sw-txt{display:none}.pj-ai .show{padding:16px}.pj-ai .chatw{min-height:440px}}

/* ---------- 4 · Con lo que te construimos ---------- */
.pj-ai .ours{display:flex;flex-direction:column;gap:32px}
.pj-ai .ours .head{max-width:720px}
.pj-ai .ours-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.pj-ai .o-card{background:var(--paper);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:22px;display:grid;grid-template-columns:44px 1fr;grid-template-rows:auto 1fr;gap:14px 14px;align-items:center}
.pj-ai .o-card p{align-self:stretch;display:flex;align-items:center}
.pj-ai .o-card img{width:44px;height:44px;object-fit:contain}
.pj-ai .o-card h4{font-size:18px}
.pj-ai .o-card div span{font-size:13.5px;color:var(--ink-45)}
.pj-ai .o-card p{grid-column:1/-1;font-size:15px;color:var(--ink-90);background:var(--sand-2);border-radius:14px;padding:12px 14px;line-height:1.45}
.pj-ai .ours .fine{font-size:14px;color:var(--ink-65)}
@media (max-width:980px){.pj-ai .ours-grid{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.pj-ai .ours-grid{grid-template-columns:1fr}}

/* ---------- 6 · Control ---------- */
.pj-ai .why{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
.pj-ai .why .ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pj-ai .why .ic{margin-bottom:6px}
.pj-ai .fine{font-size:13px;color:var(--ink-45);max-width:60ch}
@media (max-width:860px){.pj-ai .why{grid-template-columns:1fr}}

/* ---------- 4 · Documenta con tu marca ----------
   Las tres marcas son ficticias: sus colores, tipografías y radios son SUYOS (lo que se enseña es que el documento sale con su marca). */
.pj-ai #ai-studio[data-b="talleres"]{--bp:#2F5FD0;--bd:#0F1E3D;--bl:#E8EEFC;--band:#2F5FD0;--bmono:#2F5FD0;--bf:Georgia,"Times New Roman",serif;--bw:400;--br:10px}
.pj-ai #ai-studio[data-b="clinica"]{--bp:#138A72;--bd:#0B3B33;--bl:#E3F4EF;--band:#138A72;--bmono:#138A72;--bf:"Segoe UI","Helvetica Neue",Arial,sans-serif;--bw:600;--br:18px}
.pj-ai #ai-studio[data-b="grupo"]{--bp:#B7832A;--bd:#15171C;--bl:#F5EEE1;--band:#15171C;--bmono:#15171C;--bf:"Trebuchet MS","Gill Sans",sans-serif;--bw:600;--br:2px}
.pj-ai .studio{display:grid;grid-template-columns:.85fr 1.25fr;gap:40px;align-items:start;margin-top:48px;border-radius:var(--radius-xl);background:var(--sand);padding:44px}
.pj-ai .st-ctrl{display:flex;flex-direction:column;gap:22px}
.pj-ai .st-ask{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.pj-ai .st-ask p{align-self:stretch;background:var(--ink);color:#fff;border-radius:22px 22px 6px 22px;padding:14px 18px;font-size:16px;line-height:1.45;transition:opacity .25s}
.pj-ai .st-ais{display:flex;gap:4px;align-self:flex-start;background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:6px 10px}
.pj-ai .st-ais img{width:20px;height:20px;object-fit:contain}
.pj-ai .st-types{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}
.pj-ai .st-types button,.pj-ai .st-brands button{border:0;background:var(--paper);box-shadow:var(--shadow-card);border-radius:16px;padding:12px 14px;font:500 14.5px/1.25 var(--font);color:var(--ink-90);display:flex;align-items:center;gap:10px;text-align:left;transition:box-shadow .2s}
.pj-ai .st-types button:hover,.pj-ai .st-brands button:hover{box-shadow:0 0 0 1px rgba(176,122,74,.45)}
.pj-ai .st-types button[aria-checked="true"],.pj-ai .st-brands button[aria-checked="true"]{box-shadow:0 0 0 2px var(--bronze)}
.pj-ai .ty{flex:none;width:28px;height:28px;border-radius:9px;background:var(--bronze-soft);position:relative}
.pj-ai .ty::before,.pj-ai .ty::after{content:"";position:absolute;background:var(--bronze-text);border-radius:2px}
.pj-ai .ty-doc::before{left:9px;top:7px;width:10px;height:2px;box-shadow:0 5px 0 var(--bronze-text),0 10px 0 var(--bronze-text)}
.pj-ai .ty-book::before{left:8px;top:7px;width:5px;height:14px;opacity:.6}.pj-ai .ty-book::after{left:15px;top:7px;width:5px;height:14px}
.pj-ai .ty-chart::before{left:8px;bottom:7px;width:3px;height:8px;box-shadow:5px -4px 0 var(--bronze-text),10px -7px 0 var(--bronze-text)}
.pj-ai .ty-slide::before{left:6px;top:8px;width:16px;height:11px;border-radius:3px;background:none;box-shadow:inset 0 0 0 2px var(--bronze-text)}
.pj-ai .st-brands{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.pj-ai .st-brands .bm{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:#fff;font-size:13px;font-weight:600}
.pj-ai .st-brands .bn{flex:1}
.pj-ai .st-brands .bs{display:flex;gap:4px}
.pj-ai .st-brands .bs i{width:14px;height:14px;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.08)}
.pj-ai .kit{background:var(--paper);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:18px 20px;display:grid;grid-template-columns:auto 1fr;gap:14px 16px;align-items:center}
.pj-ai .kit .k-h{grid-column:1/-1;font-size:13px;color:var(--ink-45)}
.pj-ai .kit .k-mono{width:52px;height:52px;border-radius:var(--br);background:var(--bmono);color:#fff;display:grid;place-items:center;font:var(--bw) 20px/1 var(--bf);transition:background .5s,border-radius .5s}
.pj-ai .kit .k-name{font:var(--bw) 20px/1.2 var(--bf);color:var(--bd)}
.pj-ai .kit .k-sw{grid-column:1/-1;display:flex;gap:14px}
.pj-ai .kit .k-sw span{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:11px;color:var(--ink-45);font-variant-numeric:tabular-nums}
.pj-ai .kit .k-sw i{width:34px;height:34px;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.08);transition:background .5s}
.pj-ai .kit .k-aa{font:var(--bw) 40px/1 var(--bf);color:var(--bd)}
.pj-ai .kit .k-font{font-size:13px;color:var(--ink-65);line-height:1.35}
.pj-ai .kit .k-cmp{grid-column:1/-1;display:flex;gap:8px;align-items:center}
.pj-ai .kit .k-btn{background:var(--bp);color:#fff;border-radius:var(--br);padding:8px 14px;font-size:13px;font-weight:500;transition:background .5s,border-radius .5s}
.pj-ai .kit .k-chip{background:var(--bl);color:var(--bp);border-radius:99px;padding:6px 12px;font-size:12px;font-weight:500;transition:background .5s,color .5s}
.pj-ai .st-stage{display:flex;flex-direction:column;gap:14px;align-items:center;min-width:0}
.pj-ai .st-status{align-self:stretch;display:flex;align-items:center;gap:10px;background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:10px 16px;font-size:14px;color:var(--ink-65)}
.pj-ai .st-status i{flex:none;width:9px;height:9px;border-radius:50%;background:var(--bronze);animation:dotPulse 1s ease-out infinite}
.pj-ai .st-status.done i{background:var(--ok);animation:none;box-shadow:0 0 0 4px rgba(1,208,98,.15)}
.pj-ai .st-status b{font-weight:500;color:var(--ink)}
.pj-ai .paper-wrap{width:100%;display:flex;justify-content:center}
.pj-ai .paper{width:100%;max-width:500px;aspect-ratio:1/1.38;background:#fff;border-radius:10px;box-shadow:var(--shadow-lift);overflow:hidden;position:relative;container-type:inline-size;color:var(--bd)}
.pj-ai .paper.wide{max-width:100%;aspect-ratio:16/10}
.pj-ai .paper::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.85) 50%,transparent 70%);transform:translateX(-120%)}
.pj-ai .paper.reskin::after{animation:sweep .8s var(--ease)}
@keyframes sweep{to{transform:translateX(120%)}}
.pj-ai .paper *{transition:background-color .5s,color .5s,border-color .5s,border-radius .5s,box-shadow .5s}
.pj-ai .pi{font-size:calc(100cqw / 52);height:100%;display:flex;flex-direction:column}
.pj-ai .blk{animation:blk .55s var(--ease) both;animation-delay:calc(var(--i,0) * 80ms + 200ms)}
@keyframes blk{from{opacity:0;transform:translateY(.9em)}}
.pj-ai .p-band{flex:none;height:5.6em;background:var(--band);display:flex;align-items:center;gap:1em;padding:0 2.4em;color:#fff}
.pj-ai .p-mono{flex:none;width:3.1em;height:3.1em;border-radius:calc(var(--br) * .7);background:#fff;color:var(--bmono);display:grid;place-items:center}
.pj-ai .p-mono b{font:var(--bw) 1.35em/1 var(--bf)}
.pj-ai .p-name{font:var(--bw) 1.6em/1 var(--bf)}
.pj-ai .p-kind{margin-left:auto;font-size:1.1em;opacity:.75}
.pj-ai .p-body{flex:1;padding:2.4em 3em 0;display:flex;flex-direction:column;min-height:0}
.pj-ai .p-title{font:var(--bw) 2.5em/1.12 var(--bf);color:var(--bd);margin:0}
.pj-ai .p-sub{font-size:1.25em;color:color-mix(in srgb,var(--bd) 60%,#fff);margin-top:.4em}
.pj-ai .p-meta{display:flex;gap:.6em;flex-wrap:wrap;margin-top:1.1em}
.pj-ai .p-meta span{font-size:1.1em;padding:.35em .9em;border-radius:99px;background:var(--bl);color:var(--bp)}
.pj-ai .p-h{font:var(--bw) 1.55em/1.2 var(--bf);color:var(--bd);margin:1.3em 0 .65em}
.pj-ai .p-ln{height:.8em;border-radius:.4em;background:#E9ECF1;margin:.55em 0}
.pj-ai .p-flow{display:flex;align-items:center}
.pj-ai .p-flow span{flex:1;height:5.4em;border-radius:var(--br);border:.18em solid var(--bp);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35em;font-size:1em;color:var(--bd);background:#fff}
.pj-ai .p-flow span b{width:1.9em;height:1.9em;border-radius:50%;background:var(--bl);color:var(--bp);display:grid;place-items:center;font-size:.95em;font-weight:600}
.pj-ai .p-flow span:first-child{background:var(--bp);color:#fff}.pj-ai .p-flow span:first-child b{background:#fff}
.pj-ai .p-flow i{flex:none;width:1.2em;height:.18em;background:var(--bp)}
.pj-ai .p-tbl{border-radius:calc(var(--br) * .8);overflow:hidden;box-shadow:0 0 0 .1em #E2E6EE}
.pj-ai .p-tbl div{display:grid;grid-template-columns:1fr 1.5fr .8fr;padding:.75em 1.1em;font-size:1.1em;border-top:.1em solid #E2E6EE}
.pj-ai .p-tbl div:first-child{background:var(--bl);color:var(--bp);font-weight:600;border-top:0}
.pj-ai .p-foot{margin-top:auto;border-top:.15em solid var(--bp);padding:.8em 0 1.4em;display:flex;justify-content:space-between;font-size:1em;color:color-mix(in srgb,var(--bd) 55%,#fff)}
.pj-ai .p-row{display:flex;gap:2em;align-items:flex-start}
.pj-ai .p-phone{flex:none;width:9em;height:16.5em;border-radius:1.6em;border:.45em solid var(--bd);padding:1.3em .8em;display:flex;flex-direction:column;gap:.6em}
.pj-ai .p-phone i{display:block;height:1.1em;border-radius:.4em;background:var(--bl)}
.pj-ai .p-phone i.big{height:4.4em}
.pj-ai .p-phone i.go{margin-top:auto;background:var(--bp)}
.pj-ai .p-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:1.1em;flex:1}
.pj-ai .p-steps li{display:flex;gap:.9em;align-items:center;font-size:1.25em;line-height:1.3}
.pj-ai .p-steps li b{flex:none;width:1.9em;height:1.9em;border-radius:50%;background:var(--bp);color:#fff;display:grid;place-items:center;font-size:.85em;font-weight:600}
.pj-ai .p-tip{margin-top:1.4em;background:var(--bl);border-left:.35em solid var(--bp);border-radius:0 var(--br) var(--br) 0;padding:1em 1.2em;font-size:1.15em;line-height:1.4}
.pj-ai .p-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:.9em;margin-top:1.4em}
.pj-ai .p-kpis div{background:var(--bl);border-radius:var(--br);padding:.9em 1em}
.pj-ai .p-kpis span{display:block;font-size:1em;color:color-mix(in srgb,var(--bd) 60%,#fff)}
.pj-ai .p-kpis b{display:block;font:var(--bw) 1.9em/1.15 var(--bf);color:var(--bd);margin-top:.15em}
.pj-ai .p-kpis em{font-style:normal;font-size:.95em;color:var(--bp);font-weight:600}
.pj-ai .p-bars{display:flex;align-items:flex-end;gap:1em;height:10em;padding:0 .4em;border-bottom:.12em solid #E2E6EE}
.pj-ai .p-bars i{flex:1;border-radius:calc(var(--br) * .5) calc(var(--br) * .5) 0 0;background:var(--bl)}
.pj-ai .p-bars i.hi{background:var(--bp)}
.pj-ai .p-bul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6em}
.pj-ai .p-bul li{display:flex;gap:.7em;font-size:1.15em;line-height:1.35}
.pj-ai .p-bul li::before{content:"";flex:none;width:.55em;height:.55em;border-radius:50%;background:var(--bp);margin-top:.45em}
/* presentación (16:10) */
.pj-ai .pi.sl{font-size:calc(100cqw / 80)}
.pj-ai .s-main{flex:1;background:var(--band);color:#fff;padding:3em 4em;display:flex;flex-direction:column;position:relative;overflow:hidden}
.pj-ai .s-main::after{content:"";position:absolute;right:-6em;bottom:-10em;width:30em;height:30em;border-radius:50%;background:var(--bp);opacity:.35}
.pj-ai #ai-studio[data-b="grupo"] .s-main::after{opacity:.55}
.pj-ai .s-main .p-mono{position:relative;z-index:1}
.pj-ai .s-main h4{position:relative;z-index:1;margin-top:auto;font:var(--bw) 4.2em/1.05 var(--bf);color:#fff;letter-spacing:-.01em}
.pj-ai .s-main p{position:relative;z-index:1;font-size:1.5em;opacity:.8;margin-top:.6em}
.pj-ai .s-thumbs{flex:none;display:grid;grid-template-columns:repeat(3,1fr);gap:1.4em;padding:1.6em 2.4em;background:#F4F5F8}
.pj-ai .s-th{background:#fff;border-radius:calc(var(--br) * .6);aspect-ratio:16/9;padding:1em 1.2em;display:flex;flex-direction:column;gap:.5em;box-shadow:0 .2em .8em rgba(15,30,61,.08)}
.pj-ai .s-th b{font:var(--bw) 1.15em/1.1 var(--bf);color:var(--bd)}
.pj-ai .s-th .p-bars{height:auto;flex:1;gap:.5em;border:0}
.pj-ai .s-th svg{flex:1;width:100%}
.pj-ai .s-th svg path{fill:none;stroke:var(--bp);stroke-width:3;stroke-linecap:round;transition:stroke .5s}
.pj-ai .st-out{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.pj-ai .st-out span{display:inline-flex;align-items:center;gap:7px;background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:7px 12px 7px 9px;font-size:13px;color:var(--ink-65)}
.pj-ai .st-out img{width:18px;height:18px;object-fit:contain}
@media (max-width:1060px){.pj-ai .studio{grid-template-columns:1fr;padding:24px;gap:24px}.pj-ai .st-stage{order:-1}}
@media (max-width:560px){.pj-ai .studio{padding:14px}.pj-ai .st-types{grid-template-columns:1fr}}

/* documento dentro de la respuesta del chat */
.pj-ai .mini-doc{display:flex;gap:10px;align-items:center;margin-top:10px;background:#fff;border-radius:14px;box-shadow:var(--shadow-card);padding:8px 12px 8px 8px;max-width:300px;animation:rise .4s var(--ease) both}
.pj-ai .mini-doc .pg{flex:none;width:38px;height:50px;border-radius:4px;background:#fff;box-shadow:0 0 0 1px #E2E6EE;overflow:hidden;display:flex;flex-direction:column;gap:3px}
.pj-ai .mini-doc .pg i{display:block;height:3px;margin:0 5px;border-radius:2px;background:#E2E6EE}
.pj-ai .mini-doc .pg i:first-child{height:9px;margin:0;border-radius:0;background:#2F5FD0}
.pj-ai .mini-doc .pg i:nth-child(2){background:#2F5FD0;opacity:.35;width:60%}
.pj-ai .mini-doc div{display:flex;flex-direction:column;font-size:13px;line-height:1.3;min-width:0}
.pj-ai .mini-doc div b{font-size:13.5px}
.pj-ai .mini-doc div span{color:var(--ink-45);font-size:12px}

/* ---------- vídeo de portada ---------- */
.pj-ai .screen video{background:var(--sand-2)}

/* Generado por build/ a partir de apartados/comun/css/locodea.css, apartados/agentes/css/agentes.css. No editar a mano. */
/* ---- aislamiento frente a css/style.css (generado) ---- */
.pj-cp .bot{background:revert;box-shadow:revert}
.pj-cp .btn{position:revert;justify-content:revert;height:revert;cursor:revert;font-size:revert}
.pj-cp .cmp{padding:initial;border-bottom:revert;font-size:revert}
.pj-cp .cmp:last-child{border-bottom:revert}
.pj-cp .cta{display:revert;grid-template-columns:revert;gap:revert;align-items:revert}
.pj-cp .device{width:revert;max-width:revert;overflow:revert;transform:revert}
.pj-cp .done{display:revert;gap:revert;align-items:revert;padding:initial;border-radius:revert;background:revert;font-size:revert;color:revert;line-height:revert}
.pj-cp .dot{display:revert;width:revert;height:revert;border-radius:revert;background:revert;flex:revert;margin-top:initial}
.pj-cp .hero{isolation:revert;display:revert;flex-direction:revert;align-items:revert;text-align:revert;gap:revert}
.pj-cp .hero::after{content:none}
.pj-cp .hero::before{content:none}
.pj-cp .link{font-size:revert}
.pj-cp .logo{display:revert;align-items:revert;gap:revert}
.pj-cp .mano{fill:revert}
.pj-cp .mc{position:revert;background:revert;box-shadow:revert;color:revert;rotate:revert;opacity:revert;translate:revert;transition-delay:revert;transition-duration:revert;animation:revert;animation-delay:revert}
.pj-cp .nav-in{pointer-events:revert;transition:revert;z-index:revert;position:revert}
.pj-cp .nav{left:revert;right:revert;padding:initial;pointer-events:revert}
.pj-cp .sub{text-wrap:revert;margin-inline:initial;margin:initial;position:revert;z-index:revert}
.pj-cp .tilt{position:revert;transform:revert;transform-style:revert;transition:revert;will-change:revert}
.pj-cp .tilt::after{content:none}
.pj-cp .vctl{z-index:revert}
.pj-cp .win{width:revert;transform:revert}
/* ---- apartados/comun/css/locodea.css ---- */
/* locodea. — sistema de diseño «Web Design - locodea» (paleta Bronce).
   Un solo tema (claro), por decisión del sistema. COMPARTIDO por todos los apartados de la web (../comun/css/). */

.pj-cp{
  --paper:#fff; --ink:#1b1816; --ink-90:rgba(27,24,22,.9); --ink-65:rgba(27,24,22,.65); --ink-45:rgba(27,24,22,.45); --ink-10:rgba(27,24,22,.1); --ink-5:rgba(27,24,22,.05);
  --bronze:#b07a4a; --bronze-hover:#9c6a3e; --bronze-deep:#8e5e34; --bronze-text:#8a5a30; --bronze-light:#d9b48c; --bronze-soft:rgba(176,122,74,.14);
  --sand:#f1ebe2; --sand-2:#f8f4ee; --sand-3:#e8dccb; --dark:#1b1816; --dark-deep:#12100e; --on-dark:#fff; --on-dark-70:rgba(255,255,255,.7); --on-dark-45:rgba(255,255,255,.45);
  --ok:#01d062; --warn:#febc2e;
  /* semáforo de los paneles (visuales de datos, nunca texto de interfaz) */
  --st-ok:#4f8a64; --st-mid:#d19a3e; --st-bad:#c2553f;
  --radius-sm:12px; --radius-md:20px; --radius-lg:24px; --radius-xl:32px; --radius-pill:99px;
  --shadow-ring:0 0 0 1px rgba(27,24,22,.05);
  --shadow-card:0 0 0 1px rgba(27,24,22,.05),0 1px 2px rgba(0,0,0,.03);
  --shadow-lift:0 24px 48px -16px rgba(80,55,30,.22),0 0 0 1px rgba(27,24,22,.05);
  --shadow-glow:0 0 0 1px rgba(255,255,255,.1),0 40px 80px -30px rgba(176,122,74,.35);
  --font:"DM Sans","Inter","Helvetica Neue",Arial,sans-serif;
  --container:1240px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
.pj-cp *{box-sizing:border-box}
.pj-cp [hidden]{display:none!important}
.pj-cp{scroll-behavior:smooth}
.pj-cp{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.5 var(--font);-webkit-font-smoothing:antialiased;padding-inline:16px;overflow-x:hidden}
.pj-cp h1,.pj-cp h2,.pj-cp h3,.pj-cp h4{font-weight:500;line-height:1.08;letter-spacing:-.04em;margin:0;text-wrap:balance;color:var(--ink-90)}
.pj-cp h1{font-size:clamp(44px,7vw,76px)}
/* la segunda parte del titular de cada apartado, en bronce con brillo, como en Power Apps y Power Automate (.lx-g) */
.pj-cp .hero h1 em{font-style:normal;background:linear-gradient(100deg,#b9834f 0%,#8e5e34 28%,#e6c39b 48%,#a8723f 64%,#8e5e34 82%,#c99464 100%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:h-brillo 7s linear infinite}
@keyframes h-brillo{from{background-position:0 0}to{background-position:-240% 0}}
@media (prefers-reduced-motion:reduce){.pj-cp .hero h1 em{animation:none}}
.pj-cp h2{font-size:clamp(36px,5vw,56px)}
.pj-cp h3{font-size:clamp(26px,3.4vw,34px);letter-spacing:-.03em}
.pj-cp h4{font-size:20px;line-height:1.2;letter-spacing:-.02em}
.pj-cp p{margin:0}
.pj-cp b,.pj-cp strong{font-weight:500}
.pj-cp a{color:inherit}
.pj-cp button,.pj-cp input,.pj-cp select{font:inherit;color:inherit}
.pj-cp button{cursor:pointer}
.pj-cp :focus-visible{outline:2px solid var(--bronze);outline-offset:3px}
.pj-cp img,.pj-cp video,.pj-cp canvas{max-width:100%;display:block}
.pj-cp .num{font-variant-numeric:tabular-nums}

.pj-cp .wrap{max-width:var(--container);margin-inline:auto}
.pj-cp .logo{font-weight:600;letter-spacing:-.03em;font-size:22px;line-height:1;text-decoration:none;color:var(--ink)}
.pj-cp .logo b{color:var(--bronze);font-weight:600}
.pj-cp b.dot{color:var(--bronze);font-weight:inherit}   /* el punto de «locodea.» dentro de un texto */
.pj-cp section{padding-block:48px}

/* chip → titular → entradilla → botones */
.pj-cp .head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;max-width:780px;margin-inline:auto}
.pj-cp .head.left{align-items:flex-start;text-align:left;margin-inline:0}
.pj-cp .chip{display:inline-flex;align-items:center;gap:8px;font:500 13.5px/1.2 var(--font);color:var(--bronze-text);background:var(--paper);box-shadow:var(--shadow-card);padding:8px 14px;border-radius:var(--radius-pill)}
.pj-cp .sub{font-size:18px;line-height:1.5;color:var(--ink-65);max-width:56ch}
.pj-cp .btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.pj-cp .head.left .btns{justify-content:flex-start}
.pj-cp .btn{display:inline-flex;align-items:center;gap:8px;font:500 15px/1.2 var(--font);padding:14px 22px;border-radius:var(--radius-pill);border:0;text-decoration:none;transition:background .2s,transform .2s;white-space:nowrap}
.pj-cp .btn:active{transform:scale(.98)}
.pj-cp .btn-ink{background:var(--ink);color:var(--on-dark)}
.pj-cp .btn-ink:hover{background:#2e2925}
.pj-cp .btn-ghost{background:var(--bronze-soft);color:var(--bronze-text)}
.pj-cp .btn-ghost:hover{background:rgba(176,122,74,.22)}
.pj-cp .btn-bronze{background:var(--bronze);color:var(--on-dark)}
.pj-cp .btn-bronze:hover{background:var(--bronze-hover)}
.pj-cp .btn-sm{padding:10px 16px;font-size:14px}
.pj-cp .link{color:var(--bronze-text);font-weight:500;text-decoration:none;display:inline-flex;gap:6px;align-items:center}
.pj-cp .link:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- navegación ---------- */
.pj-cp .nav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 12px);z-index:30;margin-top:12px}
.pj-cp .nav-in{max-width:var(--container);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:10px 10px 10px 22px}
.pj-cp .nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.pj-cp .nav li a{display:block;font:500 15px/1.2 var(--font);color:var(--ink-65);text-decoration:none;padding:10px 14px;border-radius:var(--radius-pill)}
.pj-cp .nav li a:hover{color:var(--ink)}
.pj-cp .nav li a[aria-current]{color:var(--ink);background:var(--sand)}
.pj-cp .nav .btn{padding:11px 18px}
@media (max-width:900px){.pj-cp .nav ul{display:none}}

/* ---------- dispositivos ---------- */
.pj-cp .device{background:var(--paper);border-radius:var(--radius-md);box-shadow:var(--shadow-lift);padding:10px}
.pj-cp .device-bar{display:flex;align-items:center;gap:6px;padding:4px 6px 10px}
.pj-cp .device-bar i{width:10px;height:10px;border-radius:50%;background:var(--sand-3)}
.pj-cp .device-bar span{margin-left:10px;font:500 12px/1 var(--font);color:var(--ink-45);background:var(--sand-2);border-radius:var(--radius-pill);padding:6px 12px;flex:1;max-width:320px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.pj-cp .screen{position:relative;border-radius:12px;overflow:hidden;background:var(--sand-2);aspect-ratio:16/9}
.pj-cp .screen video,.pj-cp .screen img{width:100%;height:100%;object-fit:cover}
.pj-cp .vctl{position:absolute;right:14px;bottom:14px;display:flex;gap:8px}
.pj-cp .vctl button{border:0;background:rgba(18,16,14,.72);color:var(--on-dark);backdrop-filter:blur(8px);font:500 13.5px/1 var(--font);padding:9px 14px;border-radius:var(--radius-pill)}
.pj-cp .vctl button:hover{background:rgba(18,16,14,.9)}
@media (max-width:640px){.pj-cp .vctl{right:8px;bottom:8px}.pj-cp .vctl button{padding:7px 11px;font-size:12.5px}}

/* ---------- tarjetas, píldoras, listas ---------- */
.pj-cp .card{background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-lg);padding:24px;display:flex;flex-direction:column;gap:10px}
.pj-cp .card p{color:var(--ink-65)}
.pj-cp .ic{width:40px;height:40px;border-radius:var(--radius-sm);background:var(--bronze-soft);color:var(--bronze-text);display:grid;place-items:center;font:500 15px/1 var(--font);flex:none}
.pj-cp .pills{display:flex;flex-wrap:wrap;gap:8px}
.pj-cp .pill{font:500 13.5px/1.2 var(--font);padding:7px 12px;border-radius:var(--radius-pill);background:var(--paper);box-shadow:var(--shadow-card);color:var(--ink-65)}
.pj-cp .pill.hot{background:var(--bronze-soft);box-shadow:none;color:var(--bronze-text)}
.pj-cp .qlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.pj-cp .qlist li{display:flex;gap:12px;align-items:baseline;color:var(--ink-90)}
.pj-cp .qlist li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--bronze);transform:translateY(-2px)}
.pj-cp .qlabel{font:500 13.5px/1.2 var(--font);color:var(--ink-45)}
.pj-cp .panel-sand{border-radius:var(--radius-xl);background:var(--sand);padding:48px}
@media (max-width:760px){.pj-cp .panel-sand{padding:24px}}

/* ---------- panel oscuro (uno por página) ---------- */
.pj-cp .night{border-radius:var(--radius-xl);background:radial-gradient(55% 45% at 50% 100%,rgba(176,122,74,.35),transparent 70%),var(--dark);color:var(--on-dark);padding:96px 48px}
.pj-cp .night h2,.pj-cp .night h3,.pj-cp .night h4{color:var(--on-dark)}
.pj-cp .night .chip{background:rgba(255,255,255,.06);box-shadow:0 0 0 1px rgba(255,255,255,.1);color:var(--bronze-light)}
.pj-cp .night .sub{color:var(--on-dark-70)}
.pj-cp .grad{background:linear-gradient(90deg,#ebd0ae,var(--bronze) 45%,var(--bronze-deep));-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:980px){.pj-cp .night{padding:64px 20px}}

/* ---------- preguntas frecuentes ---------- */
.pj-cp .faq{max-width:820px;margin:48px auto 0;display:flex;flex-direction:column;gap:12px}
.pj-cp .faq details{background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-lg);padding:0 24px}
.pj-cp .faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;font:500 18px/1.3 var(--font);letter-spacing:-.01em}
.pj-cp .faq summary::-webkit-details-marker{display:none}
.pj-cp .faq summary::after{content:"+";flex:none;width:32px;height:32px;border-radius:50%;background:var(--sand);display:grid;place-items:center;font-size:20px;line-height:1;color:var(--bronze-text);transition:transform .25s}
.pj-cp .faq details[open] summary::after{transform:rotate(45deg)}
.pj-cp .faq details p{color:var(--ink-65);padding-bottom:22px;max-width:65ch}

/* ---------- llamada final + pie ---------- */
.pj-cp .cta{border-radius:var(--radius-xl);background:linear-gradient(134deg,var(--sand),#c99b70 50%,var(--sand) 92%);padding:96px 24px;text-align:center}
.pj-cp .cta .sub{color:var(--ink-90)}
.pj-cp footer{max-width:var(--container);margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-block:32px 48px;color:var(--ink-45);font-size:14px}

/* ---------- notas de diseño (solo equipo) ---------- */
.pj-cp .note{max-width:var(--container);margin:0 auto 16px;background:#fffaf2;border-radius:var(--radius-md);box-shadow:0 0 0 1px rgba(176,122,74,.35);padding:16px 20px;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:14.5px;color:var(--ink-90);text-align:left}
.pj-cp .note b{grid-row:span 2;font:500 12px/1 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--bronze-text);background:var(--bronze-soft);padding:7px 10px;border-radius:var(--radius-pill);align-self:start}
.pj-cp .note ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.pj-cp .night .note{background:rgba(255,255,255,.05);box-shadow:0 0 0 1px rgba(217,180,140,.4);color:var(--on-dark-70)}
.pj-cp .night .note b{color:var(--bronze-light);background:rgba(217,180,140,.12)}
body:not(.notes-on) .pj-cp .note,body:not(.notes-on) .pj-cp .only-notes{display:none}
.pj-cp .notes-toggle{position:fixed;right:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);z-index:40;border:0;background:var(--ink);color:var(--on-dark);font:500 14px/1 var(--font);padding:12px 16px;border-radius:var(--radius-pill);box-shadow:0 12px 30px -10px rgba(0,0,0,.4);display:flex;align-items:center;gap:10px}
.pj-cp .notes-toggle i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35)}
body.notes-on .pj-cp .notes-toggle i{background:var(--bronze)}

/* ---------- visor ampliado ---------- */
.pj-cp .lb{position:fixed;inset:0;z-index:60;background:rgba(18,16,14,.86);display:grid;place-items:center;padding:24px;cursor:zoom-out}
.pj-cp .lb img,.pj-cp .lb video{max-height:86vh;width:auto;max-width:100%;border-radius:14px;box-shadow:var(--shadow-glow)}
.pj-cp .lb p{color:var(--on-dark-70);font-size:14px;margin-top:12px;text-align:center}

@media (prefers-reduced-motion:reduce){.pj-cp *{transition:none!important;animation:none!important}.pj-cp{scroll-behavior:auto}}

/* móvil (locodea-web, 2026-10-05): los tres botones del vídeo, en una línea y centrados dentro de la pantalla */
@media (max-width:640px){.pj-cp .vctl{left:8px;justify-content:center;gap:5px}.pj-cp .vctl button{white-space:nowrap;padding:6px 9px;font-size:11.5px}}

/* ---- apartados/agentes/css/agentes.css ---- */
/* Apartado «Agentes» (Copilot Studio) — estilos propios. Los tokens y componentes comunes están en ../comun/css/locodea.css
   Portada, comparativa, flujo y casos de uso siguen el patrón de Portales para clientes para que los apartados se lean igual. */

/* ---------- avatar de agente: el símbolo oficial con el punto como cabeza, su cara y su accesorio ---------- */
.pj-cp .av{display:block;flex:none;overflow:visible}
.pj-cp .av .eye{transform-box:fill-box;transform-origin:50% 50%;animation:avBlink 5.2s infinite;animation-delay:var(--bd,0s)}
.pj-cp .av .acc{transform-box:fill-box;transform-origin:50% 80%}
.pj-cp .av .bdg{filter:drop-shadow(0 3px 6px rgba(80,55,30,.25))}
.pj-cp .av .bdg path,.pj-cp .av .bdg rect,.pj-cp .av .bdg circle:not(.bg){fill:none;stroke:var(--bronze-text);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
@keyframes avBlink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.12)}}
@keyframes avHop{0%,100%{transform:translateY(0)}35%{transform:translateY(-8px)}60%{transform:translateY(1px)}}
@keyframes avWave{0%,100%{transform:rotate(0) translateY(0)}25%{transform:rotate(-9deg) translateY(-3%)}75%{transform:rotate(9deg) translateY(-3%)}}
.pj-cp .hop{animation:avHop .6s var(--ease)}
.pj-cp .hop .acc,.pj-cp .waving .acc{animation:avWave .9s ease-in-out}

/* ---------- 1 · Portada + vídeo ---------- */
.pj-cp .hero{margin-top:16px;border-radius:var(--radius-xl);padding:80px 24px 0;overflow:hidden;position:relative;
  background:radial-gradient(60% 40% at 50% 100%,rgba(176,122,74,.45),transparent 70%),linear-gradient(180deg,var(--paper),var(--sand-2) 35%,var(--sand-3))}
.pj-cp .hero-logo{width:64px;height:64px;display:block;margin-inline:auto;filter:drop-shadow(0 10px 18px rgba(40,120,200,.2))}
.pj-cp .stage-video{max-width:1080px;margin:48px auto 0;perspective:1800px;position:relative}
.pj-cp .device.pj-tilt{--t:1;transform-origin:50% 100%;transform:rotateX(calc(var(--t) * 14deg)) scale(calc(1 - var(--t) * .05));transition:transform .08s linear;padding:10px;will-change:transform}
.pj-cp .device.pj-tilt .screen{border-radius:12px;box-shadow:0 0 0 1px rgba(27,24,22,.07)}
.pj-cp .hero-foot{height:56px}

@media (max-width:640px){.pj-cp .hero{padding:56px 16px 0}.pj-cp .hero-logo{width:52px;height:52px}.pj-cp .cta-crew .av{width:44px;height:44px}}

/* ---------- 2 · La misma pregunta, tres respuestas ---------- */
.pj-cp .cmp{display:grid;grid-template-columns:1fr 1fr 1.12fr;gap:16px;margin-top:48px;align-items:stretch}
.pj-cp .cmp-card{background:var(--sand-2);border-radius:var(--radius-xl);padding:16px 16px 24px;display:flex;flex-direction:column;gap:12px;transition:transform .35s var(--ease),box-shadow .35s}
.pj-cp .cmp-card:hover{transform:translateY(-4px)}
.pj-cp .cmp-card.hot{background:var(--paper);box-shadow:var(--shadow-lift),0 0 0 2px rgba(176,122,74,.35);transform:translateY(-10px)}
.pj-cp .cmp-card.hot:hover{transform:translateY(-14px)}
.pj-cp .cmp-card h3{font-size:26px;padding-inline:8px}
.pj-cp .cmp-tag{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;margin:4px 8px 0;font:500 13.5px/1.2 var(--font);color:var(--bronze-text);background:var(--bronze-soft);border-radius:var(--radius-pill);padding:7px 12px}
.pj-cp .cmp-tag img{width:18px;height:18px}
.pj-cp .cmp-vis{position:relative;background:var(--paper);border-radius:16px;box-shadow:var(--shadow-card);overflow:hidden;aspect-ratio:16/12;display:flex;flex-direction:column}
.pj-cp .mc-head{display:flex;align-items:center;gap:10px;padding:10px 12px;box-shadow:inset 0 -1px 0 var(--ink-5)}
.pj-cp .mc-head div{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.pj-cp .mc-head b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-cp .mc-head div>span{font-size:11px;color:var(--ink-45);display:flex;align-items:center;gap:5px}
.pj-cp .mc-head i.on{width:6px;height:6px;border-radius:50%;background:var(--ok)}
.pj-cp .mc-av{width:38px;height:38px;border-radius:10px;flex:none;display:grid;place-items:center;font:500 13px/1 var(--font)}
.pj-cp .mc-av.p{background:var(--sand);color:var(--bronze-text)}
.pj-cp .mc-av.g{background:var(--sand-2);color:var(--ink-45)}
.pj-cp .mc-av.g svg{width:16px;height:16px;fill:currentColor}
.pj-cp .mc-av.a{background:none}
.pj-cp .mc-badge{margin-left:auto;font:500 11px/1 var(--font);font-style:normal;color:#fff;background:var(--st-bad);border-radius:var(--radius-pill);padding:4px 7px}
.pj-cp .mc-body{flex:1;padding:10px 12px;display:flex;flex-direction:column;gap:7px;justify-content:flex-start}
.pj-cp .mc{max-width:88%;font-size:11.5px;line-height:1.4;padding:7px 10px;border-radius:12px;transition:opacity .4s var(--ease),transform .4s var(--ease)}
.pj-cp .mc.me{align-self:flex-end;background:var(--ink);color:#fff;border-bottom-right-radius:4px}
.pj-cp .mc.bot{align-self:flex-start;background:var(--sand-2);border-bottom-left-radius:4px;color:var(--ink-90)}
.pj-cp .mc.bot b{font-weight:500}
.pj-cp .mc-src{display:block;margin-top:5px;font-size:10px;color:var(--bronze-text)}
.pj-cp .mc-src::before{content:"↳ "}
.pj-cp .mc.act{align-self:flex-start;display:flex;align-items:center;gap:10px;background:#fff;box-shadow:var(--shadow-card);width:78%;justify-content:space-between}
.pj-cp .mc.act span{display:flex;flex-direction:column;font-weight:500}
.pj-cp .mc.act em{font-style:normal;font-weight:400;font-size:10px;color:var(--ink-45)}
.pj-cp .mc.act i{font-style:normal;font:500 10px/1 var(--font);color:#2f6b45;background:rgba(1,208,98,.12);border-radius:var(--radius-pill);padding:4px 7px}
.pj-cp .cmp:not(.play) .mc[data-d]{opacity:0;transform:translateY(6px)}
.pj-cp .cmp.play .mc[data-d="1"]{transition-delay:.9s}
.pj-cp .cmp.play .mc[data-d="2"]{transition-delay:1.9s}
.pj-cp .cmp.play .mc[data-d="3"]{transition-delay:2.8s}
.pj-cp .cmp-dl{margin:0;padding-inline:8px;display:flex;flex-direction:column;gap:10px}
.pj-cp .cmp-dl div{display:grid;grid-template-columns:128px 1fr;gap:10px;align-items:baseline}
.pj-cp .cmp-dl dt{font-size:13.5px;color:var(--ink-45)}
.pj-cp .cmp-dl dd{margin:0;font-size:15px;line-height:1.4;color:var(--ink-90)}
.pj-cp .cmp-eg{margin:auto 8px 0;font-size:13.5px;color:var(--ink-65);padding-top:12px;box-shadow:inset 0 1px 0 rgba(27,24,22,.08)}
.pj-cp .cmp-card.hot .cmp-eg{color:var(--bronze-text)}
.pj-cp .lgo{font-weight:600;letter-spacing:-.03em;color:var(--ink)}
.pj-cp .lgo b{color:var(--bronze);font-weight:600}
@media (max-width:980px){
  .pj-cp .cmp{grid-template-columns:1fr;max-width:560px;margin-inline:auto}
  .pj-cp .cmp-card.hot,.pj-cp .cmp-card.hot:hover{transform:none}
}
@media (max-width:420px){.pj-cp .cmp-dl div{grid-template-columns:1fr;gap:2px}}

/* ---------- 3 · Conoce a los agentes ---------- */
.pj-cp .team-pick{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin-top:40px}
.pj-cp .tp{border:0;background:var(--sand-2);border-radius:24px 24px 0 0;padding:18px 12px 16px;display:flex;flex-direction:column;align-items:center;gap:10px;text-align:center;color:inherit;transition:background .2s}
.pj-cp .tp:hover{background:#f4eee5}

.pj-cp .tp[aria-selected="true"]{background:var(--sand)}
.pj-cp .tp .av{transition:transform .35s var(--ease)}
.pj-cp .tp[aria-selected="true"] .av{transform:translateY(-3px) scale(1.06)}
.pj-cp .tp-name{display:flex;flex-direction:column;gap:3px;min-width:0}
.pj-cp .tp-name small{font:500 11.5px/1 var(--font);color:var(--ink-45);letter-spacing:-.01em}
.pj-cp .tp-name small .lgo{font-weight:600;color:var(--ink-65)}
.pj-cp .tp-name b{font:500 18px/1.15 var(--font);letter-spacing:-.025em;color:var(--ink-90)}
.pj-cp .tp-card{font-size:12.5px;line-height:1.35;color:var(--ink-65);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.7em}
.pj-cp .agent{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:36px;align-items:start;border-radius:0 0 var(--radius-xl) var(--radius-xl);background:var(--sand);padding:24px 28px 28px}
.pj-cp .team-pick .tp:first-child{border-top-left-radius:24px}
.pj-cp .ag-chat{min-width:0;display:flex;flex-direction:column;gap:12px}
.pj-cp .win{background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-lift);display:flex;flex-direction:column;height:520px;overflow:hidden}
.pj-cp .win-head{display:flex;gap:12px;align-items:center;padding:12px 16px;box-shadow:inset 0 -1px 0 var(--ink-5)}
.pj-cp .win-head>div{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.pj-cp .win-head b{font-size:15px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-cp .win-head>div>span{font-size:12.5px;color:var(--ink-45);display:flex;align-items:center;gap:6px}
.pj-cp .win-head>div>span i{width:7px;height:7px;border-radius:50%;background:var(--ok)}
.pj-cp .win-head em{font-style:normal}
.pj-cp .win-av{flex:none;display:block}
.pj-cp .win-ch{margin-left:auto;display:flex;gap:6px}
.pj-cp .win-ch img,.pj-cp .win-ch svg{width:26px;height:26px;padding:4px;border-radius:8px;background:var(--sand-2)}
.pj-cp .win-ch svg{fill:none;stroke:var(--bronze-text);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.pj-cp .win-body{flex:1;padding:18px;display:flex;flex-direction:column;gap:12px;overflow-y:auto;scrollbar-width:thin}
.pj-cp .win-input{margin:0 14px 14px;background:var(--sand-2);border-radius:var(--radius-pill);padding:8px 8px 8px 16px;font-size:14px;color:var(--ink-45);display:flex;justify-content:space-between;align-items:center;gap:10px}
.pj-cp .win-input span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-cp .win-input span.typed{color:var(--ink-90)}
.pj-cp .win-input i{flex:none;width:30px;height:30px;border-radius:50%;background:var(--ink);display:grid;place-items:center}
.pj-cp .win-input svg{width:16px;height:16px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pj-cp .msg{max-width:88%;border-radius:18px;padding:11px 14px;font-size:14.5px;line-height:1.45;animation:rise .45s var(--ease) both}
.pj-cp .msg.me{align-self:flex-end;background:var(--ink);color:#fff;border-bottom-right-radius:6px}
.pj-cp .msg.bot{align-self:flex-start;background:var(--sand-2);border-bottom-left-radius:6px}
.pj-cp .msg.bot b{font-weight:500}
.pj-cp .msg-who{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink-45);margin-bottom:4px}
.pj-cp .msg-src{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:12px;color:var(--ink-65);background:#fff;box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:5px 10px 5px 7px}
.pj-cp .msg-src img,.pj-cp .msg-src svg{width:15px;height:15px}
.pj-cp .msg-src svg{fill:none;stroke:var(--bronze-text);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pj-cp .mlist{margin:10px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:5px}
.pj-cp .mlist li::marker{color:var(--bronze-text);font-weight:500}
.pj-cp .mrows{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.pj-cp .mrows li{background:#fff;border-radius:12px;padding:9px 12px;display:grid;grid-template-columns:1fr auto;gap:2px 10px;align-items:center;box-shadow:var(--shadow-card)}
.pj-cp .mrows b{font-size:13.5px}
.pj-cp .mrows span{grid-column:1;font-size:12.5px;color:var(--ink-65);line-height:1.35}
.pj-cp .mrows em{grid-column:2;grid-row:1/3;font-style:normal;font:500 11.5px/1 var(--font);color:var(--ink-65);background:var(--sand-2);border-radius:var(--radius-pill);padding:5px 9px;white-space:nowrap;display:inline-flex;align-items:center;gap:6px}
.pj-cp .mrows em::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--sand-3)}
.pj-cp .mrows em.ok::before{background:var(--st-ok)}
.pj-cp .mrows em.warn::before{background:var(--warn)}
.pj-cp .mstep{display:grid;grid-template-columns:repeat(5,1fr);margin-top:12px;position:relative}
.pj-cp .mstep::before{content:"";position:absolute;left:10%;right:10%;top:6px;height:2px;background:linear-gradient(90deg,var(--ink) 0 62%,var(--sand-3) 62%)}
.pj-cp .mstep span{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:10.5px;color:var(--ink-45);text-align:center;position:relative}
.pj-cp .mstep i{width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px var(--sand-3)}
.pj-cp .mstep .done i{background:var(--ink);box-shadow:none}
.pj-cp .mstep .now{color:var(--bronze-text);font-weight:500}
.pj-cp .mstep .now i{background:var(--bronze);box-shadow:0 0 0 4px var(--bronze-soft)}
.pj-cp .act{align-self:flex-start;width:min(360px,88%);display:flex;align-items:center;gap:12px;background:#fff;border-radius:16px;box-shadow:var(--shadow-lift);padding:12px 14px;animation:rise .45s var(--ease) both}
.pj-cp .act-ic{flex:none;width:38px;height:38px;border-radius:12px;background:var(--sand-2);display:grid;place-items:center}
.pj-cp .act-ic img,.pj-cp .act-ic svg{width:22px;height:22px}
.pj-cp .act-ic svg{fill:none;stroke:var(--bronze-text);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pj-cp .act-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.pj-cp .act-t b{font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-cp .act-t span{font-size:12.5px;color:var(--ink-45);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pj-cp .act-st{flex:none;font:500 12px/1 var(--font);border-radius:var(--radius-pill);padding:6px 10px;display:inline-flex;align-items:center;gap:6px;background:rgba(254,188,46,.16);color:#8a6410;transition:background .3s,color .3s}
.pj-cp .act-st::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;animation:blink 1s infinite}
.pj-cp .act-st.done{background:rgba(1,208,98,.12);color:#2f6b45}
.pj-cp .act-st.done::before{animation:none}
.pj-cp .typing{display:inline-flex;gap:4px}
.pj-cp .typing i{width:6px;height:6px;border-radius:50%;background:var(--ink-45);animation:blink 1s infinite}
.pj-cp .typing i:nth-child(2){animation-delay:.15s}.pj-cp .typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{50%{opacity:.25}}
.pj-cp .ag-sugg{display:flex;flex-wrap:wrap;gap:8px}
.pj-cp .ag-sugg button{border:0;background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:9px 14px;font:500 13.5px/1.25 var(--font);color:var(--ink-90);text-align:left;transition:box-shadow .2s,background .2s}
.pj-cp .ag-sugg button:hover{box-shadow:0 0 0 1px rgba(176,122,74,.55)}
.pj-cp .ag-sugg button[aria-pressed="true"]{background:var(--ink);color:#fff;box-shadow:none}
.pj-cp .ag-info{display:flex;flex-direction:column;gap:12px;min-width:0;padding-top:6px}
.pj-cp .ag-id{display:flex;align-items:center;gap:16px}
.pj-cp .ag-big{display:block;flex:none}
.pj-cp .ag-area{font:500 13.5px/1.2 var(--font);color:var(--ink-45)}
.pj-cp .ag-area .lgo{color:var(--ink-65)}
.pj-cp .ag-id h3{font-size:clamp(30px,3vw,40px);letter-spacing:-.04em}
.pj-cp .ag-lead{font:500 19px/1.35 var(--font);letter-spacing:-.015em;color:var(--ink-90)}
.pj-cp .ag-desc{color:var(--ink-65);font-size:15px;line-height:1.5}
.pj-cp .ag-info .qlabel{margin-top:4px}
.pj-cp .ag-info .qlist{gap:8px}
.pj-cp .ag-info .qlist li{font-size:14.5px;line-height:1.4}
.pj-cp .ag-meta{margin:4px 0 0;display:flex;flex-direction:column;gap:10px;padding-top:14px;box-shadow:inset 0 1px 0 rgba(27,24,22,.08)}
.pj-cp .ag-meta div{display:grid;grid-template-columns:76px 1fr;gap:10px;align-items:center}
.pj-cp .ag-meta dt{font:500 13px/1.3 var(--font);color:var(--ink-45)}
.pj-cp .ag-meta dd{margin:0;font-size:14px;line-height:1.4;color:var(--ink-90);display:flex;flex-wrap:wrap;gap:6px}
.pj-cp .ag-meta dd .pl{display:inline-flex;align-items:center;gap:6px;font:500 12.5px/1 var(--font);color:var(--ink-65);background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:6px 10px 6px 7px}
.pj-cp .ag-meta dd .pl img,.pj-cp .ag-meta dd .pl svg{width:16px;height:16px}
.pj-cp .ag-meta dd .pl svg{fill:none;stroke:var(--bronze-text);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:1060px){
  .pj-cp .agent{grid-template-columns:1fr;gap:24px;padding:16px}
  .pj-cp .team-pick{display:flex;overflow-x:auto;scrollbar-width:none}
  .pj-cp .team-pick::-webkit-scrollbar{display:none}
  .pj-cp .tp{flex:0 0 168px}
  .pj-cp .ag-info{order:-1}
}
@media (max-width:640px){.pj-cp .win{height:480px}.pj-cp .ag-meta div{grid-template-columns:1fr;gap:6px}.pj-cp .win-ch{display:none}}

/* ---------- 4 · Con cabeza: banda clara y compacta ---------- */
.pj-cp .safe-band{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,2fr);gap:40px;align-items:center;background:var(--sand-2);border-radius:var(--radius-xl);padding:36px 40px}
.pj-cp .safe-head{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.pj-cp .safe-head h3{font-size:clamp(26px,2.6vw,32px)}
.pj-cp .safe-head h3 span{color:var(--bronze-text)}
.pj-cp .safe-head p{color:var(--ink-65);font-size:15px}
.pj-cp .safe{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pj-cp .safe article{background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-md);padding:16px 18px;display:grid;grid-template-columns:auto 1fr;gap:2px 14px;align-items:start}
.pj-cp .safe b{font:500 15.5px/1.3 var(--font);letter-spacing:-.01em;color:var(--ink-90)}
.pj-cp .safe p{grid-column:2;color:var(--ink-65);font-size:14px;line-height:1.45}
.pj-cp .sf-ic{grid-row:span 2;width:38px;height:38px;border-radius:12px;background:var(--bronze-soft);display:grid;place-items:center}
.pj-cp .sf-ic svg{width:20px;height:20px;fill:none;stroke:var(--bronze-text);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:980px){.pj-cp .safe-band{grid-template-columns:1fr;gap:24px;padding:28px 24px}}
@media (max-width:560px){.pj-cp .safe{grid-template-columns:1fr}}

/* ---------- 6 · Llamada final ---------- */
.pj-cp .cta-crew{display:flex;justify-content:center;margin-bottom:4px}
.pj-cp .cta-crew{gap:10px}
.pj-cp .cta-crew .av:nth-child(odd){transform:translateY(8px)}

@keyframes rise{from{opacity:.4;transform:translateY(10px)}}

/* móvil (locodea-web, 2026-10-05): en la burbuja del chat el estado va debajo y no estrecha el texto; las etapas,
   solo con el nombre de la actual */
@media (max-width:480px){.pj-cp .mrows li{grid-template-columns:minmax(0,1fr)}.pj-cp .mrows em{grid-column:1;grid-row:auto;justify-self:start;margin-top:4px}}
@media (max-width:640px){.pj-cp .mstep{grid-template-columns:repeat(5,minmax(0,1fr))}.pj-cp .mstep span:not(.now){font-size:0;gap:0}.pj-cp .mstep span.now{white-space:nowrap}}

/* al pasar el ratón por un agente, saluda: sube la mano y la mueve (y su accesorio se balancea) */
.pj-cp .av .mano{opacity:0;transform-box:view-box;transform-origin:452px 620px;transform:translateY(90px) rotate(10deg);transition:opacity .25s ease,transform .45s cubic-bezier(.3,1.4,.5,1)}
.pj-cp .tp:hover .av .mano,.pj-cp .av:hover .mano,.pj-cp .cta-crew .av:hover .mano{opacity:1;transform:none;animation:avMano 1.1s ease-in-out .3s infinite}
.pj-cp .tp:hover .av .acc,.pj-cp .av:hover .acc{animation:avWave 1.1s ease-in-out .15s}
.pj-cp .tp:hover .av,.pj-cp .cta-crew .av:hover{transform:translateY(-3px) rotate(-2deg)}
@keyframes avMano{0%,100%{transform:rotate(0)}25%{transform:rotate(-14deg)}50%{transform:rotate(6deg)}75%{transform:rotate(-10deg)}}
@media (prefers-reduced-motion:reduce){.pj-cp .tp:hover .av .mano,.pj-cp .av:hover .mano{animation:none}}

/* Generado por build/ a partir de apartados/comun/css/locodea.css, apartados/modificaciones/css/modificaciones.css. No editar a mano. */
/* ---- aislamiento frente a css/style.css (generado) ---- */
.pj-md .bs{align-items:revert;height:revert}
.pj-md .btn{position:revert;justify-content:revert;height:revert;cursor:revert;font-size:revert}
.pj-md .chev{width:revert;height:revert;opacity:revert;transform:revert;transition:revert}
.pj-md .cta{display:revert;grid-template-columns:revert;gap:revert;align-items:revert}
.pj-md .device{width:revert;max-width:revert;overflow:revert;transform:revert}
.pj-md .dn{text-align:revert;padding-block:initial;font-weight:revert;letter-spacing:revert;text-transform:revert}
.pj-md .done{display:revert;gap:revert;align-items:revert;padding:initial;border-radius:revert;background:revert;font-size:revert;color:revert;line-height:revert}
.pj-md .dot{display:revert;width:revert;height:revert;border-radius:revert;background:revert;flex:revert;margin-top:initial}
.pj-md .go{display:revert;align-items:revert;gap:revert;font-size:revert;font-weight:revert;color:revert;margin-top:initial}
.pj-md .hero{isolation:revert;display:revert;flex-direction:revert;align-items:revert;text-align:revert;gap:revert}
.pj-md .hero::after{content:none}
.pj-md .hero::before{content:none}
.pj-md .lg{padding:initial}
.pj-md .link{font-size:revert}
.pj-md .logo{display:revert;align-items:revert;gap:revert}
.pj-md .nav-in{pointer-events:revert;transition:revert;z-index:revert;position:revert}
.pj-md .nav{left:revert;right:revert;padding:initial;pointer-events:revert}
.pj-md .ph{width:revert;height:revert;border:revert;border-radius:revert;background:revert;padding:initial;flex-direction:revert;transform:revert}
.pj-md .steps{position:revert;grid-template-columns:revert;padding-top:initial;margin-top:initial}
.pj-md .step{flex-direction:revert;font-size:revert;color:revert}
.pj-md .st{display:revert;align-items:revert;gap:revert;font-size:revert;color:revert}
.pj-md .sub{text-wrap:revert;margin-inline:initial;margin:initial;position:revert;z-index:revert}
.pj-md .tbl{width:revert;border-collapse:revert;font-size:revert}
.pj-md .th{height:revert;background:revert;color:revert;font-size:revert;font-weight:revert;position:revert;border-radius:revert;overflow:revert;display:revert;place-items:revert}
.pj-md .tilt{position:revert;transform:revert;transform-style:revert;transition:revert;will-change:revert}
.pj-md .tilt::after{content:none}
.pj-md .tr{fill:revert;stroke:revert;stroke-width:revert}
.pj-md .vctl{z-index:revert}
/* ---- apartados/comun/css/locodea.css ---- */
/* locodea. — sistema de diseño «Web Design - locodea» (paleta Bronce).
   Un solo tema (claro), por decisión del sistema. COMPARTIDO por todos los apartados de la web (../comun/css/). */

.pj-md{
  --paper:#fff; --ink:#1b1816; --ink-90:rgba(27,24,22,.9); --ink-65:rgba(27,24,22,.65); --ink-45:rgba(27,24,22,.45); --ink-10:rgba(27,24,22,.1); --ink-5:rgba(27,24,22,.05);
  --bronze:#b07a4a; --bronze-hover:#9c6a3e; --bronze-deep:#8e5e34; --bronze-text:#8a5a30; --bronze-light:#d9b48c; --bronze-soft:rgba(176,122,74,.14);
  --sand:#f1ebe2; --sand-2:#f8f4ee; --sand-3:#e8dccb; --dark:#1b1816; --dark-deep:#12100e; --on-dark:#fff; --on-dark-70:rgba(255,255,255,.7); --on-dark-45:rgba(255,255,255,.45);
  --ok:#01d062; --warn:#febc2e;
  /* semáforo de los paneles (visuales de datos, nunca texto de interfaz) */
  --st-ok:#4f8a64; --st-mid:#d19a3e; --st-bad:#c2553f;
  --radius-sm:12px; --radius-md:20px; --radius-lg:24px; --radius-xl:32px; --radius-pill:99px;
  --shadow-ring:0 0 0 1px rgba(27,24,22,.05);
  --shadow-card:0 0 0 1px rgba(27,24,22,.05),0 1px 2px rgba(0,0,0,.03);
  --shadow-lift:0 24px 48px -16px rgba(80,55,30,.22),0 0 0 1px rgba(27,24,22,.05);
  --shadow-glow:0 0 0 1px rgba(255,255,255,.1),0 40px 80px -30px rgba(176,122,74,.35);
  --font:"DM Sans","Inter","Helvetica Neue",Arial,sans-serif;
  --container:1240px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
.pj-md *{box-sizing:border-box}
.pj-md [hidden]{display:none!important}
.pj-md{scroll-behavior:smooth}
.pj-md{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.5 var(--font);-webkit-font-smoothing:antialiased;padding-inline:16px;overflow-x:hidden}
.pj-md h1,.pj-md h2,.pj-md h3,.pj-md h4{font-weight:500;line-height:1.08;letter-spacing:-.04em;margin:0;text-wrap:balance;color:var(--ink-90)}
.pj-md h1{font-size:clamp(44px,7vw,76px)}
/* la segunda parte del titular de cada apartado, en bronce con brillo, como en Power Apps y Power Automate (.lx-g) */
.pj-md .hero h1 em{font-style:normal;background:linear-gradient(100deg,#b9834f 0%,#8e5e34 28%,#e6c39b 48%,#a8723f 64%,#8e5e34 82%,#c99464 100%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:h-brillo 7s linear infinite}
@keyframes h-brillo{from{background-position:0 0}to{background-position:-240% 0}}
@media (prefers-reduced-motion:reduce){.pj-md .hero h1 em{animation:none}}
.pj-md h2{font-size:clamp(36px,5vw,56px)}
.pj-md h3{font-size:clamp(26px,3.4vw,34px);letter-spacing:-.03em}
.pj-md h4{font-size:20px;line-height:1.2;letter-spacing:-.02em}
.pj-md p{margin:0}
.pj-md b,.pj-md strong{font-weight:500}
.pj-md a{color:inherit}
.pj-md button,.pj-md input,.pj-md select{font:inherit;color:inherit}
.pj-md button{cursor:pointer}
.pj-md :focus-visible{outline:2px solid var(--bronze);outline-offset:3px}
.pj-md img,.pj-md video,.pj-md canvas{max-width:100%;display:block}
.pj-md .num{font-variant-numeric:tabular-nums}

.pj-md .wrap{max-width:var(--container);margin-inline:auto}
.pj-md .logo{font-weight:600;letter-spacing:-.03em;font-size:22px;line-height:1;text-decoration:none;color:var(--ink)}
.pj-md .logo b{color:var(--bronze);font-weight:600}
.pj-md b.dot{color:var(--bronze);font-weight:inherit}   /* el punto de «locodea.» dentro de un texto */
.pj-md section{padding-block:48px}

/* chip → titular → entradilla → botones */
.pj-md .head{display:flex;flex-direction:column;align-items:center;text-align:center;gap:20px;max-width:780px;margin-inline:auto}
.pj-md .head.left{align-items:flex-start;text-align:left;margin-inline:0}
.pj-md .chip{display:inline-flex;align-items:center;gap:8px;font:500 13.5px/1.2 var(--font);color:var(--bronze-text);background:var(--paper);box-shadow:var(--shadow-card);padding:8px 14px;border-radius:var(--radius-pill)}
.pj-md .sub{font-size:18px;line-height:1.5;color:var(--ink-65);max-width:56ch}
.pj-md .btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.pj-md .head.left .btns{justify-content:flex-start}
.pj-md .btn{display:inline-flex;align-items:center;gap:8px;font:500 15px/1.2 var(--font);padding:14px 22px;border-radius:var(--radius-pill);border:0;text-decoration:none;transition:background .2s,transform .2s;white-space:nowrap}
.pj-md .btn:active{transform:scale(.98)}
.pj-md .btn-ink{background:var(--ink);color:var(--on-dark)}
.pj-md .btn-ink:hover{background:#2e2925}
.pj-md .btn-ghost{background:var(--bronze-soft);color:var(--bronze-text)}
.pj-md .btn-ghost:hover{background:rgba(176,122,74,.22)}
.pj-md .btn-bronze{background:var(--bronze);color:var(--on-dark)}
.pj-md .btn-bronze:hover{background:var(--bronze-hover)}
.pj-md .btn-sm{padding:10px 16px;font-size:14px}
.pj-md .link{color:var(--bronze-text);font-weight:500;text-decoration:none;display:inline-flex;gap:6px;align-items:center}
.pj-md .link:hover{text-decoration:underline;text-underline-offset:4px}

/* ---------- navegación ---------- */
.pj-md .nav{position:sticky;top:calc(env(safe-area-inset-top,0px) + 12px);z-index:30;margin-top:12px}
.pj-md .nav-in{max-width:var(--container);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);box-shadow:var(--shadow-card);border-radius:var(--radius-pill);padding:10px 10px 10px 22px}
.pj-md .nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.pj-md .nav li a{display:block;font:500 15px/1.2 var(--font);color:var(--ink-65);text-decoration:none;padding:10px 14px;border-radius:var(--radius-pill)}
.pj-md .nav li a:hover{color:var(--ink)}
.pj-md .nav li a[aria-current]{color:var(--ink);background:var(--sand)}
.pj-md .nav .btn{padding:11px 18px}
@media (max-width:900px){.pj-md .nav ul{display:none}}

/* ---------- dispositivos ---------- */
.pj-md .device{background:var(--paper);border-radius:var(--radius-md);box-shadow:var(--shadow-lift);padding:10px}
.pj-md .device-bar{display:flex;align-items:center;gap:6px;padding:4px 6px 10px}
.pj-md .device-bar i{width:10px;height:10px;border-radius:50%;background:var(--sand-3)}
.pj-md .device-bar span{margin-left:10px;font:500 12px/1 var(--font);color:var(--ink-45);background:var(--sand-2);border-radius:var(--radius-pill);padding:6px 12px;flex:1;max-width:320px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.pj-md .screen{position:relative;border-radius:12px;overflow:hidden;background:var(--sand-2);aspect-ratio:16/9}
.pj-md .screen video,.pj-md .screen img{width:100%;height:100%;object-fit:cover}
.pj-md .vctl{position:absolute;right:14px;bottom:14px;display:flex;gap:8px}
.pj-md .vctl button{border:0;background:rgba(18,16,14,.72);color:var(--on-dark);backdrop-filter:blur(8px);font:500 13.5px/1 var(--font);padding:9px 14px;border-radius:var(--radius-pill)}
.pj-md .vctl button:hover{background:rgba(18,16,14,.9)}
@media (max-width:640px){.pj-md .vctl{right:8px;bottom:8px}.pj-md .vctl button{padding:7px 11px;font-size:12.5px}}

/* ---------- tarjetas, píldoras, listas ---------- */
.pj-md .card{background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-lg);padding:24px;display:flex;flex-direction:column;gap:10px}
.pj-md .card p{color:var(--ink-65)}
.pj-md .ic{width:40px;height:40px;border-radius:var(--radius-sm);background:var(--bronze-soft);color:var(--bronze-text);display:grid;place-items:center;font:500 15px/1 var(--font);flex:none}
.pj-md .pills{display:flex;flex-wrap:wrap;gap:8px}
.pj-md .pill{font:500 13.5px/1.2 var(--font);padding:7px 12px;border-radius:var(--radius-pill);background:var(--paper);box-shadow:var(--shadow-card);color:var(--ink-65)}
.pj-md .pill.hot{background:var(--bronze-soft);box-shadow:none;color:var(--bronze-text)}
.pj-md .qlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.pj-md .qlist li{display:flex;gap:12px;align-items:baseline;color:var(--ink-90)}
.pj-md .qlist li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--bronze);transform:translateY(-2px)}
.pj-md .qlabel{font:500 13.5px/1.2 var(--font);color:var(--ink-45)}
.pj-md .panel-sand{border-radius:var(--radius-xl);background:var(--sand);padding:48px}
@media (max-width:760px){.pj-md .panel-sand{padding:24px}}

/* ---------- panel oscuro (uno por página) ---------- */
.pj-md .night{border-radius:var(--radius-xl);background:radial-gradient(55% 45% at 50% 100%,rgba(176,122,74,.35),transparent 70%),var(--dark);color:var(--on-dark);padding:96px 48px}
.pj-md .night h2,.pj-md .night h3,.pj-md .night h4{color:var(--on-dark)}
.pj-md .night .chip{background:rgba(255,255,255,.06);box-shadow:0 0 0 1px rgba(255,255,255,.1);color:var(--bronze-light)}
.pj-md .night .sub{color:var(--on-dark-70)}
.pj-md .grad{background:linear-gradient(90deg,#ebd0ae,var(--bronze) 45%,var(--bronze-deep));-webkit-background-clip:text;background-clip:text;color:transparent}
@media (max-width:980px){.pj-md .night{padding:64px 20px}}

/* ---------- preguntas frecuentes ---------- */
.pj-md .faq{max-width:820px;margin:48px auto 0;display:flex;flex-direction:column;gap:12px}
.pj-md .faq details{background:var(--paper);box-shadow:var(--shadow-card);border-radius:var(--radius-lg);padding:0 24px}
.pj-md .faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;font:500 18px/1.3 var(--font);letter-spacing:-.01em}
.pj-md .faq summary::-webkit-details-marker{display:none}
.pj-md .faq summary::after{content:"+";flex:none;width:32px;height:32px;border-radius:50%;background:var(--sand);display:grid;place-items:center;font-size:20px;line-height:1;color:var(--bronze-text);transition:transform .25s}
.pj-md .faq details[open] summary::after{transform:rotate(45deg)}
.pj-md .faq details p{color:var(--ink-65);padding-bottom:22px;max-width:65ch}

/* ---------- llamada final + pie ---------- */
.pj-md .cta{border-radius:var(--radius-xl);background:linear-gradient(134deg,var(--sand),#c99b70 50%,var(--sand) 92%);padding:96px 24px;text-align:center}
.pj-md .cta .sub{color:var(--ink-90)}
.pj-md footer{max-width:var(--container);margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-block:32px 48px;color:var(--ink-45);font-size:14px}

/* ---------- notas de diseño (solo equipo) ---------- */
.pj-md .note{max-width:var(--container);margin:0 auto 16px;background:#fffaf2;border-radius:var(--radius-md);box-shadow:0 0 0 1px rgba(176,122,74,.35);padding:16px 20px;display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:14.5px;color:var(--ink-90);text-align:left}
.pj-md .note b{grid-row:span 2;font:500 12px/1 var(--font);letter-spacing:.06em;text-transform:uppercase;color:var(--bronze-text);background:var(--bronze-soft);padding:7px 10px;border-radius:var(--radius-pill);align-self:start}
.pj-md .note ul{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.pj-md .night .note{background:rgba(255,255,255,.05);box-shadow:0 0 0 1px rgba(217,180,140,.4);color:var(--on-dark-70)}
.pj-md .night .note b{color:var(--bronze-light);background:rgba(217,180,140,.12)}
body:not(.notes-on) .pj-md .note,body:not(.notes-on) .pj-md .only-notes{display:none}
.pj-md .notes-toggle{position:fixed;right:16px;bottom:calc(env(safe-area-inset-bottom,0px) + 16px);z-index:40;border:0;background:var(--ink);color:var(--on-dark);font:500 14px/1 var(--font);padding:12px 16px;border-radius:var(--radius-pill);box-shadow:0 12px 30px -10px rgba(0,0,0,.4);display:flex;align-items:center;gap:10px}
.pj-md .notes-toggle i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35)}
body.notes-on .pj-md .notes-toggle i{background:var(--bronze)}

/* ---------- visor ampliado ---------- */
.pj-md .lb{position:fixed;inset:0;z-index:60;background:rgba(18,16,14,.86);display:grid;place-items:center;padding:24px;cursor:zoom-out}
.pj-md .lb img,.pj-md .lb video{max-height:86vh;width:auto;max-width:100%;border-radius:14px;box-shadow:var(--shadow-glow)}
.pj-md .lb p{color:var(--on-dark-70);font-size:14px;margin-top:12px;text-align:center}

@media (prefers-reduced-motion:reduce){.pj-md *{transition:none!important;animation:none!important}.pj-md{scroll-behavior:auto}}

/* móvil (locodea-web, 2026-10-05): los tres botones del vídeo, en una línea y centrados dentro de la pantalla */
@media (max-width:640px){.pj-md .vctl{left:8px;justify-content:center;gap:5px}.pj-md .vctl button{white-space:nowrap;padding:6px 9px;font-size:11.5px}}

/* ---- apartados/modificaciones/css/modificaciones.css ---- */
/* Apartado «Modificaciones» (Business Central y Dynamics 365 Sales) — estilos propios.
   Los tokens y componentes comunes están en ../comun/css/locodea.css. Portada y FAQ siguen el patrón de Portales para clientes. */

/* ---------- 1 · Portada + vídeo ---------- */
.pj-md .hero{margin-top:16px;border-radius:var(--radius-xl);padding:80px 24px 0;overflow:hidden;position:relative;
  background:radial-gradient(60% 40% at 50% 100%,rgba(176,122,74,.45),transparent 70%),linear-gradient(180deg,var(--paper),var(--sand-2) 35%,var(--sand-3))}
.pj-md .hero-logos{display:flex;gap:14px;justify-content:center}
.pj-md .hero-logos img{width:60px;height:60px;filter:drop-shadow(0 10px 18px rgba(30,90,140,.18))}
.pj-md .stage-video{max-width:1080px;margin:48px auto 0;perspective:1800px;position:relative}
.pj-md .device.pj-tilt{--t:1;transform-origin:50% 100%;transform:rotateX(calc(var(--t) * 14deg)) scale(calc(1 - var(--t) * .05));transition:transform .08s linear;padding:10px;will-change:transform}
.pj-md .device.pj-tilt .screen{border-radius:12px;box-shadow:0 0 0 1px rgba(27,24,22,.07)}
.pj-md .hero-foot{height:56px}
@media (max-width:640px){.pj-md .hero{padding:56px 16px 0}.pj-md .hero-logos img{width:48px;height:48px}}

/* ---------- 2 · Del campo al proceso (taller interactivo) ---------- */
.pj-md .lab{margin-top:40px;display:grid;grid-template-columns:minmax(0,370px) minmax(0,1fr);gap:28px;align-items:start;background:var(--sand);border-radius:var(--radius-xl);padding:24px}
.pj-md .lab-side{display:flex;flex-direction:column;gap:14px}
.pj-md .seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:var(--paper);border-radius:var(--radius-pill);padding:4px;box-shadow:var(--shadow-card)}
.pj-md .seg button{border:0;background:transparent;border-radius:var(--radius-pill);padding:10px 12px;font:500 14.5px/1 var(--font);color:var(--ink-65);display:flex;align-items:center;justify-content:center;gap:8px;transition:background .2s,color .2s;white-space:nowrap}
.pj-md .seg button img{width:20px;height:20px}
.pj-md .seg button[aria-pressed="true"]{background:var(--ink);color:#fff}
.pj-md .steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.pj-md .step{border:0;width:100%;text-align:left;background:var(--sand-2);border-radius:var(--radius-lg);padding:16px 18px;display:grid;grid-template-columns:auto 1fr;gap:4px 14px;align-items:start;transition:background .25s,box-shadow .25s}
.pj-md .step:hover{background:#fbf8f3}
.pj-md .step .n{grid-row:span 2;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font:500 14px/1 var(--font);background:var(--paper);color:var(--ink-45);box-shadow:var(--shadow-card);transition:background .25s,color .25s}
.pj-md .step b{font:500 18px/1.25 var(--font);letter-spacing:-.02em;color:var(--ink-90)}
.pj-md .step .d{font-size:14px;line-height:1.45;color:var(--ink-65)}
.pj-md .step .eg{grid-column:2;display:none;flex-direction:column;gap:6px;margin-top:8px;list-style:none;padding:0}
.pj-md .step .eg li{display:flex;gap:10px;align-items:baseline;font-size:13.5px;color:var(--ink-90)}
.pj-md .step .eg li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--bronze);transform:translateY(-2px)}
.pj-md .step[aria-pressed="true"]{background:var(--paper);box-shadow:var(--shadow-lift)}
.pj-md .step[aria-pressed="true"] .n{background:var(--bronze);color:#fff;box-shadow:none}
.pj-md .step[aria-pressed="true"] .eg{display:flex}
.pj-md .ba{display:flex;align-items:center;gap:12px;font-size:14px;color:var(--ink-65);padding:4px 6px}
.pj-md .sw{border:0;width:48px;height:28px;border-radius:99px;background:var(--sand-3);position:relative;flex:none;transition:background .25s;padding:0}
.pj-md .sw i{position:absolute;left:3px;top:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .25s var(--ease)}
.pj-md .sw[aria-checked="true"]{background:var(--bronze)}
.pj-md .sw[aria-checked="true"] i{transform:translateX(20px)}
.pj-md .ba b{color:var(--ink);font-weight:500}
.pj-md .lab-view{min-width:0}
.pj-md .lab-view .device{padding:8px}
.pj-md .lab-view .device-bar{padding:2px 4px 8px}
.pj-md .device-bar span img{width:14px;height:14px;display:inline-block;vertical-align:-2px;margin-right:6px}
.pj-md .mk-wrap{position:relative;aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--ink-5)}
.pj-md .lab-cap{font-size:12.5px;color:var(--ink-45);margin-top:8px;text-align:center}
@media (max-width:1000px){.pj-md .lab{grid-template-columns:1fr;padding:16px}.pj-md .lab-view{order:-1}}

/* maqueta: se dibuja a 960 × 600 y se escala con --k */
.pj-md .mk{position:absolute;left:0;top:0;width:960px;height:600px;transform:scale(var(--k,1));transform-origin:0 0;font-size:13px;color:var(--ink);background:#fff}
.pj-md .mk [data-new]{transition:opacity .45s var(--ease),transform .45s var(--ease)}
.pj-md .mk .new-ring{box-shadow:0 0 0 1.5px rgba(176,122,74,.55);background:var(--bronze-soft)}
.pj-md .ntag{font-style:normal;font:500 10.5px/1 var(--font);background:var(--bronze);color:#fff;border-radius:99px;padding:4px 7px;margin-left:8px;white-space:nowrap;letter-spacing:0}
.pj-md .mk .crumb{position:absolute;left:26px;top:18px;font-size:12px;color:var(--ink-45)}
.pj-md .mk .ttl{position:absolute;left:26px;top:36px;font-size:24px;font-weight:500;letter-spacing:-.03em;white-space:nowrap;display:flex;align-items:center}
.pj-md .mk .acts{position:absolute;left:18px;top:76px;display:flex;gap:4px}
.pj-md .mk .act{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:9px;font-size:13px;white-space:nowrap;color:var(--ink-90)}
.pj-md .mk .act svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;color:var(--ink-65)}
.pj-md .mk .act img{width:15px;height:15px}
.pj-md .mk .act.nw{background:var(--bronze-soft);color:var(--bronze-text)}
.pj-md .mk .act.nw svg{color:var(--bronze-text)}
.pj-md .mk .act.hit{animation:press .5s var(--ease)}
@keyframes press{40%{transform:scale(.94)}}
.pj-md .mk .hr{position:absolute;left:0;right:0;top:116px;height:1px;background:var(--ink-5)}
.pj-md .mk .fth{position:absolute;left:26px;top:130px;font-size:15px;font-weight:500;letter-spacing:-.02em}
.pj-md .mk .fld{position:absolute;width:430px;height:30px;display:flex;align-items:center}
.pj-md .mk .fld>span{width:150px;font-size:12px;color:var(--ink-65);white-space:nowrap;display:flex;align-items:center}
.pj-md .mk .fld>b{flex:1;font-weight:400;font-size:13px;height:24px;display:flex;align-items:center;gap:7px;border-bottom:1px solid var(--ink-10);white-space:nowrap}
.pj-md .mk .fld.nf{border-radius:10px;padding:0 10px;margin-left:-10px;width:450px}
.pj-md .mk .sdot{width:7px;height:7px;border-radius:50%;background:var(--sand-3);flex:none;transition:background .3s}
.pj-md .mk .sdot.ok{background:var(--ok)}
.pj-md .mk .sdot.wn{background:var(--warn)}
.pj-md .mk .tg{width:34px;height:19px;border-radius:99px;background:var(--bronze);position:relative}
.pj-md .mk .tg::after{content:"";position:absolute;right:2px;top:2px;width:15px;height:15px;border-radius:50%;background:#fff}
.pj-md .mk .sech{position:absolute;left:26px;font-size:15px;font-weight:500;letter-spacing:-.02em}
.pj-md .mk .tbl{position:absolute;left:18px;right:18px}
.pj-md .mk .tr{display:flex;height:30px;align-items:center;border-bottom:1px solid var(--ink-5);font-size:12px}
.pj-md .mk .tr.th{height:26px;background:var(--sand-2);border-radius:7px;color:var(--ink-65);font-size:11.5px;border:0}
.pj-md .mk .tr span{padding:0 8px;white-space:nowrap;overflow:hidden;flex:none;display:flex;align-items:center;gap:6px}
.pj-md .mk .tr span.r{justify-content:flex-end}
.pj-md .mk .tot{position:absolute;right:26px;font-size:13px;color:var(--ink-65)}
.pj-md .mk .tot b{color:var(--ink);font-size:16px;margin-left:10px}
/* página nueva, encima */
.pj-md .mk .over{position:absolute;inset:0;background:#fff;transform:translateX(100%);transition:transform .6s var(--ease);z-index:3}
.pj-md .mk .fbox{position:absolute;right:18px;top:132px;width:220px;border-radius:14px;background:var(--sand-2);padding:14px 16px}
.pj-md .mk .fbox h6{margin:0 0 8px;font:500 13.5px/1.2 var(--font)}
.pj-md .mk .fbox p{display:flex;justify-content:space-between;font-size:12px;color:var(--ink-65);height:28px;align-items:center;border-bottom:1px solid var(--ink-5)}
.pj-md .mk .fbox p b{color:var(--ink);font-weight:500}
.pj-md .mk .ph{display:flex;gap:6px;margin-top:12px}
.pj-md .mk .ph i{flex:1;height:40px;border-radius:8px;background:var(--sand-3)}
/* proceso: panel lateral */
.pj-md .mk .flow{position:absolute;right:0;top:0;bottom:0;width:320px;background:var(--sand-2);box-shadow:-20px 0 40px -24px rgba(80,55,30,.35);transform:translateX(100%);transition:transform .6s var(--ease);z-index:4;padding:22px 20px;display:flex;flex-direction:column;gap:10px}
.pj-md .mk .flow h6{margin:0 0 4px;font:500 15px/1.2 var(--font);letter-spacing:-.02em}
.pj-md .mk .flow h6 + p{font-size:12px;color:var(--ink-45);margin-bottom:6px}
.pj-md .mk .fs{position:relative;display:grid;grid-template-columns:38px 1fr;gap:2px 12px;align-items:center;background:#fff;border-radius:14px;padding:10px 12px;box-shadow:var(--shadow-card);opacity:.35;transition:opacity .35s,box-shadow .35s}
.pj-md .mk .fs .fi{grid-row:span 2;width:38px;height:38px;border-radius:11px;background:var(--sand-2);display:grid;place-items:center;color:var(--bronze-text)}
.pj-md .mk .fs .fi img{width:22px;height:22px}
.pj-md .mk .fs .fi svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.pj-md .mk .fs b{font-size:13px;font-weight:500;line-height:1.25}
.pj-md .mk .fs span{font-size:11.5px;color:var(--ink-45)}
.pj-md .mk .fs.on{opacity:1}
.pj-md .mk .fs.now{box-shadow:0 0 0 1.5px var(--bronze),var(--shadow-card)}
.pj-md .mk .fs .ab{position:absolute;right:12px;top:50%;transform:translateY(-50%);font:500 11.5px/1 var(--font);background:var(--ink);color:#fff;border-radius:99px;padding:7px 11px}
.pj-md .mk .fs .ab.ok{background:var(--bronze)}

/* estados de la maqueta: data-p (bc|sales), data-s (1 campo · 2 página · 3 proceso), data-a (0 antes · 1 después) */
.pj-md .mk [data-new]{opacity:0}
.pj-md .mk[data-a="1"][data-s="1"] [data-new~="1"],.pj-md .mk[data-a="1"][data-s="2"] [data-new~="2"],.pj-md .mk[data-a="1"][data-s="3"] [data-new~="3"]{opacity:1}
.pj-md .mk[data-a="1"][data-s="2"] .over{transform:none}
.pj-md .mk[data-a="1"][data-s="3"] .flow{transform:none}
.pj-md .mk-bc,.pj-md .mk-sales{position:absolute;inset:0}
.pj-md .mk[data-p="bc"] .mk-sales,.pj-md .mk[data-p="sales"] .mk-bc{display:none}

/* Dynamics 365 Sales con el aspecto del Centro de ventas actual (Fluent): cabecera clara con buscador, mapa del sitio,
   barra de comandos, formulario sobre gris con tarjetas, flujo de proceso en puntos y escala de tiempo. */
.pj-md .mk-sales{background:#f5f5f5}
.pj-md .mk-sales svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.pj-md .ds-top{position:absolute;left:0;right:0;top:0;height:34px;background:#fff;box-shadow:inset 0 -1px 0 #e0e0e0;display:flex;align-items:center;gap:10px;padding:0 12px;font-size:12.5px;color:#242424;white-space:nowrap;z-index:6}
.pj-md .ds-top .waffle{width:13px;height:13px;background:radial-gradient(circle,#424242 1.2px,transparent 1.6px) 0 0/4.5px 4.5px;flex:none}
.pj-md .ds-top b{font-weight:600}
.pj-md .ds-top .sep{width:1px;height:16px;background:#d1d1d1}
.pj-md .ds-search{margin-left:118px;width:290px;height:24px;border-radius:4px;box-shadow:inset 0 0 0 1px #d1d1d1;display:flex;align-items:center;gap:6px;padding:0 9px;color:#707070;font-size:11.5px}
.pj-md .ds-search svg{width:13px;height:13px}
.pj-md .ds-ic{margin-left:auto;display:flex;gap:12px}
.pj-md .ds-ic i{width:14px;height:14px;border-radius:4px;box-shadow:inset 0 0 0 1.5px #616161}
.pj-md .ds-av{width:24px;height:24px;border-radius:50%;background:#e7d6c4;color:#6b4a2b;display:grid;place-items:center;font-size:10px;font-weight:600}
.pj-md .ds-nav{position:absolute;left:0;top:34px;bottom:0;width:150px;background:#fafafa;box-shadow:inset -1px 0 0 #e0e0e0;padding:8px 6px}
.pj-md .dn{height:27px;display:flex;align-items:center;gap:8px;padding:0 8px;border-radius:4px;font-size:11.5px;color:#424242;white-space:nowrap}
.pj-md .dn svg{width:14px;height:14px;flex:none;color:#616161}
.pj-md .dn.on{background:#ebebeb;color:#242424;font-weight:600;box-shadow:inset 3px 0 0 #0f6cbd}
.pj-md .dn.nw{color:var(--bronze-text);font-weight:500}
.pj-md .dn.nw svg{color:var(--bronze-text)}
.pj-md .dn .ntag{margin-left:4px;font-size:9.5px;padding:3px 6px}
.pj-md .dg{font-size:10.5px;font-weight:600;color:#616161;margin:10px 8px 3px}
.pj-md .ds-cmd{position:absolute;left:150px;right:0;top:34px;height:36px;background:#fff;box-shadow:inset 0 -1px 0 #e0e0e0;display:flex;align-items:center;gap:2px;padding:0 8px;z-index:2}
.pj-md .dc{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 8px;border-radius:4px;font-size:11.5px;color:#242424;white-space:nowrap;transition:transform .2s}
.pj-md .dc svg{width:14px;height:14px;color:#0f6cbd}
.pj-md .dc img{width:14px;height:14px}
.pj-md .dc.nw{background:var(--bronze-soft);color:var(--bronze-text);font-family:var(--font);font-weight:500;border-radius:6px}
.pj-md .dc.nw .ntag{font-size:9.5px;padding:3px 6px;margin-left:2px}
.pj-md .dc.more{color:#616161;font-size:14px}
.pj-md .dc.hit{animation:press .5s var(--ease)}
.pj-md .ds-msg{position:absolute;left:150px;right:0;top:70px;height:0;overflow:hidden;background:#f1faf1;box-shadow:inset 0 -1px 0 #9fd89f;display:flex;align-items:center;gap:8px;padding:0 14px;font-size:11.5px;color:#242424;transition:height .35s var(--ease);z-index:2}
.pj-md .ds-msg i{width:14px;height:14px;border-radius:50%;background:#107c10;flex:none;position:relative}
.pj-md .ds-msg i::after{content:"";position:absolute;left:4px;top:3.5px;width:5px;height:3px;border:solid #fff;border-width:0 0 1.5px 1.5px;transform:rotate(-45deg)}
.pj-md .ds-msg b{font-weight:600}
.pj-md .mk[data-a="1"][data-s="3"] .ds-msg.on{height:28px}
.pj-md .ds-form{position:absolute;left:150px;right:0;top:70px;bottom:0;transition:transform .35s var(--ease)}
.pj-md .mk[data-a="1"][data-s="3"] .ds-msg.on~.ds-form{transform:translateY(28px)}
.pj-md .ds-head{position:absolute;left:12px;right:12px;top:10px;height:122px;background:#fff;border-radius:8px;box-shadow:0 1px 2px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.04);padding:12px 14px}
.pj-md .ds-ttl{display:flex;align-items:baseline;gap:6px;white-space:nowrap}
.pj-md .ds-ttl b{font-size:17px;font-weight:600;color:#242424}
.pj-md .ds-ttl span{font-size:11.5px;color:#707070}
.pj-md .ds-sub{font-size:11px;color:#616161;margin-top:2px}
.pj-md .ds-hf{position:absolute;right:14px;top:12px;display:flex;gap:20px}
.pj-md .ds-hf>div{display:flex;flex-direction:column;gap:1px;padding-left:12px;box-shadow:inset 1px 0 0 #e0e0e0}
.pj-md .ds-hf b{font-size:12.5px;font-weight:600;color:#242424}
.pj-md .ds-hf span{font-size:10.5px;color:#616161}
.pj-md .ds-hf .own{flex-direction:row;align-items:center;gap:7px}
.pj-md .ds-hf .own>i{width:24px;height:24px;border-radius:50%;background:#d6e4f7;color:#0f548c;display:grid;place-items:center;font:600 9.5px/1 "Segoe UI",sans-serif;font-style:normal}
.pj-md .ds-hf .own div{display:flex;flex-direction:column}
.pj-md .ds-bpf{position:absolute;left:14px;right:14px;bottom:10px;height:44px;border-radius:6px;background:#fafafa;display:flex;align-items:center;gap:0;padding:0 12px}
.pj-md .ds-bpf .lbl{width:150px;flex:none;font-size:11px;font-weight:600;color:#242424;line-height:1.25}
.pj-md .ds-bpf .lbl small{display:block;font-weight:400;color:#707070;font-size:10px}
.pj-md .ds-st{flex:1;min-width:0;display:flex;align-items:center;gap:6px;font-size:11px;color:#616161;white-space:nowrap;position:relative;padding-left:22px;overflow:hidden;transition:flex .5s var(--ease),opacity .4s}
.pj-md .ds-st::before{content:"";position:absolute;left:3px;width:14px;top:50%;height:1.5px;background:#c7c7c7}
.pj-md .ds-st i{width:13px;height:13px;border-radius:50%;box-shadow:inset 0 0 0 1.5px #8a8a8a;background:#fff;flex:none;position:relative;z-index:1}
.pj-md .ds-st.done{color:#242424}
.pj-md .ds-st.done i{background:#0f6cbd;box-shadow:none}
.pj-md .ds-st.done i::after{content:"";position:absolute;left:3.5px;top:3px;width:5px;height:3px;border:solid #fff;border-width:0 0 1.5px 1.5px;transform:rotate(-45deg)}
.pj-md .ds-st.cur{color:#0f548c;font-weight:600}
.pj-md .ds-st.cur i{box-shadow:inset 0 0 0 4px #0f6cbd}
.pj-md .ds-st.nw{color:var(--bronze-text);font:500 11px/1 var(--font)}
.pj-md .ds-st.nw i{box-shadow:inset 0 0 0 4px var(--bronze)}
.pj-md .ds-st[data-new]{flex:0 0 0;padding:0}
.pj-md .mk[data-a="1"][data-s="3"] .ds-st.cur{color:#616161;font-weight:400}
.pj-md .mk[data-a="1"][data-s="3"] .ds-st.cur i{box-shadow:inset 0 0 0 1.5px #8a8a8a}
.pj-md .mk[data-a="1"][data-s="3"] .ds-st[data-new]{flex:1;padding-left:22px}
.pj-md .ds-tabs{position:absolute;left:24px;top:142px;display:flex;gap:18px;font-size:11.5px;color:#424242;white-space:nowrap}
.pj-md .ds-tabs b{font-weight:600;color:#242424;box-shadow:inset 0 -2px 0 #0f6cbd;padding-bottom:5px}
.pj-md .ds-card{position:absolute;top:168px;bottom:12px;background:#fff;border-radius:8px;box-shadow:0 1px 2px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.04);padding:12px 14px}
.pj-md .ds-card h6{margin:0 0 8px;font:600 12.5px/1.2 "Segoe UI",sans-serif;color:#242424;display:flex;align-items:center;gap:6px}
.pj-md .ds-card h6 .ntag{font-size:9.5px;padding:3px 7px}
.pj-md .ds-card.new-ring{background:#fffaf4;box-shadow:0 0 0 1.5px rgba(176,122,74,.6)}
.pj-md .ds-f{display:grid;grid-template-columns:96px 1fr;align-items:center;min-height:30px;gap:6px;font-size:11.5px}
.pj-md .ds-f>span{color:#424242}
.pj-md .ds-f>span i{color:#c50f1f;font-style:normal;margin-left:2px}
.pj-md .ds-f>b{font-weight:400;color:#242424;height:24px;display:flex;align-items:center;padding:0 6px;border-radius:4px;background:#fafafa;box-shadow:inset 0 -1px 0 #d1d1d1;white-space:nowrap;overflow:hidden}
.pj-md .ds-f>b.lk{color:#0f6cbd}
.pj-md .tl-plus{margin-left:auto;color:#0f6cbd;font-weight:400;font-size:15px}
.pj-md .ds-tsearch{height:24px;border-radius:4px;box-shadow:inset 0 0 0 1px #d1d1d1;font-size:11px;color:#707070;display:flex;align-items:center;padding:0 8px;margin-bottom:8px}
.pj-md .ds-tl{display:grid;grid-template-columns:26px 1fr auto;gap:8px;padding:8px 0;box-shadow:inset 0 -1px 0 #f0f0f0;align-items:start}
.pj-md .ds-tl>i{width:26px;height:26px;border-radius:50%;background:#ebf3fc;position:relative}
.pj-md .ds-tl>i::after{content:"";position:absolute;inset:8px;border-radius:2px;box-shadow:inset 0 0 0 1.5px #0f6cbd}
.pj-md .ds-tl>i.ml{background:#f1faf1}.pj-md .ds-tl>i.ml::after{box-shadow:inset 0 0 0 1.5px #107c10}
.pj-md .ds-tl>i.cl{background:#fdf3f4}.pj-md .ds-tl>i.cl::after{border-radius:50%;box-shadow:inset 0 0 0 1.5px #c50f1f}
.pj-md .ds-tl b{display:block;font-size:11px;font-weight:600;color:#242424}
.pj-md .ds-tl span{font-size:10.5px;color:#616161;line-height:1.35}
.pj-md .ds-tl em{font-style:normal;font-size:10px;color:#707070}
.pj-md .mk-sales .ds-view{left:150px;top:34px;background:#f5f5f5}
.pj-md .ds-view .ds-cmd{top:0}
.pj-md .ds-vt{position:absolute;left:16px;right:16px;top:48px;display:flex;align-items:center;gap:8px;white-space:nowrap}
.pj-md .ds-vt b{font-size:16px;font-weight:600;color:#242424}
.pj-md .ds-vt .chev{color:#424242;font-size:13px;margin-right:4px}
.pj-md .ds-filter{margin-left:auto;width:190px;height:24px;border-radius:4px;background:#fff;box-shadow:inset 0 0 0 1px #d1d1d1;font-size:11px;color:#707070;display:flex;align-items:center;padding:0 8px}
.pj-md .ds-grid{position:absolute;left:16px;right:16px;top:84px;background:#fff;border-radius:8px;box-shadow:0 1px 2px rgba(0,0,0,.08),0 0 0 1px rgba(0,0,0,.04);overflow:hidden}
.pj-md .gr{display:flex;align-items:center;height:34px;font-size:11.5px;color:#242424;box-shadow:inset 0 -1px 0 #f0f0f0}
.pj-md .gr.gh{height:32px;font-weight:600;color:#424242;box-shadow:inset 0 -1px 0 #e0e0e0}
.pj-md .gr>i{width:13px;height:13px;border-radius:3px;box-shadow:inset 0 0 0 1px #8a8a8a;margin:0 12px;flex:none}
.pj-md .gr>span{padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:none}
.pj-md .gr .lk{color:#0f6cbd}
.pj-md .ds-foot{position:absolute;left:16px;bottom:14px;font-size:11px;color:#616161}

/* aspecto del cliente web real de Business Central y de Sales (calcado de CRONUS ES en el sandbox).
   Imitan un producto de Microsoft: van en Segoe UI y con sus grises; lo nuevo sigue en bronce. */
.pj-md .mk{font-family:"Segoe UI","Segoe UI Web (West European)",-apple-system,BlinkMacSystemFont,Roboto,"Helvetica Neue",sans-serif;color:#323130}
.pj-md .mk .d365{position:absolute;left:0;right:0;top:0;height:32px;background:#000;color:#fff;display:flex;align-items:center;gap:12px;padding:0 14px;font-size:12.5px;font-weight:600;z-index:6;white-space:nowrap}
.pj-md .mk .waffle{width:13px;height:13px;background:radial-gradient(circle,#fff 1.2px,transparent 1.6px) 0 0/4.5px 4.5px;flex:none}
.pj-md .mk .d365 .sep{width:1px;height:16px;background:rgba(255,255,255,.45)}
.pj-md .mk .d365-r{margin-left:auto;font-weight:400;opacity:.8;font-size:11.5px}
.pj-md .mk-bc .crumb{top:44px;font-size:11.5px;color:#605e5c}
.pj-md .mk-bc .ttl{top:58px;font-size:27px;font-weight:300;letter-spacing:0;color:#323130}
.pj-md .mk .tabs{position:absolute;left:26px;top:104px;display:flex;gap:16px;font-size:12px;color:#323130;white-space:nowrap}
.pj-md .mk .tabs b{font-weight:400;color:#008489;box-shadow:inset 0 -2px 0 #008489;padding-bottom:3px}
.pj-md .mk .tabs .more{color:#605e5c;padding-left:14px;box-shadow:inset 1px 0 0 #c8c6c4}
.pj-md .mk-bc .acts{top:126px;left:18px}
.pj-md .mk .act{border-radius:2px;height:28px;font-size:12px;color:#323130}
.pj-md .mk .act svg{color:#008489}
.pj-md .mk .act.nw{border-radius:6px}
.pj-md .mk-bc .fth{position:absolute;left:26px;right:26px;top:170px;font-size:15px;font-weight:600;color:#323130;letter-spacing:0;padding-bottom:5px;box-shadow:inset 0 -1.5px 0 #323130;display:flex;justify-content:space-between;align-items:baseline}
.pj-md .mk-bc .fth span{font-size:10.5px;font-weight:400;color:#605e5c}
.pj-md .mk-bc .fld{width:438px;height:26px}
.pj-md .mk-bc .fld>span{width:178px;font-size:11.5px;color:#323130}
.pj-md .mk-bc .fld>span::after{content:"";flex:1;margin:0 8px 0 6px;border-bottom:1px dotted #a19f9d;transform:translateY(3px)}
.pj-md .mk-bc .fld>b{background:#f3f2f1;border:0;height:21px;padding:0 8px;border-radius:2px;font-size:12px;color:#323130}
.pj-md .mk-bc .fld>b.nobox{background:none;padding:0}
.pj-md .mk-bc .fld>b.st{color:#107c10;font-weight:600;background:none}
.pj-md .mk-bc .fld>b.st.wn{color:#986f0b}
.pj-md .mk-bc .fld.nf{width:458px;height:30px;padding:0 10px;margin:-2px 0 0 -10px;border-radius:8px}
.pj-md .mk-bc .fld.nf>b{background:#fff}
.pj-md .mk-bc .sech{left:26px;right:26px;font-size:14px;font-weight:600;letter-spacing:0;display:flex;gap:16px;align-items:baseline;padding-bottom:6px;box-shadow:inset 0 -1px 0 #edebe9}
.pj-md .mk-bc .sech span{font-weight:400;font-size:11.5px;color:#008489}
.pj-md .mk-bc .tr{font-size:11.5px;color:#323130;border-bottom:1px solid #edebe9;height:28px}
.pj-md .mk-bc .tr.th{background:none;border-radius:0;color:#605e5c;font-size:11px;box-shadow:inset 0 -1px 0 #c8c6c4;height:26px}
.pj-md .mk-bc .tot{font-size:11.5px;color:#605e5c}
.pj-md .mk-bc .tot b{font-weight:600;font-size:13px;color:#323130}
.pj-md .mk-bc .over{top:32px}
.pj-md .mk .lbar{position:absolute;left:18px;right:18px;top:12px;display:flex;align-items:center;gap:4px;font-size:12px;white-space:nowrap;padding-bottom:10px;box-shadow:inset 0 -1px 0 #edebe9}
.pj-md .mk .lbar b{font-weight:600;margin-right:4px}
.pj-md .mk .lbar .todo{color:#008489;margin-right:6px}
.pj-md .mk .lnk{color:#008489}
.pj-md .mk .ok{color:#107c10;font-weight:600}
.pj-md .mk .wn{color:#986f0b;font-weight:600}
.pj-md .mk-bc .fbox{top:60px;border-radius:4px;background:#faf9f8;box-shadow:inset 0 0 0 1px #edebe9}
.pj-md .mk .fbox h6{font-family:inherit;font-weight:600;font-size:13px}
.pj-md .mk-bc .flow{top:32px}
.pj-md .mk .flow h6,.pj-md .mk .fs b{font-family:var(--font)}
.pj-md .mk .ntag{font-family:var(--font)}

/* ---------- 3 · Impresiones con tu marca ---------- */
.pj-md .docs{margin-top:40px;display:grid;grid-template-columns:minmax(0,330px) minmax(0,1fr);gap:28px;background:var(--sand);border-radius:var(--radius-xl);padding:24px;align-items:start}
.pj-md .docs-side{display:flex;flex-direction:column;gap:22px;padding:8px 4px}
.pj-md .dgrp{display:flex;flex-direction:column;gap:10px}
.pj-md .dpick{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;background:var(--paper);border-radius:var(--radius-pill);padding:4px;box-shadow:var(--shadow-card)}
.pj-md .dpick button{border:0;background:none;border-radius:var(--radius-pill);padding:10px 6px;font:500 14px/1 var(--font);color:var(--ink-65);display:flex;align-items:center;justify-content:center;gap:6px;transition:background .2s,color .2s}
.pj-md .dpick img{width:16px;height:16px}
.pj-md .dpick [aria-checked="true"]{background:var(--ink);color:#fff}
.pj-md .dbrands{display:flex;flex-direction:column;gap:8px}
.pj-md .dbrands button{border:0;background:var(--paper);border-radius:16px;padding:10px 12px;display:flex;align-items:center;gap:12px;box-shadow:var(--shadow-card);text-align:left;font:500 14.5px/1.2 var(--font);color:var(--ink-90);transition:box-shadow .2s}
.pj-md .dbrands .bm{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;color:#fff;font:600 12px/1 var(--font);flex:none}
.pj-md .dbrands .bn small{display:block;font-weight:400;font-size:12px;color:var(--ink-45);margin-top:2px}
.pj-md .dbrands .bs{margin-left:auto;display:flex;gap:3px}
.pj-md .dbrands .bs i{width:12px;height:12px;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,.06)}
.pj-md .dbrands [aria-checked="true"]{box-shadow:0 0 0 2px var(--bronze),var(--shadow-card)}
.pj-md .dextras{display:flex;flex-wrap:wrap;gap:8px}
.pj-md .dextras button{border:0;background:var(--paper);border-radius:var(--radius-pill);padding:8px 13px 8px 10px;font:500 13.5px/1.2 var(--font);box-shadow:var(--shadow-card);display:inline-flex;align-items:center;gap:8px;color:var(--ink-65)}
.pj-md .dextras button i{width:16px;height:16px;border-radius:5px;box-shadow:inset 0 0 0 1.5px var(--ink-45);display:grid;place-items:center;flex:none}
.pj-md .dextras button[aria-pressed="true"]{color:var(--ink)}
.pj-md .dextras button[aria-pressed="true"] i{background:var(--bronze);box-shadow:none}
.pj-md .dextras button[aria-pressed="true"] i::after{content:"";width:7px;height:4px;border:solid #fff;border-width:0 0 2px 2px;transform:translateY(-1px) rotate(-45deg)}
.pj-md #md-docs.std #md-dExtrasG{opacity:.4;pointer-events:none}
.pj-md .docs-view{min-width:0}
.pj-md .paper-wrap{position:relative;height:640px;border-radius:var(--radius-lg);background:radial-gradient(60% 50% at 50% 100%,rgba(176,122,74,.18),transparent 70%),var(--sand-2);overflow:hidden}
@media (max-width:1000px){.pj-md .docs{grid-template-columns:1fr;padding:16px}.pj-md .docs-view{order:-1}.pj-md .paper-wrap{height:auto;aspect-ratio:3/4}}

/* el documento: A4 a 595 × 842 y escalado con --k. Cada marca cambia logotipo, colores, tipografía y radios */
.pj-md .paper{--bp:#2F5FD0;--bd:#0F1E3D;--bl:#E8EEFC;--bf:Georgia,"Times New Roman",serif;--bw:400;--br:6px;
  position:absolute;left:50%;top:24px;width:595px;height:842px;transform-origin:top center;transform:translateX(-50%) scale(var(--k,.7));
  background:#fff;box-shadow:0 30px 60px -24px rgba(80,55,30,.35),0 0 0 1px var(--ink-5);font:400 10px/1.45 "Segoe UI",Arial,sans-serif;color:#2b2b2b;padding:40px 42px;overflow:hidden}
.pj-md .paper[data-b="talleres"]{--bp:#2F5FD0;--bd:#0F1E3D;--bl:#E8EEFC;--bf:Georgia,"Times New Roman",serif;--bw:400;--br:6px}
.pj-md .paper[data-b="clinica"]{--bp:#138A72;--bd:#0B3B33;--bl:#E3F4EF;--bf:"Segoe UI","Helvetica Neue",Arial,sans-serif;--bw:600;--br:12px}
.pj-md .paper[data-b="grupo"]{--bp:#B7832A;--bd:#15171C;--bl:#F5EEE1;--bf:"Trebuchet MS","Gill Sans",sans-serif;--bw:600;--br:0px}
.pj-md .paper *{transition:background .4s,color .4s,border-color .4s}
.pj-md .p-band{position:absolute;left:0;right:0;top:0;height:8px;background:var(--bp)}
.pj-md .p-head{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:22px}
.pj-md .p-logo{display:flex;align-items:center;gap:10px}
.pj-md .p-mono{width:40px;height:40px;border-radius:var(--br);background:var(--bd);color:#fff;display:grid;place-items:center;font:var(--bw) 15px/1 var(--bf)}
.pj-md .p-name{font:var(--bw) 17px/1.1 var(--bf);color:var(--bd)}
.pj-md .p-name small{display:block;font:400 9px/1.4 "Segoe UI",Arial,sans-serif;color:#777;margin-top:3px}
.pj-md .p-doc{text-align:right}
.pj-md .p-doc b{display:block;font:var(--bw) 20px/1.1 var(--bf);color:var(--bp);letter-spacing:.02em}
.pj-md .p-doc span{font-size:10px;color:#555}
.pj-md .p-meta{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:18px}
.pj-md .p-box{border-radius:var(--br);background:var(--bl);padding:10px 12px}
.pj-md .p-box h6{margin:0 0 4px;font:600 8.5px/1.2 "Segoe UI",Arial,sans-serif;text-transform:uppercase;letter-spacing:.06em;color:var(--bp)}
.pj-md .p-box p{margin:0}
.pj-md .p-kv{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;margin:0}
.pj-md .p-kv dt{color:#777}
.pj-md .p-kv dd{margin:0;font-weight:600}
.pj-md .p-kv .x{color:var(--bp)}
.pj-md .p-tbl{width:100%;border-collapse:collapse;margin-bottom:12px}
.pj-md .p-tbl th{background:var(--bd);color:#fff;font-weight:600;font-size:9px;text-align:left;padding:7px 8px}
.pj-md .p-tbl th:first-child{border-radius:var(--br) 0 0 var(--br)}
.pj-md .p-tbl th:last-child{border-radius:0 var(--br) var(--br) 0}
.pj-md .p-tbl td{padding:7px 8px;border-bottom:1px solid #eee}
.pj-md .p-tbl .r{text-align:right}
.pj-md .p-tbl .lot{color:var(--bp);font-weight:600}
.pj-md .p-tot{display:flex;justify-content:flex-end;margin-bottom:18px}
.pj-md .p-tot dl{margin:0;width:220px;display:grid;grid-template-columns:1fr auto;gap:4px 12px}
.pj-md .p-tot dt{color:#666}
.pj-md .p-tot dd{margin:0;text-align:right}
.pj-md .p-tot .gt{font:var(--bw) 15px/1.2 var(--bf);color:var(--bp);padding-top:6px;border-top:1.5px solid var(--bp)}
.pj-md .p-bottom{display:flex;gap:14px;align-items:stretch}
.pj-md .p-cond{flex:1;font-size:8.5px;color:#666}
.pj-md .p-cond b{color:#333}
.pj-md .p-qr{width:78px;flex:none;text-align:center;font-size:8px;color:#666}
.pj-md .p-qr i{display:block;width:62px;height:62px;margin:0 auto 4px;background:conic-gradient(from 90deg at 30% 30%,#111 25%,transparent 0) 0 0/12px 12px;opacity:.85;border-radius:2px}
.pj-md .p-sign{width:150px;flex:none;border-radius:var(--br);border:1px dashed #bbb;padding:8px 10px;font-size:8.5px;color:#666;position:relative}
.pj-md .p-sign svg{position:absolute;left:14px;bottom:10px;width:100px;height:34px;fill:none;stroke:var(--bd);stroke-width:1.6;stroke-linecap:round}
.pj-md .p-foot{position:absolute;left:42px;right:42px;bottom:26px;display:flex;justify-content:space-between;font-size:8px;color:#888;border-top:1px solid #eee;padding-top:8px}
.pj-md .paper:not(.e-lote) [data-e="lote"],.pj-md .paper:not(.e-qr) [data-e="qr"],.pj-md .paper:not(.e-firma) [data-e="firma"],.pj-md .paper:not(.e-cond) [data-e="cond"]{display:none}
/* estándar: como sale de fábrica */
.pj-md .paper.std{--bp:#333;--bd:#333;--bl:#fff;--bf:"Segoe UI",Arial,sans-serif;--bw:600;--br:0px}
.pj-md .paper.std .p-band,.pj-md .paper.std .p-mono{display:none}
.pj-md .paper.std .p-box{padding:0}
.pj-md .paper.std .p-tbl th{background:none;color:#333;box-shadow:inset 0 -1px 0 #333;border-radius:0}
.pj-md .paper.std .p-doc b{font-size:16px;letter-spacing:0}

/* ---------- 4 · Sincronización BC ↔ Sales ---------- */
.pj-md .sync{margin-top:40px;display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:24px;align-items:start}
.pj-md .sync-map{background:var(--sand);border-radius:var(--radius-xl);padding:22px}
.pj-md .sync-head{display:grid;grid-template-columns:1fr 150px 1fr;margin-bottom:12px}
.pj-md .sync-head span{display:inline-flex;align-items:center;gap:10px;font:500 17px/1.2 var(--font);letter-spacing:-.02em;padding:4px 6px}
.pj-md .sync-head span:last-child{grid-column:3}
.pj-md .sync-head img{width:30px;height:30px}
.pj-md .sync-rows{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.pj-md .sync-rows li{display:grid;grid-template-columns:1fr 150px 1fr;align-items:center;border-radius:16px;transition:background .25s}
.pj-md .sync-rows li:hover{background:rgba(255,255,255,.45)}
.pj-md .sr{background:var(--paper);border-radius:14px;padding:10px 14px;box-shadow:var(--shadow-card);font:500 14.5px/1.25 var(--font);color:var(--ink-90)}
.pj-md .sr span{display:block;font-weight:400;font-size:12px;color:var(--ink-45)}
.pj-md .sl{position:relative;height:40px}
.pj-md .sl::before{content:"";position:absolute;left:10px;right:10px;top:16px;border-top:2px dashed rgba(176,122,74,.45)}
.pj-md .sl em{position:absolute;left:0;right:0;top:23px;text-align:center;font:500 11px/1.2 var(--font);font-style:normal;color:var(--bronze-text)}
.pj-md .sl i{position:absolute;top:12px;left:10px;width:10px;height:10px;border-radius:50%;background:var(--bronze);box-shadow:0 0 8px rgba(176,122,74,.7);opacity:0;animation:goR 2.4s linear infinite}
.pj-md .sl.l i{animation-name:goL}
.pj-md .sl.b i+i{animation-name:goL;animation-delay:1.2s}
@keyframes goR{0%{left:10px;opacity:0}12%,88%{opacity:1}100%{left:calc(100% - 20px);opacity:0}}
@keyframes goL{0%{left:calc(100% - 20px);opacity:0}12%,88%{opacity:1}100%{left:10px;opacity:0}}
.pj-md .sync-side{background:var(--paper);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);padding:28px 26px;display:flex;flex-direction:column;gap:18px}
.pj-md .sync-side h3{font-size:26px}
.pj-md .sync-pts{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:16px}
.pj-md .sync-pts li{display:flex;gap:14px;align-items:flex-start}
.pj-md .sync-pts .n{flex:none;width:30px;height:30px;border-radius:10px;background:var(--bronze-soft);color:var(--bronze-text);display:grid;place-items:center;font:500 13px/1 var(--font)}
.pj-md .sync-pts b{display:block;font-size:16px;font-weight:500;letter-spacing:-.01em}
.pj-md .sync-pts span{font-size:14px;color:var(--ink-65);line-height:1.45}
@media (max-width:1000px){.pj-md .sync{grid-template-columns:1fr}}
@media (max-width:560px){.pj-md .sync-head,.pj-md .sync-rows li{grid-template-columns:1fr 70px 1fr}.pj-md .sync-head span{font-size:14px;gap:6px}.pj-md .sync-head img{width:22px;height:22px}.pj-md .sr{font-size:13px;padding:9px 10px}.pj-md .sl em{font-size:9.5px}}

/* ---------- 5 · Por encima, sin romper nada (limpio, sin noche) ---------- */
.pj-md .safe{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:center;background:var(--sand-2);border-radius:var(--radius-xl);padding:44px 48px}
.pj-md .safe-txt{display:flex;flex-direction:column;gap:16px;align-items:flex-start}
.pj-md .safe-txt h2{font-size:clamp(30px,4vw,44px)}
.pj-md .safe-pts{list-style:none;padding:0;margin:4px 0 0;display:flex;flex-direction:column;gap:10px}
.pj-md .safe-pts li{display:flex;gap:12px;font-size:15px;line-height:1.45;color:var(--ink-65)}
.pj-md .safe-pts i{width:8px;height:8px;border-radius:50%;background:var(--ok);margin-top:7px;flex:none}
.pj-md .safe-pts b{color:var(--ink);font-weight:500}
.pj-md .stack{position:relative;height:300px}
.pj-md .slab{position:absolute;left:0;right:0;height:98px;border-radius:24px;display:flex;align-items:center;gap:14px;padding:0 22px}
.pj-md .slab b{display:block;font-size:19px;font-weight:500;letter-spacing:-.02em;line-height:1.2}
.pj-md .slab span{font-size:13.5px;color:var(--ink-65)}
.pj-md .slab-t{top:70px;background:var(--paper);box-shadow:0 0 0 1.5px rgba(176,122,74,.55),var(--shadow-lift)}
.pj-md .slab-t i{width:14px;height:14px;border-radius:50%;background:var(--bronze);box-shadow:0 0 0 6px var(--bronze-soft);flex:none;margin:0 4px}
.pj-md .slab-b{top:184px;background:var(--sand);box-shadow:var(--shadow-ring);transition:box-shadow .5s}
.pj-md .slab-b.flash{box-shadow:0 0 0 2px rgba(1,208,98,.55)}
.pj-md .slab-b .lg{display:flex;gap:6px}
.pj-md .slab-b .lg img{width:30px;height:30px}
.pj-md .vchip{margin-left:auto;display:flex;align-items:center;gap:8px;height:32px;padding:0 12px;border-radius:99px;background:var(--paper);box-shadow:var(--shadow-card);font-size:13px;color:var(--ink-90);white-space:nowrap}
.pj-md .vchip i{width:8px;height:8px;border-radius:50%;background:var(--ok)}
.pj-md .upd{position:absolute;right:10px;top:0;display:flex;align-items:center;gap:10px;height:42px;padding:0 18px 0 14px;border-radius:99px;background:var(--paper);color:var(--ink);font:500 14px/1 var(--font);white-space:nowrap;box-shadow:var(--shadow-lift);opacity:0;z-index:2}
.pj-md .upd img{width:16px;height:16px}
.pj-md .upd.go{animation:upd 2.2s var(--ease) forwards}
@keyframes upd{0%{opacity:0;transform:translateY(-8px)}18%{opacity:1;transform:none}70%{opacity:1;transform:translate(-10px,196px) scale(.82)}100%{opacity:0;transform:translate(-10px,196px) scale(.7)}}
@media (max-width:900px){.pj-md .safe{grid-template-columns:1fr;gap:28px;padding:28px 20px}}
@media (max-width:480px){.pj-md .slab{padding:0 14px;gap:10px}.pj-md .slab b{font-size:16px}.pj-md .vchip{display:none}}