/* ==========================================================================
   GUIA SANTAMARIENSE: identidade e topo próprios
   (template-parts/guia-marca.php; só na lista, no ramo e na página da empresa)
   O Guia é um produto dentro do portal: faixa escura própria, nome em destaque
   e a busca como primeira coisa da tela. As cores ficam em variáveis para
   outras cidades trocarem.
   ========================================================================== */
body.guia-marca {
    --gs-fundo: #12303a;
    --gs-fundo-2: #0c242c;
    --gs-acento: #f2b84b;
    --gs-texto: #eaf1f3;
    --gs-suave: #9db4bb;
}

.gs-marca {
    margin: 0 0 24px;
    padding: 26px 0 20px;
    background: linear-gradient(180deg, var(--gs-fundo) 0%, var(--gs-fundo-2) 100%);
    color: var(--gs-texto);
}

.gs-marca-topo { display: flex; align-items: center; gap: 10px 22px; flex-wrap: wrap; margin: 0 0 16px; }
.gs-marca-nome {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    font-family: var(--font-serif, Georgia, serif);
    font-size: 34px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.01em;
    color: #fff;
    text-decoration: none;
}
.gs-marca-pin {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--gs-acento);
    font-size: 18px;
    color: var(--gs-fundo-2);
}
.gs-marca-lema { margin: 0; font-size: 14.5px; color: var(--gs-suave); }
.gs-marca-cta {
    margin-left: auto;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--gs-acento);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.gs-marca-cta:hover { border-bottom-color: var(--gs-acento); }

/* Busca: o campo mais importante da tela */
.gs-busca { display: flex; align-items: center; gap: 0; max-width: 760px; margin: 0 0 16px; padding: 5px 5px 5px 16px; border-radius: 10px; background: #fff; }
.gs-busca i { color: #7b8a90; font-size: 16px; }
.gs-busca input[type="search"] {
    flex: 1;
    min-width: 0;
    padding: 12px 12px;
    border: 0;
    background: none;
    font-size: 16px;
    color: #17191d;
    outline: none;
    box-shadow: none;
}
.gs-busca button {
    padding: 12px 24px;
    border: 0;
    border-radius: 7px;
    background: var(--gs-acento);
    font-size: 14.5px;
    font-weight: 800;
    color: var(--gs-fundo-2);
    cursor: pointer;
}
.gs-busca button:hover { filter: brightness(1.06); }
.gs-busca:focus-within { box-shadow: 0 0 0 3px rgba(242, 184, 75, .45); }

/* Ramos */
.gs-ramos { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.gs-ramos::-webkit-scrollbar { display: none; }
.gs-ramos a {
    flex: none;
    padding: 7px 15px;
    border: 1px solid rgba(255, 255, 255, .22);
    border-radius: 999px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--gs-texto);
    text-decoration: none;
    white-space: nowrap;
    transition: background-color .15s, border-color .15s, color .15s;
}
.gs-ramos a:hover { border-color: var(--gs-acento); color: #fff; }
.gs-ramos a.is-ativo { border-color: var(--gs-acento); background: var(--gs-acento); color: var(--gs-fundo-2); font-weight: 800; }

/* No restante da página, o acento do Guia substitui o vermelho do portal */
body.guia-marca .ct-achados-abas a.is-ativo { background: var(--gs-fundo); border-color: var(--gs-fundo); }
body.guia-marca .ct-arq-header { border-bottom-color: var(--gs-fundo); }
body.guia-marca .ct-arq-contagem a { color: var(--gs-fundo); font-weight: 800; }

@media (max-width: 700px) {
    .gs-marca { padding: 18px 0 14px; margin-bottom: 18px; }
    .gs-marca-nome { font-size: 27px; }
    .gs-marca-pin { width: 34px; height: 34px; font-size: 15px; }
    .gs-marca-lema { flex: 1 1 100%; order: 3; font-size: 13.5px; }
    .gs-marca-cta { font-size: 13px; }
    .gs-busca { padding-left: 12px; }
    .gs-busca button { padding: 11px 16px; }
    .gs-busca input[type="search"] { font-size: 15px; }
}

/* Cabeçalho completo do Guia: hambúrguer, links e conta na linha do nome */
.gs-marca { margin-bottom: 0; }
.gs-menu { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 8px; background: none; font-size: 17px; color: #fff; cursor: pointer; }
.gs-menu:hover { border-color: var(--gs-acento); }
.gs-marca-links { display: flex; align-items: center; gap: 18px; margin-left: auto; }
.gs-marca-links .gs-marca-cta { margin-left: 0; }
.gs-link-portal { font-size: 13px; font-weight: 600; color: var(--gs-suave); text-decoration: none; white-space: nowrap; }
.gs-link-portal:hover { color: #fff; }
.gs-conta .ct-top-clean-link, .gs-conta .ct-top-clean-link span { color: #fff; }
.gs-conta .ct-top-clean-link:hover { color: var(--gs-acento); }
.gs-conta { position: relative; }
body.guia-marca .ct-breadcrumb-wrap { display: none; }
@media (max-width: 900px) { .gs-link-portal span { display: none; } .gs-marca-cta { display: none; } }
@media (max-width: 700px) { .gs-marca-links { gap: 10px; } .gs-conta .ct-top-clean-link span { display: none; } }
@media (max-width: 700px) {
    .gs-menu { display: none; } /* no celular o menu do portal está em "Mais", na barra de baixo */
    .gs-marca-topo { flex-wrap: wrap; row-gap: 6px; }
    .gs-marca-nome { font-size: 25px; gap: 9px; }
}

/* Aberto agora (cartão da lista e cabeçalho da página da empresa) */
.ct-gl-status { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; color: #64748b; }
.ct-gl-ponto { width: 8px; height: 8px; border-radius: 50%; background: #94a3b8; }
.ct-gl-status.status-open { color: #15803d; }
.ct-gl-status.status-open .ct-gl-ponto { background: #16a34a; }
.ct-gl-status.status-closed { color: #b91c1c; }
.ct-gl-status.status-closed .ct-gl-ponto { background: #dc2626; }
.ct-empresa-status-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 0 0 12px; font-size: 14px; color: #475569; }
.ct-empresa-horario-linha i { margin-right: 4px; color: #94a3b8; }

/* Lista e ramo sem coluna lateral: o Guia ocupa a largura toda e não leva anúncio de terceiros */
.ct-main-grid--sem-lateral { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1100px) { .ct-main-grid--sem-lateral .ct-cat-grid-section { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
