/*
 * Topo na rolagem, no celular e no computador (Scripts/jv/topo.js; XD "001 - HOME": só o grupo "MENU FIXO" fica preso;
 * usuário, 18 e 19/10/2026). Rolando para baixo, a faixa roxa e o bloco de baixo (celular: busca e categorias;
 * computador: barra de categorias) saem com a página desde o começo, até sobrar só a faixa do meio; rolando para cima,
 * o topo inteiro volta. A altura do topo não muda, para a página não pular: o topo.js calcula quanto o topo preso sobe
 * (--jv-topo-subida, até a altura da faixa roxa) e quanto do bloco de baixo é cortado (--jv-topo-corte), a cada quadro
 * da rolagem; perto do começo, sem animação, para acompanhar o dedo (jv-topo--seguindo).
 */
#header.jv-topo {
  clip-path: inset(0 0 0 0);
  transition: top var(--jv-duration-base) var(--jv-ease), clip-path var(--jv-duration-base) var(--jv-ease);
}

/* Computador: aberto, sem corte, para os submenus da barra de categorias abrirem embaixo do topo. */
#header.jv-topo.jv-topo--submenu:not(.jv-topo--recolhido) {
  clip-path: none;
}

#header.jv-topo.jv-topo--recolhido {
  top: calc(-1 * var(--jv-topo-subida, 0px));
  clip-path: inset(0 0 var(--jv-topo-corte, 0px) 0);
}

#header.jv-topo.jv-topo--seguindo {
  transition: none;
}

/* Busca em uso: sem corte, para a lista de sugestões aparecer embaixo do topo. */
#header.jv-topo:focus-within,
body.searching #header.jv-topo,
body.show-search #header.jv-topo {
  clip-path: none;
}