/* Tema escuro: mesma estrutura e formas do tema claro, só troca as cores.
   Ativado pelo botão de lua no topo (atributo data-tema="escuro" no <html>). */
html[data-tema="escuro"]{
  --bg:#0B0E14; --surface:#141922; --line:#262C38; --text:#ECEEF2; --muted:#9AA3B4;
  --acc:#3D68FF; --acc-text:#8CA4FF;
  --win:#F4F5F7; --win-line:#DDE0E6;
  color-scheme:dark;
}
html[data-tema="escuro"] .nav{background:rgba(11,14,20,.94);border-bottom-color:var(--line)}
html[data-tema="escuro"] .btn-line{border-color:#5A6476}
html[data-tema="escuro"] .btn-line:hover{background:var(--text);color:var(--bg)}
html[data-tema="escuro"] .btn:hover{background:#5079FF;box-shadow:0 8px 22px -8px rgba(61,104,255,.7)}
html[data-tema="escuro"] .tag{background:rgba(61,104,255,.16)}
html[data-tema="escuro"] .prob{text-decoration-color:#4A5262}
html[data-tema="escuro"] .hero::before{background:radial-gradient(circle,color-mix(in srgb,var(--acc) 26%,transparent),transparent 68%)}

/* faixa de capacidades */
html[data-tema="escuro"] .cap{background:var(--surface);border-color:var(--line);color:var(--text)}

/* tipo de negócio */
html[data-tema="escuro"] .seg-ic{border-color:#2A3557;background:linear-gradient(160deg,#1A2236,#121827);color:#8CA4FF;box-shadow:0 10px 22px -16px rgba(0,0,0,.8),inset 0 1px 0 rgba(255,255,255,.05)}
html[data-tema="escuro"] .seg-btn:hover .seg-ic{background:linear-gradient(160deg,#202A42,#161D30);box-shadow:0 16px 28px -16px rgba(61,104,255,.5),inset 0 1px 0 rgba(255,255,255,.06)}
html[data-tema="escuro"] .seg-btn[aria-pressed="true"] .seg-ic{background:linear-gradient(160deg,#4C77FF,#2346D6);border-color:transparent;color:#fff}

/* demonstrações: as janelas continuam claras, como telas acesas */
html[data-tema="escuro"] .win{border-color:transparent;box-shadow:0 24px 50px -26px rgba(0,0,0,.8)}
html[data-tema="escuro"] .seg-sys .mini.win{box-shadow:0 30px 60px -30px rgba(0,0,0,.85)}

/* formulário */
html[data-tema="escuro"] .contact form input,
html[data-tema="escuro"] .contact form select,
html[data-tema="escuro"] .contact form textarea{background:#0F131B;border-color:#2C3340;color:var(--text)}
html[data-tema="escuro"] .contact textarea::placeholder{color:#6B7486}

/* rodapé se separa do fundo */
html[data-tema="escuro"] .foot{background:#070A10;border-top:1px solid var(--line)}
html[data-tema="escuro"] .wa-fixo:focus-visible{outline-color:#fff}

/* botão de tema */
.tema-btn{display:inline-grid;place-items:center;width:40px;height:40px;padding:0;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--text);cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.tema-btn:hover{background:var(--surface);border-color:var(--muted)}
.tema-btn svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.tema-btn .sol{display:none}
html[data-tema="escuro"] .tema-btn .sol{display:block}
html[data-tema="escuro"] .tema-btn .lua{display:none}
.nav nav .tema-btn{margin-left:-8px}
@media (max-width:760px){.nav nav{gap:12px}.nav nav .tema-btn{margin-left:0}}
.nav .btn-sm{white-space:nowrap}
@media (max-width:400px){.nav{padding-left:16px;padding-right:16px}.nav nav{gap:8px}.nav .btn-sm{padding:9px 14px;font-size:.88rem}.tema-btn{width:36px;height:36px}.logo{font-size:1.08rem}}
@media (max-width:370px){.nav{gap:8px;padding-left:12px;padding-right:12px}.logo{gap:7px;font-size:1rem}.logo img{width:26px;height:26px}.nav .btn-sm{padding:8px 12px;font-size:.84rem}}
