/* =============================================================================
   WIDGET SEOLINKS — skins/wc_wey.css
   Skin do tema wc_wey (design system wb-*, wc_css/wc-wey.css). O rodapé do Wey é
   o bloco mais escuro da escala (o preto da marca), então os tokens do widget
   são mapeados nos --wb-* do tema em vez dos rgba() brancos genéricos do
   base.css — assim o bloco acompanha a paleta do painel
   (SITE_THEME_FOOTER_BG/TEXT/LINK → --wc-footer-* → --wb-footer-*).

   Cuidado de especificidade (o mesmo problema do skin wc_clinic, com outro
   culpado): wc-wey.css:1183 declara
       .wb-footer a:not(.btn)        { color: var(--wb-footer-link) }   (0,2,1)
       .wb-footer a:not(.btn):hover  { color: ...; text-decoration: underline }  (0,3,1)
   Como isso pinta QUALQUER âncora do rodapé, as variáveis --wc-seo-link/--wc-seo-chip-*
   sozinhas não teriam efeito. As regras abaixo alcançam os links pelo caminho
   .wb-footer .wc-seolinks a.<classe> (0,3,1 / 0,4,1) — vencem por especificidade,
   sem !important. O sublinhado do hover é mantido nos links do mapa (é o
   comportamento do rodapé) e removido só nos chips, que têm borda própria.

   ⚠️ Não esconder nada por CSS: ver o aviso no topo de seolinks.base.css.
   ============================================================================= */

.wc-seolinks {
    --wc-seo-border: rgba(var(--wb-bone-rgb), .14);
    --wc-seo-sum: var(--wb-bone);
    --wc-seo-sum-hover: var(--wb-green-300);
    --wc-seo-h: var(--wb-green-400);
    --wc-seo-accent: var(--wb-green-400);

    --wc-seo-link: var(--wb-footer-link);
    --wc-seo-link-hover: var(--wb-bone);

    --wc-seo-chip-border: rgba(var(--wb-bone-rgb), .18);
    --wc-seo-chip-bg: rgba(var(--wb-bone-rgb), .05);
    --wc-seo-chip-bg-hover: rgba(var(--wb-bone-rgb), .12);
    --wc-seo-chip-text: var(--wb-footer-text);
    --wc-seo-chip-text-hover: var(--wb-bone);

    --wc-seo-gap: var(--wb-space-5);
}

/* Respiro igual ao do pé do rodapé (.wb-footer__base) e ao bloco de newsletter:
   o widget entra como mais uma faixa da mesma grade vertical. A borda reta do
   base.css é trocada pelo MESMO fio em gradiente dos outros divisores do rodapé
   — sem ele, o bloco parece colado de outro tema. */
.wb-footer .wc-seolinks {
    position: relative;
    margin-top: var(--wb-space-7);
    padding-top: var(--wb-space-5);
    border-top: 0;
}

.wb-footer .wc-seolinks::before {
    content: '';
    position: absolute; left: 0; right: 0; top: 0; height: 1px;
    background: linear-gradient(90deg,
        rgba(var(--wb-bone-rgb), 0) 0%,
        color-mix(in srgb, var(--wb-green-500) 38%, transparent) 18%,
        rgba(var(--wb-bone-rgb), .2) 50%,
        color-mix(in srgb, var(--wb-green-500) 38%, transparent) 82%,
        rgba(var(--wb-bone-rgb), 0) 100%);
}

/* O summary fala com a voz dos títulos de coluna do rodapé (.wb-footer__t):
   mono, caixa alta, entrelinha larga. */
.wb-footer .wc-seolinks__sum {
    font-family: var(--wb-font-mono);
    font-size: var(--wb-fs-xs);
    font-weight: 500;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.wb-footer .wc-seolinks__h {
    font-family: var(--wb-font-mono);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .14em;
}

/* Vence .wb-footer a:not(.btn) (0,2,1) — sem isto o chip herda a cor de link do
   rodapé e a borda fica sem contraste com o texto. */
.wb-footer .wc-seolinks a.wc-seolinks__chip {
    color: var(--wc-seo-chip-text);
    text-decoration: none;
}

.wb-footer .wc-seolinks a.wc-seolinks__chip:hover,
.wb-footer .wc-seolinks a.wc-seolinks__chip:focus-visible {
    color: var(--wc-seo-chip-text-hover);
    text-decoration: none;   /* o chip já tem borda e fundo; sublinhar polui */
}

.wb-footer .wc-seolinks a.wc-seolinks__link {
    color: var(--wc-seo-link);
}

.wb-footer .wc-seolinks a.wc-seolinks__link:hover,
.wb-footer .wc-seolinks a.wc-seolinks__link:focus-visible {
    color: var(--wc-seo-link-hover);
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* Foco visível na mesma cor do resto do rodapé (wc-wey.css:1496). */
.wb-footer .wc-seolinks :focus-visible { outline-color: var(--wb-green-300); }

/* No celular o rodapé já é uma coluna longa: o mapa entra mais compacto. */
@media (max-width: 575.98px) {
    .wb-footer .wc-seolinks { margin-top: var(--wb-space-6); }
    .wb-footer .wc-seolinks__sum { letter-spacing: .12em; }
}
