/* Kaza CRM by Chatfor · proposta interativa. Tokens em DESIGN.md (Chatfor + ChatforUX). */
@font-face{font-family:'Inter';font-weight:400;font-display:swap;src:url(a/f/Inter-Regular.woff2) format('woff2')}
@font-face{font-family:'Inter';font-weight:500;font-display:swap;src:url(a/f/Inter-Medium.woff2) format('woff2')}
@font-face{font-family:'Inter';font-weight:600;font-display:swap;src:url(a/f/Inter-SemiBold.woff2) format('woff2')}
@font-face{font-family:'Inter';font-weight:700;font-display:swap;src:url(a/f/Inter-Bold.woff2) format('woff2')}
@font-face{font-family:'Jakarta';font-weight:600;font-display:swap;src:url(a/f/PlusJakartaSans-SemiBold.ttf) format('truetype')}
@font-face{font-family:'Jakarta';font-weight:700;font-display:swap;src:url(a/f/PlusJakartaSans-Bold.ttf) format('truetype')}
@font-face{font-family:'Jakarta';font-weight:800;font-display:swap;src:url(a/f/PlusJakartaSans-ExtraBold.ttf) format('truetype')}

:root{
  --carbon:#0d0d0d; --carbon-2:#141414; --carbon-3:#1c1c1c; --carbon-4:#262626;
  --d-line:rgba(255,255,255,.1); --d-line-2:rgba(255,255,255,.16);
  --snow:#fafafa; --d-mute:#a1a1a1; --d-mute-2:#6f6f6f;
  --paper:#f4f4f4; --surface:#fff; --surface-2:#fafafa; --fill:#f0f0f0; --fill-2:#e9e9e9;
  --line:#ebebeb; --line-2:#dedede;
  --ink:#0d0d0d; --ink-2:#3b3b3b; --ink-3:#6e6e6e; --ink-4:#a3a3a3;
  --lime:#99ea48; --lime-hover:#8dd63e; --lime-soft:#f0fce0; --lime-ink:#3d7410;
  --indigo:#818cf8; --indigo-ink:#4f46e5; --indigo-soft:#eef0ff;
  --ok:#2f7d32; --ok-bg:#edf6ea; --warn:#8a5a00; --warn-bg:#fbf3db; --bad:#b42318; --bad-bg:#fdecea; --info:#1f5f99; --info-bg:#e9f1fa;
  --display:'Jakarta','Plus Jakarta Sans','Inter',system-ui,sans-serif;
  --ui:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --ease:cubic-bezier(.16,1,.3,1); --t:200ms; --t-slow:320ms;
  --sh-2:0 1px 2px rgba(0,0,0,.04),0 4px 12px rgba(0,0,0,.04);
  --sh-3:0 2px 6px rgba(0,0,0,.06),0 16px 40px rgba(0,0,0,.10);
  --sh-win:0 0 0 1px rgba(0,0,0,.04),0 30px 80px -20px rgba(0,0,0,.45);
  --u:min(1vw,1.78vh);
  --gx:clamp(16px,calc(var(--u)*5.2),96px);
  --top:64px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--carbon);color:var(--snow);font:400 15px/1.5 var(--ui);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow:hidden}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;padding:0}
input,textarea{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--lime);outline-offset:2px;border-radius:6px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
svg.lucide{width:16px;height:16px;stroke-width:1.75;flex:none}

/* ---------- barra superior ---------- */
.bar{position:fixed;inset:0 0 auto 0;z-index:30;height:var(--top);padding:0 var(--gx);padding-top:env(safe-area-inset-top,0px);display:flex;align-items:center;gap:16px;transition:background var(--t),color var(--t),border-color var(--t);border-bottom:1px solid transparent}
.bar.on-light{color:var(--ink)}
.bar.scrolled{background:rgba(13,13,13,.72);backdrop-filter:blur(20px) saturate(160%);-webkit-backdrop-filter:blur(20px) saturate(160%);border-color:var(--d-line)}
.bar.on-light.scrolled{background:rgba(250,250,250,.78);border-color:var(--line)}
.brandpair{display:flex;align-items:center;gap:14px;min-width:0}
.brandpair .kz{height:30px;width:auto}
.brandpair .x{opacity:.4;font:500 13px var(--ui)}
.brandpair .cf{height:16px;width:auto}
.bar.on-light .kz,.bar.on-light .cf-w{filter:invert(1)}
.bar .chap{flex:1;text-align:center;font:700 11px/1 var(--ui);letter-spacing:.1em;text-transform:uppercase;opacity:.55;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bar .ctl{display:flex;align-items:center;gap:6px}
.pill-btn{height:34px;padding:0 14px;border-radius:999px;display:inline-flex;align-items:center;gap:8px;font:600 13px var(--ui);border:1px solid var(--d-line-2);transition:background var(--t),border-color var(--t),transform 120ms}
.pill-btn:hover{background:rgba(255,255,255,.08)}
.pill-btn:active{transform:scale(.97)}
.bar.on-light .pill-btn{border-color:var(--line-2)}
.bar.on-light .pill-btn:hover{background:var(--fill)}
.pill-btn[aria-pressed="true"]{background:var(--lime);color:var(--carbon);border-color:var(--lime)}
.count{font:600 13px var(--ui);font-variant-numeric:tabular-nums;opacity:.7;min-width:56px;text-align:right}
.prog{position:fixed;left:0;right:0;top:calc(var(--top) + env(safe-area-inset-top,0px));height:2px;z-index:31;pointer-events:none}
.prog i{display:block;height:100%;width:0;background:var(--lime);transition:width var(--t-slow) var(--ease)}
.tour-meter{position:fixed;left:0;bottom:0;height:3px;background:var(--indigo);width:0;z-index:31}

.nav-arrows{position:fixed;right:var(--gx);bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:30;display:flex;gap:8px}
.nav-arrows button{width:44px;height:44px;border-radius:999px;display:grid;place-items:center;background:rgba(30,30,30,.7);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid var(--d-line-2);color:var(--snow);transition:transform 120ms,background var(--t)}
.nav-arrows button:hover{background:rgba(50,50,50,.85)}
.nav-arrows button:active{transform:scale(.94)}
.nav-arrows button:disabled{opacity:.35;cursor:default}

/* ---------- índice ---------- */
.idx{position:fixed;inset:0;z-index:60;background:rgba(8,8,8,.6);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;justify-content:flex-end}
.idx-panel{width:min(440px,100%);height:100%;background:var(--carbon-2);border-left:1px solid var(--d-line);padding:calc(24px + env(safe-area-inset-top,0px)) 24px 24px;overflow:auto;animation:slideIn var(--t-slow) var(--ease)}
@keyframes slideIn{from{transform:translateX(24px);opacity:0}}
.idx-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.idx-head h2{font:800 22px/1 var(--display);letter-spacing:-.03em;margin:0}
.idx ol{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.idx li button{width:100%;text-align:left;display:grid;grid-template-columns:34px 1fr;gap:8px;padding:10px 12px;border-radius:10px;align-items:baseline}
.idx li button:hover{background:var(--carbon-3)}
.idx li button[aria-current="true"]{background:var(--carbon-4)}
.idx li .n{font:600 12px var(--ui);color:var(--d-mute-2);font-variant-numeric:tabular-nums}
.idx li .t{font:500 14px/1.35 var(--ui)}
.idx li .t small{display:block;color:var(--d-mute);font-size:12px;margin-top:2px}

/* ---------- deck ---------- */
.deck{height:100%;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;scroll-behavior:smooth;overscroll-behavior:contain}
.sl{position:relative;min-height:100dvh;height:100dvh;scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden;display:flex;flex-direction:column;padding:calc(var(--top) + clamp(16px,calc(var(--u)*3),48px)) var(--gx) 0}
.sl.dark{background:var(--carbon);color:var(--snow)}
.sl.light{background:var(--snow);color:var(--ink)}
.sl .body{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center}
.sl .foot{flex:none;height:64px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--d-line);margin-top:clamp(12px,calc(var(--u)*2),28px)}
.sl.light .foot{border-color:var(--line)}
.label{font:700 11px/1 var(--ui);letter-spacing:.1em;text-transform:uppercase}
.foot .label{opacity:.6}
.foot .sig{font:600 12px var(--ui);opacity:.4;padding-right:110px}

/* tipografia */
.h1{font:800 clamp(46px,calc(var(--u)*7.6),132px)/.94 var(--display);letter-spacing:-.05em;margin:0;text-wrap:balance}
.h2{font:800 clamp(30px,calc(var(--u)*4),70px)/1.02 var(--display);letter-spacing:-.045em;margin:0;text-wrap:balance}
.h3{font:800 clamp(26px,calc(var(--u)*2.9),50px)/1.04 var(--display);letter-spacing:-.04em;margin:0;text-wrap:balance}
.lead{font:400 clamp(16px,calc(var(--u)*1.35),23px)/1.5 var(--ui);margin:0;max-width:60ch;text-wrap:pretty}
.mute{color:var(--d-mute)}
.light .mute{color:var(--ink-3)}
.soft{opacity:.42}
.lime{color:var(--lime)}
.light .lime{color:var(--lime-ink)}

/* entrada dos elementos: estado final é o visível */
.rv{transition:opacity .7s var(--ease),transform .7s var(--ease)}
.sl:not(.seen) .rv{opacity:0;transform:translateY(18px)}
.sl.seen .rv{transition-delay:calc(var(--i,0) * 70ms)}

/* ---------- capa ---------- */
.cover{padding-top:var(--top)}
.cover .vidro{position:absolute;inset:0 48% 0 0;background:url(a/vidro.webp) center/cover;mask-image:linear-gradient(90deg,#000 55%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 55%,transparent)}
.cover .vidro::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,13,13,0) 40%,var(--carbon))}
.cover .body{position:relative;margin-left:42%;max-width:820px;gap:clamp(14px,calc(var(--u)*1.8),28px)}
.cover .h1 .by{display:block;font-size:.42em;letter-spacing:-.03em;color:var(--d-mute);margin-top:.18em;font-weight:700}
.cover .h1 .by b{color:var(--snow);font-weight:800}
.cover .praças{font:500 14px var(--ui);color:var(--d-mute)}
.cover .tag{font:700 clamp(16px,calc(var(--u)*1.3),22px)/1.35 var(--display);letter-spacing:-.02em;max-width:34ch}
.cover .tag span{color:var(--lime)}
.cover .row{display:flex;align-items:center;gap:20px;flex-wrap:wrap;margin-top:6px}
.btn-lime{height:48px;padding:0 22px;border-radius:999px;background:var(--lime);color:var(--carbon);font:700 15px var(--ui);display:inline-flex;align-items:center;gap:10px;transition:transform 120ms,background var(--t)}
.btn-lime:hover{background:var(--lime-hover)}
.btn-lime:active{transform:scale(.97)}
.mbp{height:34px;width:auto;opacity:.85}

/* ---------- quem somos ---------- */
.about{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(28px,calc(var(--u)*6),110px);align-items:center}
.about .copy{display:grid;gap:clamp(16px,calc(var(--u)*2),30px)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{height:32px;padding:0 13px;border-radius:999px;border:1px solid var(--line-2);display:inline-flex;align-items:center;gap:7px;font:600 13px var(--ui);color:var(--ink-2);background:var(--surface)}
.dark .chip{border-color:var(--d-line-2);color:var(--snow);background:transparent}
.founder{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:end}
.founder img{width:clamp(150px,calc(var(--u)*17),280px);aspect-ratio:4/5;object-fit:cover;border-radius:20px;filter:grayscale(.15)}
.founder p{margin:0;font:500 15px/1.55 var(--ui);color:var(--ink-2);max-width:30ch}
.founder p b{display:block;font:800 20px/1.2 var(--display);letter-spacing:-.03em;color:var(--ink);margin-bottom:6px}

/* ---------- o que fazemos ---------- */
.two{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,calc(var(--u)*2),32px);margin-top:clamp(24px,calc(var(--u)*4),64px)}
.svc{border:1px solid var(--d-line);border-radius:24px;padding:clamp(22px,calc(var(--u)*3),48px);display:grid;gap:14px;align-content:start;background:var(--carbon-2);position:relative;overflow:hidden}
.svc .ic{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--carbon-4)}
.svc .ic svg{width:22px;height:22px}
.svc h3{font:800 clamp(22px,calc(var(--u)*2.2),38px)/1.08 var(--display);letter-spacing:-.035em;margin:0}
.svc p{margin:0;color:var(--d-mute);font-size:clamp(15px,calc(var(--u)*1.2),19px);line-height:1.55;max-width:44ch}
.svc .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.svc .tags span{font:600 12px var(--ui);padding:5px 10px;border-radius:999px;background:var(--carbon-4);color:var(--snow)}
.svc.hl{background:var(--snow);color:var(--ink);border-color:var(--snow)}
.svc.hl p{color:var(--ink-3)}
.svc.hl .ic{background:var(--carbon);color:var(--lime)}
.svc.hl .tags span{background:var(--fill);color:var(--ink)}
.closing{margin-top:clamp(20px,calc(var(--u)*3.5),56px);font:800 clamp(22px,calc(var(--u)*2.3),40px)/1.1 var(--display);letter-spacing:-.04em}

/* ---------- como fazemos ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(12px,calc(var(--u)*1.6),28px);margin-top:clamp(28px,calc(var(--u)*4.5),72px);position:relative}
.steps::before{content:"";position:absolute;left:0;right:0;top:19px;height:1px;background:var(--line-2)}
.steps .line{position:absolute;left:0;top:19px;height:1px;background:var(--carbon);width:0;transition:width 1.6s var(--ease) .2s}
.sl.seen .steps .line{width:100%}
.step{position:relative;display:grid;gap:12px;align-content:start}
.step .n{width:38px;height:38px;border-radius:999px;background:var(--snow);border:1px solid var(--line-2);display:grid;place-items:center;font:700 13px var(--ui);font-variant-numeric:tabular-nums;transition:background var(--t),color var(--t),border-color var(--t)}
.sl.seen .step .n{background:var(--carbon);color:var(--lime);border-color:var(--carbon);transition-delay:calc(var(--i,0)*380ms + .3s)}
.step h3{margin:6px 0 0;font:800 clamp(20px,calc(var(--u)*1.9),32px)/1.1 var(--display);letter-spacing:-.035em}
.step p{margin:0;color:var(--ink-3);font-size:clamp(14px,calc(var(--u)*1.1),17px);line-height:1.55}
.byline{margin-top:clamp(28px,calc(var(--u)*4.5),72px);padding:18px 22px;border-radius:16px;background:var(--paper);display:flex;gap:14px;align-items:center;font:500 clamp(14px,calc(var(--u)*1.15),18px)/1.5 var(--ui);color:var(--ink-2)}
.byline b{color:var(--ink)}
.byline svg{width:22px;height:22px;flex:none}

/* ---------- cases ---------- */
.cases{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:12px;margin-top:clamp(18px,calc(var(--u)*2.6),40px);flex:1;min-height:0;max-height:520px}
.case{position:relative;border-radius:20px;overflow:hidden;background:var(--carbon-2);border:1px solid var(--d-line);padding:clamp(16px,calc(var(--u)*1.8),26px);display:flex;flex-direction:column;justify-content:space-between;gap:10px;min-height:0}
.case .lg{height:clamp(22px,calc(var(--u)*2.4),34px);width:auto;max-width:70%;object-fit:contain;object-position:left}
.case .seg{font:600 12px var(--ui);color:var(--d-mute)}
.case .big{font:800 clamp(30px,calc(var(--u)*3.8),62px)/1 var(--display);letter-spacing:-.05em;color:var(--lime)}
.case p{margin:0;font-size:clamp(13px,calc(var(--u)*1.05),16px);line-height:1.45;color:#d6d6d6}
.case.feat{grid-row:span 2;background:var(--snow);color:var(--ink);border-color:var(--snow)}
.case.feat .lg{filter:invert(1)}
.case.feat .seg{color:var(--ink-3)}
.case.feat .big{color:var(--ink)}
.case.feat p{color:var(--ink-2)}
.case.photo{padding:0}
.case.photo img.ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 22%}
.case.photo .capt{position:relative;margin-top:auto;padding:clamp(14px,calc(var(--u)*1.6),22px);background:linear-gradient(transparent,rgba(0,0,0,.82) 45%);display:grid;gap:4px}
.case.photo .capt b{font:800 18px/1.1 var(--display);letter-spacing:-.03em}
.case.wide{grid-column:span 2}
.logos{display:flex;align-items:center;gap:clamp(18px,calc(var(--u)*3),48px);flex-wrap:wrap;margin-top:16px}
.logos img{height:22px;width:auto;opacity:.55}
.logos .sep{flex:1}
.logos img.selo{height:34px;opacity:1}

/* ---------- ponto central ---------- */
.center{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,calc(var(--u)*5),90px);align-items:center}
.center .copy{display:grid;gap:clamp(16px,calc(var(--u)*2.2),32px)}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.kpi{border-top:2px solid var(--carbon);padding-top:14px;display:grid;gap:6px}
.kpi b{font:800 clamp(34px,calc(var(--u)*4.6),76px)/1 var(--display);letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.kpi span{font:500 14px/1.35 var(--ui);color:var(--ink-3)}
.dots-wrap{position:relative;aspect-ratio:1;max-height:62vh;width:100%;margin:auto;display:grid;place-items:center}
.dots{display:grid;grid-template-columns:repeat(20,1fr);gap:clamp(4px,calc(var(--u)*.55),9px);width:100%}
.dots i{aspect-ratio:1;border-radius:999px;background:var(--fill-2);transition:background .5s,transform .5s var(--ease)}
.dots i.on{background:var(--carbon)}
.dots i.sp{background:var(--carbon)}
.dots i.sjc{background:var(--lime-ink)}
.dots i.jac{background:var(--indigo-ink)}
.dots-legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:14px;font:600 12px var(--ui);color:var(--ink-3)}
.dots-legend span{display:inline-flex;align-items:center;gap:6px}
.dots-legend i{width:9px;height:9px;border-radius:99px;display:inline-block}

/* ---------- módulos ---------- */
.mod{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7.4fr);gap:clamp(24px,calc(var(--u)*4),72px);align-items:center;flex:1;min-height:0}
.mod.flip{grid-template-columns:minmax(0,7.4fr) minmax(0,5fr)}
.mod.flip .copy{order:2}
.mod .copy{display:grid;gap:clamp(12px,calc(var(--u)*1.6),22px);align-content:center}
.modno{display:inline-flex;align-items:center;gap:10px;font:700 11px/1 var(--ui);letter-spacing:.1em;text-transform:uppercase;color:var(--d-mute)}
.light .modno{color:var(--ink-3)}
.modno b{font:800 13px var(--display);letter-spacing:0;color:var(--carbon);background:var(--lime);border-radius:6px;padding:4px 7px}
.mod .sub{margin:0;color:var(--d-mute);font-size:clamp(15px,calc(var(--u)*1.2),19px);line-height:1.5}
.light .mod .sub{color:var(--ink-3)}
.pts{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:clamp(8px,calc(var(--u)*1),14px)}
.pts li{display:grid;grid-template-columns:22px 1fr;gap:10px;font-size:clamp(14px,calc(var(--u)*1.12),17.5px);line-height:1.5;color:#d9d9d9}
.light .pts li{color:var(--ink-2)}
.pts li svg{margin-top:3px;width:16px;height:16px;color:var(--lime)}
.light .pts li svg{color:var(--lime-ink)}
.pts li.on{color:var(--snow)}
.light .pts li.on{color:var(--ink)}

/* ---------- janela do CRM (ChatforUX) ---------- */
.win{background:var(--paper);color:var(--ink);border-radius:20px;box-shadow:var(--sh-win);overflow:hidden;display:flex;flex-direction:column;min-height:0;max-height:calc(100dvh - var(--top) - 150px);font-size:13px;line-height:1.45;position:relative}
.light .win{box-shadow:0 0 0 1px var(--line),0 30px 70px -30px rgba(0,0,0,.28)}
.win-top{height:46px;flex:none;display:flex;align-items:center;gap:10px;padding:0 14px;background:var(--surface);border-bottom:1px solid var(--line)}
.win-top .kzm{height:18px;width:auto;filter:invert(1)}
.win-top .crumb{font:600 13px var(--ui);color:var(--ink-3);display:flex;gap:6px;align-items:center;white-space:nowrap;overflow:hidden}
.win-top .crumb b{color:var(--ink);font-weight:600}
.win-top .sp{flex:1}
.win-top .ex{font:600 11px var(--ui);color:var(--ink-3);background:var(--fill);border-radius:999px;padding:4px 9px;white-space:nowrap}
.win-body{flex:1;min-height:0;display:flex;overflow:hidden}
.win-body > *{min-width:0}
.wbtn{height:30px;padding:0 12px;border-radius:8px;display:inline-flex;align-items:center;gap:6px;font:600 12.5px var(--ui);background:var(--surface);border:1px solid var(--line-2);color:var(--ink);transition:background var(--t),transform 120ms;white-space:nowrap}
.wbtn:hover{background:var(--fill)}
.wbtn:active{transform:scale(.97)}
.wbtn.pri{background:var(--carbon);color:#fff;border-color:var(--carbon)}
.wbtn.pri:hover{background:#262626}
.wbtn.ai{background:var(--indigo-soft);color:var(--indigo-ink);border-color:#dfe2ff}
.wbtn:disabled{opacity:.45;cursor:default}
.wbtn svg{width:14px;height:14px}
.seg-ctl{display:inline-flex;background:var(--fill);border-radius:9px;padding:2px;gap:2px;flex-wrap:wrap}
.seg-ctl button{height:26px;padding:0 10px;border-radius:7px;font:600 12px var(--ui);color:var(--ink-3);white-space:nowrap}
.seg-ctl button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:var(--sh-2)}
.badge{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:999px;font:600 11.5px var(--ui);white-space:nowrap}
.b-ok{background:var(--ok-bg);color:var(--ok)} .b-warn{background:var(--warn-bg);color:var(--warn)} .b-bad{background:var(--bad-bg);color:var(--bad)} .b-info{background:var(--info-bg);color:var(--info)}
.b-ai{background:var(--indigo-soft);color:var(--indigo-ink)} .b-lime{background:var(--lime-soft);color:var(--lime-ink)} .b-mute{background:var(--fill);color:var(--ink-3)}
.av{width:28px;height:28px;border-radius:999px;object-fit:cover;flex:none;background:var(--fill-2)}
.av.sm{width:22px;height:22px} .av.lg{width:40px;height:40px}
.ai-av{width:28px;height:28px;border-radius:999px;background:var(--carbon);display:grid;place-items:center;flex:none}
.ai-av img{width:14px;height:auto}
.card-w{background:var(--surface);border:1px solid var(--line);border-radius:14px}
.ttl{font:600 13px var(--ui);color:var(--ink)}
.cap{font:500 11.5px var(--ui);color:var(--ink-3)}
.num{font-variant-numeric:tabular-nums}
.metric{font:700 22px/1.1 var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.scroll-y{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}

/* chat (WhatsApp oficial dentro do CRM) */
.chat{display:flex;flex-direction:column;min-height:0;flex:1;background:var(--surface)}
.chat-h{flex:none;height:52px;display:flex;align-items:center;gap:10px;padding:0 14px;border-bottom:1px solid var(--line)}
.chat-h .who b{display:block;font:600 13px var(--ui)} .chat-h .who span{font:500 11.5px var(--ui);color:var(--ink-3)}
.chat-h .sp{flex:1}
.msgs{flex:1;min-height:0;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px;background:var(--surface-2);scroll-behavior:smooth;overscroll-behavior:contain}
.day{align-self:center;font:600 11px var(--ui);color:var(--ink-3);background:var(--fill);padding:3px 10px;border-radius:999px;margin:2px 0}
.m{max-width:82%;padding:8px 11px;border-radius:14px;font-size:13px;line-height:1.45;animation:pop .32s var(--ease) both;position:relative;white-space:pre-line}
@keyframes pop{from{opacity:0;transform:translateY(6px) scale(.98)}}
.m.in{align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:4px}
.m.out{align-self:flex-end;background:var(--carbon);color:#fff;border-bottom-right-radius:4px}
.m.ai{align-self:flex-end;background:var(--indigo-soft);color:#1e1b4b;border:1px solid #e0e3ff;border-bottom-right-radius:4px}
.m.me{align-self:flex-end;background:var(--carbon);color:#fff;border-bottom-right-radius:4px}
.m .meta{display:flex;gap:6px;align-items:center;justify-content:flex-end;font:500 10.5px var(--ui);opacity:.6;margin-top:3px}
.m.ai .tag{display:inline-flex;align-items:center;gap:4px;font:700 10px var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--indigo-ink);margin-bottom:3px}
.m.ai .tag img{width:10px}
.m.sys{align-self:center;background:transparent;color:var(--ink-3);font:600 11.5px var(--ui);display:flex;gap:6px;align-items:center;padding:4px 8px;max-width:95%;text-align:center}
.m.sys svg{width:13px;height:13px}
.m.sys.ok{color:var(--ok)} .m.sys.ai{color:var(--indigo-ink)}
.typing{align-self:flex-end;display:flex;gap:4px;padding:10px 12px;background:var(--indigo-soft);border-radius:14px;border-bottom-right-radius:4px}
.typing.l{align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:14px;border-bottom-left-radius:4px}
.typing i{width:6px;height:6px;border-radius:99px;background:var(--indigo);animation:blink 1.1s infinite}
.typing.l i{background:var(--ink-4)}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{0%,60%,100%{opacity:.3;transform:none}30%{opacity:1;transform:translateY(-2px)}}
.qr{flex:none;display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px;border-top:1px solid var(--line);background:var(--surface);min-height:52px;align-items:center}
.qr .hint{font:600 11px var(--ui);color:var(--ink-3);width:100%;display:flex;align-items:center;gap:6px}
.qr button{height:30px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);font:600 12.5px var(--ui);background:var(--surface);transition:background var(--t),border-color var(--t),transform 120ms}
.qr button:hover{background:var(--fill);border-color:var(--ink-4)}
.qr button:active{transform:scale(.97)}
.compose{flex:none;display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:var(--surface)}
.compose input{flex:1;min-width:0;height:36px;border-radius:10px;border:1px solid var(--line-2);padding:0 12px;background:var(--surface-2);color:var(--ink);font-size:13px}
.compose input::placeholder{color:var(--ink-4)}
.compose input:focus{outline:none;border-color:var(--ink-3);background:var(--surface)}

/* perfil do lead */
.side{width:280px;flex:none;border-left:1px solid var(--line);background:var(--surface);display:flex;flex-direction:column;min-height:0}
.side-h{padding:14px;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:center}
.fields{padding:8px 14px 14px;display:grid;gap:0}
.fld{display:grid;grid-template-columns:110px 1fr;gap:8px;padding:8px 0;border-bottom:1px dashed var(--line);font-size:12.5px;align-items:center}
.fld:last-child{border-bottom:0}
.fld span{color:var(--ink-3);font-weight:500}
.fld b{font-weight:600;min-height:18px;display:flex;align-items:center;gap:6px}
.fld b.empty{color:var(--ink-4);font-weight:500}
.fld b.new{animation:flash 1.2s var(--ease)}
@keyframes flash{0%{background:var(--indigo-soft);box-shadow:0 0 0 4px var(--indigo-soft)}100%{background:transparent;box-shadow:0 0 0 4px transparent}}
.score{margin:0 14px 14px;padding:12px;border-radius:12px;background:var(--fill);display:grid;gap:8px}
.score .row{display:flex;justify-content:space-between;align-items:center}
.meter{height:6px;border-radius:99px;background:var(--fill-2);overflow:hidden}
.meter i{display:block;height:100%;width:0;background:var(--carbon);border-radius:99px;transition:width .6s var(--ease)}
.handoff{margin:0 14px 14px;padding:12px;border-radius:12px;background:var(--lime-soft);color:#1f3d08;font-size:12.5px;line-height:1.5;display:none;gap:8px;animation:pop .4s var(--ease)}
.handoff.show{display:grid}
.handoff .who{display:flex;gap:8px;align-items:center;font-weight:600}

/* kanban */
.kb{display:flex;gap:10px;padding:12px;overflow-x:auto;flex:1;min-height:0;align-items:stretch;scrollbar-width:thin}
.col{flex:1 0 168px;max-width:240px;display:flex;flex-direction:column;min-height:0;background:var(--fill);border-radius:14px;padding:8px;transition:background var(--t),box-shadow var(--t)}
.col.over{background:var(--lime-soft);box-shadow:inset 0 0 0 1.5px var(--lime)}
.col.lit{box-shadow:inset 0 0 0 1.5px var(--indigo)}
.col-h{display:flex;align-items:center;justify-content:space-between;padding:4px 4px 8px;font:600 12px var(--ui);color:var(--ink-2)}
.col-h .c{font:600 11px var(--ui);color:var(--ink-3);background:var(--surface);border-radius:999px;padding:1px 7px;font-variant-numeric:tabular-nums}
.col-b{display:flex;flex-direction:column;gap:6px;overflow-y:auto;min-height:40px;flex:1;scrollbar-width:none}
.dc{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:9px;display:grid;gap:6px;cursor:grab;box-shadow:var(--sh-2);user-select:none;-webkit-user-select:none;touch-action:none;transition:box-shadow var(--t),transform var(--t),opacity var(--t)}
.dc:hover{box-shadow:var(--sh-3)}
.dc.drag{opacity:.35}
.dc.ghost{position:fixed;z-index:80;pointer-events:none;box-shadow:0 20px 50px rgba(0,0,0,.25);transform:rotate(2deg);width:200px}
.dc.star{box-shadow:0 0 0 2px var(--indigo),var(--sh-3)}
.dc .r1{display:flex;align-items:center;gap:7px}
.dc .r1 b{font:600 12.5px var(--ui);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dc .r2{font:500 11.5px var(--ui);color:var(--ink-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dc .r3{display:flex;gap:4px;flex-wrap:wrap;align-items:center}
.dc .r3 .v{margin-left:auto;font:600 11.5px var(--ui);color:var(--ink-2);font-variant-numeric:tabular-nums}
.dc .badge{height:19px;font-size:10.5px;padding:0 6px}
.flying{position:fixed;z-index:80;pointer-events:none;transition:transform .7s var(--ease),opacity .3s}

/* drawer do deal */
.drawer{position:absolute;top:46px;right:0;bottom:0;width:min(360px,92%);background:var(--surface);border-left:1px solid var(--line);box-shadow:-20px 0 50px rgba(0,0,0,.12);display:flex;flex-direction:column;transform:translateX(105%);transition:transform var(--t-slow) var(--ease);z-index:5}
.drawer.open{transform:none}
.drawer .dh{padding:14px;border-bottom:1px solid var(--line);display:flex;gap:10px;align-items:center}
.drawer .dh .x{margin-left:auto;width:30px;height:30px;border-radius:8px;display:grid;place-items:center}
.drawer .dh .x:hover{background:var(--fill)}
.tl{list-style:none;margin:0;padding:14px;display:grid;gap:12px;overflow:auto}
.tl li{display:grid;grid-template-columns:24px 1fr;gap:10px;font-size:12.5px}
.tl li .i{width:24px;height:24px;border-radius:99px;display:grid;place-items:center;background:var(--fill)}
.tl li .i svg{width:13px;height:13px}
.tl li .i.ai{background:var(--indigo-soft);color:var(--indigo-ink)}
.tl li small{display:block;color:var(--ink-3);font-size:11.5px;margin-top:1px}

/* fluxo (tudo conectado) */
.flow{display:flex;gap:6px;flex-wrap:wrap;margin:clamp(14px,calc(var(--u)*2),26px) 0 clamp(12px,calc(var(--u)*1.6),20px)}
.flow .st{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 13px;border-radius:999px;border:1px solid var(--d-line-2);font:600 12.5px var(--ui);color:var(--d-mute);transition:all var(--t-slow) var(--ease);white-space:nowrap}
.flow .st svg{width:14px;height:14px}
.flow .st.done{color:var(--snow);border-color:var(--d-line-2);background:var(--carbon-3)}
.flow .st.now{color:var(--carbon);background:var(--lime);border-color:var(--lime);transform:translateY(-1px)}
.flow .ar{align-self:center;color:var(--d-mute-2)}
.flow .ar svg{width:14px;height:14px}

/* tabela */
.tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.tbl th{font:600 11px var(--ui);color:var(--ink-3);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl td{padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl tr:last-child td{border-bottom:0}
.tbl .r{text-align:right;font-variant-numeric:tabular-nums}
.tbl tr.moving td{background:var(--lime-soft);transition:background 1s}

/* barras */
.bars{display:grid;gap:9px}
.bars .b{display:grid;grid-template-columns:96px 1fr 54px;gap:10px;align-items:center;font-size:12px}
.bars .b span{color:var(--ink-2);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bars .b .tr{height:10px;border-radius:4px;position:relative}
.bars .b .tr i{position:absolute;inset:0 auto 0 0;border-radius:4px;background:var(--carbon);transition:width .7s var(--ease)}
.bars .b em{font-style:normal;font-weight:600;text-align:right;font-variant-numeric:tabular-nums}
.funnel{display:grid;gap:6px}
.funnel .f{display:grid;grid-template-columns:84px 1fr;gap:10px;align-items:center;font-size:12px}
.funnel .f span{color:var(--ink-3);font-weight:500}
.funnel .f .bx{height:28px;border-radius:7px;background:var(--carbon);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 10px;font:600 12px var(--ui);transition:width .7s var(--ease);min-width:84px;font-variant-numeric:tabular-nums}
.funnel .f:nth-child(2) .bx{background:#2e2e2e}.funnel .f:nth-child(3) .bx{background:#4a4a4a}.funnel .f:nth-child(4) .bx{background:var(--lime);color:var(--carbon)}
.funnel .f .bx small{font-weight:500;opacity:.7}

/* dash grid */
.dash{flex:1;min-height:0;overflow:auto;padding:12px;display:grid;gap:10px;grid-template-columns:repeat(4,1fr);align-content:start}
.dash .k{padding:12px;display:grid;gap:4px}
.dash .k .d{font:600 11.5px var(--ui)}
.dash .pn{padding:14px;display:grid;gap:10px;align-content:start}
.dash .w2{grid-column:span 2}.dash .w4{grid-column:span 4}
.filters{flex:none;display:flex;gap:8px;flex-wrap:wrap;padding:10px 12px;border-bottom:1px solid var(--line);background:var(--surface);align-items:center}

/* propriedade */
.props{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;margin-top:6px;width:100%}
.prop{background:var(--surface);border:1px solid var(--line);border-radius:12px;overflow:hidden;color:var(--ink);animation:pop .4s var(--ease) both}
.prop img{width:100%;aspect-ratio:3/2;object-fit:cover}
.prop .pb{padding:8px 9px;display:grid;gap:3px}
.prop .pb b{font:700 13.5px var(--display);letter-spacing:-.01em}
.prop .pb span{font:500 11.5px var(--ui);color:var(--ink-3)}
.prop .pb a{font:600 11.5px var(--ui);color:var(--indigo-ink);text-decoration:none;display:inline-flex;gap:4px;align-items:center;margin-top:2px}
.m.wide{max-width:96%;width:96%}

/* agenda */
.cal{flex:1;min-width:0;display:flex;flex-direction:column;background:var(--surface);border-left:1px solid var(--line)}
.cal-g{flex:1;min-height:0;display:grid;grid-template-columns:40px repeat(5,1fr);grid-auto-rows:minmax(30px,1fr);font-size:11px;overflow:auto;position:relative}
.cal-g .hh{color:var(--ink-4);font:500 10.5px var(--ui);padding:2px 6px 0 0;text-align:right;border-top:1px solid var(--line)}
.cal-g .cell{border-top:1px solid var(--line);border-left:1px solid var(--line);position:relative}
.cal-g .dh{font:600 11px var(--ui);color:var(--ink-2);padding:6px;border-left:1px solid var(--line);text-align:center;position:sticky;top:0;background:var(--surface);z-index:1}
.ev{position:absolute;inset:2px 3px;border-radius:6px;padding:3px 6px;font:600 10.5px/1.25 var(--ui);overflow:hidden;background:var(--fill-2);color:var(--ink-2)}
.ev.vis{background:var(--carbon);color:#fff;animation:pop .4s var(--ease)}
.ev.free{background:repeating-linear-gradient(135deg,var(--lime-soft) 0 6px,#e7f8d2 6px 12px);color:var(--lime-ink);border:1px dashed #b9e58c}
.ev.moved{opacity:.35;text-decoration:line-through}

/* roleta */
.ring{width:64px;height:64px;position:relative;flex:none}
.ring svg{width:64px;height:64px;transform:rotate(-90deg)}
.ring circle{fill:none;stroke-width:5}
.ring .bg{stroke:var(--fill-2)}
.ring .fg{stroke:var(--carbon);stroke-linecap:round;transition:stroke-dashoffset .25s linear}
.ring b{position:absolute;inset:0;display:grid;place-items:center;font:700 15px var(--display);font-variant-numeric:tabular-nums}
.queue{display:grid;gap:6px}
.qrow{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:8px 10px;border-radius:10px;border:1px solid var(--line);background:var(--surface);transition:all var(--t-slow) var(--ease)}
.qrow.cur{border-color:var(--carbon);box-shadow:0 0 0 1px var(--carbon),var(--sh-3)}
.qrow.skip{opacity:.5}
.qrow.won{border-color:var(--lime-ink);box-shadow:0 0 0 1px var(--lime-ink);background:var(--lime-soft)}
.qrow .nm{font:600 12.5px var(--ui)} .qrow .nm small{display:block;font:500 11px var(--ui);color:var(--ink-3)}

/* espelho */
.tower{display:grid;grid-template-columns:34px repeat(4,1fr);gap:4px;font-size:11px}
.tower .fl{color:var(--ink-3);font:600 10.5px var(--ui);display:grid;place-items:center}
.un{height:clamp(18px,2.6vh,26px);border-radius:5px;border:1px solid var(--line-2);background:var(--surface);font:600 10px var(--ui);color:var(--ink-3);display:grid;place-items:center;transition:background var(--t),color var(--t),transform 120ms}
.un:hover{transform:scale(1.06)}
.un.res{background:var(--warn-bg);border-color:#ecd9a0;color:var(--warn)}
.un.ven{background:var(--carbon);border-color:var(--carbon);color:#fff}
.un.pulse{animation:pulse .9s var(--ease)}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(129,140,248,.7)}100%{box-shadow:0 0 0 10px rgba(129,140,248,0)}}
.legend{display:flex;gap:12px;flex-wrap:wrap;font:600 11px var(--ui);color:var(--ink-3)}
.legend span{display:inline-flex;gap:5px;align-items:center}
.legend i{width:10px;height:10px;border-radius:3px;border:1px solid var(--line-2);display:inline-block}

/* heatmap */
.heat{display:grid;gap:3px;font-size:11.5px}
.heat .hc{height:34px;border-radius:6px;display:grid;place-items:center;font:600 11.5px var(--ui);font-variant-numeric:tabular-nums;transition:background .5s,color .5s,transform 120ms;cursor:pointer}
.heat .hc:hover{transform:scale(1.04)}
.heat .hc.sel{box-shadow:0 0 0 2px var(--indigo)}
.heat .hl{font:600 11px var(--ui);color:var(--ink-2);display:flex;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.heat .hh2{font:600 10.5px var(--ui);color:var(--ink-3);text-align:center;align-self:end;padding-bottom:3px}

/* celular */
.phone{width:min(300px,100%);aspect-ratio:9/19;max-height:calc(100dvh - var(--top) - 150px);border-radius:44px;background:#111;padding:10px;box-shadow:0 0 0 1px #333,0 40px 80px -30px rgba(0,0,0,.7);position:relative;margin:auto;flex:none}
.phone .scr{width:100%;height:100%;border-radius:35px;background:var(--paper);overflow:hidden;display:flex;flex-direction:column;position:relative;color:var(--ink)}
.phone .isl{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:84px;height:24px;background:#000;border-radius:999px;z-index:6}
.phone .sb{height:40px;flex:none;display:flex;justify-content:space-between;align-items:flex-end;padding:0 24px 4px;font:600 12px var(--ui)}
.phone .ah{flex:none;padding:6px 16px 10px;display:flex;align-items:center;gap:8px}
.phone .ah h4{margin:0;font:800 20px/1 var(--display);letter-spacing:-.03em;flex:1}
.phone .pc{flex:1;min-height:0;overflow:auto;padding:0 12px 12px;display:grid;gap:8px;align-content:start;scrollbar-width:none}
.phone .tabs{flex:none;display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);background:var(--surface);padding:6px 4px 16px}
.phone .tabs button{display:grid;justify-items:center;gap:3px;font:600 9.5px var(--ui);color:var(--ink-4)}
.phone .tabs button svg{width:19px;height:19px}
.phone .tabs button[aria-selected="true"]{color:var(--ink)}
.push{position:absolute;left:8px;right:8px;top:44px;z-index:7;padding:10px 12px;border-radius:18px;background:rgba(255,255,255,.86);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);box-shadow:0 10px 30px rgba(0,0,0,.18);display:grid;grid-template-columns:30px 1fr;gap:9px;font-size:12px;transform:translateY(-140%);transition:transform .5s var(--ease);cursor:pointer;text-align:left;color:var(--ink)}
.push.show{transform:none}
.push .ic{width:30px;height:30px;border-radius:8px;background:var(--carbon);display:grid;place-items:center}
.push .ic img{width:15px;filter:invert(1)}
.push b{display:block;font-weight:600}
.lr{background:var(--surface);border-radius:14px;padding:10px;display:grid;grid-template-columns:34px 1fr auto;gap:9px;align-items:center;border:1px solid var(--line);animation:pop .35s var(--ease) both}
.lr b{font:600 12.5px var(--ui);display:block}
.lr small{font:500 11px var(--ui);color:var(--ink-3)}
.lr .av{width:34px;height:34px}

/* utilidades de layout das demos */
.col2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.stack{display:grid;gap:10px;align-content:start}
.pad{padding:12px}
.ins{padding:12px;border-radius:12px;background:var(--indigo-soft);color:#1e1b4b;font-size:12.5px;line-height:1.5;display:grid;gap:6px;animation:pop .4s var(--ease)}
.ins .h{display:flex;gap:6px;align-items:center;font:700 11px var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--indigo-ink)}
.ins .h img{width:11px}
.ins q{quotes:"\201C" "\201D";font-style:italic;color:#312e81}
.al{display:grid;grid-template-columns:28px 1fr auto;gap:9px;align-items:center;padding:9px 10px;border-radius:10px;border:1px solid var(--line);background:var(--surface);text-align:left;width:100%;transition:border-color var(--t),background var(--t)}
.al:hover{border-color:var(--ink-4)}
.al[aria-pressed="true"]{border-color:var(--indigo);background:#fbfbff}
.al .t{font:600 12.5px var(--ui)} .al .t small{display:block;font:500 11px var(--ui);color:var(--ink-3)}
.toast{position:absolute;left:50%;bottom:14px;transform:translate(-50%,20px);opacity:0;background:var(--carbon);color:#fff;font:600 12.5px var(--ui);padding:9px 14px;border-radius:999px;display:flex;gap:8px;align-items:center;transition:all var(--t-slow) var(--ease);z-index:9;white-space:nowrap;pointer-events:none}
.toast.show{opacity:1;transform:translate(-50%,0)}
.toast svg{color:var(--lime)}
.replay{position:absolute;right:12px;bottom:12px;z-index:4}

/* por que o Kaza */
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,calc(var(--u)*1.6),24px);margin-top:clamp(24px,calc(var(--u)*4),60px)}
.why article{display:grid;gap:12px;align-content:start;padding-top:18px;border-top:2px solid var(--carbon)}
.why h3{margin:0;font:800 clamp(20px,calc(var(--u)*2),34px)/1.1 var(--display);letter-spacing:-.035em}
.why p{margin:0;color:var(--ink-3);font-size:clamp(14px,calc(var(--u)*1.12),17.5px);line-height:1.55}
.why .ic{width:40px;height:40px;border-radius:12px;background:var(--carbon);color:var(--lime);display:grid;place-items:center}
.why .ic svg{width:20px;height:20px}
.why article.fund{background:var(--carbon);color:var(--snow);border-radius:20px;padding:22px;border-top:0}
.why article.fund p{color:var(--d-mute)}
.why article.fund .ic{background:var(--lime);color:var(--carbon)}

/* próximos passos */
.next{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,calc(var(--u)*5),90px);align-items:center}
.nx{list-style:none;margin:0;padding:0;display:grid;gap:10px;counter-reset:nx}
.nx li{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:center;padding:18px 20px;border-radius:18px;background:var(--carbon-2);border:1px solid var(--d-line);font-size:clamp(15px,calc(var(--u)*1.25),20px);line-height:1.45;cursor:pointer;transition:border-color var(--t),background var(--t)}
.nx li:hover{border-color:var(--d-line-2)}
.nx li .n{width:44px;height:44px;border-radius:999px;border:1px solid var(--d-line-2);display:grid;place-items:center;font:700 14px var(--ui);font-variant-numeric:tabular-nums;transition:all var(--t)}
.nx li[aria-checked="true"]{background:var(--carbon-3);border-color:var(--lime)}
.nx li[aria-checked="true"] .n{background:var(--lime);color:var(--carbon);border-color:var(--lime)}

/* encerramento */
.end .vidro{position:absolute;inset:0 0 0 52%;background:url(a/vidro.webp) center/cover;transform:scaleX(-1);mask-image:linear-gradient(270deg,#000 55%,transparent);-webkit-mask-image:linear-gradient(270deg,#000 55%,transparent)}
.end .body{position:relative;max-width:760px;gap:clamp(16px,calc(var(--u)*2.2),32px)}
.contact{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.contact .num{font:800 clamp(22px,calc(var(--u)*2.2),36px)/1 var(--display);letter-spacing:-.03em;user-select:all}
.sig2{display:flex;align-items:center;gap:14px}
.sig2 img{width:52px;height:52px;border-radius:999px;object-fit:cover}
.sig2 b{display:block;font:700 16px var(--ui)} .sig2 span{color:var(--d-mute);font-size:14px}
.pairlogos{display:flex;align-items:center;gap:18px;margin-top:8px}
.pairlogos .kz{height:64px;width:auto}
.pairlogos .cf{height:28px;width:auto}
.pairlogos .x{color:var(--d-mute-2);font:500 18px var(--ui)}

/* ---------- responsivo: celular e telas baixas viram página corrida ---------- */
@media (max-width:980px),(max-height:620px){
  body{overflow:auto}
  html,body{height:auto}
  .deck{height:auto;overflow:visible;scroll-snap-type:none}
  .sl{height:auto;min-height:0;padding-top:calc(var(--top) + 28px);overflow:visible}
  .sl .body{justify-content:flex-start}
  .win,.phone{max-height:none}
  .foot .sig{padding-right:0}
}
@media (max-width:980px){
  :root{--top:56px}
  .bar .chap{display:none}
  .bar .ctl .hide-m{display:none}
  .brandpair .kz{height:24px}
  .nav-arrows{display:none}
  .cover{min-height:100svh}
  .cover .vidro{inset:0 0 55% 0;mask-image:linear-gradient(180deg,#000 40%,transparent);-webkit-mask-image:linear-gradient(180deg,#000 40%,transparent)}
  .cover .vidro::after{background:linear-gradient(180deg,transparent 40%,var(--carbon))}
  .cover .body{margin-left:0;padding-top:30vh}
  .about,.center,.next,.mod,.mod.flip{grid-template-columns:1fr}
  .mod.flip .copy{order:0}
  .two,.why{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr;row-gap:28px}
  .steps::before,.steps .line{display:none}
  .cases{grid-template-columns:1fr 1fr;grid-template-rows:none;max-height:none}
  .case{min-height:180px}
  .case.feat{grid-row:auto;grid-column:span 2}
  .case.wide{grid-column:span 2}
  .case.photo{min-height:260px}
  .kpis{grid-template-columns:1fr 1fr 1fr}
  .dash{grid-template-columns:1fr 1fr}
  .dash .w2,.dash .w4{grid-column:span 2}
  .side{width:100%;border-left:0;border-top:1px solid var(--line)}
  .win-body.stack-m{flex-direction:column}
  .win-body.stack-m .chat{min-height:380px}
  .cal{border-left:0;border-top:1px solid var(--line);min-height:320px}
  .end .vidro{inset:0 0 60% 0;transform:none;mask-image:linear-gradient(180deg,#000 30%,transparent);-webkit-mask-image:linear-gradient(180deg,#000 30%,transparent)}
  .end .body{padding-top:22vh}
  .flow .ar{display:none}
}
@media (max-width:560px){
  .founder{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .cases{grid-template-columns:1fr}
  .case.feat,.case.wide{grid-column:auto}
  .kpis{gap:8px}
  .kpi span{font-size:12px}
  .brandpair .x,.brandpair .cf{display:none}
  .col2{grid-template-columns:1fr}
  .dash{grid-template-columns:1fr 1fr}
  .fld{grid-template-columns:96px 1fr}
  .foot{height:auto;padding:16px 0;flex-wrap:wrap}
  .count{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .sl:not(.seen) .rv{opacity:1;transform:none}
}

/* complementos das demos */
.mod .win{height:min(660px,calc(100dvh - var(--top) - 150px))}
.m.as{align-self:flex-start;background:var(--indigo-soft);color:#1e1b4b;border:1px solid #e0e3ff;border-bottom-left-radius:4px}
.m.as .tag{display:inline-flex;align-items:center;gap:4px;font:700 10px var(--ui);letter-spacing:.06em;text-transform:uppercase;color:var(--indigo-ink);margin-bottom:3px}
.m.as .tag img,.m.ai .tag img{width:10px;height:auto}
.typing.as{align-self:flex-start;border-bottom-right-radius:14px;border-bottom-left-radius:4px}
.pix{display:flex;gap:6px;align-items:center;margin-top:6px;padding:6px 8px;border-radius:8px;background:rgba(255,255,255,.7);border:1px dashed #c7cbfa;font:500 11px var(--mono);color:#312e81;word-break:break-all;white-space:normal}
.pix button{flex:none;font:600 11px var(--ui);color:var(--indigo-ink);display:inline-flex;gap:4px;align-items:center}
.file{display:inline-flex;gap:8px;align-items:center;margin-top:6px;padding:7px 10px;border-radius:9px;background:rgba(255,255,255,.75);border:1px solid #e0e3ff;font:600 12px var(--ui);color:var(--ink);white-space:nowrap}
.file svg{color:var(--bad)}
.loc{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;margin-top:6px;padding:7px 10px;border-radius:9px;background:rgba(255,255,255,.75);border:1px solid #e0e3ff;font:500 11.5px var(--ui);color:var(--ink-2);white-space:normal}
.m.out .lbl,.m.in .lbl{display:block;font:600 10px var(--ui);opacity:.6;margin-bottom:2px;letter-spacing:.02em}
.vtabs{width:210px;flex:none;border-right:1px solid var(--line);background:var(--surface);display:flex;flex-direction:column;min-height:0}
.vtabs .kp{padding:12px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}
.vtabs .kp div{display:grid;gap:1px}
.vtabs .kp b{font:700 15px var(--display);font-variant-numeric:tabular-nums}
.vtabs .kp span{font:500 10.5px var(--ui);color:var(--ink-3)}
.vtabs ol{list-style:none;margin:0;padding:8px;display:grid;gap:2px;overflow:auto}
.vtabs li button{width:100%;text-align:left;display:grid;grid-template-columns:44px 1fr;gap:8px;align-items:center;padding:8px;border-radius:9px;font:600 12.5px var(--ui)}
.vtabs li button small{display:block;font:500 11px var(--ui);color:var(--ink-3)}
.vtabs li button .d{font:700 11px var(--ui);text-align:center;border-radius:6px;padding:3px 0;background:var(--fill);color:var(--ink-2)}
.vtabs li button:hover{background:var(--fill)}
.vtabs li button[aria-selected="true"]{background:var(--carbon);color:#fff}
.vtabs li button[aria-selected="true"] small{color:#bdbdbd}
.vtabs li button[aria-selected="true"] .d{background:var(--lime);color:var(--carbon)}
.htabs{flex:none;display:flex;gap:2px;padding:8px 12px 0;background:var(--surface);border-bottom:1px solid var(--line);overflow-x:auto}
.htabs button{height:34px;padding:0 12px;font:600 12.5px var(--ui);color:var(--ink-3);border-bottom:2px solid transparent;white-space:nowrap}
.htabs button[aria-selected="true"]{color:var(--ink);border-color:var(--carbon)}
.pane{flex:1;min-height:0;display:flex;overflow:hidden}
.pane[hidden]{display:none!important}
.blk{display:grid;gap:7px}
.blk > .cap{font:700 10.5px var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-3)}
.ch{display:flex;flex-wrap:wrap;gap:6px}
.ch button{height:28px;padding:0 11px;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);font:600 12px var(--ui);color:var(--ink-2);transition:all var(--t)}
.ch button[aria-pressed="true"]{background:var(--carbon);border-color:var(--carbon);color:#fff}
.aud{display:flex;align-items:baseline;gap:8px}
.aud b{font:800 30px/1 var(--display);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.fnl{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.fnl div{background:var(--fill);border-radius:10px;padding:8px;display:grid;gap:2px}
.fnl b{font:700 16px var(--display);font-variant-numeric:tabular-nums}
.fnl span{font:500 10.5px var(--ui);color:var(--ink-3)}
.wa{background:#efeae2;flex:1;min-height:0;display:flex;flex-direction:column}
.wa .msgs{background:transparent}
.wa .m.in{background:#fff;border:0}
.wa .m.out{background:#d9fdd3;color:#111}
.wa-h{flex:none;height:46px;background:#f0f2f5;display:flex;align-items:center;gap:8px;padding:0 12px;border-bottom:1px solid #e3e3e3;font:600 12.5px var(--ui)}
.wa-h small{display:block;font:500 10.5px var(--ui);color:var(--ink-3)}
.uline{display:flex;gap:6px;flex-wrap:wrap;align-items:center;font:600 11.5px var(--ui)}
.uline span{padding:5px 9px;border-radius:999px;background:var(--fill)}
.uline svg{width:13px;height:13px;color:var(--ink-4)}
.cmp{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px;align-content:start;flex:1;overflow:auto}
.cmp .card-w{padding:14px;display:grid;gap:10px;align-content:start}
.cmp .ln{display:flex;justify-content:space-between;gap:10px;font-size:12.5px;padding:7px 0;border-bottom:1px dashed var(--line)}
.cmp .ln:last-child{border-bottom:0}
.cmp .ln b{white-space:nowrap}
.cmp .x{color:var(--bad)} .cmp .y{color:var(--ok)}
.cmp .card-w.us{border-color:var(--carbon);box-shadow:0 0 0 1px var(--carbon)}
@media (max-width:980px){
  .mod .win{height:auto}
  .vtabs{width:100%;border-right:0;border-bottom:1px solid var(--line)}
  .vtabs ol{grid-auto-flow:column;grid-auto-columns:minmax(150px,1fr);overflow-x:auto}
  .win-body.stack-m{flex-direction:column}
  .win-body.stack-m > .chat,.win-body.stack-m > .wa{min-height:400px}
  .cmp{grid-template-columns:1fr}
  .fnl{grid-template-columns:repeat(3,1fr)}
}

/* ajustes da revisão no navegador */
.deck{scrollbar-width:none}
.deck::-webkit-scrollbar{display:none}
.win,.phone .scr{color-scheme:light}
.chat-h .who,.wa-h > div{flex:1;min-width:0}
.chat-h .who b,.chat-h .who span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chat-h .sp{display:none}
.crumb svg{width:14px;height:14px;color:var(--ink-4)}
.crumb b{display:inline-flex;align-items:center;gap:6px}
.vtabs li button{grid-template-columns:58px 1fr}
.col{flex:1 0 150px}
a.btn-lime{text-decoration:none}
.end .vidro{inset:0 0 0 48%;transform:scaleX(-1);mask-image:linear-gradient(90deg,#000 55%,transparent);-webkit-mask-image:linear-gradient(90deg,#000 55%,transparent)}
.end .vidro::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(13,13,13,0) 40%,var(--carbon))}
.cover .foot,.end .foot{position:relative}
.cover .vidro,.end .vidro{top:var(--top)}
.case.photo .capt{background:linear-gradient(transparent,rgba(0,0,0,.88) 38%);padding-top:56px}
.dots{width:88%;margin:auto;gap:clamp(5px,calc(var(--u)*.8),12px)}
.eqs{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:0 12px 12px}
.eqs div{background:var(--fill);border-radius:10px;padding:10px;display:grid;gap:3px}
.eqs b{font:700 17px var(--display);font-variant-numeric:tabular-nums}
.eqs span{font:500 11px var(--ui);color:var(--ink-3)}
@media (max-width:980px){
  .end .vidro{inset:var(--top) 0 60% 0;transform:none;mask-image:linear-gradient(180deg,#000 30%,transparent);-webkit-mask-image:linear-gradient(180deg,#000 30%,transparent)}
  .end .vidro::after{display:none}
  .eqs{grid-template-columns:repeat(3,1fr)}
}
[data-demo="gestao"] .tbl td,[data-demo="gestao"] .tbl th{padding:8px 6px}
@media (max-width:980px){
  .about,.center,.next,.mod,.mod.flip,.two,.why{grid-template-columns:minmax(0,1fr)}
  .demo{min-width:0;max-width:100%}
  .sl{overflow-x:clip}
}
@media (max-width:980px){
  .cases .case{grid-area:auto!important}
  .cases .case.feat{grid-column:1/-1!important}
}

/* ===== versão só clara (pedido do Gabriel): sobrescreve os estilos que eram do escuro ===== */
:root{color-scheme:light}
body{background:var(--snow);color:var(--ink)}
.bar{color:var(--ink)}
.bar .kz,.brandpair .kz{filter:invert(1)}
.bar.scrolled{background:rgba(250,250,250,.8);border-color:var(--line)}
.pill-btn{border-color:var(--line-2)}
.pill-btn:hover{background:var(--fill)}
.pill-btn[aria-pressed="true"]{background:var(--carbon);color:#fff;border-color:var(--carbon)}
.nav-arrows button{background:rgba(255,255,255,.85);border-color:var(--line-2);color:var(--ink);box-shadow:var(--sh-2)}
.nav-arrows button:hover{background:#fff}
.idx{background:rgba(240,240,240,.55)}
.idx-panel{background:var(--surface);border-color:var(--line);color:var(--ink);box-shadow:-30px 0 60px rgba(0,0,0,.08)}
.idx li button:hover{background:var(--fill)}
.idx li button[aria-current="true"]{background:var(--fill-2)}
.idx li .n{color:var(--ink-4)}
.idx li .t small{color:var(--ink-3)}
.sl .foot{border-color:var(--line)}
.cover .vidro::after{background:linear-gradient(90deg,rgba(250,250,250,0) 45%,var(--snow))}
.cover .h1 .by{color:var(--ink-4)}
.cover .h1 .by b{color:var(--ink)}
.cover .praças{color:var(--ink-3)}
.cover .tag span{color:var(--lime-ink)}
.cover .lead{color:var(--ink-2)}
.svc{background:var(--surface);border-color:var(--line);box-shadow:var(--sh-2)}
.svc p{color:var(--ink-3)}
.svc .ic{background:var(--fill)}
.svc .tags span{background:var(--fill);color:var(--ink-2)}
.svc.hl{background:var(--surface);border:1.5px solid var(--carbon);color:var(--ink)}
.svc.hl .ic{background:var(--carbon);color:var(--lime)}
.case{background:var(--surface);border-color:var(--line);color:var(--ink);box-shadow:var(--sh-2)}
.case .lg{filter:invert(1) brightness(.15)}
.case .lg.lg-w{filter:none;height:clamp(24px,calc(var(--u)*2.6),36px);margin-bottom:6px}
.case .seg{color:var(--ink-3)}
.case .big{color:var(--lime-ink)}
.case p{color:var(--ink-2)}
.case.feat{background:var(--lime-soft);border-color:#dcf5c0}
.case.feat .lg{filter:invert(1) brightness(.15)}
.case.photo{border:0;color:#fff}
.case.photo .seg{color:#d4d4d4}
.case.photo p{color:#ececec}
.logos{gap:clamp(14px,calc(var(--u)*2.2),36px);row-gap:12px}
.logos img{height:clamp(18px,calc(var(--u)*2),26px);filter:invert(1) brightness(.2);opacity:.6;transition:opacity var(--t)}
.logos img[src$="h9.svg"]{filter:grayscale(1) brightness(.35)}
.logos img:hover{opacity:1}
.logos img.selo{filter:none;opacity:1;height:32px}
.flow .st{border-color:var(--line-2);color:var(--ink-3);background:var(--surface)}
.flow .st.done{color:var(--ink);background:var(--fill);border-color:var(--line-2)}
.flow .st.now{color:var(--carbon);background:var(--lime);border-color:var(--lime)}
.flow .ar{color:var(--ink-4)}
.nx li{background:var(--surface);border-color:var(--line);box-shadow:var(--sh-2)}
.nx li:hover{border-color:var(--line-2)}
.nx li .n{border-color:var(--line-2)}
.nx li[aria-checked="true"]{background:var(--lime-soft);border-color:var(--lime-ink)}
.why article.fund{background:var(--lime-soft);color:var(--ink)}
.why article.fund p{color:var(--ink-2)}
.why article.fund .ic{background:var(--carbon);color:var(--lime)}
.end .vidro::after{background:linear-gradient(90deg,rgba(250,250,250,0) 45%,var(--snow))}
.contact .num{color:var(--ink)}
.sig2 span{color:var(--ink-3)}
.pairlogos .x{color:var(--ink-4)}
.phone{box-shadow:0 0 0 1px #2a2a2a,0 40px 80px -30px rgba(0,0,0,.35)}
.mod .win,.light .win{box-shadow:0 0 0 1px var(--line),0 30px 70px -30px rgba(0,0,0,.28)}
.tag{color:var(--ink)}
.closing{color:var(--ink)}

/* integrações */
.ints{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px;padding:12px;align-content:start;overflow:auto;flex:1}
.int{display:grid;gap:8px;justify-items:start;padding:12px;border-radius:12px;border:1px solid var(--line);background:var(--surface);text-align:left;transition:border-color var(--t),box-shadow var(--t),transform 120ms,opacity var(--t)}
.int:hover{border-color:var(--ink-4);box-shadow:var(--sh-2)}
.int:active{transform:scale(.98)}
.int[aria-pressed="true"]{border-color:var(--carbon);box-shadow:0 0 0 1px var(--carbon)}
.int.dim{opacity:.32}
.int .lgo{height:26px;display:flex;align-items:center}
.int .lgo img{height:22px;width:auto;max-width:96px;filter:grayscale(1) brightness(.25);transition:filter var(--t)}
.int:hover .lgo img,.int[aria-pressed="true"] .lgo img{filter:none}
.int .mono{height:26px;padding:0 8px;border-radius:7px;background:var(--carbon);color:#fff;font:800 12px/26px var(--display);letter-spacing:-.01em;white-space:nowrap}
.int b{font:600 12.5px var(--ui)}
.int small{font:500 11px var(--ui);color:var(--ink-3);margin-top:-6px}
.int-flow{flex:none;border-top:1px solid var(--line);background:var(--surface);padding:12px;display:grid;gap:8px;min-height:96px}
.int-flow .uline span.k{background:var(--carbon);color:#fff}
.int-flow .uline span.ai{background:var(--indigo-soft);color:var(--indigo-ink)}
.push .ic img{filter:none;width:22px}
.pairlogos .kz{filter:invert(1)}
.cover .foot{margin-left:42%}
.end .foot .sig{display:none}
.case .lg.lg-w{max-width:150px}
@media (max-width:980px){.cover .foot{margin-left:0}}
button,a,.dc,.un,.hc{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.drawer,.idx-panel{overscroll-behavior:contain}

/* cases: fotos lado a lado e todos os logos abaixo */
.cases2{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.05fr);gap:12px;margin-top:clamp(16px,calc(var(--u)*2.4),36px);height:clamp(280px,42vh,420px)}
.cp{position:relative;margin:0;border-radius:20px;overflow:hidden;background:var(--fill-2)}
.cp .ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 20%}
.cp figcaption{position:absolute;inset:auto 0 0 0;padding:56px clamp(14px,calc(var(--u)*1.6),22px) clamp(14px,calc(var(--u)*1.6),20px);background:linear-gradient(transparent,rgba(0,0,0,.86) 42%);color:#fff;display:grid;gap:6px}
.cp .lg{height:clamp(20px,calc(var(--u)*2.2),30px);width:auto;max-width:150px;object-fit:contain;object-position:left}
.cp .nm{font:800 18px/1.1 var(--display);letter-spacing:-.03em}
.cp p{margin:0;font:500 clamp(13px,calc(var(--u)*1.05),16px)/1.4 var(--ui)}
.cp span{font:600 11.5px var(--ui);color:#cfcfcf}
.cstats{display:grid;grid-template-rows:repeat(3,1fr);gap:12px;min-height:0}
.cs{border:1px solid var(--line);background:var(--surface);border-radius:16px;padding:12px 14px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto 1fr;column-gap:12px;align-content:center;box-shadow:var(--sh-2);min-height:0}
.cs .lg{grid-column:1/-1;height:18px;width:auto;max-width:110px;object-fit:contain;object-position:left;filter:invert(1) brightness(.15);margin-bottom:6px}
.cs b{font:800 clamp(22px,calc(var(--u)*2.3),34px)/1 var(--display);letter-spacing:-.04em;color:var(--lime-ink);white-space:nowrap}
.cs p{margin:0;font:500 12px/1.35 var(--ui);color:var(--ink-2)}
.lwall{list-style:none;margin:clamp(14px,calc(var(--u)*2),28px) 0 0;padding:0;display:grid;grid-template-columns:repeat(7,1fr);gap:8px}
.lwall li{height:clamp(46px,6.2vh,60px);border:1px solid var(--line);border-radius:12px;background:var(--surface);display:grid;place-items:center;padding:8px 12px}
.lwall li img{max-height:24px;max-width:100%;width:auto;filter:invert(1) brightness(.2);opacity:.72;transition:opacity var(--t)}
.lwall li img[src$="h9.svg"]{filter:grayscale(1) brightness(.35)}
.lwall li:hover img{opacity:1}
.lwall li.selo img{filter:none;opacity:1;max-height:30px}
.lwall li.selo{grid-column:span 1}
@media (max-width:980px){
  .cases2{grid-template-columns:1fr 1fr;height:auto}
  .cp{aspect-ratio:3/4}
  .cstats{grid-column:1/-1;grid-template-rows:none}
  .lwall{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:560px){.cases2{grid-template-columns:1fr}.cp{aspect-ratio:4/5}}
/* arrastar: impede o arrasto nativo das imagens do card */
.dc img{pointer-events:none;-webkit-user-drag:none}

/* lançamento inteligente */
.lhead{display:grid;gap:10px}
.lkpi{flex:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:10px 12px;background:var(--surface);border-bottom:1px solid var(--line)}
.lkpi div{background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:8px 10px;display:grid;gap:2px}
.lkpi b{font:700 20px/1.1 var(--display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.lkpi span{font:500 11px var(--ui);color:var(--ink-3)}
.lkpi .hl{background:var(--lime-soft);border-color:#d6f2b6}
.lkpi .hl b{color:var(--lime-ink)}
.lbody{flex:1;min-height:0;display:flex}
.lbody .kb{padding:10px}
.lbody .col{flex:1 0 132px;max-width:none}
.col.miss{background:var(--bad-bg)}
.col.win{background:var(--lime-soft)}
.feed{width:250px;flex:none;border-left:1px solid var(--line);background:var(--surface);display:flex;flex-direction:column;min-height:0}
.feed ol{list-style:none;margin:0;padding:10px;display:grid;gap:6px;overflow:auto;align-content:start;flex:1}
.feed li{display:grid;grid-template-columns:22px 1fr;gap:8px;font-size:12px;line-height:1.4;animation:pop .35s var(--ease) both}
.feed li .i{width:22px;height:22px;border-radius:99px;display:grid;place-items:center;background:var(--indigo-soft);color:var(--indigo-ink)}
.feed li .i svg{width:12px;height:12px}
.feed li .i.ok{background:var(--ok-bg);color:var(--ok)}
.feed li .i.bad{background:var(--bad-bg);color:var(--bad)}
.feed li small{display:block;color:var(--ink-4);font-size:10.5px}
.ini{width:22px;height:22px;border-radius:99px;background:var(--fill-2);color:var(--ink-2);display:grid;place-items:center;font:700 9.5px var(--ui);flex:none}
@media (max-width:980px){
  .lkpi{grid-template-columns:repeat(3,minmax(0,1fr))}
  .lbody{flex-direction:column}
  .lbody .kb{min-height:380px}
  .feed{width:100%;border-left:0;border-top:1px solid var(--line);max-height:260px}
}

/* reaquecimento de base */
.rh-fun{width:230px;flex:none;border-right:1px solid var(--line);background:var(--surface);padding:12px;display:grid;gap:6px;align-content:start;overflow:auto}
.rh-st{display:grid;gap:3px;padding:8px 10px;border-radius:10px;background:var(--surface-2);border:1px solid var(--line);position:relative;overflow:hidden}
.rh-st i.bar{position:absolute;inset:auto 0 0 0;height:3px;background:var(--carbon);width:0;transition:width .8s var(--ease)}
.rh-st.hot i.bar{background:var(--lime-ink)}
.rh-st b{font:700 18px/1.1 var(--display);font-variant-numeric:tabular-nums}
.rh-st span{font:500 11px var(--ui);color:var(--ink-3)}
.rh-st.hot{background:var(--lime-soft);border-color:#d6f2b6}
.rh-list{flex:1;min-width:0;display:flex;flex-direction:column;background:var(--surface)}
.rh-row{display:grid;grid-template-columns:28px minmax(0,1.3fr) minmax(0,1fr) 92px;gap:10px;align-items:center;padding:8px 12px;border-bottom:1px solid var(--line);width:100%;text-align:left;font-size:12.5px;transition:background var(--t)}
.rh-row:hover{background:var(--surface-2)}
.rh-row[aria-pressed="true"]{background:var(--indigo-soft)}
.rh-row .nm{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rh-row .nm small{display:block;font:500 11px var(--ui);color:var(--ink-3)}
.rh-row .st{display:flex;gap:4px;flex-wrap:wrap}
.rh-row .sc{display:flex;align-items:center;gap:6px;justify-content:flex-end;font:600 12px var(--ui);font-variant-numeric:tabular-nums}
.rh-row .sc s{color:var(--ink-4);font-weight:500}
.rh-row.busy .st::before{content:"Lendo histórico…";font:600 11px var(--ui);color:var(--indigo-ink)}
.rh-ins{flex:none;border-top:1px solid var(--line);padding:10px 12px;min-height:92px}
@media (max-width:980px){.rh-fun{width:100%;border-right:0;border-bottom:1px solid var(--line);grid-template-columns:repeat(2,minmax(0,1fr))}.rh-row{grid-template-columns:28px minmax(0,1fr) 80px}.rh-row .st{grid-column:2/-1;grid-row:2}}
.lbody .col{flex:1 0 118px}
.lbody .col-h{font-size:11.5px}
.feed{width:230px}
.about.solo{grid-template-columns:minmax(0,1fr);max-width:900px}
.pvid{margin:0;border-radius:20px;overflow:hidden;background:var(--fill-2);box-shadow:0 0 0 1px var(--line),0 30px 70px -30px rgba(0,0,0,.28);aspect-ratio:16/9}
.pvid video{width:100%;height:100%;object-fit:cover;display:block}
.about{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
@media (prefers-reduced-motion:reduce){.pvid video{display:block}}
@media (max-width:980px){.about{grid-template-columns:minmax(0,1fr)}}