/* Tally · landing v4 · AdCenter
   Paleta AdCenter: tinta manda, azul es lo que se toca, dorado sólo lo que pide una decisión. */
:root{
  --tinta:#090055; --tinta-2:#140A6B; --azul:#1670F9; --morado:#A652FF; --dorado:#FFB03A; --verde:#61CE70;
  --gris:#F5F6FA; --lienzo:#EEF0F6; --linea:#E7E9F2; --linea-2:#DADDEA;
  --texto:#0E0B3D; --texto-2:#565B7E; --texto-3:#8E92AB;
  --azul-p:#EAF1FF; --morado-p:#F3EAFF; --dorado-p:#FFF3DE; --verde-p:#E7F7E9; --rojo:#E5484D; --rojo-p:#FDECEC;
  --wa:#25D366;
  --r-panel:22px; --r-tarj:14px; --r-chip:8px;
  --sombra-flota:0 1px 2px rgba(9,0,85,.05),0 24px 60px -24px rgba(9,0,85,.28);
  --curva:cubic-bezier(.2,.7,.2,1);
  --resorte:cubic-bezier(.34,1.4,.5,1);
  --gutter:32px;
  color-scheme:light;
}
@font-face{font-family:'Kaushan Script';src:url(../fonts/KaushanScript.ttf) format('truetype');font-display:swap}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:90px}
body{margin:0;background:var(--gris);color:var(--texto);font:17px/1.55 'Albert Sans',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:clip}
img,svg{display:block}
a{color:inherit}
p,h1,h2,h3,h4,h5,ol,ul{margin:0}
ol,ul{padding:0;list-style:none}
button{font:inherit;color:inherit;cursor:pointer}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.salta{position:absolute;left:16px;top:-60px;z-index:100;background:#fff;color:var(--tinta);padding:10px 14px;border-radius:10px;font-weight:600}
.salta:focus{top:12px}
:focus-visible{outline:3px solid #8DB4FF;outline-offset:3px;border-radius:10px}
.i{width:18px;height:18px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.envuelve{max-width:1280px;margin-inline:auto;padding-inline:var(--gutter)}
.num,.tabs b,time,.sil-dia-n,[data-num],[data-nec],[data-entrada]{font-variant-numeric:tabular-nums}

/* ── botones ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:14px;font:600 16px/1 'Albert Sans';text-decoration:none;white-space:nowrap;transition:transform .14s var(--curva),background-color .2s,box-shadow .2s;will-change:transform}
.btn .i{width:20px;height:20px}
.btn:active{transform:scale(.97)}
.btn-tinta{background:var(--tinta);color:#fff}
.btn-tinta:hover{background:#15098A}
.btn-oro{background:var(--dorado);color:var(--tinta);box-shadow:0 10px 30px -10px rgba(255,176,58,.6),inset 0 -2px 0 rgba(9,0,85,.12)}
.btn-oro:hover{background:#FFBD57}
.btn-chico{height:40px;padding:0 16px;font-size:14.5px;border-radius:12px}
.btn-grande{height:58px;padding:0 26px;font-size:17px}
.btn-enorme{height:68px;padding:0 32px;font-size:19px;border-radius:18px}
.btn-enorme .i{width:24px;height:24px}

/* ── barra ── */
.barra{position:fixed;z-index:50;top:14px;left:50%;transform:translateX(-50%);width:min(1240px,calc(100% - 28px));height:60px;display:flex;align-items:center;gap:28px;padding:0 10px 0 12px;
  background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(18px) saturate(180%);backdrop-filter:blur(18px) saturate(180%);border:1px solid rgba(255,255,255,.6);border-radius:18px;box-shadow:0 8px 30px -12px rgba(9,0,85,.25)}
.barra-marca{display:flex;align-items:center;gap:10px}
.barra-marca img:first-child{border-radius:10px}
.barra-firma{height:30px;width:auto}
.barra-nav{display:flex;gap:4px;margin-left:auto}
.barra-nav a{text-decoration:none;font-weight:500;font-size:15px;color:var(--texto-2);padding:9px 12px;border-radius:10px;transition:background-color .14s,color .14s}
.barra-nav a:hover{background:var(--gris);color:var(--tinta)}

/* ── tipografía de sección ── */
.h2{font:700 clamp(34px,4.6vw,62px)/1.02 Gabarito,sans-serif;letter-spacing:-.028em;color:var(--tinta);max-width:17ch;text-wrap:balance}
.h2-blanco{color:#fff}
.sec-p{font-size:clamp(17px,1.35vw,19px);line-height:1.55;color:var(--texto-2);max-width:54ch;margin-top:20px;text-wrap:pretty}
.sec-cab{padding-top:clamp(96px,11vw,150px)}
.sec-cab-2{padding-top:0}
.demo-aviso{font-size:12px;color:var(--texto-3);margin-top:12px;text-align:right}

/* entradas: sólo se esconden si hay JS; las revela un IntersectionObserver en el head */
.js .entra{opacity:0;transform:translateY(22px);transition:opacity .7s var(--curva),transform .8s var(--curva)}
.js .entra.visto{opacity:1;transform:none}
.parte .pw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.parte .pw>span{display:inline-block;transform:translateY(108%);transition:transform .9s var(--curva);transition-delay:calc(var(--k)*45ms)}
.parte.visto .pw>span{transform:none}

/* ═════════ 1 · PORTADA ═════════ */
.portada{position:relative;background:var(--tinta);color:#fff;min-height:100svh;display:flex;align-items:center;overflow:hidden;isolation:isolate;padding:120px 0 90px}
.portada-fondo{position:absolute;inset:0;z-index:-1;
  background:radial-gradient(60% 55% at 85% 20%,rgba(166,82,255,.30),transparent 70%),radial-gradient(50% 60% at 0% 100%,rgba(22,112,249,.28),transparent 70%)}
.portada-marca-agua{position:absolute;right:-8%;bottom:-18%;width:min(1100px,90vw);opacity:.045;transform:rotate(-8deg)}
.portada-in{width:100%;max-width:1280px;margin:0 auto;padding:0 var(--gutter);display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;align-items:center}
.portada-h1{font:700 clamp(38px,4.9vw,70px)/1.02 Gabarito,sans-serif;letter-spacing:-.03em;margin:0}
.firma{width:min(520px,82%);height:auto;color:#fff;margin:0 0 22px -2%;overflow:visible}
.h1-linea{display:block;overflow:hidden;padding-bottom:.06em}
.h1-in{display:block}
.portada-p{font-size:clamp(17px,1.45vw,20px);line-height:1.55;color:rgba(255,255,255,.74);max-width:48ch;margin-top:26px}
.portada-cta{margin-top:36px;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.portada-nota{display:flex;align-items:center;gap:8px;font-size:14.5px;color:rgba(255,255,255,.6)}
.portada-nota .i{width:16px;height:16px}
.portada-baja{position:absolute;left:50%;bottom:26px;width:26px;height:42px;margin-left:-13px;border:2px solid rgba(255,255,255,.35);border-radius:14px}
.portada-baja span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:3px;background:#fff;animation:baja 1.8s var(--curva) infinite}
@keyframes baja{0%{transform:translateY(0);opacity:1}70%{transform:translateY(12px);opacity:0}100%{opacity:0}}

/* la firma se escribe sola (sólo con JS en el head; sin él se ve completa) */
.f-rayos line{stroke:var(--dorado);stroke-width:30;stroke-linecap:round}
.js .fw{transform-box:fill-box;transform-origin:0 50%;transform:scaleX(0);animation:fw .42s cubic-bezier(.5,0,.3,1) forwards}
.js .fw0{animation-delay:.2s;animation-duration:.46s}
.js .fw1{animation-delay:.6s;animation-duration:.3s}
.js .fw2{animation-delay:.86s;animation-duration:.22s}
.js .fw3{animation-delay:1.04s;animation-duration:.22s}
.js .fw4{animation-delay:1.2s;animation-duration:.5s}
@keyframes fw{to{transform:scaleX(1)}}
.js .f-punto{transform-box:fill-box;transform-origin:50% 50%;animation:fpunto .62s var(--curva) 1.72s both}
@keyframes fpunto{0%{transform:translateY(-300px) scale(0);opacity:0}55%{transform:translateY(0) scale(1.28);opacity:1}75%{transform:scale(.9)}100%{transform:scale(1);opacity:1}}
.js .f-rayos{transform-box:view-box;transform-origin:1985px -175px;animation:frayos .7s var(--resorte) 2.02s both}
@keyframes frayos{0%{transform:scale(.4);opacity:0}100%{transform:scale(1);opacity:1}}
.js .h1-in{transform:translateY(105%);animation:sube .9s var(--curva) forwards}
.js .h1-l1 .h1-in{animation-delay:1.3s}
.js .h1-l2 .h1-in{animation-delay:1.44s}
.js .avisos-cab,.js .avisos-lista>.aviso{animation:aviso-in .8s var(--resorte) backwards}
.js .avisos-lista.vivo>.aviso{animation:none}
.js .avisos-cab{animation-delay:2.05s}
.js .avisos-lista>.aviso:nth-child(1){animation-delay:2.15s}
.js .avisos-lista>.aviso:nth-child(2){animation-delay:2.3s}
.js .avisos-lista>.aviso:nth-child(3){animation-delay:2.45s}
.js .avisos .demo-aviso{animation:aviso-in .8s 2.6s backwards}
@keyframes aviso-in{from{opacity:0;transform:translateY(-22px) scale(.95)}to{opacity:1;transform:none}}
@keyframes sube{to{transform:none}}
.js .portada .entra{transition-delay:1.7s}
.js .portada .portada-cta.entra{transition-delay:1.85s}

/* avisos */
.avisos{position:relative;transform:rotate(-4deg);width:min(420px,100%);justify-self:end}
.avisos-cab{display:flex;align-items:center;justify-content:space-between;margin:0 6px 12px}
.avisos-pill{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);padding:7px 8px 7px 12px;border-radius:12px;font-weight:600;font-size:14px}
.avisos-pill .i{color:var(--dorado)}
.avisos-num{display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:12px;background:var(--dorado);color:var(--tinta);font-size:13px;padding:0 7px}
.avisos-hora{font:600 14px Gabarito;color:rgba(255,255,255,.55)}
.avisos-lista{display:flex;flex-direction:column;gap:10px}
.aviso{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;background:rgba(255,255,255,.97);color:var(--texto);border-radius:20px;padding:13px 16px 13px 13px;box-shadow:0 18px 40px -18px rgba(0,0,0,.5)}
.aviso-av{width:44px;height:44px;border-radius:12px}
.aviso div{min-width:0}
.aviso b{display:block;font-size:15px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.aviso span{display:block;font-size:13.5px;color:var(--texto-2);line-height:1.35}
.aviso time{align-self:start;font-size:12px;color:var(--texto-3)}
.avisos .demo-aviso{color:rgba(255,255,255,.4);margin-right:6px}

/* ═════════ 1b · LA LIBRETA ═════════ */
.libreta-sec{position:relative}
.lib-pin{min-height:100svh;display:flex;align-items:center;padding:100px 0 40px}
.lib-in{width:100%;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:center}
.lib-beats{display:grid}
.lib-beats p{font:500 clamp(24px,2.35vw,34px)/1.28 Gabarito,sans-serif;letter-spacing:-.015em;color:var(--tinta);text-wrap:pretty}
.lib-beats p+p{margin-top:22px}
.lib-lema{font-weight:700!important;font-size:clamp(30px,3vw,44px)!important}
.js .lib-beats p{grid-area:1/1;align-self:center;margin:0;opacity:0;transform:translateY(18px);transition:opacity .45s var(--curva),transform .6s var(--curva)}
.js .lib-beats p.on{opacity:1;transform:none}
.lib-prog{display:none;gap:7px;margin-top:34px;align-items:flex-end;height:26px}
.js .lib-prog{display:flex}
.lib-prog i{width:5px;height:26px;border-radius:3px;background:var(--linea-2);transform:rotate(8deg);transition:background-color .3s}
.lib-prog i.on{background:var(--tinta)}
.lib-hoja{position:relative;background:#fff;border-radius:10px;padding:26px 30px 18px 30px;box-shadow:0 1px 2px rgba(9,0,85,.06),0 40px 80px -40px rgba(9,0,85,.35);transform:rotate(-1.6deg);--papel:1}
.lib-hoja::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:var(--papel);
  background:linear-gradient(90deg,transparent 62px,#E9D8FF 62px,#E9D8FF 64px,transparent 64px),repeating-linear-gradient(180deg,transparent 0 43px,#DCE7FB 43px 44px);background-position:0 0,0 30px}
.lib-cab{position:relative;display:grid;height:52px;align-items:center;margin-bottom:6px}
.lib-cab>*{grid-area:1/1}
.lib-cab-mano{font:400 30px 'Kaushan Script',cursive;color:var(--tinta);padding-left:48px;transform:rotate(-1.5deg)}
.lib-cab-ui{display:flex;align-items:center;gap:10px;opacity:0}
.lib-cab-ui img{border-radius:8px}
.lib-cab-ui b{font:600 20px Gabarito;color:var(--tinta)}
.lib-cab-ui .chip{margin-left:auto}
.lib-filas{position:relative;display:flex;flex-direction:column}
.lr{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr) 150px;align-items:center;gap:14px;height:88px;padding:0 4px}
.lr+.lr::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:var(--linea);opacity:calc(1 - var(--papel))}
.lr-marca img{width:48px;height:48px;border-radius:50%}
.lr-mano{grid-column:2;grid-row:1;font:400 clamp(28px,2.6vw,36px)/1 'Kaushan Script',cursive;color:var(--tinta);transform:rotate(var(--rot));transform-origin:0 50%;white-space:nowrap}
.lr-ui{grid-column:2;grid-row:1;opacity:0;min-width:0}
.lr-ui b{display:block;font-size:15.5px;font-weight:600}
.lr-ui small{display:block;font-size:13.5px;color:var(--texto-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lr-rayas{grid-column:3;grid-row:1;width:150px;height:auto;overflow:visible}
.lr-rayas path{fill:none;stroke:var(--tinta);stroke-width:4.2;stroke-linecap:round;stroke-dasharray:1 1;stroke-dashoffset:0}
.lr-rayos line{stroke:var(--dorado);stroke-width:2.6;stroke-linecap:round}
.lr-punto{fill:var(--dorado)}
.lr-clic,.lr-rayos{transform-box:fill-box;transform-origin:50% 100%}
.lr-chip{grid-column:3;grid-row:1;justify-self:end;opacity:0}
.lr-chip .chip{font-size:12px;padding:6px 9px}
.lr-chip img{border-radius:3px}
.lib-aviso{margin-top:6px}

/* ═════════ 2 · BANDEJA ═════════ */
.bandeja-pin{min-height:100svh;display:flex;align-items:center;padding:96px 0 24px}
.bandeja-pin>.bandeja-grid{width:100%}
.bandeja-grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:48px;align-items:center}
.pasos{display:flex;flex-direction:column;gap:6px;position:relative}
.paso{padding:18px 18px 18px 20px;border-radius:16px;position:relative;transition:opacity .35s var(--curva),background-color .35s}
.paso h3{display:flex;align-items:center;gap:10px;font:600 20px/1.2 Gabarito;color:var(--tinta);letter-spacing:-.01em}
.paso h3 .i{width:22px;height:22px;color:var(--azul)}
.paso p{font-size:15.5px;color:var(--texto-2);margin-top:8px;line-height:1.5}
.js .paso{opacity:.36}
.js .paso.on{opacity:1;background:#fff;box-shadow:0 1px 2px rgba(9,0,85,.05),0 10px 30px -18px rgba(9,0,85,.25)}
.js .paso.on::before{content:"";position:absolute;left:0;top:18px;bottom:18px;width:3px;border-radius:3px;background:var(--azul)}
.escena{perspective:1600px}

.app{position:relative;display:grid;grid-template-columns:188px 286px minmax(0,1fr);height:600px;background:#fff;border-radius:var(--r-panel);box-shadow:0 1px 2px rgba(9,0,85,.05),0 40px 90px -40px rgba(9,0,85,.35);overflow:hidden;font-size:14px;line-height:1.4;transform-origin:50% 0}
.app>*{min-height:0;transition:opacity .45s var(--curva),filter .45s var(--curva),transform .45s var(--curva)}
.app .i{width:18px;height:18px}
.av{width:40px;height:40px;border-radius:50%}
/* carpetas */
.app-carp{background:var(--gris);padding:16px 10px;display:flex;flex-direction:column;gap:2px;border-right:1px solid var(--linea)}
.app-carp-cab{display:flex;align-items:center;gap:10px;padding:2px 8px 14px}
.app-carp-cab img{border-radius:8px}
.app-carp-cab b{font:600 19px Gabarito;color:var(--tinta)}
.fol{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:10px;color:var(--texto-2);font-weight:500;font-size:13.5px;transition:background-color .3s,box-shadow .3s}
.fol b{margin-left:auto;font-weight:600;font-size:12px;color:var(--texto-3)}
.fol-nec{color:var(--texto)}
.badge-oro{background:var(--dorado);color:var(--tinta)!important;border-radius:20px;padding:1px 7px;min-width:22px;text-align:center}
.rot{font:600 11px 'Albert Sans';letter-spacing:.05em;color:var(--texto-3);padding:16px 10px 6px}
.num{display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:10px;font-size:13px;font-weight:500}
.num>span:nth-child(2){display:flex;flex-direction:column;line-height:1.2}
.num small{font-size:11px;color:var(--texto-3);font-weight:400}
.num em{margin-left:auto;width:7px;height:7px;border-radius:50%;background:var(--verde)}
.num-lg{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--verde-p);color:var(--wa)}
.num-lg .i{width:17px;height:17px}
.freno-mini{margin-top:auto;background:#fff;border:1px solid var(--linea);border-radius:12px;padding:10px;display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--texto-2);line-height:1.25}
.freno-mini b{display:block;color:var(--texto);font-size:12.5px}
.sw{margin-left:auto;width:32px;height:19px;border-radius:20px;background:var(--linea-2);position:relative;flex:none;transition:background-color .25s}
.sw::after{content:"";position:absolute;left:2px;top:2px;width:15px;height:15px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.18);transition:transform .3s var(--resorte)}
/* lista */
.app-lista{display:flex;flex-direction:column;border-right:1px solid var(--linea)}
.busca{display:flex;align-items:center;gap:8px;background:var(--gris);border-radius:11px;padding:9px 12px;color:var(--texto-3);margin:14px 14px 0;font-size:13.5px}
.busca .i{width:16px;height:16px}
.tabs{display:flex;gap:14px;white-space:nowrap;padding:12px 16px 0;border-bottom:1px solid var(--linea);font-weight:500;color:var(--texto-3);font-size:13px}
.tabs span{padding-bottom:9px;position:relative}
.tabs .on{color:var(--texto)}
.tabs .on::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;border-radius:2px;background:var(--tinta)}
.chats{padding:6px;overflow:hidden;display:flex;flex-direction:column}
.chat{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:1px 11px;padding:10px;border-radius:13px;align-items:start;transition:background-color .2s}
.chat:hover{background:var(--gris)}
.chat.on{background:var(--gris)}
.chat .av{grid-row:span 3}
.chat h4{font:600 14px 'Albert Sans';white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat time{font-size:11.5px;color:var(--texto-3);justify-self:end}
.chat p{grid-column:2/4;color:var(--texto-2);font-size:12.8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat .meta{grid-column:2/4;display:flex;align-items:center;gap:5px;margin-top:5px}
.chip{display:inline-flex;align-items:center;gap:4px;font:600 11px/1 'Albert Sans';padding:5px 8px;border-radius:var(--r-chip);white-space:nowrap}
.chip .i{width:13px;height:13px}
.c-mor{background:var(--morado-p);color:#7A2FD0}.c-az{background:var(--azul-p);color:#1257C8}.c-ver{background:var(--verde-p);color:#237A33}
.c-oro{background:var(--dorado-p);color:#935406}.c-gris{background:var(--gris);color:var(--texto-2)}.c-rojo{background:var(--rojo-p);color:#B4262B}
.silencio{display:inline-flex;align-items:flex-end;gap:2px;height:12px;margin-left:auto}
.silencio i{width:3px;border-radius:2px;background:var(--linea-2)}
.silencio i:nth-child(1){height:4px}.silencio i:nth-child(2){height:6px}.silencio i:nth-child(3){height:8px}.silencio i:nth-child(4){height:10px}.silencio i:nth-child(5){height:12px}
.silencio i.s{background:var(--tinta)}
.silencio i.d{background:var(--dorado)}
/* hilo */
.app-hilo{display:flex;flex-direction:column;background:linear-gradient(180deg,#fff,#F9FAFD);min-width:0}
.hilo-cab{display:flex;align-items:center;gap:11px;padding:12px 16px;border-bottom:1px solid var(--linea);background:#fff}
.hilo-cab>div{min-width:0;flex:1}
.hilo-cab h4{font:600 15px 'Albert Sans';white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hilo-cab small{display:block;color:var(--texto-3);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#atiende{transition:color .3s,background-color .3s;border-radius:5px;padding:0 3px;margin:0 -3px}
.btn-mini{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border-radius:10px;border:1px solid var(--linea);font:600 12.5px 'Albert Sans';color:var(--texto-2);background:#fff;white-space:nowrap;flex:none}
.btn-mini-tinta{background:var(--tinta);border-color:var(--tinta);color:#fff}
.msgs{flex:1;min-height:0;padding:14px 18px;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;overflow:hidden}
.msgs>*{flex:none}
.dia{align-self:center;font:600 11px 'Albert Sans';color:var(--texto-3);background:#fff;border:1px solid var(--linea);padding:4px 11px;border-radius:20px;margin:4px 0 8px}
.b{max-width:80%;padding:9px 13px;border-radius:17px;font-size:13.5px;line-height:1.42}
.b time{display:flex;gap:4px;align-items:center;font-size:10.5px;color:var(--texto-3);margin-top:3px}
.b.chico{font-size:12.8px;padding:8px 12px}
.ent{align-self:flex-start;background:#fff;border:1px solid var(--linea);border-bottom-left-radius:6px}
.sal{align-self:flex-end;background:var(--tinta);color:#fff;border-bottom-right-radius:6px}
.sal time{justify-content:flex-end;color:rgba(255,255,255,.6)}
.sal time .i{width:14px;height:14px;color:#8DB4FF}
.sistema{align-self:stretch;display:flex;align-items:center;justify-content:center;gap:8px;font:600 12px 'Albert Sans';color:var(--texto-2);background:var(--gris);border-radius:10px;padding:8px 12px;text-align:center}
.sistema .i{width:15px;height:15px;color:var(--azul)}
#traspaso{height:0;padding-block:0;opacity:0;overflow:hidden;margin-top:-6px;transition:height .45s var(--curva),opacity .35s,padding .45s var(--curva),margin .45s}
.app[data-paso="3"] #traspaso{height:34px;padding-block:8px;opacity:1;margin-top:4px;background:var(--azul-p);color:#1257C8}
.caja{margin:0 14px 14px;background:#fff;border:1px solid var(--linea-2);border-radius:16px;box-shadow:0 8px 24px -16px rgba(9,0,85,.2);position:relative}
.caja-sup{display:flex;align-items:center;gap:6px;padding:9px 10px 0;white-space:nowrap}
.porn{position:relative;display:flex;align-items:center;gap:6px;font:600 12px 'Albert Sans';background:var(--gris);padding:5px 8px;border-radius:9px;transition:box-shadow .3s}
.porn small{color:var(--texto-3);font-weight:500}
.porn>.i{width:14px;height:14px;color:var(--texto-3)}
.wa-pt{width:9px;height:9px;border-radius:50%;background:var(--wa);flex:none}
.porn-menu{position:absolute;left:0;bottom:calc(100% + 8px);background:#fff;border:1px solid var(--linea);border-radius:13px;padding:5px;box-shadow:var(--sombra-flota);display:flex;flex-direction:column;gap:2px;min-width:230px;transform-origin:10% 100%;transform:scale(.92) translateY(6px);opacity:0;pointer-events:none;transition:transform .32s var(--resorte),opacity .2s}
.porn-menu.abierto{transform:none;opacity:1}
.porn-op{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:9px;font-size:12.5px;transition:background-color .2s}
.porn-op small{margin-left:auto;color:var(--texto-3)}
.porn-op.on{background:var(--azul-p)}
.vent{position:relative;display:flex;align-items:center;gap:6px;font:600 12px 'Albert Sans';color:#237A33;background:var(--verde-p);padding:5px 9px;border-radius:9px}
.vent .i{width:14px;height:14px}
.vent-barra{width:42px;height:5px;border-radius:5px;background:#CDEFD3;overflow:hidden}
.vent-barra i{display:block;height:100%;width:100%;background:var(--verde);border-radius:5px;transform-origin:0 50%;transform:scaleX(.75)}
.vent-tip{position:absolute;left:50%;bottom:calc(100% + 10px);width:230px;margin-left:-115px;background:var(--tinta);color:#fff;font:500 12px/1.4 'Albert Sans';white-space:normal;padding:9px 11px;border-radius:10px;box-shadow:var(--sombra-flota);opacity:0;transform:translateY(6px);transition:opacity .25s,transform .35s var(--resorte);pointer-events:none}
.vent-tip::after{content:"";position:absolute;left:50%;top:100%;margin-left:-6px;border:6px solid transparent;border-top-color:var(--tinta)}
.app[data-paso="1"] .vent-tip{opacity:1;transform:none}
.ia-off{margin-left:auto;display:flex;align-items:center;gap:5px;font:600 11.5px 'Albert Sans';color:var(--texto-3)}
.ia-off .i{width:15px;height:15px}
.caja-txt{padding:10px 14px 4px;color:var(--texto-3);font-size:14px}
.caja-inf{display:flex;align-items:center;gap:12px;padding:6px 10px 10px 14px;color:var(--texto-3)}
.nota-int{display:flex;align-items:center;gap:6px;font:600 12px 'Albert Sans';color:var(--texto-2);padding:0 9px;height:30px;border-radius:9px;background:var(--dorado-p)}
.nota-int .i{width:15px;height:15px}
.enviar{margin-left:auto}
.enviar .i{width:15px;height:15px}
/* foco por paso */
.js .app[data-paso] .app-hilo,.js .app[data-paso] .app-carp,.js .app[data-paso] .app-lista{opacity:1}
.js .app[data-paso="0"] .app-hilo{opacity:.3;filter:saturate(.4)}
.js .app[data-paso="0"] #fol-nec{background:#fff;box-shadow:0 0 0 2px var(--dorado),0 6px 16px -8px rgba(255,176,58,.7)}
.js .app[data-paso="1"] .app-carp,.js .app[data-paso="1"] .app-lista,
.js .app[data-paso="2"] .app-lista,
.js .app[data-paso="3"] .app-carp,.js .app[data-paso="3"] .app-lista{opacity:.3;filter:saturate(.4)}
.js .app[data-paso="1"] .msgs,.js .app[data-paso="2"] .msgs{opacity:.45}
.msgs{transition:opacity .45s}
.js .app[data-paso="1"] .vent{box-shadow:0 0 0 2px var(--verde)}
.js .app[data-paso="2"] .porn{box-shadow:0 0 0 2px var(--azul)}
.js .app[data-paso="2"] .app-carp .fol,.js .app[data-paso="2"] .app-carp .rot~.freno-mini{opacity:.3}
.js .app[data-paso="3"] #atiende{background:var(--azul-p);color:#1257C8}
.chat-nuevo{transform-origin:50% 0}

/* ═════════ 3 · MARQUESINA ═════════ */
.marquesina{background:var(--tinta);color:#fff;padding:44px 0;overflow:hidden;margin-top:clamp(80px,9vw,130px)}
.marq-fila{display:flex;overflow:hidden;white-space:nowrap}
.marq-pista{display:flex;align-items:center;gap:36px;padding-right:36px;flex:none;font:700 clamp(30px,4.6vw,66px)/1.15 Gabarito;letter-spacing:-.025em;will-change:transform}
.marq-pista img{height:.62em;width:auto;opacity:.9}
.marq-2 .marq-pista{color:rgba(255,255,255,.32)}
.marq-2 .marq-pista img{opacity:.35}
.marq-2{margin-top:6px}

/* ═════════ 4 · COEXISTENCIA ═════════ */
.coex{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:center;padding-top:clamp(96px,11vw,150px)}
.coex-lista{margin-top:30px;display:flex;flex-direction:column;gap:16px}
.coex-lista li{display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:start;font-size:16px;color:var(--texto-2);line-height:1.5}
.coex-lista .i{width:40px;height:40px;padding:10px;border-radius:12px;background:#fff;color:var(--tinta);box-shadow:0 0 0 1px var(--linea)}
.coex-lista b{color:var(--texto);font-weight:600}
.coex-escena{position:relative;display:grid;grid-template-columns:250px minmax(40px,1fr) 360px;align-items:center}
.cel{position:relative;width:250px;height:500px;border-radius:42px;background:#0E0B3D;padding:10px;box-shadow:0 40px 80px -30px rgba(9,0,85,.45),inset 0 0 0 2px #2A2560;display:flex;flex-direction:column;z-index:2}
.cel-isla{position:absolute;left:50%;top:18px;width:74px;height:20px;margin-left:-37px;border-radius:12px;background:#000;z-index:3}
.cel-cab{display:flex;align-items:center;gap:9px;padding:40px 14px 10px;background:#F4F1EC;border-radius:33px 33px 0 0;border-bottom:1px solid #E6E1D8}
.cel-cab img{width:32px;height:32px;border-radius:50%}
.cel-cab b{display:block;font-size:13.5px}
.cel-cab small{display:block;font-size:11px;color:#6B7A6E}
.cel-msgs{flex:1;background:#ECE5DD;padding:12px 10px;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;overflow:hidden}
.cb{max-width:82%;font-size:12.5px;line-height:1.35;padding:7px 10px;border-radius:12px;box-shadow:0 1px 1px rgba(0,0,0,.08)}
.cb-ent{align-self:flex-start;background:#fff;border-top-left-radius:4px}
.cb-sal{align-self:flex-end;background:#D9FDD3;border-top-right-radius:4px;display:flex;align-items:flex-end;gap:5px}
.cb-sal i .i{width:14px;height:14px;color:#53BDEB}
.cel-caja{display:flex;align-items:center;gap:6px;background:#ECE5DD;padding:8px 8px 14px;border-radius:0 0 33px 33px}
.cel-caja>span{flex:1;min-width:0;background:#fff;border-radius:18px;padding:8px 12px;font-size:12.5px;min-height:34px;white-space:nowrap;overflow:hidden;display:flex;align-items:center}
.cel-caja em{font-style:normal}
.cel-caja em:empty::before{content:"Mensaje";color:#8A9A8E}
.cel-cursor{width:1.5px;height:16px;background:var(--wa);margin-left:1px;flex:none;animation:parpadea 1s steps(1) infinite}
.cel-caja b{margin-left:auto;width:34px;height:34px;border-radius:50%;background:#00A884;color:#fff;display:grid;place-items:center;flex:none}
.cel-caja b .i{width:16px;height:16px}
@keyframes parpadea{50%{opacity:0}}
.coex-hilo{width:100%;height:120px;overflow:visible}
.coex-hilo path{fill:none;stroke:#C4C8DC;stroke-width:2;stroke-dasharray:4 6;vector-effect:non-scaling-stroke}
.coex-hilo circle{fill:var(--azul);filter:drop-shadow(0 0 6px rgba(22,112,249,.8));opacity:0}
.coex-tally{background:#fff;border-radius:var(--r-panel);box-shadow:var(--sombra-flota);overflow:hidden;position:relative;z-index:2}
.ct-cab{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--linea)}
.ct-cab img{border-radius:8px}
.ct-cab b{font-size:14.5px}
.ct-cab .chip{margin-left:auto}
.ct-msgs{padding:14px 16px;display:flex;flex-direction:column;gap:6px;min-height:280px;justify-content:flex-end;background:linear-gradient(180deg,#fff,#F9FAFD)}
.desde{display:inline-flex;align-items:center;gap:3px;color:#fff;background:rgba(255,255,255,.14);padding:1px 6px;border-radius:6px;margin-right:4px}
.desde .i{width:12px;height:12px;color:#fff!important}
.ct-pie{display:flex;gap:6px;padding:12px 16px 16px;flex-wrap:wrap}
.ct-toast{display:flex;align-items:center;gap:10px;margin:10px 10px 0;padding:9px 12px;border-radius:12px;background:var(--azul-p);font-size:13px;color:var(--texto-2)}
.ct-toast b{color:var(--tinta)}
.ct-toast img{border-radius:8px}
.coex-escena .demo-aviso{grid-column:1/-1}

/* ═════════ 5 · LA REGLA DEL SILENCIO ═════════ */
.silencio-sec{background:var(--tinta);color:#fff;margin-top:clamp(96px,11vw,150px);position:relative;overflow:clip}
.silencio-sec::before{content:"";position:absolute;inset:0;background:radial-gradient(50% 50% at 75% 45%,rgba(166,82,255,.22),transparent 70%);pointer-events:none}
.sil-pin{min-height:100svh;display:flex;align-items:center}
.sil-in{position:relative;width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:1fr auto;gap:24px 48px;padding-top:110px;padding-bottom:44px;min-height:100svh}
.sil-izq{align-self:center}
.sil-sub{font-size:clamp(17px,1.4vw,20px);color:rgba(255,255,255,.7);margin-top:16px;max-width:36ch}
.sil-dia{margin-top:28px;display:flex;align-items:baseline;gap:18px;font-family:Gabarito;line-height:.8}
.sil-dia-d{font-weight:600;font-size:clamp(28px,2.6vw,40px);color:rgba(255,255,255,.55)}
.sil-dia-n{font-weight:800;font-size:clamp(120px,14vw,220px);letter-spacing:-.05em;min-width:2ch;transition:color .3s}
.sil-dia-n.oro{color:var(--dorado)}
.sil-textos{display:grid;margin-top:26px;max-width:40ch;min-height:3.2em}
.sil-textos p{font-size:clamp(18px,1.6vw,23px);line-height:1.4;color:#fff;font-weight:500}
.js .sil-textos p{grid-area:1/1;opacity:0;transform:translateY(14px);transition:opacity .35s,transform .5s var(--curva)}
.js .sil-textos p.on{opacity:1;transform:none}
.sil-der{align-self:center;display:flex;flex-direction:column;align-items:center;gap:26px;position:relative}
.cuenta{width:min(520px,100%);height:auto;overflow:visible}
.cr{fill:#fff}
.c-rayos line{stroke:var(--dorado);stroke-width:30;stroke-linecap:round}
.c-punto{fill:var(--dorado)}
.c-rayos,.c-punto{transform-box:fill-box;transform-origin:50% 50%}
.c-rayos{transform-box:view-box;transform-origin:760px 356px}
.cs{stroke-dasharray:1 1;stroke-dashoffset:0}
.sil-ficha{width:min(400px,100%);background:#fff;color:var(--texto);border-radius:20px;padding:14px;box-shadow:0 30px 70px -30px rgba(0,0,0,.6)}
.sf-cab{display:flex;align-items:center;gap:11px}
.sf-cab img{width:42px;height:42px;border-radius:50%}
.sf-cab b{display:block;font-size:15px}
.sf-cab small{display:block;font-size:12.5px;color:var(--texto-3);font-variant-numeric:tabular-nums}
.silencio.grande{height:28px;gap:4px}
.silencio.grande i{width:6px;border-radius:3px}
.silencio.grande i:nth-child(1){height:9px}.silencio.grande i:nth-child(2){height:14px}.silencio.grande i:nth-child(3){height:19px}.silencio.grande i:nth-child(4){height:23px}.silencio.grande i:nth-child(5){height:28px}
.silencio i{transition:background-color .3s,transform .4s var(--resorte);transform-origin:50% 100%}
.sf-cuerpo{display:grid;margin-top:12px}
.sf-cuerpo>*{grid-area:1/1;transition:opacity .3s,transform .45s var(--curva)}
.sf-rec{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--texto-2);background:var(--gris);border-radius:11px;padding:10px 12px}
.sf-rec .i{color:var(--azul);width:17px;height:17px}
.sf-decide{background:var(--dorado-p);border-radius:12px;padding:10px 12px}
.sf-decide b{display:flex;align-items:center;gap:8px;font-size:14px;color:#6B3D04}
.sf-decide>div{display:flex;gap:6px;margin-top:9px}
.sf-btn{font:600 12.5px 'Albert Sans';background:var(--tinta);color:#fff;padding:7px 11px;border-radius:9px}
.sf-btn-2{background:#fff;color:var(--texto)}
.sf-contesta{display:flex;align-items:center}
.sf-contesta .b{max-width:100%}
.js .sf-cuerpo>*{opacity:0;transform:translateY(8px)}
.js .sf-cuerpo[data-e="rec"] .sf-rec,.js .sf-cuerpo[data-e="decide"] .sf-decide,.js .sf-cuerpo[data-e="contesta"] .sf-contesta{opacity:1;transform:none}
.sil-riel{grid-column:1/-1;position:relative;height:44px;margin:0 8px}
.sil-riel-l{position:absolute;left:0;right:0;top:8px;height:4px;border-radius:4px;background:rgba(255,255,255,.14);overflow:hidden}
.sil-riel-l i{display:block;height:100%;background:linear-gradient(90deg,#fff 80%,var(--dorado));transform-origin:0 50%;transform:scaleX(1)}
.sil-riel span{position:absolute;top:22px;left:calc(var(--p)*100%);transform:translateX(-50%);font:600 13px Gabarito;color:rgba(255,255,255,.55);transition:color .3s}
.sil-riel span::before{content:"";position:absolute;left:50%;top:-18px;width:10px;height:10px;margin-left:-5px;border-radius:50%;background:var(--tinta);border:2px solid rgba(255,255,255,.4);transition:background-color .3s,border-color .3s}
.sil-riel span.on{color:#fff}
.sil-riel span.on::before{background:#fff;border-color:#fff}
.sil-riel span.d30.on{color:var(--dorado)}
.sil-riel span.d30.on::before{background:var(--dorado);border-color:var(--dorado)}
.sil-riel span:first-of-type{transform:none}
.sil-riel span:first-of-type::before{left:5px}
.sil-riel span.d30{transform:translateX(-100%)}
.sil-riel span.d30::before{left:auto;right:-5px;margin:0}

/* ═════════ 6 · EMBUDO ═════════ */
.embudo-sec{padding-top:clamp(96px,11vw,150px)}
.embudo-sec .h2{max-width:22ch}
.tablero-marco{position:relative;margin-top:48px;background:#fff;border-radius:var(--r-panel);box-shadow:0 1px 2px rgba(9,0,85,.05),0 40px 90px -40px rgba(9,0,85,.3);padding:18px;overflow:hidden;font-size:14px;line-height:1.4}
.tab-cab{display:flex;align-items:center;gap:12px;padding:2px 4px 16px}
.tab-cab>b{font:700 22px Gabarito;color:var(--tinta);letter-spacing:-.01em}
.tab-cab .chip{font-size:12.5px;padding:6px 10px}
.tab-res{margin-left:auto;font-size:13px;color:var(--texto-3);font-variant-numeric:tabular-nums}
.tab-res b{color:var(--texto)}
.cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.col{background:var(--gris);border-radius:16px;padding:12px;min-height:360px;display:flex;flex-direction:column;gap:10px;position:relative}
.col h5{display:flex;align-items:center;gap:8px;font:600 14px 'Albert Sans';padding:2px 4px}
.col h5 i{width:9px;height:9px;border-radius:3px}
.col h5 b{font-weight:600;font-size:12px;color:var(--texto-3);background:#fff;border-radius:6px;padding:1px 7px;font-variant-numeric:tabular-nums}
.col-nota{display:flex;align-items:center;gap:5px;font-size:11.5px;color:var(--texto-3);padding:0 4px}
.col-nota .i{width:14px;height:14px}
.col-vacia{flex:1;border:1.5px dashed var(--linea-2);border-radius:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;color:var(--texto-3);font-size:12.5px;padding:16px}
.col-vacia img{opacity:.9}
.tarj{background:#fff;border-radius:var(--r-tarj);padding:12px;box-shadow:0 1px 2px rgba(9,0,85,.06),0 0 0 1px var(--linea)}
.tj-cab{display:flex;align-items:center;gap:9px}
.tj-cab img{width:30px;height:30px;border-radius:50%}
.tj-cab b{font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tarj p{font-size:12.5px;color:var(--texto-2);margin-top:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tj-pie{display:flex;align-items:center;gap:5px;margin-top:10px}
.tj-pie .silencio{margin-left:0}
.yo{margin-left:auto;width:22px;height:22px;border-radius:50%;background:var(--tinta);color:#fff;display:grid;place-items:center;font:600 10px Gabarito;font-style:normal;flex:none}
.hueco{display:none;height:var(--h,112px);flex:none}
.soltar{display:none}
.anim .hueco{display:block}
.anim .soltar{display:flex;position:absolute;inset:44px 12px 12px;border:2px dashed var(--azul);border-radius:13px;background:rgba(234,241,255,.6);color:var(--azul);font-size:13px;text-align:center;align-items:center;justify-content:center;padding:18px;opacity:0;line-height:1.45}
.anim .dlg{transform:none}
.anim .tarj-viaja{position:absolute;left:0;top:0;width:var(--w,240px);z-index:5;will-change:transform}
.tarj-viaja.alza{box-shadow:0 1px 2px rgba(9,0,85,.06),0 0 0 1px var(--linea),0 26px 50px -18px rgba(9,0,85,.35)}
.tarj-viaja .tj-pend{display:inline-flex}
.anim .tarj-viaja .tj-nec{display:none}
.anim .tarj-viaja.antes .tj-nec{display:inline-flex}
.anim .tarj-viaja.antes .tj-pend{display:none}
.puntero{position:absolute;left:0;top:0;width:26px;height:26px;z-index:9;opacity:0;pointer-events:none;filter:drop-shadow(0 3px 5px rgba(9,0,85,.35))}
.puntero path{fill:var(--tinta);stroke:#fff;stroke-width:1.6;stroke-linejoin:round}
.dlg-fondo{position:absolute;inset:0;background:rgba(9,0,85,.28);opacity:0;z-index:6;pointer-events:none}
.dlg{position:absolute;left:50%;top:50%;width:min(450px,calc(100% - 32px));background:#fff;border-radius:18px;padding:18px;box-shadow:0 40px 80px -24px rgba(9,0,85,.5);z-index:7;transform:translate(-50%,-50%) scale(.96);opacity:0;pointer-events:none}
.dlg-cab{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.dlg-cab img{border-radius:50%}
.dlg-cab b{display:block;font:600 17px Gabarito;color:var(--tinta)}
.dlg-cab small{display:block;font-size:12.5px;color:var(--texto-3)}
.dlg label{display:flex;justify-content:space-between;font:600 12.5px 'Albert Sans';color:var(--texto);margin:10px 0 6px}
.dlg label em{font-style:normal;font-weight:500;color:var(--texto-3)}
.dlg-campo{min-height:62px;border:1.5px solid var(--azul);border-radius:11px;padding:9px 11px;font-size:13.5px;box-shadow:0 0 0 3px var(--azul-p)}
.cursor-t{display:inline-block;width:1.5px;height:15px;background:var(--azul);vertical-align:-2px;margin-left:1px;animation:parpadea 1s steps(1) infinite}
.dlg-pend{display:flex;flex-wrap:wrap;gap:6px}
.dp{display:inline-flex;align-items:center;gap:5px;font:600 12px 'Albert Sans';padding:7px 10px;border-radius:9px;border:1.5px solid var(--linea-2);color:var(--texto-2);transition:background-color .2s,border-color .2s,color .2s}
.dp .i{width:14px;height:14px}
.dp.on{background:var(--azul-p);border-color:var(--azul);color:#1257C8}
.dp-gris{color:var(--texto-3)}
.dlg-pie{display:flex;justify-content:flex-end;gap:8px;margin-top:16px}
.dlg-cancel{font:600 13px 'Albert Sans';padding:10px 14px;border-radius:10px;color:var(--texto-2)}
.dlg-ok{display:inline-flex;align-items:center;gap:6px;font:600 13px 'Albert Sans';padding:10px 14px;border-radius:10px;background:var(--linea);color:var(--texto-3);transition:background-color .25s,color .25s,transform .12s}
.dlg-ok .i{width:15px;height:15px}
.dlg-ok.on{background:var(--tinta);color:#fff}
/* sin JS o sin movimiento: el diálogo se ve abierto y completo, como ficha estática */
.tablero-marco:not(.anim) .dlg{position:relative;left:auto;top:auto;transform:none;opacity:1;margin:18px auto 0;box-shadow:0 0 0 1px var(--linea)}
.tablero-marco:not(.anim) .dlg-campo #dlg-nota-t::before{content:"Ya vio la propuesta, quiere pagar en dos partes."}
.tablero-marco:not(.anim) #dp-1{background:var(--azul-p);border-color:var(--azul);color:#1257C8}
.tablero-marco:not(.anim) .dlg-ok{background:var(--tinta);color:#fff}

/* ═════════ 7 · AGENTE DE IA ═════════ */
.ia-sec{background:#fff;margin-top:clamp(96px,11vw,150px);padding:clamp(88px,10vw,140px) 0}
.ia-in{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:64px;align-items:center}
.ia-ico{border-radius:18px;margin-bottom:24px}
.modos{position:relative;display:inline-grid;grid-template-columns:repeat(3,auto);background:var(--gris);border-radius:14px;padding:5px;margin-top:34px;box-shadow:inset 0 0 0 1px var(--linea)}
.modo{position:relative;z-index:1;border:0;background:none;font:600 15px 'Albert Sans';color:var(--texto-2);padding:12px 20px;border-radius:10px;transition:color .2s}
.modo[aria-selected="true"]{color:var(--tinta)}
.modos-pill{position:absolute;z-index:0;left:0;top:5px;height:calc(100% - 10px);width:var(--pw,100px);transform:translateX(var(--px,5px));background:#fff;border-radius:10px;box-shadow:0 1px 2px rgba(9,0,85,.1),0 6px 16px -8px rgba(9,0,85,.25);transition:transform .45s var(--resorte),width .35s var(--curva)}
.modo-desc{margin-top:14px;font-size:15.5px;color:var(--texto-2);min-height:3em}
.ia-escena{position:relative}
.ia-chat{background:var(--gris);border-radius:var(--r-panel);overflow:hidden;box-shadow:0 0 0 1px var(--linea),0 40px 90px -46px rgba(9,0,85,.35);display:flex;flex-direction:column;height:470px;font-size:14px;line-height:1.4}
.ia-estado{display:inline-flex;align-items:center;gap:6px;font:600 12px 'Albert Sans';padding:6px 10px;border-radius:9px;background:var(--gris);color:var(--texto-3);transition:background-color .3s,color .3s;white-space:nowrap}
.ia-estado .i{width:15px;height:15px}
.ia-escena[data-modo="1"] .ia-estado{background:var(--morado-p);color:#7A2FD0}
.ia-escena[data-modo="2"] .ia-estado{background:var(--azul-p);color:#1257C8}
.ia-escena.a-un-lado .ia-estado{background:var(--gris);color:var(--texto-2)}
.ia-msgs{background:linear-gradient(180deg,#fff,#F9FAFD)}
.auto{align-self:flex-end;background:#fff;border:1.5px dashed #7BA7FF;border-bottom-right-radius:6px;color:var(--texto)}
.auto time{justify-content:flex-end}
.auto-et{display:flex;align-items:center;gap:5px;font:600 11px 'Albert Sans';color:#1257C8;margin-bottom:4px}
.auto-et .i{width:13px;height:13px}
.sep-ia{background:var(--morado-p);color:#6A2BB8;font-weight:600}
.sep-ia img{border-radius:6px}
.ia-msgs .m2{display:none}
#ia-escena[data-modo="2"] .ia-msgs .m2{display:block}
#ia-escena[data-modo="2"] .ia-msgs .sistema.m2{display:flex}
.ia-chat .caja{margin:0 14px 14px}
.sug{display:none;margin:10px 10px 0;background:var(--morado-p);border-radius:12px;padding:10px 12px}
#ia-escena[data-modo="1"] .sug{display:block}
.sug-et{display:flex;align-items:center;gap:5px;font:600 11.5px 'Albert Sans';color:#7A2FD0}
.sug-et .i{width:14px;height:14px}
.sug p{font-size:13.5px;margin-top:4px}
.sug>div{display:flex;gap:6px;margin-top:8px}
.sug .btn-mini{height:28px}

/* ═════════ 8 · BENTO ═════════ */
.bento-sec{padding-top:clamp(96px,11vw,150px)}
.bento{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:44px}
.bt{background:#fff;border-radius:var(--r-panel);padding:14px 14px 26px;box-shadow:0 0 0 1px var(--linea);display:flex;flex-direction:column}
.bt h3{font:600 22px/1.15 Gabarito;letter-spacing:-.015em;color:var(--tinta);margin:22px 12px 0}
.bt p{font-size:15.5px;color:var(--texto-2);margin:8px 12px 0;max-width:46ch;line-height:1.5}
.bt-hoy{grid-column:span 2}
.bt-plant{grid-row:span 2}
.bt-demo{background:var(--gris);border-radius:16px;height:250px;position:relative;overflow:hidden;font-size:13.5px;line-height:1.4}
.bt-plant .bt-demo{height:auto;flex:1;min-height:520px}
/* hoy */
.hoy{padding:22px}
.hoy-cab b{display:block;font:700 24px Gabarito;color:var(--tinta);letter-spacing:-.02em}
.hoy-cab small{display:block;font-size:13px;color:var(--texto-2);margin-top:2px}
.hoy-fila{display:grid;grid-template-columns:200px minmax(0,1fr);gap:12px;margin-top:16px}
.hoy-nec{background:var(--tinta);color:#fff;border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:6px;height:152px}
.hoy-nec span{display:flex;align-items:center;gap:7px;font-weight:600;font-size:13px}
.hoy-nec span .i{color:var(--dorado)}
.hoy-nec b{font:700 40px/1 Gabarito}
.hoy-nec em{margin-top:auto;align-self:flex-end;display:inline-flex;align-items:center;gap:4px;font:600 12.5px 'Albert Sans';font-style:normal;background:var(--dorado);color:var(--tinta);padding:7px 11px;border-radius:10px}
.hoy-nec em .i{width:14px;height:14px}
.hoy-pend{background:#fff;border-radius:16px;padding:6px 12px;display:flex;flex-direction:column}
.hoy-pend{position:relative}
.hoy-pend li.hoy-fin{position:absolute;inset:0;border:0;padding:0 20px;grid-template-columns:none;background:#fff;border-radius:16px;display:flex;align-items:center;gap:14px;padding:0 20px;font-size:14px;color:var(--texto-2);opacity:0;pointer-events:none}
.hoy-fin b{display:block;font:600 17px Gabarito;color:var(--tinta)}
.hoy-fin img{border-radius:12px}
.hoy-pend li{display:grid;grid-template-columns:28px minmax(0,1fr) auto 28px;gap:10px;align-items:center;padding:9px 0;border-bottom:1px solid var(--linea)}
.hoy-pend li:nth-last-child(2){border:0}
.hoy-pend img{width:28px;height:28px;border-radius:50%}
.hoy-pend span{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .3s}
.hoy-pend time{font:600 11px 'Albert Sans';color:#B4262B;background:var(--rojo-p);padding:4px 7px;border-radius:7px;transition:opacity .3s}
.ck{width:28px;height:28px;border-radius:9px;border:1.5px solid var(--linea-2);display:grid;place-items:center;color:transparent;transition:background-color .25s,border-color .25s,color .25s,transform .3s var(--resorte)}
.ck .i{width:15px;height:15px;stroke-width:2.4}
.hoy-pend li.hecho .ck{background:var(--verde);border-color:var(--verde);color:#fff}
.hoy-pend li.hecho span{color:var(--texto-3);text-decoration:line-through}
.hoy-pend li.hecho time{opacity:.35}
/* plantillas */
.plant{padding:18px;display:flex;flex-direction:column;gap:14px}
.pl-editor{background:#fff;border-radius:14px;padding:12px;box-shadow:0 0 0 1px var(--linea)}
.pl-editor small{font:600 11.5px 'Albert Sans';color:var(--texto-3)}
.pl-campo{margin-top:8px;border:1.5px solid var(--linea-2);border-radius:10px;padding:9px 11px;min-height:64px;font-size:13.5px}
.pl-vars{display:flex;justify-content:space-between;align-items:center;margin-top:9px;font-size:11.5px;color:var(--texto-3)}
.v1{background:var(--azul-p);color:#1257C8;border-radius:5px;padding:0 4px;font-weight:600}
.plant{justify-content:space-between}
.pl-cel{flex:none;height:380px;align-self:center;width:230px;background:#ECE5DD;border-radius:30px;border:8px solid #0E0B3D;padding:0 0 16px;display:flex;flex-direction:column;overflow:hidden;min-height:330px}
.pl-cel-cab{display:flex;align-items:center;gap:8px;background:#F4F1EC;padding:24px 12px 10px}
.pl-cel-cab img{width:26px;height:26px;border-radius:50%}
.pl-cel-cab b{font-size:12.5px}
.pl-dia{margin:auto auto 10px;background:rgba(255,255,255,.85)}
.pl-burbuja{margin:0 12px 0;background:#fff;border-radius:12px 12px 12px 4px;padding:9px 11px;font-size:12.5px;box-shadow:0 1px 1px rgba(0,0,0,.08);min-height:40px}
.pl-burbuja b{color:#1257C8;font-weight:600}
.pl-boton{margin:5px 12px 0;background:#fff;border-radius:10px;text-align:center;color:#0B8FD3;font-weight:600;font-size:12.5px;padding:8px;box-shadow:0 1px 1px rgba(0,0,0,.08)}
/* formularios */
.form{padding:16px}
.fm-lista{display:flex;flex-direction:column;gap:8px}
.fm{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;background:#fff;border-radius:13px;padding:10px 12px;box-shadow:0 0 0 1px var(--linea)}
.fm img{width:34px;height:34px;border-radius:50%}
.fm b{display:block;font-size:13.5px}
.fm small{display:block;font-size:11.5px;color:var(--texto-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-dup{box-shadow:0 0 0 1.5px var(--verde)}
.fm{transition:box-shadow .3s}
/* freno */
.freno{padding:18px;display:flex;flex-direction:column;gap:12px}
.freno-sw{display:flex;align-items:center;gap:12px;width:100%;border:0;background:#fff;border-radius:14px;padding:12px 14px;text-align:left;box-shadow:0 0 0 1px var(--linea);transition:box-shadow .25s}
.freno-sw:hover{box-shadow:0 0 0 1.5px var(--linea-2)}
.fs-ico{width:36px;height:36px;border-radius:11px;background:var(--gris);display:grid;place-items:center;color:var(--tinta);transition:background-color .25s,color .25s}
.fs-txt b{display:block;font-size:14.5px}
.fs-txt small{display:block;font-size:12.5px;color:var(--texto-3)}
.sw-grande{width:44px;height:26px}
.sw-grande::after{width:22px;height:22px}
.freno-sw[aria-checked="true"] .sw{background:var(--tinta)}
.freno-sw[aria-checked="true"] .sw::after{transform:translateX(18px)}
.freno-sw[aria-checked="true"] .fs-ico{background:var(--tinta);color:#fff}
.freno-lista{display:flex;flex-direction:column;gap:6px}
.freno-lista li{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;padding:8px 12px;background:rgba(255,255,255,.6);border-radius:10px}
.freno-lista em{font:600 11px 'Albert Sans';font-style:normal;padding:4px 8px;border-radius:7px;background:var(--verde-p);color:#237A33;transition:background-color .25s,color .25s;white-space:nowrap}
.freno-lista.pausa em{background:#ECEBF5;color:var(--texto-2)}

/* ═════════ 9 · CIERRE ═════════ */
.cierre{background:var(--tinta);color:#fff;margin-top:clamp(96px,11vw,150px);position:relative;overflow:hidden;isolation:isolate}
.cierre::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 50% at 50% 0%,rgba(166,82,255,.3),transparent 70%),radial-gradient(40% 40% at 90% 90%,rgba(22,112,249,.22),transparent 70%)}
.cierre-in{display:flex;flex-direction:column;align-items:center;text-align:center;padding-top:clamp(96px,11vw,150px);padding-bottom:clamp(80px,9vw,120px)}
.cierre-ico img{border-radius:24px;box-shadow:0 0 0 1.5px rgba(255,255,255,.2),0 30px 60px -20px rgba(0,0,0,.6)}
.cierre-historia{margin-top:28px;font-size:clamp(17px,1.4vw,20px);line-height:1.6;color:rgba(255,255,255,.7);max-width:52ch}
.cierre-h{margin-top:40px;font:800 clamp(40px,5.8vw,84px)/1 Gabarito;letter-spacing:-.035em;max-width:17ch;text-wrap:balance}
.cierre-cta{margin-top:48px;display:flex;flex-direction:column;align-items:center;gap:16px}
.cierre-cta p{font-size:15px;color:rgba(255,255,255,.6);max-width:44ch}
.pie{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:28px;padding-bottom:36px;border-top:1px solid rgba(255,255,255,.1)}
.pie img{height:66px;width:auto}
.pie p{font-size:14px;color:rgba(255,255,255,.5)}

/* ═════════ RESPONSIVO ═════════ */
@media (max-width:1180px){
  .app{grid-template-columns:0 270px minmax(0,1fr)}
  .app-carp{display:none}
  .bandeja-grid{grid-template-columns:270px minmax(0,1fr);gap:32px}
  .coex{grid-template-columns:1fr;gap:48px}
  .coex-escena{max-width:760px}
}
@media (max-width:980px){
  :root{--gutter:24px}
  .lib-in{grid-template-columns:1fr;gap:28px}
  .lib-pin{padding:84px 0 20px}
  .portada-in{grid-template-columns:1fr;gap:56px}
  .avisos{justify-self:start;transform:rotate(-3deg)}
  .barra-nav{display:none}
  .barra .btn{margin-left:auto}
  .bandeja-grid{grid-template-columns:1fr;gap:20px}
  .pasos{display:grid;grid-template-columns:1fr}
  .js .pasos .paso{grid-area:1/1}
  .js .paso:not(.on){opacity:0;pointer-events:none}
  .js .paso.on{background:transparent;box-shadow:none;padding:0}
  .js .paso.on::before{display:none}
  .pasos-dots{display:flex}
  .ia-in{grid-template-columns:1fr;gap:40px}
  .bento{grid-template-columns:1fr 1fr}
  .bt-hoy{grid-column:1/-1}
  .bt-plant{grid-row:auto}
  .bt-plant .bt-demo{min-height:0;height:auto}
  .sil-in{grid-template-columns:1fr;grid-template-rows:auto auto auto;gap:18px;padding-top:96px}
  .sil-der{flex-direction:row;align-items:center;justify-content:flex-start;gap:20px}
  .cuenta{width:180px}
  .sil-ficha{margin-top:0;flex:1}
  .cols{grid-template-columns:repeat(2,minmax(0,1fr))}
  .col-1,.col-2{display:none}
}
@media (max-width:760px){
  :root{--gutter:16px}
  body{font-size:16px}
  .barra{top:10px;height:54px;border-radius:15px;width:calc(100% - 20px)}
  .barra-firma{height:26px}
  .barra .btn-chico{height:38px;padding:0 13px;font-size:14px}
  .portada{padding:104px 0 80px;min-height:auto}
  .firma{width:78%;margin-bottom:14px}
  .portada-h1{font-size:clamp(34px,10vw,46px)}
  .btn-grande{height:54px;width:100%}
  .portada-cta{align-items:stretch}
  .avisos{width:100%}
  .aviso{grid-template-columns:38px minmax(0,1fr) auto;padding:11px 12px 11px 11px;border-radius:17px}
  .aviso-av{width:38px;height:38px}
  .aviso span{font-size:12.5px}
  .lib-beats p{font-size:20px}
  .lib-lema{font-size:26px!important}
  .lib-prog{margin-top:16px}
  .lib-hoja{padding:16px 16px 10px}
  .lib-hoja::before{background:linear-gradient(90deg,transparent 46px,#E9D8FF 46px,#E9D8FF 48px,transparent 48px),repeating-linear-gradient(180deg,transparent 0 35px,#DCE7FB 35px 36px);background-position:0 0,0 18px}
  .lib-cab{height:40px}
  .lib-cab-mano{font-size:23px;padding-left:40px}
  .lib-cab-ui b{font-size:17px}
  .lr{grid-template-columns:38px minmax(0,1fr) 104px;height:72px;gap:10px}
  .lr-marca img{width:38px;height:38px}
  .lr-mano{font-size:25px}
  .lr-rayas{width:104px}
  .lr-ui b{font-size:14px}
  .lr-ui small{font-size:12px}
  .bandeja-pin{padding:80px 0 12px}
  .app{grid-template-columns:minmax(0,1fr);height:470px}
  .app-lista,.app-hilo{grid-area:1/1}
  .js .app[data-paso="0"] .app-hilo{opacity:0;transform:translateX(40px);pointer-events:none;filter:none}
  .js .app:not([data-paso="0"]) .app-lista{opacity:0;transform:translateX(-40px);filter:none}
  .hilo-cab .btn-mini-tinta{display:none}
  .b{max-width:88%}
  .ia-off{display:none}
  .caja-inf>.i:nth-of-type(n+2){display:none}
  .vent-tip{left:auto;right:-40px;margin-left:0}
  .vent-tip::after{left:auto;right:60px}
  .coex-escena{grid-template-columns:1fr;justify-items:start}
  .coex-hilo{display:none}
  .cel{width:210px;height:420px;border-radius:36px}
  .cel-cab{border-radius:27px 27px 0 0;padding-top:36px}
  .cel-caja{border-radius:0 0 27px 27px}
  .coex-tally{width:calc(100% - 44px);justify-self:end;margin-top:-190px}
  .ct-msgs{min-height:0}
  .sil-dia{margin-top:14px}
  .sil-dia-n{font-size:104px}
  .sil-sub{font-size:16px;margin-top:10px}
  .sil-textos{margin-top:12px;min-height:4.3em}
  .sil-textos p{font-size:17px}
  .sil-in{gap:10px;padding-top:84px;padding-bottom:22px}
  .sil-in{grid-template-columns:minmax(0,1fr) 128px;grid-template-rows:none;gap:0 8px}
  .sil-izq,.sil-der{display:contents}
  .sil-in{grid-template-areas:"h h" "sub sub" "dia cu" "txt txt" "fi fi" "ri ri";align-content:center}
  .sil-izq>.h2{grid-area:h}.sil-sub{grid-area:sub}.sil-textos{grid-area:txt}.sil-ficha{grid-area:fi}.sil-riel{grid-area:ri}
  .sil-dia{grid-area:dia;align-self:center}
  .sil-cuenta{grid-area:cu;align-self:center;margin-top:14px}
  .cuenta{width:128px}
  .sil-ficha{width:100%;padding:12px;margin-top:14px}
  .sil-riel{margin-top:18px}
  .silencio.grande{height:22px}
  .h2{font-size:clamp(32px,8.6vw,40px)}
  .tablero-marco{padding:12px;margin-top:32px}
  .tab-res{display:none}
  .col{min-height:330px;padding:9px}
  .dlg{padding:14px}
  .modos{display:grid;width:100%}
  .modo{padding:12px 8px;font-size:14px}
  .ia-chat{height:460px}
  .bento{grid-template-columns:1fr}
  .hoy{padding:16px}
  .hoy-fila{grid-template-columns:1fr}
  .hoy-nec{height:auto;flex-direction:row;align-items:center;flex-wrap:wrap}
  .hoy-nec b{font-size:30px;margin-left:6px}
  .hoy-nec em{margin-top:0;margin-left:auto;align-self:center}
  .hoy-pend li{grid-template-columns:24px minmax(0,1fr) auto 26px;gap:8px}
  .hoy-pend img{width:24px;height:24px}
  .hoy-pend span{font-size:13px}
  .hoy-pend time{font-size:10.5px;padding:3px 5px}
  .ck{width:26px;height:26px}
  .bt-hoy .bt-demo{height:auto}
  .pie{flex-direction:column;align-items:flex-start}
  .btn-enorme{height:62px;font-size:16.5px;padding:0 20px;width:100%}
  .cierre-cta{align-self:stretch}
}

/* ═════════ MOVIMIENTO REDUCIDO: todo quieto y legible ═════════ */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .entra{opacity:1;transform:none}
  .js .fw,.js .h1-in,.js .f-punto,.js .f-rayos{transform:none}
  .js .avisos-cab,.js .avisos-lista>.aviso{opacity:1}
  .js .lib-beats p{grid-area:auto;opacity:1;transform:none}
  .js .lib-beats p+p{margin-top:18px}
  .js .lib-prog{display:none}
  .js .paso{opacity:1}
  .js .paso.on{background:transparent;box-shadow:none}
  .js .paso.on::before{display:none}
  .js .pasos .paso{grid-area:auto}
  .js .app[data-paso="0"] .app-hilo{opacity:1;filter:none}
  .parte .pw>span{transform:none}
}