/* =====================================================================
   ntc-custom.css  —  Camada de tema do site (tipografia + cores)

   Carregado DEPOIS de ntc.css em todas as páginas ativas.
   Usa !important de propósito: precisa vencer o ntc.css e também os
   blocos <style> inline que cada página ainda tem no <head>
   (ex.: "body,td,th { font-family: Hind }" e ".noticia-texto,p { color:#414042 }").

   Este arquivo vive em /assets/css/ ; as fontes em /assets/fonts/ .
   Fonte: Roboto hospedada localmente (.woff2 geradas a partir dos .ttf
   oficiais). Sem request a terceiros no carregamento.
   ===================================================================== */

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    font-display: swap;
    src: url('../fonts/roboto-300.woff2') format('woff2');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/roboto-400.woff2') format('woff2');
}
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: url('../fonts/roboto-400-italic.woff2') format('woff2');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url('../fonts/roboto-500.woff2') format('woff2');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/roboto-700.woff2') format('woff2');
}
@font-face {
    font-family: 'Roboto';
    font-style: italic;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/roboto-700-italic.woff2') format('woff2');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 900;
    font-display: swap;
    src: url('../fonts/roboto-900.woff2') format('woff2');
}

/* ------------------------------------------------------------------ */
/* 1. Tipografia — Roboto em todo o site                             */
/*    (NÃO inclui <i> nem classes de ícone: FontAwesome / Pe-icon-7) */
/* ------------------------------------------------------------------ */
body,
h1, h2, h3, h4, h5, h6,
p, a, li, blockquote, figcaption,
td, th, caption,
input, select, textarea, button, label,
.nav-link, .navbar-brand, .btn,
.widget, .widget-title,
.post-title, .post-category, .noticia-texto,
.ntc-result__title, .ntc-result__cartola, .ntc-result__resumo {
    font-family: 'Roboto', Arial, Helvetica, sans-serif !important;
}

/* ------------------------------------------------------------------ */
/* 2. Cor padrão dos textos: #333132                                 */
/* ------------------------------------------------------------------ */
body,
p, li, dd, dt, td, th,
h1, h2, h3, h4, h5, h6,
.noticia-texto,
.noticia-texto p,
.noticia-texto li,
.noticia-texto span {
    color: #333132 !important;
}

/* ------------------------------------------------------------------ */
/* 3. Links: #326598  /  hover ("overlay"): #198cff                  */
/* ------------------------------------------------------------------ */
a,
a:link,
a:visited {
    color: #326598 !important;
    text-decoration: none;
}

a:hover,
a:focus,
a:active {
    color: #198cff !important;
    text-decoration: none;
}

/* ------------------------------------------------------------------ */
/* 4. Underline animado (esquerda -> direita) no hover               */
/*    Aplicado só em links de TEXTO de conteúdo — fora de botões,    */
/*    menu e links que envolvem imagens, pra não quebrar layout.     */
/* ------------------------------------------------------------------ */
.noticia-texto a,
.ntc-result__title a,
.ntc-result__body a,
.widget-area a,
.post-title a,
main article a {
    display: inline;
    padding-bottom: 2px;
    background-image: linear-gradient(#198cff, #198cff);
    background-repeat: no-repeat;
    background-position: 0 100%;          /* ancora à esquerda  */
    background-size: 0% 2px;              /* começa sem traço   */
    transition: background-size .30s ease;
}

.noticia-texto a:hover,
.ntc-result__title a:hover,
.ntc-result__body a:hover,
.widget-area a:hover,
.post-title a:hover,
main article a:hover {
    background-size: 100% 2px;            /* cresce p/ a direita */
}

/* links que envolvem imagens (thumbs, banners) não recebem o traço */
.ntc-result__thumb,
.noticia-texto a:has(img),
.widget-area a:has(img),
main article a:has(img) {
    background-image: none !important;
    padding-bottom: 0 !important;
}

/* ------------------------------------------------------------------ */
/* 5. Cartola: #198cff + negrito                                     */
/* ------------------------------------------------------------------ */
.ntc-result__cartola,
.post-category,
.cartola {
    color: #198cff !important;
    font-weight: 700 !important;
}

/* ------------------------------------------------------------------ */
/* 6. Rodapé — fundo escuro: texto branco + ícones sociais maiores   */
/*    (o !important das regras 2 e 3 acima deixava o rodapé preto;    */
/*     e o ntc.css força ".ftr-social > li > a > i { font-size:13px }" */
/*     que deixava os ícones minúsculos)                              */
/* ------------------------------------------------------------------ */
.footer-main,
.footer-main p,
.footer-main li,
.footer-main a,
.footer-main strong,
.footer-main h1, .footer-main h2, .footer-main h3, .footer-main h4,
.footer-main .copyright p,
.footer-main .ftr-social > li > a {
    color: #ffffff !important;
}
.footer-main a:hover,
.footer-main a:focus {
    color: #198cff !important;
}
/* links do rodapé não recebem o underline animado */
.footer-main a {
    background-image: none !important;
    padding-bottom: 0 !important;
}

/* ícones das redes sociais maiores (mantém o alinhamento central do rodapé) */
.footer-main .ftr-social > li > a > i,
.footer-main .ftr-social > li > a > .fa {
    font-size: clamp(34px, 6vw, 48px) !important;
    margin-right: 0 !important;
    line-height: 1;
    vertical-align: middle;
    transition: transform .2s ease, opacity .2s ease;
}
.footer-main .ftr-social > li > a:hover > i,
.footer-main .ftr-social > li > a:hover > .fa {
    transform: translateY(-2px);
}

/* rodapé: o <p> do "copyright" deve ficar centralizado como no index —
   o "p { text-align:left }" do <style> inline das páginas de conteúdo
   estava jogando pra esquerda */
.footer-main .copyright,
.footer-main .copyright p {
    text-align: center !important;
}

/* ------------------------------------------------------------------ */
/* 7. Barra do topo — telefone sempre à direita                      */
/*    O <style> inline de cadastro/pesquisar/notícia tem             */
/*    ".noticia-texto, p { text-align:left; margin-bottom:30px;      */
/*    font-size:22px }" que atinge TODO <p>, inclusive o do telefone */
/*    no topo (que deveria herdar text-align:right do wrapper).      */
/*    Aqui devolvemos o comportamento do index.php.                  */
/* ------------------------------------------------------------------ */
.top-header p {
    text-align: right !important;
    margin-bottom: 0 !important;
    font-size: 18px !important;
}
