:root {
    /* folha de orçamento — SVG embutido, sem pedido externo */
    --bb-icone-orcamento: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"/><path d="M14 2v6h6"/><path d="M8 13h8"/><path d="M8 17h5"/></svg>');
}

/* ---- botão de WhatsApp, dentro do menu ----
   ATENÇÃO: o seletor do tema (#site-navigation .dropdown-menu > li > a) tem
   especificidade altíssima. Se as regras do botão forem escritas só em .bb-zap,
   o tema ganha e esmaga-o (foi o que aconteceu). Por isso TUDO aqui usa o
   mesmo seletor longo — e o efeito de sublinhado do tema é anulado. */

/* A lista de topo do menu nao era flex: os itens flutuavam, e um botao de
   32px nao tinha por onde se centrar na altura. Tornando a lista flex,
   tudo passa a alinhar pelo eixo central.

   CUIDADO — foi aqui que me enganei: um `display: flex !important` sem
   media query ANULA o `display: none` com que o OceanWP esconde o menu
   de desktop no telemovel. O hamburguer nunca entrava e o cabecalho
   atropelava-se todo. Por isso a regra so existe a partir dos 960px. */
@media only screen and (min-width: 1025px) {
    #site-navigation .dropdown-menu {
        display: flex !important;
        align-items: center !important;
        flex-wrap: nowrap;
    }
    #site-navigation .dropdown-menu > li {
        float: none !important;
        display: flex !important;
        align-items: center !important;
    }
    #site-navigation .dropdown-menu > li.bb-menu-zap {
        align-self: center !important;
        margin-left: 14px;
        height: auto !important;
    }
    #site-navigation .dropdown-menu > li.bb-menu-zap > a.bb-zap {
        align-self: center !important;
        margin: 0 !important;
    }
}

/* Abaixo dos 960px manda o tema: menu de desktop escondido, hamburguer a
   funcionar. O botao verde e o seletor de idioma vivem dentro do menu de
   desktop, por isso desaparecem com ele — e reaparecem no menu movel. */
@media only screen and (max-width: 1024px) {
    #site-navigation-wrap,
    #site-navigation .dropdown-menu { display: none !important; }

    .oceanwp-mobile-menu-icon { display: flex !important; align-items: center; }
}

#site-navigation .dropdown-menu > li.bb-menu-zap > a.bb-zap,
.bb-zap {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    height: 32px !important;
    padding: 0 13px !important;
    border-radius: 999px !important;
    background: #25d366 !important;
    color: #0b3d21 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
    border: 0 !important;
    transition: background .15s ease;
}
#site-navigation .dropdown-menu > li.bb-menu-zap > a.bb-zap:hover,
.bb-zap:hover {
    background: #1eb955 !important;
    color: #0b3d21 !important;
}

/* o tema desenha um sublinhado animado dentro de cada link do menu:
   dentro do botão isso era o "efeito estranho" — fora. */
#site-navigation .dropdown-menu > li.bb-menu-zap > a::before,
#site-navigation .dropdown-menu > li.bb-menu-zap > a::after,
#site-navigation .dropdown-menu > li.bb-menu-zap > a .text-wrap::after {
    display: none !important;
    content: none !important;
}

.bb-zap__icone {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 14px;
    height: 14px;
}
.bb-zap__icone svg { width: 14px; height: 14px; display: block; }
.bb-zap__txt {
    font-size: 12.5px !important;
    font-weight: 650 !important;
    line-height: 1 !important;
}

/* ---- ÍCONE DO CARRINHO ----
   Não é uma loja de compra imediata: é uma lista de artigos para orçamentar.
   Um carrinho de supermercado comunica a coisa errada. */
#site-header .wcmenucart .owp-icon,
#site-header .wcmenucart i,
#site-header .wcmenucart svg { display: none !important; }

#site-header a.wcmenucart::before {
    content: "";
    display: inline-block;
    width: 19px;
    height: 19px;
    vertical-align: middle;
    background-color: currentColor;
    -webkit-mask: var(--bb-icone-orcamento) center/contain no-repeat;
            mask: var(--bb-icone-orcamento) center/contain no-repeat;
}

/* ---------------- CABEÇALHO FIXO ---------------- */
#site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: rgba(255,255,255,.88) !important;
    backdrop-filter: saturate(180%) blur(14px);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    border-bottom: 1px solid rgba(0,0,0,.07) !important;
}

/* ---------------- MEGA-MENU ----------------
   Painel em colunas: cada CATEGORIA é o cabeçalho de uma coluna e as suas
   SUBCATEGORIAS ficam listadas por baixo. Tudo visível de uma vez — sem
   acordeões, sem cliques, sem manobras de precisão com o rato.

   CUIDADO: o OceanWP esconde os submenus com `display: none` e abre-os com
   a classe .sfHover. Um `display: grid !important` incondicional anulava o
   `none` e o menu ficava SEMPRE ABERTO. Por isso a grelha só se aplica ao
   estado aberto. */

#site-navigation .dropdown-menu > li.menu-item-has-children:hover > ul.sub-menu,
#site-navigation .dropdown-menu > li.menu-item-has-children.sfHover > ul.sub-menu,
#site-navigation .dropdown-menu > li.menu-item-has-children:focus-within > ul.sub-menu {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(178px, 1fr));
    align-items: start;
    gap: 4px 10px;
    width: max-content !important;
    max-width: calc(100vw - 40px) !important;
    max-height: calc(100vh - 130px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 20px !important;
    border-radius: 14px !important;
}

/* cada categoria = uma coluna */
#site-navigation .dropdown-menu ul.sub-menu > li {
    display: block !important;
    border: 0 !important;
    break-inside: avoid;
    margin-bottom: 10px;
}

/* o link da categoria = cabeçalho da coluna */
#site-navigation .dropdown-menu ul.sub-menu > li > a {
    display: block !important;
    font-size: 13px !important;
    font-weight: 750 !important;
    color: #16191d !important;
    text-transform: uppercase;
    letter-spacing: .06em;
    padding: 6px 8px !important;
    margin-bottom: 2px;
    border-radius: 6px !important;
    border-bottom: 1px solid #eef0f2 !important;
    line-height: 1.3 !important;
}
#site-navigation .dropdown-menu ul.sub-menu > li > a:hover {
    color: #1d4ed8 !important;
    background: transparent !important;
}

/* as SUBCATEGORIAS: sempre visíveis, por baixo da categoria */
#site-navigation .dropdown-menu ul.sub-menu ul.sub-menu {
    display: block !important;
    position: static !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    max-height: none !important;
    overflow: visible !important;
    box-shadow: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    min-width: 0 !important;
    width: auto !important;
    margin: 0 !important;
    padding: 4px 0 0 !important;
    grid-template-columns: none !important;
}
#site-navigation .dropdown-menu ul.sub-menu ul.sub-menu > li { margin: 0 !important; }
#site-navigation .dropdown-menu ul.sub-menu ul.sub-menu > li > a {
    display: block !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    color: #5c646e !important;
    padding: 6px 8px !important;
    border: 0 !important;
    border-radius: 6px !important;
    line-height: 1.35 !important;
}
#site-navigation .dropdown-menu ul.sub-menu ul.sub-menu > li > a:hover {
    background: #f2f4f6 !important;
    color: #16191d !important;
}

/* SO CLASSES E SUBCLASSES.
   O terceiro nível (Serie 13, Serie 80, Curva, Direita, Alcatifas Auto...)
   sai do menu: são filtros, não navegação. O sítio deles é a página da
   categoria, onde o filtro já existe. */
#site-navigation .dropdown-menu ul.sub-menu ul.sub-menu ul.sub-menu {
    display: none !important;
}

/* setas dos submenus internos: não fazem sentido, está tudo aberto */
#site-navigation .dropdown-menu ul.sub-menu .nav-arrow { display: none !important; }

/* ponte invisível: o menu não fecha quando o rato atravessa o vazio */
#site-navigation .dropdown-menu > li.menu-item-has-children > ul.sub-menu::before {
    content: "";
    position: absolute;
    top: -14px; left: 0; right: 0;
    height: 14px;
}
#site-navigation .dropdown-menu > li.menu-item-has-children > ul.sub-menu { left: 0; right: auto; }

/* barra de scroll discreta */
#site-navigation ul.sub-menu::-webkit-scrollbar { width: 6px; }
#site-navigation ul.sub-menu::-webkit-scrollbar-thumb { background: #d4d8dd; border-radius: 3px; }

/* janelas estreitas: menos colunas */
@media (max-width: 1280px) {
    #site-navigation .dropdown-menu > li.menu-item-has-children:hover > ul.sub-menu,
    #site-navigation .dropdown-menu > li.menu-item-has-children.sfHover > ul.sub-menu,
    #site-navigation .dropdown-menu > li.menu-item-has-children:focus-within > ul.sub-menu {
        grid-template-columns: repeat(3, minmax(168px, 1fr));
    }
}
@media (max-width: 980px) {
    #site-navigation .dropdown-menu > li.menu-item-has-children:hover > ul.sub-menu,
    #site-navigation .dropdown-menu > li.menu-item-has-children.sfHover > ul.sub-menu,
    #site-navigation .dropdown-menu > li.menu-item-has-children:focus-within > ul.sub-menu {
        grid-template-columns: repeat(2, minmax(160px, 1fr));
    }
}

/* ---------------- CABEÇALHO: JANELAS ESTREITAS ----------------
   Ao tornar o menu flex (para centrar o botão), criei um problema:
   com `nowrap`, em janelas médias o menu + logótipo + carrinho
   transbordavam e empurravam o conteúdo. Estas regras contêm isso. */

#site-header .container,
#site-header #site-header-inner {
    max-width: 100% !important;
    box-sizing: border-box;
}

#site-navigation-wrap { min-width: 0; }
#site-navigation .dropdown-menu { min-width: 0; flex-wrap: nowrap; }

/* os separadores do menu encolhem antes de rebentar */
@media (max-width: 1200px) {
    #site-navigation .dropdown-menu > li > a { padding: 0 10px !important; }
    #site-navigation .dropdown-menu > li.bb-menu-zap { margin-left: 8px; }
}
@media (max-width: 1040px) {
    #site-navigation .dropdown-menu > li > a { padding: 0 7px !important; font-size: 13px !important; }
    .bb-zap__txt { font-size: 12px !important; }
    #site-navigation .dropdown-menu > li.bb-menu-zap > a.bb-zap { padding: 0 10px !important; }
}

/* ---- MENU MÓVEL ---- */
#mobile-dropdown { max-height: calc(100vh - 70px); overflow-y: auto; overscroll-behavior: contain; }
#mobile-dropdown ul li a { font-size: 15px !important; padding: 14px 20px !important; }

/* o botao verde ocupa a linha toda no menu movel */
#mobile-dropdown li.bb-menu-zap { padding: 12px 20px; }
#mobile-dropdown li.bb-menu-zap > a.bb-zap {
    display: flex !important;
    width: 100% !important;
    height: 48px !important;
    justify-content: center !important;
    border-radius: 10px !important;
    padding: 0 16px !important;
}
#mobile-dropdown li.bb-menu-zap > a.bb-zap .bb-zap__txt { font-size: 14px !important; }

/* o seletor de idioma tambem */
#mobile-dropdown .gtranslate_wrapper { display: block !important; padding: 8px 20px 14px; }

/* nada, em pagina nenhuma, pode causar scroll horizontal */
html, body { overflow-x: hidden; max-width: 100%; }
#main, #content-wrap, .container { max-width: 100%; box-sizing: border-box; }
img, video, iframe, table { max-width: 100%; }

/* ---------------- SELETOR DE IDIOMA ----------------
   Estava desalinhado e por ordenar. */
#site-navigation .gtranslate_wrapper,
li.menu-item .gtranslate_wrapper {
    display: inline-flex !important;
    align-items: center;
    margin-left: 8px;
}
.gt_switcher_wrapper, .gtranslate_wrapper .gt_switcher {
    font-family: var(--bb-fonte, sans-serif) !important;
    font-size: 13px !important;
    width: auto !important;
}
.gtranslate_wrapper .gt_switcher .gt_selected a {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    height: 32px !important;
    padding: 0 12px !important;
    border: 1px solid var(--bb-linha, #e6e8eb) !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: var(--bb-tinta, #16191d) !important;
    font-weight: 600 !important;
    line-height: 1 !important;
}
.gtranslate_wrapper .gt_switcher .gt_option {
    border: 1px solid var(--bb-linha, #e6e8eb) !important;
    border-radius: 10px !important;
    box-shadow: 0 12px 28px rgba(16,24,40,.12) !important;
    padding: 5px !important;
    margin-top: 5px !important;
    overflow: hidden;
    width: auto !important;
    min-width: 150px;
}
.gtranslate_wrapper .gt_switcher .gt_option a {
    display: flex !important;
    align-items: center;
    gap: 8px;
    border: 0 !important;
    border-radius: 6px !important;
    padding: 8px 10px !important;
    font-size: 13px !important;
    line-height: 1.3 !important;
    color: var(--bb-tinta, #16191d) !important;
}
.gtranslate_wrapper .gt_switcher .gt_option a:hover {
    background: var(--bb-fundo-suave, #f7f8f9) !important;
}

/* ---------------- FAIXA CTA ---------------- *//* ---------------- FAIXA CTA ---------------- *//* ---------------- FAIXA CTA ---------------- */
.bb-cta {
    background: linear-gradient(135deg, #12161b 0%, #1e2a3a 55%, #1d4ed8 160%);
    color: #fff;
    margin-top: 64px;
}
.bb-cta__int {
    max-width: 1401px;
    margin: 0 auto;
    padding: 56px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    flex-wrap: wrap;
}
.bb-cta__txt { flex: 1 1 380px; }
.bb-cta__txt h2 {
    color: #fff !important;
    font-size: 30px !important;
    font-weight: 750 !important;
    margin: 0 0 10px !important;
    letter-spacing: -.02em;
}
.bb-cta__txt p { color: #b9c2cd; margin: 0; font-size: 16px; max-width: 52ch; }
.bb-cta__acoes { display: flex; gap: 12px; flex-wrap: wrap; }

.bb-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 15px;
    padding: 15px 26px;
    border-radius: 10px;
    white-space: nowrap;
    transition: transform .12s ease, box-shadow .15s ease, background .15s ease;
}
.bb-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(0,0,0,.28); }
.bb-btn--claro { background: #fff; color: #12161b !important; }
.bb-btn--claro:hover { background: #f1f3f5; }
.bb-btn--linha { border: 1.5px solid rgba(255,255,255,.35); color: #fff !important; }
.bb-btn--linha:hover { border-color: #fff; background: rgba(255,255,255,.08); }

/* ---------------- RODAPÉ COMPACTO ---------------- */
#footer-widgets { display: none !important; }

.bb-rodape { background: #12161b; color: #a6b0bb; }
.bb-rodape__int {
    max-width: 1280px;
    margin: 0 auto;
    padding: 48px 24px 40px;
    display: grid;
    grid-template-columns: 1.5fr 1fr 1.2fr;
    gap: 40px;
}
.bb-rodape__col--marca strong { display: block; color: #fff; font-size: 16px; font-weight: 750; margin-bottom: 8px; }
.bb-rodape__col--marca p { color: #78838f; font-size: 14px; line-height: 1.6; margin: 0 0 18px; max-width: 34ch; }

/* Especificidade alta: a regra global de botões do tema (padding !important)
   comia o padding esquerdo e esmagava o ícone contra o texto. */
.bb-rodape a.bb-rodape__zap {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    background: #25d366 !important;
    color: #06301a !important;
    font-size: 13.5px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    padding: 11px 20px !important;
    border: 0 !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    transition: background .15s ease, transform .12s ease !important;
}
.bb-rodape a.bb-rodape__zap:hover {
    background: #22c55e !important;
    transform: translateY(-1px);
    color: #06301a !important;
}
.bb-rodape a.bb-rodape__zap svg {
    width: 16px !important;
    height: 16px !important;
    flex: 0 0 auto;
    display: block;
}

.bb-rodape__col h3 {
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: .11em;
    margin: 0 0 14px !important;
}
.bb-rodape__col ul { list-style: none; margin: 0; padding: 0; }
.bb-rodape__col li { margin-bottom: 8px; font-size: 14px; line-height: 1.5; }
.bb-rodape__col a { color: #a6b0bb !important; transition: color .15s ease; }
.bb-rodape__col a:hover { color: #fff !important; }
.bb-rodape__mudo { color: #6b7581; font-size: 13px !important; }

/* lista de contactos com ícone antes do texto */
.bb-contactos-lista li {
    display: flex !important;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 11px !important;
}
.bb-contactos-lista .bb-ci {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    margin-top: 2px;
    color: #6ee7a8;   /* verde suave, a condizer com o resto */
    opacity: .9;
}
.bb-contactos-lista li.bb-rodape__mudo { color: #6b7581; }
.bb-contactos-lista li.bb-rodape__mudo .bb-ci { color: #5b6672; }
.bb-contactos-lista a { word-break: break-word; }

/* morada: clicável, abre o Google Maps (o ícone está fora do link, na lista) */
.bb-rodape__mapa { line-height: 1.5; }

/* ÚLTIMA LINHA: copyright à esquerda, links legais à direita, numa só linha.
   A minha barra legal é injetada antes de #footer-bottom-inner (que tem o
   copyright); torno o #footer-bottom flex e uso 'order' para os alinhar. */
#footer-bottom {
    background: #12161b !important;
    border-top: 1px solid #212831 !important;
    /* padding-right generoso: o botão flutuante do WhatsApp fica no canto
       inferior direito e tapava o "Livro de Reclamações" */
    padding: 16px 100px 16px 24px !important;
    font-size: 13px;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 12px 28px;
    flex-wrap: wrap;
}
#footer-bottom-inner {
    order: 0;                 /* copyright à esquerda */
    max-width: none !important;
    width: auto !important;
    padding: 0 !important;
    margin: 0 !important;
}
#footer-bottom .copyright-text, #footer-bottom .copyright { margin: 0 !important; }

.bb-rodape__legal { order: 1; display: inline-flex; }   /* legal à direita */
.bb-legal-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    align-items: center;
}
.bb-legal-links a {
    font-size: 13px;
    color: #8a929b !important;
    transition: color .15s ease;
    cursor: pointer;
    white-space: nowrap;
}
.bb-legal-links a:hover { color: #fff !important; }
.bb-livro {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12.5px;
    font-weight: 600;
    color: #cfd6dd !important;
    border: 1px solid #2b3340;
    padding: 7px 13px;
    border-radius: 8px;
    transition: border-color .15s ease, color .15s ease;
    white-space: nowrap;
}
.bb-livro:hover { border-color: #4a5563; color: #fff !important; }
.bb-livro svg { width: 14px; height: 14px; flex: 0 0 auto; }

@media (max-width: 860px) {
    #footer-bottom { flex-direction: column; align-items: flex-start; gap: 14px; padding: 16px 20px 78px !important; }
    .bb-legal-links { gap: 8px 14px; }
}

/* ================= BANNER DE COOKIES (Complianz) =================
   Estilizado à imagem do site — em vez do aspeto genérico do plugin. */
#cmplz-cookiebanner-container .cmplz-cookiebanner {
    background: #12161b !important;
    border: 1px solid #232a33 !important;
    border-radius: 14px !important;
    box-shadow: 0 20px 50px rgba(0,0,0,.42) !important;
    font-family: var(--bb-fonte, sans-serif) !important;
    max-width: 520px !important;
    width: calc(100% - 32px) !important;
    padding: 22px 24px !important;
    /* Em baixo, nao centrado. Centrado tapava o meio do ecra no telemovel e,
       com o "soft cookie wall" do Complianz ligado, o site ficava sem resposta
       ao toque ate o banner ser respondido — nao se conseguia abrir as fotos.
       O soft cookie wall foi desligado nas definicoes do plugin; o banner
       continua a pedir consentimento e nada e instalado antes da resposta. */
    position: fixed !important;
    left: 50% !important;
    top: auto !important;
    right: auto !important;
    bottom: 14px !important;
    transform: translateX(-50%) !important;
    max-height: 70vh !important;
    overflow-y: auto !important;
    z-index: 100000 !important;
}
@media (max-width: 600px) {
    #cmplz-cookiebanner-container .cmplz-cookiebanner {
        max-width: none !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        transform: none !important;
        border-radius: 14px 14px 0 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        border-bottom: 0 !important;
        padding: 16px 18px !important;
        max-height: 60vh !important;
    }
}
#cmplz-cookiebanner-container .cmplz-title {
    color: #fff !important;
    font-size: 16px !important;
    font-weight: 750 !important;
    letter-spacing: -.01em;
}
#cmplz-cookiebanner-container .cmplz-body,
#cmplz-cookiebanner-container .cmplz-message {
    color: #aab4bf !important;
    font-size: 13.5px !important;
    line-height: 1.6 !important;
}
#cmplz-cookiebanner-container .cmplz-links a,
#cmplz-cookiebanner-container .cmplz-body a { color: #6ee7a8 !important; text-decoration: underline; }

#cmplz-cookiebanner-container .cmplz-buttons { gap: 10px !important; margin-top: 6px !important; }
#cmplz-cookiebanner-container .cmplz-btn {
    border-radius: 9px !important;
    font-size: 13.5px !important;
    font-weight: 650 !important;
    font-family: var(--bb-fonte, sans-serif) !important;
    padding: 11px 18px !important;
    border: 1px solid transparent !important;
    transition: filter .15s ease, background .15s ease, border-color .15s ease;
    min-width: 0 !important;
}
#cmplz-cookiebanner-container .cmplz-btn.cmplz-accept {
    background: #25d366 !important;
    color: #06301a !important;
}
#cmplz-cookiebanner-container .cmplz-btn.cmplz-accept:hover { background: #22c55e !important; }
#cmplz-cookiebanner-container .cmplz-btn.cmplz-deny {
    background: transparent !important;
    border-color: #3a434e !important;
    color: #cfd6dd !important;
}
#cmplz-cookiebanner-container .cmplz-btn.cmplz-deny:hover { border-color: #5a636e !important; color: #fff !important; }
#cmplz-cookiebanner-container .cmplz-btn.cmplz-view-preferences,
#cmplz-cookiebanner-container .cmplz-btn.cmplz-save-preferences {
    background: transparent !important;
    color: #8a929b !important;
    border-color: transparent !important;
    text-decoration: underline;
}
#cmplz-cookiebanner-container .cmplz-btn.cmplz-view-preferences:hover { color: #fff !important; }

/* contraste: TODO o texto dentro do banner tem de ser legível sobre o fundo escuro */
#cmplz-cookiebanner-container .cmplz-cookiebanner,
#cmplz-cookiebanner-container .cmplz-cookiebanner * { color: #cfd6dd; }
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-title,
#cmplz-cookiebanner-container .cmplz-category .cmplz-category-title { color: #fff !important; }
#cmplz-cookiebanner-container .cmplz-description,
#cmplz-cookiebanner-container .cmplz-category .cmplz-description { color: #9aa4af !important; font-size: 12.5px !important; line-height: 1.55 !important; }
#cmplz-cookiebanner-container .cmplz-always-active { color: #6ee7a8 !important; font-weight: 600 !important; }

/* toggles: verde quando ligado, cinza quando desligado (opt-in: desligados por omissão) */
#cmplz-cookiebanner-container .cmplz-category .cmplz-banner-checkbox input:checked + .cmplz-label .cmplz-slider,
#cmplz-cookiebanner-container input[type="checkbox"]:checked + label .cmplz-slider { background: #25d366 !important; }

/* categorias (quando abre preferências) */
#cmplz-cookiebanner-container .cmplz-category {
    background: #1a1f27 !important;
    border: 1px solid #232a33 !important;
    border-radius: 10px !important;
    color: #cfd6dd !important;
}
#cmplz-cookiebanner-container .cmplz-category .cmplz-title { font-size: 14px !important; }

/* O CSS do Complianz que esconde este painel não está a carregar (LiteSpeed
   adia-o), por isso o painel de gestão aparecia solto no rodapé. Replico aqui
   o default do plugin. SEM !important, para o Complianz o poder abrir por JS. */
#cmplz-manage-consent-container,
.cmplz-manage-consent-container { display: none; }

/* o botão flutuante de rever cookies não deve tapar o WhatsApp */
.cmplz-manage-consent-container.cmplz-manage-consent { bottom: auto !important; }
#footer-bottom, #footer-bottom p { color: #6b7581 !important; margin: 0 !important; }
#footer-bottom a { color: #9aa4af !important; }
#footer-bottom a:hover { color: #fff !important; }

/* ---------------- MOBILE ---------------- */
@media (max-width: 767px) {
    /* no menu do telemóvel o círculo passa a botão largo, com texto */
    /* o menu do telemóvel tem de poder rolar: são ~40 categorias */
    #mobile-dropdown { max-height: calc(100vh - 80px); overflow-y: auto; overscroll-behavior: contain; }

    #mobile-dropdown li.bb-menu-zap { margin: 12px 20px; }
    #mobile-dropdown li.bb-menu-zap .bb-zap {
        width: 100%; height: 48px; border-radius: 10px;
        padding: 0 16px !important;
    }

    /* No telemóvel volta a ser uma coluna — mas só quando ABERTO.
       (Aqui também: sem os estados, o `!important` mantinha o menu
       permanentemente aberto por cima da página.) */
    #site-navigation .dropdown-menu > li.menu-item-has-children:hover > ul.sub-menu,
    #site-navigation .dropdown-menu > li.menu-item-has-children.sfHover > ul.sub-menu,
    #site-navigation .dropdown-menu > li.menu-item-has-children:focus-within > ul.sub-menu {
        display: block !important;
        min-width: 0 !important;
        grid-template-columns: none !important;
    }

    .bb-cta { margin-top: 40px; }
    .bb-cta__int { padding: 40px 18px; gap: 26px; }
    .bb-cta__txt h2 { font-size: 24px !important; }
    .bb-cta__acoes { width: 100%; }
    .bb-btn { flex: 1; min-height: 50px; }
    .bb-rodape__int { grid-template-columns: 1fr; gap: 30px; padding: 36px 18px 30px; }
}

/* ---- LOGOTIPO: contido na altura do header (o tema deixava-o com 148-173px
   dentro de uma barra de 53px, saia gigante e cortado) ---- */
#site-logo #site-logo-inner a img,
#site-header.center-header #site-navigation-wrap .middle-site-logo a img,
#site-logo.has-responsive-logo .responsive-logo-link img {
    max-height: 42px !important;
    max-width: 180px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain;
}
#site-logo #site-logo-inner { display: flex !important; align-items: center !important; }
@media (max-width: 1024px) {
    #site-logo #site-logo-inner a img,
    #site-logo.has-responsive-logo .responsive-logo-link img { max-height: 36px !important; }
}

/* ---- avalie-nos no rodape ---- */
.bb-rodape__avaliar {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    padding: 9px 16px !important;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    color: #fff !important;
    transition: background .15s ease, border-color .15s ease;
}
.bb-rodape__avaliar:hover { background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.45); }
.bb-rodape__estrelas { color: #fbbf24; letter-spacing: 2px; font-size: 12px; }