/* ============ Reset e Variáveis ============ */
:root{
  --brand-1:#0ea5e9;
  --brand-2:#22c55e;

  --bg:#0b1320;
  --bg-soft:#0f1a2e;
  --text:#e2e8f0;
  --muted:#a7b0c0;
  --card:#111a2f;
  --line:rgba(255,255,255,.08);

  --s-2: .35rem;
  --s-1: .75rem;
  --s0:  1rem;
  --s1:  1.25rem;
  --s2:  1.6rem;
  --s3:  clamp(2rem, 3vw, 2.6rem);
  --s4:  clamp(2.4rem, 5vw, 3.2rem);
  --radius: 18px;
}
[data-theme="light"]{
  --bg:#f8fafc;
  --bg-soft:#f1f5f9;
  --text:#0f172a;
  --muted:#475569;
  --card:#ffffff;
  --line:rgba(0,0,0,.08);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text); background:linear-gradient(180deg,var(--bg),#07101d 40%, var(--bg) 100%);
  line-height:1.5;
}

/* ============ Layout utilitários ============ */
.container{max-width:1180px;margin:0 auto;padding:0 var(--s1)}
.section-title{font-size:var(--s3);margin:.5em 0 0.6em}
.display{font-size:var(--s4);margin:.2em 0 .4em}
.sub{margin:.2em 0}
.grad{background:linear-gradient(90deg,var(--brand-1),var(--brand-2));-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{opacity:.9}
.row-wrap{display:flex;gap:8px;flex-wrap:wrap}

.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,2vw,20px)}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,2vw,20px)}
.stack>*+*{margin-top:var(--s-1)}
@media (max-width:960px){
  .grid-2{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
}

/* ============ Header / Nav ============ */
.site-header{
  position:sticky;top:0;z-index:50;
  backdrop-filter:saturate(120%) blur(8px);
  background:color-mix(in oklab, var(--bg) 82%, transparent);
  border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;min-height:64px;gap:12px}
.brand{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}
.menu{display:flex;gap:16px;align-items:center}
.menu a{color:var(--text);text-decoration:none;opacity:.9}
.menu a:hover{opacity:1}
.nav-cta{display:flex;gap:10px;align-items:center}
.hamb{display:none;background:none;border:1px solid var(--line);border-radius:999px;padding:.4rem .6rem;color:var(--text)}
@media (max-width:960px){
  .menu{position:fixed;inset:64px 0 auto 0; background:var(--bg);border-bottom:1px solid var(--line);
        padding:12px;display:none;flex-direction:column}
  .menu.open{display:flex}
  .hamb{display:inline-flex}
}

/* ============ Hero ============ */
.hero{padding:clamp(28px,5vw,56px) 0}
.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(16px,4vw,28px);align-items:center}
.hero .eyebrow{opacity:.8;font-size:.95rem}
.hero .actions{display:flex;gap:10px;margin-top:var(--s-1);flex-wrap:wrap}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:var(--s1)}
.kpi{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:12px}
.kpi .n{font-weight:700;font-size:1.15rem}
.hero-card.card{align-self:stretch}
@media (max-width:960px){ .hero-grid{grid-template-columns:1fr} .kpis{grid-template-columns:1fr 1fr} }

/* ============ Componentes base ============ */
.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:clamp(12px,2.2vw,18px);
  box-shadow:0 6px 24px rgba(2,6,23,.18), inset 0 1px 0 rgba(255,255,255,.03);
}
.card.soft{background:var(--bg-soft)}
.btn{
  --pad-x: 14px; --pad-y: 10px;
  display:inline-flex;align-items:center;justify-content:center;
  gap:8px; padding:var(--pad-y) var(--pad-x);
  color:var(--text); background:transparent; border:1px solid var(--line);
  border-radius:10px; cursor:pointer; text-decoration:none; transition:transform .06s ease, background .2s;
}
.btn:hover{transform:translateY(-1px); background:color-mix(in oklab, var(--bg) 85%, white 5%)}
.btn.primary{border:none;background:linear-gradient(90deg,var(--brand-1),var(--brand-2));color:#041016}
.btn.pill{border-radius:999px}
.badge{display:inline-block;padding:.35rem .6rem;border:1px solid var(--line);border-radius:999px;font-size:.85rem;opacity:.9;background:var(--bg-soft)}
.progress{height:8px;background:var(--bg-soft);border-radius:999px;overflow:hidden;border:1px solid var(--line);margin-top:8px}
.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--brand-1),var(--brand-2))}

/* ============ Forms ============ */
label{display:block;margin-bottom:.25rem;font-weight:600}
input, select, textarea{
  width:100%; background:var(--bg); color:var(--text);
  border:1px solid var(--line); border-radius:10px;
  padding:.65rem .8rem; outline:none;
}
input:focus, select:focus, textarea:focus{border-color:color-mix(in oklab, var(--brand-1) 60%, var(--line))}
::placeholder{color:var(--muted)}

/* ============ Assistant ============ */
#assistant{
  position:fixed; right:16px; bottom:16px; width:min(420px, calc(100vw - 32px));
  background:var(--card); border:1px solid var(--line); border-radius:16px;
  display:none; flex-direction:column; overflow:hidden; z-index:40;
}
#assistant.open{display:flex}
.assist-head{display:flex;align-items:center;justify-content:space-between;padding:10px;border-bottom:1px solid var(--line)}
.assist-actions{display:flex;gap:8px}
.assist-body{height:300px;overflow:auto;padding:10px}
.quick{display:flex;gap:8px;flex-wrap:wrap;padding:0 10px 10px}
.assist-input{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line)}
.message{display:flex;margin-bottom:8px}
.message .bubble{max-width:86%;padding:10px 12px;border-radius:12px;background:var(--bg-soft);border:1px solid var(--line)}
.message.me{justify-content:flex-end}
.message.me .bubble{background:linear-gradient(90deg,var(--brand-1),var(--brand-2));color:#041016;border:none}

/* ============ Intranet modal ============ */
#intranetModal{position:fixed;inset:0;background:rgba(2,6,23,.58);display:none;z-index:60}
#intranetModal.open{display:block}
.intranet{margin:6vh auto;max-width:980px}
.intra-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.intra-actions{display:flex;gap:8px}
.tabs{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.tabs button{padding:.5rem .8rem;border:1px solid var(--line);background:var(--bg-soft);color:var(--text);border-radius:999px;cursor:pointer}
.tabs button.active{background:linear-gradient(90deg,var(--brand-1),var(--brand-2));color:#041016;border:none}
.tabpanel{display:none}
.tabpanel.active{display:block}

/* ============ Footer & Toast ============ */
.footer{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:20px 0}
.footer ul{margin:0;padding:0;list-style:none}
.copy{text-align:center;opacity:.8;border-top:1px solid var(--line);padding:12px 0;margin:0}
@media (max-width:960px){ .footer{grid-template-columns:1fr 1fr} }

.toast{position:fixed;left:0;right:0;bottom:-140px;display:flex;justify-content:center;transition:bottom .22s ease;z-index:70}
.toast.show{bottom:16px}

/* ============ FAQ + Timeline ============ */
details{border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--card)}
details+details{margin-top:10px}
.timeline{display:flex;gap:10px;flex-wrap:wrap;padding-left:1rem}
.timeline li{list-style:disc}

/* ============ Reveal animation ============ */
.reveal{opacity:0;transform:translateY(12px);transition:opacity .5s ease, transform .5s ease}
.reveal.in{opacity:1;transform:none}

/* ============ LGPD bar ============ */
.lgpd{
  position:fixed;left:16px;right:16px;bottom:16px;display:flex;justify-content:space-between;align-items:center;
  gap:12px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:10px;z-index:80
}
.lgpd.hide{display:none}

/* ============ A11y focus ============ */
:focus-visible{outline:3px solid color-mix(in oklab, var(--brand-1) 62%, transparent); outline-offset:2px}