/**
 * Micro-interações elegantes — paleta: preto (#000), vermelho (#c51f40), cinza (#333, #555, #777, #aaa)
 * Easing: cubic-bezier para sensação premium e fluida
 */

/* === Variáveis de transição === */
:root {
  --mi-transition: 0.28s cubic-bezier(0.4, 0, 0.2, 1);
  --mi-transition-slow: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  --mi-transition-snappy: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  --mi-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --mi-vermelho: #c51f40;
  --mi-preto: #000;
  --mi-cinza-escuro: #333;
  --mi-cinza-medio: #555;
  --mi-cinza: #777;
  --mi-cinza-claro: #aaa;
}

/* === Links gerais === */
a {
  transition: color var(--mi-transition), background-color var(--mi-transition),
    border-color var(--mi-transition), opacity var(--mi-transition);
}

/* === Menu de navegação === */
.novo-menu .linha-menus a .texto-menu,
.menu .linha-menus a .texto-menu {
  transition: color var(--mi-transition), text-shadow var(--mi-transition);
}

.novo-menu .linha-menus a:hover .texto-menu,
.menu .linha-menus a:hover .texto-menu {
  color: var(--mi-vermelho);
}

.novo-menu .segura .busca,
.novo-menu .segura .redes a {
  transition: opacity var(--mi-transition), transform var(--mi-transition);
}

.novo-menu .segura .redes a img {
  transition: opacity var(--mi-transition), transform var(--mi-transition);
}

.novo-menu .segura .busca:hover,
.novo-menu .segura .redes a:hover {
  opacity: 0.9;
  transform: scale(1.04);
}

.novo-menu .segura .redes a:hover img {
  opacity: 0.95;
  transform: scale(1.02);
}

/* Logo — hover sutil com leve scale */
.novo-menu .logo img,
.menu .logo img {
  transition: opacity var(--mi-transition), transform var(--mi-transition);
}

.novo-menu .logo:hover img,
.menu .logo:hover img {
  opacity: 0.92;
  transform: scale(1.02);
}

/* === Menu — linhas desenhando de fora pra dentro no carregamento === */
.novo-menu.menu-animado .menu-linha {
  transform: scaleX(0);
  transform-origin: center;
  transition: transform 0.7s cubic-bezier(0.4, 0, 0.2, 1);
}

.novo-menu.menu-animado .menu-linha-esq {
  transform-origin: left center;
}

.novo-menu.menu-animado .menu-linha-dir {
  transform-origin: right center;
}

.novo-menu.menu-pronto .menu-linha-esq,
.novo-menu.menu-pronto .menu-linha-dir {
  transform: scaleX(1);
}

/* Underline nos itens do menu — desenha no hover */
.novo-menu .linha-menus a .texto-menu {
  position: relative;
}

.novo-menu .linha-menus a .texto-menu::after {
  content: '';
  position: absolute;
  left: 50%;
  bottom: -4px;
  width: 0;
  height: 2px;
  background: var(--mi-vermelho);
  transform: translateX(-50%);
  transition: width 0.4s var(--mi-ease-out);
}

.novo-menu .linha-menus a:hover .texto-menu::after,
.novo-menu .linha-menus a.active .texto-menu::after {
  width: 100%;
}

/* === Submenus — estilo elegante e compacto === */
/* Área de proteção: ponte invisível entre Editorias e o submenu — evita piscar ao mover o mouse */
.novo-menu .menu-categoria::after,
.menu-categoria::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 48px; /* Zona de proteção — mouse mantém hover ao descer para o submenu */
  z-index: 99;
}

.novo-menu .menu-categoria ul,
.menu-categoria ul {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(0);
  margin-top: 0; /* Submenu abaixo de Editorias, sem sobrepor o texto */
  min-width: 200px;
  background: #fff;
  padding: 12px 0 8px; /* Pequeno espaçamento no topo */
  border-radius: 8px;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.08), 0 10px 30px -4px rgba(0, 0, 0, 0.12);
  z-index: 100;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.28s var(--mi-ease-out), transform 0.28s var(--mi-ease-out), visibility 0.28s, box-shadow var(--mi-transition);
}

.novo-menu .menu-categoria:hover ul,
.menu-categoria:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%);
  box-shadow: 0 12px 40px -8px rgba(0, 0, 0, 0.15), 0 0 0 1px rgba(0, 0, 0, 0.04);
}

.novo-menu .menu-categoria ul li,
.menu-categoria ul li {
  padding: 0;
  margin: 0;
  border: none;
  transition: background-color 0.22s var(--mi-ease-out);
}

.novo-menu .menu-categoria ul li:hover,
.menu-categoria ul li:hover {
  background-color: var(--mi-vermelho);
}

.novo-menu .menu-categoria ul li a,
.menu-categoria ul li a {
  display: block;
  padding: 6px 18px;
  font-family: "Roboto", "Open Sans", sans-serif;
  font-size: 11px;
  font-weight: 500;
  color: var(--mi-cinza-medio);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  transition: color 0.22s var(--mi-ease-out);
}

.novo-menu .menu-categoria ul li:hover a,
.menu-categoria ul li:hover a {
  color: #fff;
  text-align: left;
}

.novo-menu .menu-categoria ul li > .sub,
.menu-categoria ul li > .sub {
  left: 100%;
  right: auto;
  top: 0;
  margin-left: 2px;
  margin-top: -4px; /* Ponte para manter hover ao mover o mouse */
  transform: translateY(0);
}

.novo-menu .menu-categoria ul li:hover > .sub,
.menu-categoria ul li:hover > .sub {
  display: block;
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* === Botões === */
.enviar,
input[type="submit"],
.contato #formvisita .enviar,
.footer #formvisita .enviar {
  transition: background-color var(--mi-transition), color var(--mi-transition),
    transform var(--mi-transition), box-shadow var(--mi-transition);
  cursor: pointer;
}

.contato #formvisita .enviar:hover {
  background-color: #a01933 !important;
  color: #fff !important;
}

.footer #formvisita .enviar:hover {
  background-color: var(--mi-vermelho) !important;
  color: #fff !important;
}

.contato #formvisita .enviar:hover,
.footer #formvisita .enviar:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(197, 31, 64, 0.25);
}

.contato #formvisita .enviar:active,
.footer #formvisita .enviar:active {
  transform: translateY(0) scale(0.98);
}

/* Botão Ver canal (VIP TV) */
.viptv-canal {
  transition: background-color var(--mi-transition), color var(--mi-transition),
    border-color var(--mi-transition), transform var(--mi-transition), box-shadow var(--mi-transition);
}

.viptv-canal:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(197, 31, 64, 0.2);
}

.viptv-canal:active {
  transform: translateY(0) scale(0.97);
}

/* === Formulários — focus elegante === */
input[type="text"],
input[type="email"],
input[type="search"],
textarea {
  transition: border-color var(--mi-transition), box-shadow var(--mi-transition),
    background-color var(--mi-transition);
}

input:focus,
textarea:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(197, 31, 64, 0.2);
}

a:focus-visible,
button:focus-visible {
  outline: none;
  box-shadow: 0 0 0 2px rgba(197, 31, 64, 0.3);
}

.contato input:focus,
.contato textarea:focus {
  background-color: #e8e8e8;
}

/* === Cards e colunas === */
.home .linha-01 a,
.home .linha-07 a,
.home .linha-08 .teste-03,
.nhome .arquivo .linhas .linha .coluna {
  transition: transform var(--mi-transition-slow), box-shadow var(--mi-transition);
}

.home .linha-01 a:hover,
.home .linha-07 a:hover {
  transform: translateY(-2px);
}

.home .linha-08 .teste-03:hover .img {
  transform: scale(1.03);
}

.home .linha-01 .img,
.home .linha-08 .img-01,
.home .linha-08 .img-02,
.home .linha-08 .img-03,
.home .linha-08 .img-04 {
  transition: transform var(--mi-transition-slow);
}

/* Colunistas */
.colunistas .colunista,
.colunista .img,
.colunista .img.background,
.colunista .background {
  transition: transform var(--mi-transition), opacity var(--mi-transition),
    color var(--mi-transition), box-shadow var(--mi-transition);
}

.colunistas .colunista:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.colunista:hover .img,
.colunista:hover .img.background,
.colunista:hover .background {
  transform: scale(1.02);
}

.colunista:hover h2,
.colunista:hover span {
  color: var(--mi-vermelho);
}

.colunista h2,
.colunista span {
  transition: color var(--mi-transition);
}

/* Colunista notícia (single colunista) */
.colunista .colunista-noticia,
.colunista .colunista-noticia .fundo,
.colunista .colunista-noticia .fundo-preto {
  transition: transform var(--mi-transition), color var(--mi-transition),
    opacity var(--mi-transition);
}

.colunista .colunista-noticia:hover {
  transform: scale(1.02);
}

.colunista .mais {
  transition: transform var(--mi-transition), background-color var(--mi-transition),
    box-shadow var(--mi-transition);
}

.colunista .mais:active {
  transform: scale(0.97);
}

/* === Página Single Colunista — micro-interações elegantes === */
/* Perfil: card, foto, redes */
.colunista-perfil .dentro {
  transition: box-shadow var(--mi-transition-slow), transform var(--mi-transition-slow);
}

.colunista-perfil:hover .dentro {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.colunista-perfil-foto {
  transition: transform 0.9s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.5s ease;
}

.colunista-perfil:hover .colunista-perfil-foto {
  transform: scale(1.03);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.1);
}

.colunista-rede {
  transition: background-color var(--mi-transition), transform var(--mi-transition),
    box-shadow var(--mi-transition);
}

.colunista-rede:hover {
  transform: scale(1.1);
  box-shadow: 0 4px 12px rgba(197, 31, 64, 0.3);
}

.colunista-rede:active {
  transform: scale(0.96);
}

.colunista-perfil-banner {
  transition: box-shadow var(--mi-transition), transform var(--mi-transition);
}

.colunista-perfil-banner:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.colunista-perfil-banner img {
  transition: transform 0.5s var(--mi-ease-out);
}

.colunista-perfil-banner:hover img {
  transform: scale(1.02);
}

/* Artigos: cards alinhados à galeria */
.colunista-artigos .colunista-noticia {
  transition: transform var(--mi-transition-slow), box-shadow 0.4s var(--mi-ease-out);
}

.colunista-artigos .colunista-noticia:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
}

.colunista-artigos .colunista-noticia img {
  transition: transform 0.5s var(--mi-ease-out);
}

.colunista-artigos .colunista-noticia:hover img {
  transform: scale(1.06);
}

.colunista-artigos .colunista-noticia .texto-01 {
  transform: translateY(12px);
  transition: transform 0.5s var(--mi-ease-out);
}

.colunista-artigos .colunista-noticia:hover .texto-01 {
  transform: translateY(-12px);
}

.colunista-artigos .colunista-noticia .fundo-preto h2 {
  transform: translateY(12px);
  transition: color var(--mi-transition), opacity var(--mi-transition),
    transform 0.5s var(--mi-ease-out);
}

.colunista-artigos .colunista-noticia:hover .fundo-preto h2 {
  transform: translateY(-12px);
}

.colunista-artigos .colunista-noticia .compartilhamento {
  transition: opacity var(--mi-transition), visibility var(--mi-transition);
}

.colunista-artigos .colunista-noticia .compartilhamento a {
  transition: color var(--mi-transition), transform var(--mi-transition);
}

.colunista-artigos .colunista-noticia .compartilhamento a:hover {
  transform: scale(1.1);
}

.colunista-artigos-titulo {
  transition: color var(--mi-transition), border-color var(--mi-transition);
}

.colunista-artigos-titulo:hover {
  color: var(--mi-cinza-escuro);
}

.colunista-artigos .mais {
  transition: transform var(--mi-transition), background-color var(--mi-transition),
    box-shadow var(--mi-transition);
}

.colunista-artigos .mais:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(197, 31, 64, 0.35);
}

.colunista-artigos .mais:active {
  transform: translateY(0) scale(0.97);
}

/* Card VIP TV */
.vip-yt-card a {
  transition: transform var(--mi-transition);
}

.vip-yt-card:hover a {
  transform: translateY(-2px);
}

/* === Galeria / Categorias (archive, category) === */
.galeria .linha-02 .grid-image-item {
  transition: transform var(--mi-transition-slow), box-shadow 0.4s var(--mi-ease-out);
}

.galeria .linha-02 .grid-image-item:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
}

.galeria .linha-02 .grid-image-item img {
  transition: transform 0.5s var(--mi-ease-out);
}

.galeria .linha-02 .grid-image-item:hover img {
  transform: scale(1.06);
}

.galeria .linha-02 .grid-image-item .fundo-preto {
  transition: opacity var(--mi-transition);
}

.galeria .linha-02 a,
.galeria-interna .linha-galeria a {
  transition: color var(--mi-transition), transform var(--mi-transition);
}

/* Texto permanece branco no hover — blocos com overlay escuro */
.galeria .linha-02 a:hover .texto-01,
.galeria .linha-02 .grid-image-item:hover .texto-01,
.galeria-interna .linha-galeria a:hover .texto-01 {
  color: #fff;
}

.galeria .linha-02 .texto-01 {
  transform: translateY(12px);
  transition: color var(--mi-transition), transform 0.5s var(--mi-ease-out);
}

/* Texto sobe lentamente no hover — mesmo recurso do banner da home */
.galeria .linha-02 .grid-image-item:hover .texto-01 {
  transform: translateY(-12px);
}

.galeria .linha-02 .grid-image-item .fundo-preto h2 {
  transform: translateY(12px);
  transition: transform 0.5s var(--mi-ease-out);
}

.galeria .linha-02 .grid-image-item:hover .fundo-preto h2 {
  transform: translateY(-12px);
}

.galeria .linha-02 .grid-image-item .compartilhamento a {
  transition: color var(--mi-transition), transform var(--mi-transition);
}

.galeria .linha-02 .grid-image-item .compartilhamento a:hover {
  transform: scale(1.1);
}

/* Paginação da galeria/categoria/colunista */
.galeria .paginas a,
.galeria .paginas .page-numbers,
.colunista-artigos .paginas a,
.colunista-artigos .paginas .page-numbers {
  transition: color var(--mi-transition), transform var(--mi-transition),
    text-shadow var(--mi-transition);
}

.galeria .paginas a:hover,
.galeria .paginas .page-numbers:hover,
.colunista-artigos .paginas a:hover,
.colunista-artigos .paginas .page-numbers:hover {
  transform: translateY(-2px);
}

.galeria .paginas a:active,
.galeria .paginas .page-numbers:active,
.colunista-artigos .paginas a:active,
.colunista-artigos .paginas .page-numbers:active {
  transform: translateY(0) scale(0.97);
}

.galeria .linha-01 .botao {
  transition: background-color var(--mi-transition), opacity var(--mi-transition),
    transform var(--mi-transition);
}

.galeria .linha-01 .botao:hover {
  opacity: 0.95;
  transform: translateY(-1px);
}

.galeria .linha-01 .botao:active {
  transform: translateY(0) scale(0.96);
}

/* === Matérias / Single === */
.materia .linha-03 a,
.materia .mais-publicacoes,
.materia .adicao {
  transition: color var(--mi-transition), opacity var(--mi-transition);
}

.materia .linha-03 a:hover,
.materia a:hover .mais-publicacoes {
  color: var(--mi-vermelho);
}

.materia .galeria-img .imagem {
  transition: transform var(--mi-transition), opacity var(--mi-transition);
}

.materia .galeria-img .imagem:hover {
  transform: scale(1.02);
  opacity: 0.95;
}

/* Compartilhamento */
.materia .icones a,
.compartilhamento a {
  transition: color var(--mi-transition), background-color var(--mi-transition),
    transform var(--mi-transition);
}

.materia .icones a:hover,
.compartilhamento a:hover {
  transform: scale(1.08);
}

/* === Footer === */
.footer a,
.footer .img-logo {
  transition: opacity var(--mi-transition), transform var(--mi-transition);
}

.footer a:hover,
.footer .img-logo:hover {
  opacity: 0.9;
}

.footer .img-logo:hover {
  transform: scale(1.04);
}

/* === Página de busca — animações suaves === */
.busca .resultado {
  display: block;
  overflow: hidden;
  border-radius: 8px;
  transition: transform 0.5s var(--mi-ease-out), box-shadow 0.5s var(--mi-ease-out);
}

.busca .resultado:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
}

.busca .resultado .foto,
.busca .resultado .foto.background {
  transition: transform 0.6s var(--mi-ease-out);
}

.busca .resultado:hover .foto,
.busca .resultado:hover .foto.background {
  transform: scale(1.03);
}

.busca .resultado .categoria {
  transition: background-color 0.4s var(--mi-ease-out), border-color 0.4s var(--mi-ease-out),
    color 0.4s var(--mi-ease-out);
}

.busca .resultado:hover .categoria {
  background-color: var(--mi-vermelho);
  border-color: var(--mi-vermelho);
}

.busca .resultado .titulo {
  transition: color 0.4s var(--mi-ease-out);
}

.busca .resultado:hover .titulo {
  color: #fff;
}

/* Barra de busca — campo, ícone e botão */
.busca .busca-campo {
  transition: border-color 0.35s var(--mi-ease-out), box-shadow 0.35s var(--mi-ease-out);
}

.busca .busca-icone {
  transition: color 0.35s var(--mi-ease-out);
}

.busca .busca-botao {
  transition: background-color 0.35s var(--mi-ease-out), transform 0.3s var(--mi-ease-out);
}

.busca .busca-botao:hover {
  transform: scale(1.03);
}

.busca .busca-botao:active {
  transform: scale(0.96);
}

/* Paginação da busca */
.busca .paginas a,
.busca .paginas .page-numbers {
  transition: background-color 0.35s var(--mi-ease-out), color 0.35s var(--mi-ease-out),
    transform 0.35s var(--mi-ease-out), border-color 0.35s var(--mi-ease-out);
}

.busca .paginas a:hover,
.busca .paginas .page-numbers:hover {
  transform: translateY(-2px);
}

.busca .paginas a:active,
.busca .paginas .page-numbers:active {
  transform: translateY(0) scale(0.97);
}

.busca input {
  transition: border-color var(--mi-transition), box-shadow var(--mi-transition),
    background-color var(--mi-transition);
}

.busca input:focus {
  box-shadow: 0 0 0 2px rgba(197, 31, 64, 0.25);
}

.busca h1 {
  transition: color var(--mi-transition);
}

/* Publicidade lateral na matéria — sempre rola com a página */
.materia .col-md-3.propa-noticias,
.materia .propa-noticias .anda-publi {
	position: relative !important;
	left: auto !important;
	top: auto !important;
}

/* Paginação na busca — removido: regras conflitantes movidas para estilo.css */

/* Overlay do novo-buscando */
.buscando input {
  transition: border-color var(--mi-transition), box-shadow var(--mi-transition);
}

/* === Slider / Eventos === */
.retangulo-agenda .unslider-nav ol li {
  transition: background-color var(--mi-transition), transform var(--mi-transition);
}

.retangulo-agenda .unslider-nav ol li:hover {
  background-color: var(--mi-cinza-medio);
}

/* Linha tempo (botões de ano) */
.home .linha-tempo button {
  transition: background-color var(--mi-transition), transform var(--mi-transition);
}

.home .linha-tempo button:hover {
  background-color: var(--mi-cinza-claro);
}

.home .linha-tempo button:active {
  transform: scale(0.95);
}

/* === Mobile menu === */
.segura-novo-mobile .abre-mobile,
.segura-novo-mobile .logo-mobile {
  transition: opacity var(--mi-transition), transform var(--mi-transition);
}

.segura-novo-mobile .abre-mobile:active,
.segura-novo-mobile .logo-mobile:active {
  transform: scale(0.96);
}

.novo-menu-mobile a {
  transition: color var(--mi-transition), background-color var(--mi-transition);
}

.novo-menu-mobile a:hover {
  color: var(--mi-vermelho);
}

/* === Nav lateral (âncoras) === */
.nav-lateral a {
  transition: color var(--mi-transition), border-color var(--mi-transition);
}

.nav-lateral a:hover {
  color: var(--mi-vermelho);
}

/* === Parceiros === */
.parceiros a,
.parceiros img {
  transition: opacity var(--mi-transition), transform var(--mi-transition);
}

.parceiros a:hover img {
  opacity: 0.9;
  transform: scale(1.02);
}

/* === Desliza (classe utilitária existente) — refinamento === */
.desliza {
  transition: transform var(--mi-transition), box-shadow var(--mi-transition);
}

.desliza:hover {
  transform: scale(1.02) translateX(2px);
}

/* === Slick carrossel — setas e dots === */
.viptv .slick-prev,
.viptv .slick-next,
.slick-prev,
.slick-next {
  transition: opacity var(--mi-transition), transform var(--mi-transition);
}

.viptv .slick-prev:hover,
.viptv .slick-next:hover,
.slick-prev:hover,
.slick-next:hover {
  opacity: 0.9;
}

.slick-dots li button {
  transition: opacity var(--mi-transition), transform var(--mi-transition);
}

.slick-dots li:hover button::before {
  color: var(--mi-cinza-claro);
}

/* === Revistas / Slider === */
.slider-revistas .revista,
.revista {
  transition: transform var(--mi-transition), color var(--mi-transition);
}

.slider-revistas .revista:hover {
  transform: translateY(-2px);
}

/* === Retângulo contato === */
.contato .retangulo a,
.contato .retangulo .conteudo {
  transition: color var(--mi-transition);
}

.contato .retangulo a:hover {
  color: var(--mi-vermelho);
}

/* === Acessibilidade — reduzir movimento === */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}