/* OC-UI-02 — cabeçalho branco: logo original | menu central | funções auxiliares. Carregado por último. Cores do logo: índigo #2905a1, ciano #29c2de. */
.site-header{display:grid;grid-template-columns:auto auto auto;justify-content:center;align-items:center;column-gap:clamp(.8rem,2vw,2.2rem);min-height:74px;padding:.5rem clamp(1rem,2.5vw,3rem);background:#fff;border-bottom:1px solid #dbe3ee;box-shadow:0 2px 12px rgba(3,20,47,.06)}
.site-header .wordmark{justify-self:start}
.site-header nav{display:flex;justify-content:center;align-items:center;align-self:center;gap:.1rem;width:auto;flex:none;flex-wrap:nowrap}
.site-header nav a{position:relative;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:38px;padding:0 .85rem;margin:0;border-radius:999px;border-top:0;font-size:.86rem;font-weight:500;line-height:1;color:#33496b;white-space:nowrap;transition:background-color .2s ease,color .2s ease}
.site-header nav a:hover{background:#29c2de;color:#03142f}
.site-header nav a:focus-visible{background:#29c2de;color:#03142f;outline:2px solid #2905a1;outline-offset:2px}
.site-header nav a.is-active,.site-header nav a.is-active:hover,.site-header nav a.is-active:focus-visible{background:#2905a1;color:#fff;font-weight:600}
.site-header nav .nav-chevron{display:none}
.header-tools{display:flex;align-items:center;gap:.8rem;margin-left:0;padding-left:clamp(.8rem,1.6vw,1.5rem);border-left:1px solid #dbe3ee}
.header-tools .header-cta,.header-tools .header-search{order:0}
.header-tools .header-search{flex:0 0 220px;width:220px}

@media (prefers-reduced-motion:reduce){.site-header nav a{transition:none}}

/* Menu recolhido (tablet e mobile) */
@media (max-width:1300px){
  .site-header{grid-template-columns:1fr auto;justify-content:stretch;row-gap:.6rem;padding:.55rem 1rem}
  .menu-toggle{display:inline-flex;align-items:center;gap:.45rem;order:0;margin:0;justify-self:end;padding:.5rem .8rem;border:1px solid #b9c6d8;border-radius:999px;background:transparent;color:#03142f;font:inherit;font-size:.8rem;cursor:pointer}
  .menu-toggle:hover{background:#29c2de}
  .menu-toggle:focus-visible{outline:2px solid #2905a1;outline-offset:2px}
  .site-header nav{display:none;grid-column:1/-1;flex-direction:column;align-items:stretch;gap:.2rem;padding:.2rem 0 .4rem;order:0}
  .site-header nav.is-open{display:flex}
  .site-header nav a{justify-content:space-between;padding:.8rem 1rem;font-size:.92rem}
  .header-tools{grid-column:1/-1;flex-wrap:wrap;margin:0;padding:.7rem 0 .2rem;border-left:0;border-top:1px solid #dbe3ee;gap:.7rem}
  .header-tools .header-search{order:0;flex:1 1 100%;height:40px}
  .header-tools .header-cta{order:1;display:inline-flex}
}

/* Logo e ícones ampliados */
.site-header .header-logo{width:128px}
.site-header .header-cta .icon{width:20px;height:20px}
.site-header .header-search>.icon{width:19px;height:19px}
.site-header .header-search button{width:30px;height:32px}
.site-header .header-search button .icon{width:19px;height:19px}
.menu-toggle .icon{width:22px;height:22px}
@media (max-width:620px){.site-header .header-logo{width:108px}}

/* Cabeçalho branco: busca, CTA e idioma em tons escuros */
.site-header .header-tools .header-cta.button{color:#fff;border-color:#2905a1;background:#2905a1}
.site-header .header-tools .header-cta.button:hover,.site-header .header-tools .header-cta.button:focus-visible{background:#29c2de;border-color:#29c2de;color:#03142f;transform:none}
.site-header .header-search{background:#f4f7fb;border-color:#cfd9e6}
.site-header .header-search input{color:#03142f}
.site-header .header-search input::placeholder{color:#566a88}
.site-header .header-search>.icon,.site-header .header-search button{color:#2905a1}
.site-header .header-search button:hover,.site-header .header-search button:focus-visible{color:#29c2de}
.site-header .header-logo{width:128px}
.site-header .header-logo>img:first-child{clip-path:none}

/* OC-UI-03 — cabeçalho fixo: branco no topo; preto translúcido ao rolar (classe is-scrolled, ver site-menu.js). Para voltar: content/oc-ui-03/RESTAURAR.md */
.site-header{position:sticky;top:0;z-index:100;transition:background-color .25s ease,border-color .25s ease,box-shadow .25s ease}
.site-header .header-logo img{transition:filter .25s ease}
.site-header.is-scrolled{background:rgba(5,9,16,.74);-webkit-backdrop-filter:saturate(140%) blur(14px);backdrop-filter:saturate(140%) blur(14px);border-bottom-color:rgba(255,255,255,.1);box-shadow:0 6px 24px rgba(0,0,0,.28)}
.site-header.is-scrolled .header-logo img{filter:brightness(0) invert(1)}
.site-header.is-scrolled nav a{color:#dbe6f3}
.site-header.is-scrolled nav a:hover,.site-header.is-scrolled nav a:focus-visible{background:#29c2de;color:#03142f}
.site-header.is-scrolled nav a:focus-visible{outline-color:#fff}
.site-header.is-scrolled nav a.is-active,.site-header.is-scrolled nav a.is-active:hover,.site-header.is-scrolled nav a.is-active:focus-visible{background:#3a12c4;color:#fff}
.site-header.is-scrolled .header-tools{border-left-color:rgba(255,255,255,.18)}
.site-header.is-scrolled .header-tools .header-cta.button{background:#3a12c4;border-color:#3a12c4;color:#fff}
.site-header.is-scrolled .header-tools .header-cta.button:hover,.site-header.is-scrolled .header-tools .header-cta.button:focus-visible{background:#29c2de;border-color:#29c2de;color:#03142f}
.site-header.is-scrolled .header-search{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.22)}
.site-header.is-scrolled .header-search input{color:#fff}
.site-header.is-scrolled .header-search input::placeholder{color:#a9bad0}
.site-header.is-scrolled .header-search>.icon,.site-header.is-scrolled .header-search button{color:#8fe3f2}
.site-header.is-scrolled .header-search button:hover,.site-header.is-scrolled .header-search button:focus-visible{color:#fff}
@media (max-width:1300px){
  .site-header{max-height:100vh;overflow-y:auto}
  .site-header.is-scrolled .menu-toggle{border-color:rgba(255,255,255,.35);color:#fff}
  .site-header.is-scrolled .menu-toggle:hover{background:#29c2de;color:#03142f}
  .site-header.is-scrolled .header-tools{border-top-color:rgba(255,255,255,.18)}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.site-header.is-scrolled{background:rgba(5,9,16,.94)}}
@media (prefers-reduced-motion:reduce){.site-header,.site-header .header-logo img{transition:none}}
html{scroll-padding-top:84px}


/* Menu: item ativo, hover e "Seja um Revendedor" em preto (no topo branco); invertidos para branco com texto preto quando o cabeçalho escurece */
.site-header nav a:hover,.site-header nav a:focus-visible,
.site-header nav a.is-active,.site-header nav a.is-active:hover,.site-header nav a.is-active:focus-visible{background:#0b0f14;color:#fff}
.site-header nav a:focus-visible{outline-color:#0b0f14}
.site-header .header-tools .header-cta.button{background:#0b0f14;border-color:#0b0f14;color:#fff}
.site-header .header-tools .header-cta.button:hover,.site-header .header-tools .header-cta.button:focus-visible{background:#262e3a;border-color:#262e3a;color:#fff}
.menu-toggle:hover{background:#0b0f14;color:#fff}
.site-header.is-scrolled nav a:hover,.site-header.is-scrolled nav a:focus-visible,
.site-header.is-scrolled nav a.is-active,.site-header.is-scrolled nav a.is-active:hover,.site-header.is-scrolled nav a.is-active:focus-visible{background:#fff;color:#0b0f14}
.site-header.is-scrolled nav a:focus-visible{outline-color:#fff}
.site-header.is-scrolled .header-tools .header-cta.button{background:#fff;border-color:#fff;color:#0b0f14}
.site-header.is-scrolled .header-tools .header-cta.button:hover,.site-header.is-scrolled .header-tools .header-cta.button:focus-visible{background:#dfe6ee;border-color:#dfe6ee;color:#0b0f14}
.site-header.is-scrolled .menu-toggle:hover{background:#fff;color:#0b0f14}

/* Blog "Em breve": item informativo, sem link, sem foco, sem hover e sem aparência de botão (texto + selo discreto).
   Contraste mínimo WCAG AA (4,5:1): topo #4a5d7a sobre #fff e selo #3b4d6b sobre #eef2f8; rolado #d3deec e selo #e6eef8
   sobre o pior caso do cabeçalho translúcido (#46494e). Conferido por teste (core/test_header_menu.py). */
.site-header nav .nav-soon{display:inline-flex;align-items:center;gap:.4rem;box-sizing:border-box;height:38px;padding:0 .85rem;font-size:.86rem;font-weight:500;line-height:1;color:#4a5d7a;white-space:nowrap;cursor:default;user-select:none}
.site-header nav .nav-soon-badge{display:inline-block;padding:.2rem .5rem;border:1px solid #b8c5d8;border-radius:999px;background:#eef2f8;color:#3b4d6b;font-size:.68rem;font-weight:600;line-height:1.1;letter-spacing:.01em}
.site-header.is-scrolled nav .nav-soon{color:#d3deec}
.site-header.is-scrolled nav .nav-soon-badge{border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.12);color:#e6eef8}
@media (max-width:1300px){
  .site-header nav .nav-soon{justify-content:space-between;padding:.8rem 1rem;font-size:.92rem}
}

/* OC-DEPLOY-09 — cabeçalho compacto no mobile/tablet. Só no layout recolhido; desktop intacto.
   Fechado, o cabeçalho em fluxo é só a linha logo + botão de menu; a faixa busca/revenda fica pendurada
   logo abaixo (absoluta) e sua altura é reservada por margem (--header-collapse, medida em site-menu.js).
   Ao rolar, a faixa some e o conteúdo não se move. Com o menu aberto a faixa volta ao fluxo, dentro do menu. */
@media (max-width:1300px){
  .site-header{overflow:visible;margin-bottom:var(--header-collapse,112px)}
  .site-header .header-tools{position:absolute;top:100%;left:0;right:0;box-sizing:border-box;padding:.8rem 1rem .6rem;border-top:0;border-bottom:1px solid #dbe3ee;background:#fff;box-shadow:0 8px 14px -8px rgba(3,20,47,.14);transition:opacity .15s ease,visibility 0s}
  .site-header.is-scrolled:not(.menu-open) .header-tools{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .15s ease,visibility 0s .15s}
  .site-header.menu-open{margin-bottom:0;max-height:100vh;max-height:100dvh;overflow-y:auto;overscroll-behavior:contain}
  .site-header.menu-open .header-tools{position:static;padding:.7rem 0 .2rem;border-bottom:0;border-top:1px solid #dbe3ee;background:transparent;box-shadow:none}
  .site-header.menu-open.is-scrolled .header-tools{border-top-color:rgba(255,255,255,.18)}
}
@media (max-width:1300px) and (prefers-reduced-motion:reduce){.site-header .header-tools{transition:none}}
