/* ALOHA NOTÍCIAS — visual do site antigo (abril/2023): topo preto, logo vermelho, menu preto com item ativo
   vermelho, painéis de destaque, lista com "Leia mais" e barra lateral. Carregado depois de aloha.css. */

:root {
  --vermelho: #bc3131;
  --preto: #0a0a0a;
  --fundo: #ffffff;
  --superficie: #f4f4f4;
  --tinta: #2c2f34;
  --mare: #777777;
  --marca: #2c2f34;
  --linha: #e3e3e3;
  --coral: #bc3131;
  --coral-texto: #bc3131;
  --foco: #bc3131;
  --rodape-fundo: #0a0a0a;
  --rodape-tinta: #ffffff;
  --rodape-mare: #b5b5b5;
  --f-marca: "Inter", "Segoe UI", system-ui, -apple-system, Arial, sans-serif;
  --largura: 1200px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --fundo: #1f2024; --superficie: #2c2e34; --tinta: #eaeaea; --mare: #a8a8a8; --marca: #ffffff;
    --linha: #3a3c42; --coral-texto: #e05a5a; --rodape-fundo: #0a0a0a;
  }
}
:root[data-theme="dark"] {
  --fundo: #1f2024; --superficie: #2c2e34; --tinta: #eaeaea; --mare: #a8a8a8; --marca: #ffffff;
  --linha: #3a3c42; --coral-texto: #e05a5a; --rodape-fundo: #0a0a0a;
}

/* ---------- topo ---------- */
.cabecalho { position: static; border-top: 0; border-bottom: 0; box-shadow: none; background: var(--fundo); }
.topbar { background: var(--preto); color: #d6d6d6; font-size: 12px; }
.topbar .wrap { display: flex; align-items: center; justify-content: space-between; min-height: 40px; }
.topbar .cab-data { margin: 0; color: #d6d6d6; font-size: 12px; }
.topbar .botao-icone { color: #fff; width: 32px; height: 32px; }
.topbar .botao-icone:hover { background: #222; }
.topbar .botao-icone svg { width: 16px; height: 16px; }
.logo-area { background: #0a0a0a url("../img/banner.jpg") center / cover no-repeat; padding-block: 28px; }
.cab-logo { display: inline-block; line-height: 0; }
.cab-logo img { width: 290px; height: auto; max-width: 70vw; }
.nav { background: var(--preto); border: 0; box-shadow: 0 3px 8px rgba(0, 0, 0, .25); }
.nav .wrap { display: flex; align-items: center; }
.nav ul { gap: 0; flex: 1; }
.nav a {
  display: block; padding: 0 14px; line-height: 60px; color: #fff; font-size: 13px; font-weight: 700;
  text-transform: uppercase; white-space: nowrap; position: relative;
}
.nav li:first-child a { padding-left: 14px; }
.nav a:hover { box-shadow: none; background: #1c1c1c; }
.nav a[aria-current="page"] { background: var(--vermelho); box-shadow: none; font-weight: 700; }
.nav a[aria-current="page"]::after { content: ""; position: absolute; left: 50%; bottom: 14px; width: 18px; height: 2px; margin-left: -9px; background: rgba(0, 0, 0, .55); }
.nav-busca { color: #fff; padding: 0 4px; line-height: 0 !important; }
.nav-busca svg { width: 18px; height: 18px; }
.nav-busca:hover { background: transparent !important; color: #ccc; }

/* ---------- selo vermelho ---------- */
.tag-v {
  display: inline-block; background: var(--vermelho); color: #fff; font-size: 12px; font-weight: 500; line-height: 1;
  text-transform: uppercase; padding: 5px 6px; border-radius: 2px; letter-spacing: 0;
}
.chapeu { color: var(--vermelho); }

/* ---------- destaques ---------- */
.hero { padding-top: 40px; }
.hero-grade { display: grid; grid-template-columns: 1fr; gap: 4px; }
.hero-2 .hero-grade { grid-template-columns: 1.6fr 1fr; }
.hero-3 .hero-grade { grid-template-columns: 1.99fr 1fr 1fr; }
.hero-card { position: relative; display: block; min-height: 460px; overflow: hidden; background: #333; color: #fff; }
.hero-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.hero-card:hover .hero-img { transform: scale(1.03); }
.hero-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,0) 35%, rgba(0,0,0,.82) 100%); }
.hero-card .tag-v { position: absolute; top: 20px; left: 20px; z-index: 2; }
.hero-texto { position: absolute; left: 20px; right: 20px; bottom: 18px; z-index: 2; display: grid; gap: 8px; }
.hero-texto time { font-size: 12px; opacity: .9; }
.hero-texto h2 { font-size: 22px; line-height: 1.25; font-weight: 700; color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.5); }
.hero-card.grande .hero-texto h2 { font-size: 34px; line-height: 1.2; }
.hero-fina { font-size: 13px; opacity: .95; }
.hero-card:hover h2 { text-decoration: none; }

/* ---------- duas colunas ---------- */
.duas-colunas { display: grid; grid-template-columns: minmax(0, 1fr) 345px; gap: 45px; padding-block: 50px 60px; }
.tit-secao { border-bottom: 2px solid var(--linha); position: relative; margin-bottom: 24px; padding-bottom: 14px; }
.tit-secao::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 40px; height: 2px; background: var(--vermelho); }
.tit-secao h2, .tit-secao h3 { margin: 0; font-size: 18px; font-weight: 700; text-transform: uppercase; color: var(--tinta); letter-spacing: 0; }
.coluna-principal .tit-secao h2 { color: var(--vermelho); font-size: 20px; }
.secao-lista { margin-bottom: 40px; }

.item-lista { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 28px; margin-bottom: 36px; }
.il-capa { position: relative; display: block; aspect-ratio: 4 / 3; background: var(--superficie); overflow: hidden; }
.il-capa .capa, .il-capa img, .il-capa svg { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0; box-shadow: none; aspect-ratio: auto; }
.il-capa .tag-v { position: absolute; right: 10px; bottom: 10px; }
.il-texto { display: grid; gap: 10px; align-content: start; }
.il-texto h3 { margin: 0; font-size: 22px; line-height: 1.3; font-weight: 700; }
.il-texto h3 a:hover { color: var(--vermelho); text-decoration: none; }
.meta-l { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 12px; color: var(--mare); margin: 0; }
.resumo { margin: 0; color: var(--mare); font-size: 14px; line-height: 1.6; }
.leia-mais, .pesquisar button {
  display: inline-block; justify-self: start; background: var(--vermelho); color: #fff; font-size: 13px; font-weight: 500;
  padding: 9px 14px; border-radius: 2px; border: 0; cursor: pointer;
}
.leia-mais:hover, .pesquisar button:hover { background: #9d2626; text-decoration: none; }
.ver-tudo { color: var(--vermelho); font-weight: 600; font-size: 14px; }

/* ---------- barra lateral ---------- */
.lateral-site { display: grid; gap: 36px; align-content: start; }
.lateral-site .tit-secao h2 { font-size: 15px; }
.mini-lista, .lista-links { list-style: none; margin: 0; padding: 0; }
.mini-lista { display: grid; gap: 26px; }
.mini { position: relative; display: grid; gap: 8px; }
.mini .capa, .mini img, .mini svg { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 0; box-shadow: none; }
.mini .tag-v { position: absolute; top: 10px; left: 10px; }
.mini strong { font-size: 17px; line-height: 1.3; font-weight: 700; }
.mini:hover strong { color: var(--vermelho); }
.mini time { font-size: 11px; color: var(--mare); }
.lista-links li { padding-block: 9px; font-size: 14px; line-height: 1.4; }
.lista-links a:hover { color: var(--vermelho); }
.pesquisar { display: flex; }
.pesquisar input { flex: 1; min-width: 0; border: 1px solid var(--linha); background: var(--fundo); color: var(--tinta); padding: 0 10px; height: 42px; }
.pesquisar button { border-radius: 0; height: 42px; }

/* ---------- página de editoria ---------- */
.migalhas-v { font-size: 12px; color: var(--mare); margin-bottom: 14px; }
.migalhas-v a:hover { color: var(--vermelho); }
.titulo-cat { font-size: 40px; line-height: 1.1; font-weight: 800; text-transform: uppercase; color: var(--tinta); margin: 0 0 16px; }
.desc-cat { margin: 0 0 30px; font-size: 15px; line-height: 1.7; color: var(--tinta); max-width: 70ch; }
.grade-cat { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 34px 32px; }
.card-cat { display: grid; gap: 12px; align-content: start; }
.card-cat h2 { margin: 0; font-size: 26px; line-height: 1.3; font-weight: 700; }
.card-cat h2 a:hover { color: var(--vermelho); text-decoration: none; }
.cc-capa { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--superficie); }
.cc-capa .capa, .cc-capa img, .cc-capa svg { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0; box-shadow: none; aspect-ratio: auto; }

/* ---------- matéria, botões e demais páginas herdam a paleta ---------- */
.botao { background: var(--vermelho); color: #fff; border-radius: 2px; }
.materia-topo h1, .topo-editoria h1 { color: var(--tinta); }
.materia-topo h1 { font-weight: 800; }
.secao-topo { border-bottom-color: var(--vermelho); }
.secao-topo h2 { color: var(--vermelho); }
.rodape { border-top: 0; }
.rodape-logo img { width: 200px; height: auto; }

/* ---------- celular ---------- */
@media (max-width: 960px) {
  .duas-colunas { grid-template-columns: 1fr; gap: 40px; }
  .hero-3 .hero-grade, .hero-2 .hero-grade { grid-template-columns: 1fr 1fr; }
  .hero-card.grande { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
  .hero { padding-top: 16px; }
  .hero-3 .hero-grade, .hero-2 .hero-grade { grid-template-columns: 1fr; }
  .hero-card { min-height: 300px; }
  .hero-card.grande .hero-texto h2 { font-size: 24px; }
  .item-lista, .grade-cat { grid-template-columns: 1fr; }
  .titulo-cat { font-size: 30px; }
  .logo-area { padding-block: 18px; }
  .nav a { line-height: 52px; font-size: 12px; padding: 0 11px; }
}

/* remove as ondas azuis da identidade anterior */
.cabecalho::after, .rodape::before, .secao-topo::after, .secao-topo h2::before { content: none !important; display: none !important; }
.ver-tudo { display: inline-block; padding: 0; border: 0; background: none; color: var(--vermelho); font-weight: 600; }
.ver-tudo:hover { text-decoration: underline; color: #9d2626; }
.item-lista .meta-l { position: static; }

/* seletor de idioma sobre a barra preta */
.topbar .idioma-menu summary { color: #fff; height: 32px; }
.topbar .idioma-rotulo { font-size: 11px; }
.topbar .cab-acoes { display: flex; align-items: center; gap: 10px; }
.idioma-lista { background: var(--fundo); color: var(--tinta); border-radius: 4px; }
.idioma-lista a:hover, .idioma-lista a:focus-visible { background: var(--superficie); }
[dir="rtl"] .nav a, [dir="rtl"] .hero-texto { text-align: right; }

/* ---------- celular: como era no site antigo (barra preta com Menu, logo e lupa; gaveta escura) ---------- */
.barra-m, .gaveta { display: none; }
@media (max-width: 760px) {
  .topbar, .logo-area, .nav { display: none; }
  .barra-m { display: block; background: var(--preto); }
  .barra-m .wrap { display: flex; align-items: center; justify-content: space-between; height: 76px; }
  .menu-m, .busca-m { color: var(--vermelho); background: none; border: 0; padding: 6px; display: inline-flex; align-items: center; gap: 8px; font: inherit; font-size: 15px; cursor: pointer; min-width: 84px; }
  .busca-m { justify-content: flex-end; }
  .menu-m svg, .busca-m svg { width: 26px; height: 26px; }
  .logo-m { line-height: 0; }
  .logo-m img { height: 54px; width: auto; }
  .gaveta { background: #1f2024; color: #fff; padding-block: 18px 28px; }
  .gaveta:not([hidden]) { display: block; }
  .gaveta-busca { display: flex; border: 1px solid #44464d; border-radius: 999px; overflow: hidden; margin-bottom: 8px; }
  .gaveta-busca input { flex: 1; min-width: 0; background: none; border: 0; color: #fff; padding: 14px 18px; font-size: 16px; }
  .gaveta-busca button { background: none; border: 0; color: #fff; padding: 0 16px; }
  .gaveta-busca svg { width: 20px; height: 20px; }
  .gaveta ul { list-style: none; margin: 0; padding: 0; }
  .gaveta li { border-bottom: 1px solid #34363c; }
  .gaveta li a { display: block; padding: 18px 4px; font-weight: 600; font-size: 18px; color: #fff; }
  .gaveta li a[aria-current="page"] { color: #e05a5a; }
  .gaveta-ferr { display: flex; align-items: center; justify-content: center; gap: 16px; padding-top: 22px; }
  .gaveta-ferr .botao-icone, .gaveta-ferr summary { color: #fff; }
  .gaveta-ferr .idioma-lista { right: auto; left: 0; top: auto; bottom: calc(100% + 8px); }

  .hero-grade { grid-template-columns: 1fr 1fr !important; gap: 4px; }
  .hero-card.grande { grid-column: 1 / -1; min-height: 190px; }
  .hero-card { min-height: 150px; }
  .hero-2 .hero-card:not(.grande) { grid-column: 1 / -1; }
  .hero-card .tag-v { top: 10px; left: 10px; font-size: 10px; padding: 4px 5px; }
  .hero-texto { left: 12px; right: 12px; bottom: 10px; }
  .hero-texto time, .hero-fina { display: none; }
  .hero-texto h2, .hero-card.grande .hero-texto h2 { font-size: 16px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .il-capa { aspect-ratio: 16 / 10; }
  .il-texto h3 { font-size: 24px; }
  .resumo { font-size: 16px; }
  .meta-l { font-size: 14px; }
  .rodape .wrap { text-align: center; }
  .rodape .rodape-logo { display: inline-block; }
  .rodape p { margin-inline: auto; }
  .rodape ul { justify-items: center; }
}

/* fotos do texto: sempre em 16:9 (1920x1080), nunca em pé */
.foto-corpo img, .materia-capa img { aspect-ratio: 16 / 9 !important; width: 100% !important; height: auto !important; max-height: none !important; object-fit: cover !important; }

/* cabeçalho: barra preta de cima vazia; idioma, tema e lupa ficam na barra do menu */
.topbar .wrap { min-height: 40px; }
.nav-ferr { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.nav-ferr .botao-icone, .nav-ferr .idioma-menu summary { color: #fff; width: auto; min-width: 32px; height: 36px; }
.nav-ferr .botao-icone:hover { background: #222; }
.nav-ferr .botao-icone svg { width: 18px; height: 18px; }
.nav-ferr .idioma-rotulo { font-size: 11px; }
.nav-busca { padding: 0 6px; }
[dir="rtl"] .nav-ferr { margin-left: 0; margin-right: auto; }
.nav .idioma-lista { display: block; flex: none; overflow: visible; right: 0; left: auto; top: calc(100% + 10px); min-width: 190px; }
[dir="rtl"] .nav .idioma-lista { right: auto; left: 0; }
.nav .idioma-lista li { border: 0; }
.nav .idioma-lista a { display: flex; align-items: center; gap: 10px; line-height: 1.3; padding: 8px 10px; color: var(--tinta); font-size: 14px; font-weight: 500; text-transform: none; background: none; white-space: nowrap; }
.nav .idioma-lista a:hover { background: var(--superficie); }
.nav .idioma-lista a[aria-current] { font-weight: 700; }
.nav .idioma-lista a::after { content: none; }
.nav .idioma-tit { color: var(--tinta); }