/* Cabeçalho preso no topo — Centro Evolvere.
 *
 * O <header> do SiteHeader JÁ é `position:sticky;top:0`, e mesmo assim rolava
 * junto com a página. Duas coisas o impediam, e as duas precisam ser desfeitas:
 *
 * 1. O `<div style="background:#F6F4EF;overflow-x:hidden">` que envolve a
 *    página inteira. `overflow-x:hidden` cria um contexto de rolagem próprio, e
 *    o sticky passa a se ancorar nele em vez de na janela. `overflow-x:clip`
 *    corta o transbordo horizontal do mesmo jeito e NÃO cria esse contexto —
 *    é a correção certa, não um contorno.
 *
 * 2. O runtime `dc` embrulha cada componente num `<div class="sc-host">`, e o
 *    do cabeçalho tem EXATAMENTE a altura dele (71px). Um elemento sticky só
 *    desliza enquanto o pai está na tela; com o pai do mesmo tamanho, não
 *    existe espaço para deslizar e ele sai junto. Por isso o wrapper também
 *    precisa grudar.
 *
 * Os seletores são estruturais, com :has(), e não pelo texto do atributo
 * `style`: o React normaliza o inline para `overflow-x: hidden` (com espaço) e
 * um seletor de substring não casa. Testado no navegador.
 *
 * O `!important` existe porque o valor concorrente é inline e o runtime o
 * reescreve a cada render — sem ele, a regra perde.
 */

/* 1. o contexto de rolagem que capturava o sticky */
div:has(> .sc-host > header) {
  overflow-x: clip !important;
  overflow-y: visible !important;
}

/* 2. o wrapper do componente gruda junto com o cabeçalho */
.sc-host:has(> header) {
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
}

/* A âncora #agendar leva o alvo para baixo do cabeçalho preso; o recuo evita
   que o título do destino fique escondido atrás dele. */
:target {
  scroll-margin-top: 78px;
}