@font-face {
  font-family: Poppins;
  src: url('/assets/fonts/Poppins-Regular.ttf') format('truetype');
  font-weight: 400;
  font-display: swap;
}

/* Transições entre documentos em navegadores compatíveis; os demais mantêm
   a navegação normal. Respeita a preferência de movimento reduzido abaixo. */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: site-sair .12s ease both; }
::view-transition-new(root) { animation: site-entrar .18s ease both; }
@keyframes site-sair { to { opacity: 0; } }
@keyframes site-entrar { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation: none; }
}

@font-face {
  font-family: Poppins;
  src: url('/assets/fonts/Poppins-Medium.ttf') format('truetype');
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: Poppins;
  src: url('/assets/fonts/Poppins-SemiBold.ttf') format('truetype');
  font-weight: 600 900;
  font-display: swap;
}

:root {
  --largura-site: 1480px;
  color-scheme: light;
  font-family: Poppins, Arial, sans-serif;
  color: var(--pal-2b2541, #2b2541);
  background: var(--pal-f5f3f9, #f5f3f9);
  --cor-roxo: var(--pal-6b56d6, #6b56d6);
  --cor-roxo-medio: var(--pal-7f46c8, #7f46c8);
  --cor-roxo-forte: var(--pal-a03dbb, #a03dbb);
  --cor-texto: var(--pal-2b2541, #2b2541);
  --cor-suave: var(--pal-736c80, #736c80);
  --cor-borda: var(--pal-eeeaf4, #eeeaf4);
  --cor-fundo: var(--pal-f5f3f9, #f5f3f9);
  --degrade-marca: linear-gradient(125deg, var(--pal-6b56d6, #6b56d6) 0%, var(--pal-7f46c8, #7f46c8) 52%, var(--pal-a03dbb, #a03dbb) 100%);
}

.carrinho-acesso {
  position: relative;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  flex: none;
  border: 1px solid rgba(255, 255, 255, .65);
  border-radius: 13px;
  background: rgba(255, 255, 255, .12);
  color: white;
  text-decoration: none;
}

.carrinho-acesso:hover,
.carrinho-acesso:focus-visible { background: rgba(255, 255, 255, .24); }
.carrinho-acesso svg { width: 22px; height: 22px; }

.carrinho-contagem {
  position: absolute;
  top: -8px;
  right: -9px;
  display: grid;
  place-items: center;
  min-width: 20px;
  height: 20px;
  padding: 0 4px;
  border-radius: 999px;
  background: white;
  color: var(--pal-6e45b3, #6e45b3);
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
}

.topo-acoes {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  gap: 5px;
}

.topo-acoes .acesso-painel,
.topo-acoes .carrinho-acesso {
  position: relative;
  top: auto;
  right: auto;
  transform: none;
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: white;
  box-shadow: none;
}

.topo-acoes .carrinho-acesso svg { width: 19px; height: 19px; }
.topo-acoes .acesso-painel:hover,
.topo-acoes .acesso-painel:focus-visible,
.topo-acoes .carrinho-acesso:hover,
.topo-acoes .carrinho-acesso:focus-visible { background: rgba(255,255,255,.18); }
.topo-acoes .carrinho-contagem { top: -4px; right: -6px; min-width: 15px; height: 15px; font-size: 9px; }
.topo-acoes .carrinho-acesso:hover .login-balao,
.topo-acoes .carrinho-acesso:focus-visible .login-balao { opacity: 1; visibility: visible; }

.cabecalho-atalhos { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.cabecalho-atalhos .acesso-painel,
.cabecalho-atalhos .carrinho-acesso {
  position: relative;
  top: auto;
  right: auto;
  transform: none;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  flex: none;
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 13px;
  background: rgba(255,255,255,.12);
  color: white;
  text-decoration: none;
}
.cabecalho-atalhos .acesso-painel svg,
.cabecalho-atalhos .carrinho-acesso svg { width: 23px; height: 23px; }
.cabecalho-atalhos .acesso-painel:hover,
.cabecalho-atalhos .acesso-painel:focus-visible,
.cabecalho-atalhos .carrinho-acesso:hover,
.cabecalho-atalhos .carrinho-acesso:focus-visible { background: rgba(255,255,255,.24); }
.cabecalho-atalhos .carrinho-acesso:hover .login-balao,
.cabecalho-atalhos .carrinho-acesso:focus-visible .login-balao { opacity: 1; visibility: visible; }

.contatos-rodape {
  width: min(var(--largura-site, 1480px), calc(100% - 40px));
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 13px;
  margin: 24px auto 0;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, .18);
}

.contatos-rodape[hidden] { display: none; }
.contato-item { display: inline-flex; align-items: center; gap: 10px; min-width: 0; color: var(--pal-f1eafa, #f1eafa); font-size: 12px; text-decoration: none; overflow-wrap: anywhere; }
a.contato-item:hover { color: white; text-decoration: underline; }
.contato-icone { display: grid; place-items: center; width: 30px; height: 30px; flex: none; border: 1px solid rgba(255,255,255,.3); border-radius: 9px; background: rgba(255,255,255,.1); }
.contato-icone svg { width: 18px; height: 18px; }

.paginas-rodape {
  width: min(var(--largura-site, 1480px), calc(100% - 40px));
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 11px 18px;
  margin: 24px auto 0;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, .18);
}

.paginas-rodape[hidden] { display: none; }
.paginas-rodape h2 { grid-column: 1 / -1; margin: 0 0 4px; color: white; font-size: 13px; font-weight: 600; }
.paginas-rodape a { color: var(--pal-e8dff1, #e8dff1); font-size: 12px; text-decoration: none; }
.paginas-rodape a:hover { color: white; text-decoration: underline; }

@media (max-width: 760px) {
  .contatos-rodape { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .paginas-rodape { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 450px) {
  .contatos-rodape { grid-template-columns: 1fr; }
  .paginas-rodape { grid-template-columns: 1fr; }
}
.logo-branca-cabecalho { display: block; width: min(220px, 48vw); height: auto; }
.logo-branca-rodape { display: block; width: 150px; max-width: 100%; height: auto; }

/* Movimentos breves dos atalhos, sem repetição contínua. */
:is(.cabecalho-atalhos,.topo-acoes) a:hover > svg,
:is(.cabecalho-atalhos,.topo-acoes) a:focus-visible > svg {animation:atalho-salto .32s ease-out 1;}
:is(.cabecalho-atalhos,.topo-acoes) .favoritos-acesso:hover > svg {animation:atalho-brilho .4s ease-out 1;}
@keyframes atalho-salto {0%,100%{transform:translateY(0);}50%{transform:translateY(-3px);}}
@keyframes atalho-brilho {0%,100%{transform:scale(1) rotate(0);}50%{transform:scale(1.12) rotate(10deg);}}
@media(prefers-reduced-motion:reduce){:is(.cabecalho-atalhos,.topo-acoes) a:hover > svg,:is(.cabecalho-atalhos,.topo-acoes) a:focus-visible > svg {animation:none;}}
