/*
Theme Name: Portal MA
Theme URI: https://joerdsonrodrigues.com.br
Author: Joerdson Rodrigues
Description: Tema de portal de notícias com foco em política e bastidores. Manchete em destaque, editorias, mais lidas, colunistas e barra de últimas notícias. Cor principal azul #20457c, ajustável em Aparência > Personalizar.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPLv2 or later
Text Domain: portalma
*/

:root{
  --cor-principal:#20457c;
  --cor-principal-escura:#162f55;
  --cor-destaque:#d8a31a;
  --cor-alerta:#c0262d;
  --texto:#1a1d23;
  --texto-suave:#5b6270;
  --linha:#dde1e8;
  --fundo:#ffffff;
  --fundo-suave:#f3f5f8;
  --fonte-titulo:"Newsreader", Georgia, "Times New Roman", serif;
  --fonte-texto:"Public Sans", "Segoe UI", Roboto, Arial, sans-serif;
  --largura:1200px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fundo);color:var(--texto);font-family:var(--fonte-texto);font-size:16px;line-height:1.55}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
a:hover{color:var(--cor-principal)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--cor-destaque);outline-offset:2px}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
.container{max-width:var(--largura);margin:0 auto;padding:0 20px}

/* Barra superior */
.topo-info{background:var(--cor-principal-escura);color:#cfd9e8;font-size:13px}
.topo-info .container{display:flex;justify-content:space-between;align-items:center;min-height:34px;gap:16px}
.topo-info a{color:#fff}
.topo-redes{display:flex;gap:14px}

/* Cabeçalho */
.cabecalho{border-bottom:1px solid var(--linha);background:#fff}
.cabecalho .container{display:flex;align-items:center;justify-content:space-between;padding-top:22px;padding-bottom:22px;gap:20px}
.marca{display:flex;align-items:baseline;gap:4px;font-family:var(--fonte-titulo);font-weight:800;font-size:clamp(30px,5vw,48px);line-height:1;color:var(--cor-principal);letter-spacing:-.02em}
.marca:hover{color:var(--cor-principal)}
.marca-selo{font-family:var(--fonte-texto);font-size:.38em;font-weight:800;background:var(--cor-principal);color:#fff;padding:.25em .45em;border-radius:3px;letter-spacing:0;transform:translateY(-.4em)}
.custom-logo{max-height:64px;width:auto}
.slogan{margin:6px 0 0;color:var(--texto-suave);font-size:14px}
.busca-topo form{display:flex;border:1px solid var(--linha);border-radius:4px;overflow:hidden}
.busca-topo input{border:0;padding:9px 12px;font:inherit;font-size:14px;width:220px;background:#fff}
.busca-topo button{border:0;background:var(--cor-principal);color:#fff;padding:0 14px;cursor:pointer;font-weight:700}

/* Menu */
.menu-principal{background:var(--cor-principal);position:sticky;top:0;z-index:50}
.menu-principal .container{display:flex;align-items:center}
.menu-principal ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap}
.menu-principal li{position:relative}
.menu-principal a{display:block;color:#fff;font-weight:700;font-size:14px;padding:13px 14px}
.menu-principal a:hover,.menu-principal .current-menu-item>a{background:var(--cor-principal-escura);color:#fff}
.menu-principal .sub-menu{display:none;position:absolute;top:100%;left:0;background:var(--cor-principal-escura);min-width:200px;flex-direction:column}
.menu-principal li:hover>.sub-menu,.menu-principal li:focus-within>.sub-menu{display:flex}
.botao-menu{display:none;background:none;border:0;color:#fff;font:inherit;font-weight:700;padding:12px 0;cursor:pointer}

/* Últimas */
.ultimas{border-bottom:1px solid var(--linha);background:var(--fundo-suave);font-size:14px}
.ultimas .container{display:flex;align-items:center;gap:14px;min-height:42px;overflow:hidden}
.ultimas-rotulo{flex:none;background:var(--cor-alerta);color:#fff;font-weight:800;font-size:12px;padding:4px 9px;border-radius:3px}
.ultimas-lista{display:flex;gap:28px;white-space:nowrap;overflow-x:auto;scrollbar-width:none}
.ultimas-lista::-webkit-scrollbar{display:none}
.ultimas-lista time{color:var(--cor-principal);font-weight:800;margin-right:6px}

/* Elementos de notícia */
.chapeu{display:inline-block;color:var(--cor-principal);font-weight:800;font-size:13px;margin-bottom:6px}
.chapeu:hover{text-decoration:underline}
.titulo-noticia{font-family:var(--fonte-titulo);font-weight:700;line-height:1.15;margin:0 0 8px;letter-spacing:-.01em}
.meta{color:var(--texto-suave);font-size:13px}
.miniatura{overflow:hidden;background:var(--fundo-suave);aspect-ratio:16/9;margin-bottom:12px}
.miniatura img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
a:hover .miniatura img{transform:scale(1.03)}
@media (prefers-reduced-motion:reduce){a:hover .miniatura img{transform:none}}

/* Destaques da capa */
.capa{padding:28px 0}
.destaques{display:grid;grid-template-columns:2fr 1fr;gap:28px;padding-bottom:28px;border-bottom:3px solid var(--cor-principal)}
.manchete .titulo-noticia{font-size:clamp(28px,3.6vw,44px)}
.manchete .resumo{font-size:18px;color:#333;margin:0 0 10px;max-width:68ch}
.manchete .miniatura{aspect-ratio:16/9}
.secundarias{display:flex;flex-direction:column;gap:22px}
.secundarias article+article{border-top:1px solid var(--linha);padding-top:20px}
.secundarias .titulo-noticia{font-size:21px}

/* Grade principal */
.grade{display:grid;grid-template-columns:1fr 320px;gap:36px;padding-top:30px}
.bloco-editoria{margin-bottom:38px}
.bloco-cabeca{display:flex;justify-content:space-between;align-items:baseline;border-bottom:2px solid var(--cor-principal);margin-bottom:18px}
.bloco-cabeca h2{margin:0;padding-bottom:6px;font-family:var(--fonte-titulo);font-size:26px;color:var(--cor-principal)}
.bloco-cabeca a.ver-mais{font-size:13px;font-weight:700;color:var(--cor-principal)}
.bloco-grade{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.bloco-grade .titulo-noticia{font-size:19px}
.bloco-grade .primeira{grid-column:span 3;display:grid;grid-template-columns:1.3fr 1fr;gap:22px;align-items:center;padding-bottom:20px;border-bottom:1px solid var(--linha)}
.bloco-grade .primeira .miniatura{margin:0}
.bloco-grade .primeira .titulo-noticia{font-size:27px}

/* Lista (arquivo/busca) */
.lista-noticias article{display:grid;grid-template-columns:260px 1fr;gap:22px;padding:22px 0;border-bottom:1px solid var(--linha)}
.lista-noticias article .miniatura{margin:0}
.lista-noticias .titulo-noticia{font-size:23px}
.lista-noticias .resumo{margin:0 0 8px;color:#3a3f48}
.titulo-arquivo{font-family:var(--fonte-titulo);color:var(--cor-principal);font-size:36px;margin:0 0 6px}

/* Barra lateral */
.lateral .widget{margin-bottom:34px}
.lateral .widget-title,.lateral h2{font-family:var(--fonte-titulo);color:var(--cor-principal);font-size:22px;margin:0 0 14px;padding-bottom:6px;border-bottom:2px solid var(--cor-principal)}
.mais-lidas{list-style:none;margin:0;padding:0;counter-reset:lidas}
.mais-lidas li{counter-increment:lidas;display:grid;grid-template-columns:38px 1fr;gap:10px;padding:12px 0;border-bottom:1px solid var(--linha)}
.mais-lidas li::before{content:counter(lidas);font-family:var(--fonte-titulo);font-size:34px;font-weight:800;line-height:1;color:var(--cor-principal)}
.mais-lidas a{font-family:var(--fonte-titulo);font-weight:700;font-size:17px;line-height:1.25}
.colunistas{list-style:none;margin:0;padding:0}
.colunistas li{display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--linha)}
.colunistas img{width:52px;height:52px;border-radius:50%;object-fit:cover}
.colunistas strong{display:block;font-size:14px}
.colunistas span{font-family:var(--fonte-titulo);font-size:16px;font-weight:600}
.publicidade{background:var(--fundo-suave);border:1px dashed var(--linha);min-height:250px;display:flex;align-items:center;justify-content:center;color:var(--texto-suave);font-size:12px}

/* Matéria */
.materia{max-width:780px}
.materia-cabeca{padding:32px 0 20px;border-bottom:1px solid var(--linha);margin-bottom:24px}
.materia-cabeca h1{font-family:var(--fonte-titulo);font-size:clamp(30px,4.4vw,48px);line-height:1.1;margin:0 0 14px;letter-spacing:-.015em}
.linha-fina{font-size:20px;color:#3a3f48;margin:0 0 18px;line-height:1.45}
.assinatura{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;align-items:center;font-size:14px;color:var(--texto-suave)}
.assinatura strong{color:var(--texto)}
.compartilhar{display:flex;gap:8px}
.compartilhar a{font-size:13px;font-weight:700;padding:6px 11px;border-radius:3px;background:var(--fundo-suave);color:var(--cor-principal)}
.compartilhar a:hover{background:var(--cor-principal);color:#fff}
.foto-destaque{margin:0 0 26px}
.foto-destaque figcaption{font-size:13px;color:var(--texto-suave);padding-top:6px}
.conteudo{font-family:var(--fonte-titulo);font-size:20px;line-height:1.7}
.conteudo p{margin:0 0 1.1em}
.conteudo h2,.conteudo h3{font-family:var(--fonte-texto);line-height:1.25;margin:1.6em 0 .6em}
.conteudo h2{font-size:25px}.conteudo h3{font-size:21px}
.conteudo a{color:var(--cor-principal);text-decoration:underline;text-underline-offset:3px}
.conteudo blockquote{margin:1.5em 0;padding:4px 0 4px 22px;border-left:4px solid var(--cor-principal);font-style:italic;color:#333}
.conteudo figure{margin:1.6em 0}
.conteudo figcaption,.wp-caption-text{font-family:var(--fonte-texto);font-size:13px;color:var(--texto-suave)}
.tags{margin:28px 0;display:flex;flex-wrap:wrap;gap:8px}
.tags a{font-size:13px;border:1px solid var(--linha);padding:4px 10px;border-radius:20px}
.relacionadas{border-top:3px solid var(--cor-principal);padding-top:18px;margin:36px 0}
.relacionadas h2{font-family:var(--fonte-titulo);color:var(--cor-principal);margin:0 0 16px}
.relacionadas .bloco-grade .titulo-noticia{font-size:18px}

/* Paginação */
.paginacao{display:flex;gap:6px;flex-wrap:wrap;margin:30px 0}
.paginacao .page-numbers{padding:8px 13px;border:1px solid var(--linha);border-radius:3px;font-weight:700}
.paginacao .current{background:var(--cor-principal);color:#fff;border-color:var(--cor-principal)}

/* Comentários */
.comentarios{margin:40px 0}
.comment-list{list-style:none;padding:0}
.comment-body{padding:14px 0;border-bottom:1px solid var(--linha)}
.comment-form input[type=text],.comment-form input[type=email],.comment-form input[type=url],.comment-form textarea{width:100%;padding:10px;border:1px solid var(--linha);border-radius:3px;font:inherit}
.comment-form .submit,.botao{background:var(--cor-principal);color:#fff;border:0;padding:11px 20px;border-radius:3px;font-weight:700;cursor:pointer}

/* Rodapé */
.rodape{background:var(--cor-principal-escura);color:#cfd9e8;margin-top:50px;padding:42px 0 0;font-size:14px}
.rodape-colunas{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:36px}
.rodape .marca{color:#fff;font-size:34px}
.rodape .marca-selo{background:#fff;color:var(--cor-principal-escura)}
.rodape h3{color:#fff;font-size:15px;margin:0 0 12px}
.rodape ul{list-style:none;margin:0;padding:0}
.rodape li{margin-bottom:7px}
.rodape a{color:#fff}
.rodape a:hover{color:var(--cor-destaque)}
.rodape-base{border-top:1px solid rgba(255,255,255,.15);margin-top:34px;padding:16px 0;font-size:13px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}

/* 404 */
.erro{padding:70px 0;text-align:center}
.erro h1{font-family:var(--fonte-titulo);font-size:44px;color:var(--cor-principal);margin:0 0 10px}

/* Responsivo */
@media (max-width:960px){
  .destaques,.grade{grid-template-columns:1fr}
  .rodape-colunas{grid-template-columns:1fr 1fr}
  .busca-topo{display:none}
}
@media (max-width:720px){
  .botao-menu{display:block}
  .menu-principal .container{flex-direction:column;align-items:stretch}
  .menu-principal ul{display:none;flex-direction:column;padding-bottom:10px}
  .menu-principal.aberto ul{display:flex}
  .menu-principal .sub-menu{position:static;display:flex;padding-left:14px}
  .bloco-grade{grid-template-columns:1fr}
  .bloco-grade .primeira{grid-column:auto;grid-template-columns:1fr}
  .lista-noticias article{grid-template-columns:1fr}
  .rodape-colunas{grid-template-columns:1fr}
  .topo-redes{display:none}
  .conteudo{font-size:18px}
}