/* ══════════════════════════════════════════════════════════════════
   Barra global Edenware na página do Vimer
   (adotada por /vimer/{en,es,pt}/index.html)

   Mesmo caso da página do SnapAway: dump de WordPress (ucraft) de tema CLARO com a
   barra própria TRANSPARENTE por cima da imagem do herói — `header-overlapped` é
   `position: absolute; top: 0`. A barra global entra como primeiro elemento do <body>
   (sticky, 56px) e, sem ajuste, a barra própria continuaria a `top: 0` do DOCUMENTO,
   escondida atrás dela.

   O que a barra global passa a anunciar aqui é a prateleira PRONTA (SonicAura, SnapAway,
   Megacubo, Hub — a lista padrão do /edenware-nav.js). O Vimer NÃO entra nela: ainda não
   está pronto para ser vendido, e é isso que o dono pediu em 2026-09-30. A identidade da
   página continua sendo o nome "Vimer" ao lado do símbolo da Edenware (`siteName`), sem
   um preset próprio — no dia em que o app estiver pronto, ele entra na lista padrão e o
   ícone da seção aparece junto, como acontece nas outras.
   ══════════════════════════════════════════════════════════════════ */

/* ── 1. A barra própria passa a começar DEPOIS da barra global ──────
   Não é somar 56px a `top`: é dar à barra própria um bloco de contenção que comece
   depois da barra global. Com `position: relative` no wrapper, o `top: 0` do header
   absoluto passa a significar "logo abaixo da barra global", em qualquer largura e sem
   número mágico repetido em 3 arquivos. O wrapper (`body > .main-container > .main-body >
   .main-layout > .header-and-main-rows`) contém o header E o `<main>`: por isso o `top: 0`
   dele é exatamente a borda de baixo da barra global, e o header segue flutuando sobre o
   herói, como o desenho original queria. */
.header-and-main-rows {
  position: relative;
}

/* ── 2. O logo duplicado sai ────────────────────────────────────────
   A barra global já mostra o símbolo da Edenware e o nome "Vimer" logo acima; a barra
   própria repetia a mesma identidade. O MENU fica: são os atalhos da página ("Baixar",
   "F.A.Q.", "Contato"), e tirá-los de uma página de vendas longa custaria navegação.

   Escopo no header de propósito: `.ModuleLogo` também nomeia o módulo do rodapé em
   alguns templates do ucraft, e lá o logo é conteúdo. */
.header-rows.header-overlapped .ModuleLogo {
  display: none !important;
}

/* ── 3. O menu lateral da página fica ACIMA da barra global ─────────
   O menu do celular abre num painel `position: fixed` que vive dentro de
   `.layers-container`, e esse contêiner tem `z-index: 1003` — abaixo do 9999 da barra
   global. Medido no navegador com o painel aberto: o que está sob o botão de fechar
   (a 20px do topo) é o "Entrar" da barra, isto é, menu aberto SEM como fechar.

   Subir o painel sozinho não resolve: o z-index dele (10) já é o teto do contexto do
   contêiner. Quem sobe é o contêiner — e aqui isso é seguro porque ele contém um único
   elemento nesta página (o próprio painel: 1 `.layer`, altura 0), então nada mais muda
   de lugar. Especificidade (0,2,1) para vencer o `html .layers-container` (0,1,1) do
   all.css; o arquivo é carregado depois dele, e é a ordem que desempata. */
html .main-layout > .layers-container {
  z-index: 10000;
}

/* ── 4. Tokens do shell ─────────────────────────────────────────────
   A regra do shell é que quem adota re-declara os tokens no PRÓPRIO CSS, nunca no
   arquivo compartilhado. Esta página é clara (fundo branco), então a barra segue a
   página em vez do azul escuro padrão.

   A rampa é a do herói do Vimer (indigo #190046). O indigo do herói serve DOIS papéis no
   shell — fundo de botão com texto branco E cor de texto no rodapé — então o fundo usa a
   parada um pouco mais clara (#3A1C8F, 12,05:1 com branco) e o texto usa o indigo cheio
   (18,59:1). Contraste medido com tmp/contrast-check.js, não escolhido a olho.

   O bloco vale para `:root` E para `[data-theme="light"]` (as páginas declaram
   `data-theme="light"` no <html>) e este arquivo é carregado DEPOIS do
   /edenware-theme.css — a ordem é o que faz estes valores vencerem os padrões do shell. */
:root,
[data-theme="light"] {
  --ew-bg: #FFFFFF;
  --ew-border: #E7E4F2;
  --ew-text: #14102A;
  --ew-text-secondary: #55507A;
  --ew-text-muted: #6B6488;
  --ew-primary: #3A1C8F;          /* papel de FUNDO: botão ativo, avatar (texto branco por cima) */
  --ew-primary-light: #190046;    /* papel de TEXTO: nome do serviço, link de entrar */
  --ew-primary-bg: rgba(58, 28, 143, .10);
  --ew-primary-gradient: linear-gradient(135deg, #190046, #4B2EA8);
  --ew-nav-shadow: 0 1px 0 rgba(0, 0, 0, .10);
}