/* Vitrine (versão neutra) da Gestão Integrada, 13/11/2026: cores e fonte da Boito por cima da marca do cliente.
   Só existe na tela montada da vitrine (dist/_v). Contrastes sobre branco: texto #1F1C18 15,9:1 · #4F4A42 8,6:1 · #655F56 6,2:1 ·
   ação #7F5F1C com texto branco 6,0:1. Sobre o painel escuro #1F1C18: #F6F2EA 15,6:1 · #E2BF73 9,4:1 · #C9C2B4 10,1:1. */
@font-face { font-family: "Plus Jakarta Sans"; src: url(/marca/fonte-boito.woff2) format("woff2"); font-weight: 200 800; font-display: swap; }
html:root, html:root[data-theme="light"] {
  --fonte-ui: "Plus Jakarta Sans";
  --marca-principal: #1F1C18;  --marca-secundaria: #7F5F1C;  --marca-fundo: #F4F2EE;
  --mesa: #F4F2EE;  --folha: #FFFFFF;  --sf-2: #F8F6F2;  --sf-3: #EFEBE4;
  --linha: #E9E4DB;  --linha-forte: #D9D2C6;  --borda-campo: #8C857A;
  --tx: #1F1C18;  --tx-2: #4F4A42;  --tx-3: #655F56;
  --acc: #7F5F1C;  --acc2: #1F1C18;  --acc-aresta: #6A4F17;  --acc-tinta: #7F5F1C;  --acc-sobre: #FFFFFF;
  --acc-suave: #F3ECDD;  --acc-suave-2: #EADFC8;  --acc-halo: rgba(193, 154, 75, .30);
  --marca: #1F1C18;  --marca-2: #7F5F1C;  --marca-suave: #F3ECDD;  --marca-linha: #D9D2C6;
  --mono-fundo: #1F1C18;  --mono-letra: #E2BF73;
  --el-1: inset 0 1px 0 rgba(255, 255, 255, .9), 0 1px 2px rgba(31, 28, 24, .05), 0 10px 24px -14px rgba(31, 28, 24, .22);
  --el-2: inset 0 1px 0 rgba(255, 255, 255, .9), 0 2px 5px rgba(31, 28, 24, .06), 0 20px 44px -20px rgba(31, 28, 24, .30);
  --veu: rgba(16, 14, 11, .50);
  --foco: 0 0 0 2px #FFFFFF, 0 0 0 4px #7F5F1C;
  --e1: #7F5F1C; --e2: #1F1C18; --e3: #A88A4F; --e4: #6E6553; --e5: #C19A4B; --e6: #4F4A42; --e7: #9C9384; --e8: #3D3A35;
}
html:root[data-theme="dark"] {
  --mesa: #100E0B;  --folha: #1A1713;  --sf-2: #221E19;  --sf-3: #2B2620;
  --linha: #3A342C;  --linha-forte: #4F473C;  --borda-campo: #8C857A;
  --tx: #F6F2EA;  --tx-2: #C9C2B4;  --tx-3: #A39B8C;
  --acc: #C19A4B;  --acc-sobre: #231C0E;  --acc-tinta: #E2BF73;  --acc-suave: #2A2318;  --acc-suave-2: #352C1D;
  --marca: #E2BF73;  --marca-2: #C19A4B;  --marca-suave: #2A2318;  --marca-linha: #4F473C;
  --mono-fundo: #E2BF73;  --mono-letra: #1F1C18;
  --foco: 0 0 0 2px #1A1713, 0 0 0 4px #E2BF73;
}
/* o menu lateral do app troca os próprios tokens: aqui ele recebe os da Boito */
html:root .menu { --mesa: #F4F2EE; --folha: #FFFFFF; --sf-2: #F8F6F2; --sf-3: #EFEBE4; --linha: #E9E4DB; --linha-forte: #D9D2C6;
  --tx: #1F1C18; --tx-2: #4F4A42; --tx-3: #655F56; --acc-tinta: #7F5F1C; --foco: 0 0 0 2px #FFFFFF, 0 0 0 4px #7F5F1C; }
html:root[data-theme="dark"] .menu { --mesa: #100E0B; --folha: #1A1713; --sf-2: #221E19; --sf-3: #2B2620; --linha: #3A342C; --linha-forte: #4F473C;
  --tx: #F6F2EA; --tx-2: #C9C2B4; --tx-3: #A39B8C; --acc-tinta: #E2BF73; --foco: 0 0 0 2px #1A1713, 0 0 0 4px #E2BF73; background: #1A1713; }
/* a entrada: o painel da marca segue claro, como no app; o logo é o da Boito e o dourado fica no selo da empresa inventada */
.vt-selo { margin: 0; font-size: 13px; line-height: 20px; font-weight: 600; color: #7A5C14; }
.bl-ey { color: #7A5C14 !important; }
/* no topo e no menu, o logo horizontal da Boito (proporção 720 x 168), sem deformar */
.topo .logo-topo, .logo-menu, .mn-marca img { content: url(/marca/logo-horizontal.png); object-fit: contain; }
.mn-marca:focus-visible, .mn-mod:focus-visible, .mn-gr:focus-visible, .mn-tres:focus-visible { box-shadow: 0 0 0 2px #C19A4B !important; }
.mn-gr.on { color: var(--marca) !important; }
.mn-pessoa .av { background: #1F1C18 !important; color: #E2BF73 !important; }
:root[data-theme="dark"] .mn-marca img, :root[data-theme="dark"] .topo .logo-topo { background: transparent; padding: 0; }
@media (max-width: 1023px) { .app > .menu.mn.aberto { background: var(--folha) !important; } }
/* "Como Funciona" dentro do app (marca-vitrine/vitrine.js): rodapé da entrada, pé do trilho e barra do topo do celular */
.vt-como {
  display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 16px; border-radius: 8px;
  background: linear-gradient(180deg, #CDA75A, #C19A4B); color: #231C0E; border: 1px solid #A47E33;
  font: 700 14px/1.2 "Plus Jakarta Sans", system-ui, sans-serif; text-decoration: none; white-space: nowrap;
}
.vt-como:hover { filter: brightness(1.04); }
.vt-como:focus-visible { outline: 2px solid #1F1C18; outline-offset: 3px; }
.vt-entrada { margin: 0 auto 12px; }
.bl-rodape { display: flex; flex-direction: column; align-items: center; }
.vt-menu { margin: 0 0 8px; min-height: 32px; padding: 4px 8px; font-size: 12px; white-space: normal; text-align: center; }
.vt-topo { margin-left: auto; min-height: 36px; padding: 6px 12px; font-size: 13px; flex: 0 0 auto; }
@media (max-width: 560px) { .vt-topo { display: none; } }
@media print { .vt-como, .vt-selo { display: none; } }