/* --- RESET GLOBAL OBRIGATÓRIO --- */

/* 1. Garante que Padding e Borda não aumentem a largura dos elementos */
*, *::before, *::after {
    box-sizing: border-box;
}

/* 2. Impede que o corpo da página exceda a largura da janela */
html, body {
    width: 100%;
    max-width: 100vw;
    overflow-x: hidden; /* Corta qualquer coisa que teime em sair para a direita */
    margin: 0;
    padding: 0;
}

/* 3. Garante que imagens e vídeos nunca estouram o container pai */
img, video, iframe {
    max-width: 100%;
    height: auto;
}

/* --- CORREÇÃO DE OVERFLOW HORIZONTAL --- */
html, body {
    max-width: 100%;
    overflow-x: hidden; /* Esconde qualquer coisa que tente sair da tela horizontalmente */
    margin: 0;
    padding: 0;
}

/* Garante que o box-sizing inclua bordas e preenchimentos no cálculo da largura */
*, *::before, *::after {
    box-sizing: border-box;
}

/* Tela de Carregamento */
#loading-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*background-color: rgba(255, 255, 255, 0.8); /* Fundo semitransparente */
	background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999; /* Fica por cima de todo o conteúdo */
}/* Modal ocupando toda a área visível */#detalheautores {    display: none; /* Inicialmente oculto */    position: fixed;    top: 0;    left: 0;    width: 100vw;    height: 100vh;    background-color: rgba(255, 255, 255, 0.9); /* Fundo semitransparente */    z-index: 9999; /* Fica acima de todo o conteúdo */    overflow: hidden; /* Desativa o scroll da página */}/* Quando visível */#detalheautores.mostrar {    display: flex; /* Mostra o modal */    flex-direction: column; /* Conteúdo organizado verticalmente */}.autoresdetail{	max-width:600px;	margin:auto;}/* Barra superior com botão no lado direito */.ocultardetalheautor {    width: 100%; /* Ocupa toda a largura */    background-color: #f1f1f1; /* Fundo claro para destaque */    padding: 10px;    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Sombra */    border-bottom: 1px solid #ccc; /* Linha divisória */    display: flex;    justify-content: flex-end; /* Botão alinhado à direita */    align-items: center;    position: relative; /* Não se sobrepõe ao conteúdo abaixo */    z-index: 1; /* Mantém-se acima de outros elementos visuais */}/* Container do conteúdo principal */#detalheautores > div {    flex: 1; /* Ocupa o restante do espaço */    display: flex; /* Flexbox para layout dos filhos */    flex-wrap: wrap; /* Permite ajuste responsivo */    overflow-y: auto; /* Barra de rolagem para conteúdo */    padding: 20px;    padding-top: 50px; /* Espaço para evitar sobreposição pela barra superior */}/* Estilo do conteúdo de foto e nome */#fotoenome {    flex: 0 0 100%; /* Ocupa 100% inicialmente */    display: flex;    flex-direction: column; /* Elementos organizados verticalmente */    align-items: center;    margin-bottom: 20px; /* Espaçamento inferior */}/* Foto e nome lado a lado */#fotoenome .fotoautor,#fotoenome .nomeautor {    margin: 5px 0; /* Espaçamento entre os elementos */}/* Descrição do autor */#descricaoautor {    flex: 1; /* Ocupa o espaço restante */}/* Layout responsivo */@media (min-width: 401px) {    #fotoenome {        flex: 0 0 40%; /* Ocupa 40% quando a largura for maior que 400px */        margin-bottom: 0; /* Remove o espaçamento inferior */    }    #descricaoautor {        flex: 0 0 60%; /* Ocupa 60% quando a largura for maior que 400px */        margin-left: 20px; /* Espaçamento entre os elementos */    }}
.spinner {
    border: 8px solid #f3f3f3; /* Cor do fundo */
    border-top: 8px solid #3498db; /* Cor da borda superior */
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
}

.popup {
  position: fixed;
  display:none;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url('../images/landing.jpg'); 
  background-size: cover;
  background-position: center;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999; /* Valor alto para garantir que o pop-up fique acima de outros elementos */
}

.popupinside{
	font:white;
	background-color: rgba(0, 0, 0, 0.8);
	padding:30px;
}


/* Animação de rotação */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}


/* Estilos do header */
header {
	width:100%;
    /*
	background-color: #c11923; /* Fundo vermelho para o header */
	background-color: black; /* Fundo vermelho para o header */
    color: white; /* Texto branco no header */
    padding: 10px 20px;
    display: flex; /* Alinha logo e menu horizontalmente no desktop */
    /*justify-content: space-between;*/
    align-items: center;
	margin: 0;
	justify-content: flex-start; /* Alinha os itens à esquerda */
	/*gap: 20px; /* Espaçamento entre logo e menu */
}

/* Logo e texto no header */
.logo {
    display: flex;
    align-items: center;
}

/* O logotipo visível apenas no desktop */
.logo img {
    display: block; /* Logo visível no desktop */
    width: auto;
    height: 100px; /* Ajuste a altura conforme necessário */
}

/* O texto "EDITORA NIHON" será exibido no mobile */
.logo-text {
    display: none; /* Oculto no desktop */
    font-size: 18px;
    font-weight: bold;
	color: white;
}

.logo-link {
    text-decoration: none; /* Remove o sublinhado para este link */
}

#contacto {
    /*padding: 20px;*/
    background: #f9f9f9;
}


.footer_left {
	text-align:left;
	font-weight: 400;
	font-family: "Arial", sans-serif;
	text-decoration:none;
}

.footer_left .container p a,
.footer_left div p{
	text-align:left;
	font-weight: 400;
	font-family: "Arial", sans-serif;
	text-decoration:none;
	color: inherit;
}

/* Estilos do menu */
nav ul {
    display: flex; /* Menu horizontal no desktop */
    list-style-type: none;
    margin: 0;
    padding: 0;
}

#mobileMenu ul li,
nav ul li {
    /*margin: 0 15px; /* Espaçamento entre os itens do menu */
	list-style-type: none;
	white-space: nowrap;
	padding-right:5px;
}

#mobileMenu ul li a,
ul li a {
    text-decoration: none;
    color: white; /* Texto branco no menu */
    font-weight: bold;
	padding: 10px 15px; /* Adiciona espaçamento interno para parecer botão */
	border: 2px solid transparent;
	border-radius:5px;
	transition: all 0.3s ease;
	height:50px;
}

/* Aumenta o espaçamento entre as linhas dos itens no menu móvel */
#mobileMenu ul li {
    margin-bottom: 10px; /* Adiciona espaço entre os itens */
}

/* Estilo hover para os links */

#mobileMenu ul li a:hover,
header nav ul li a:hover {
    background-color: white; /* Fundo branco ao passar o mouse */
    color: #c11923; /* Texto vermelho ao passar o mouse */
    border-color: white; /* Adiciona borda branca ao passar o mouse */
}

/* Estilo para o menu ativo */
header nav ul li a.active {
    background-color: white; /* Fundo branco para o menu ativo */
    color: #c11923; /* Texto vermelho */
    border-color: white; /* Borda branca */
}

/* Botão de menu visível apenas no mobile */
.menu-toggle {
    display: none;
    font-size: 24px;
    background: none;
    border: none;
    color: white;
    cursor: pointer;
}

/* Esconde o menu mobile (hamburger) no desktop */
.mobile-menu {
    display: none; /* Esconde o menu mobile por padrão, incluindo no desktop */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #c11923; /* Fundo vermelho para o menu mobile */
    padding: 20px;
    /*box-sizing: border-box;*/
}

.mobile-menu.open {
    display: block; /* Exibe o menu mobile quando a classe 'open' for adicionada */
}

/* Estilo do botão de fechamento do menu no mobile */
.mobile-menu .close-btn {
    font-size: 30px;
    color: white;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 20px;
}

/* Responsividade */
@media (max-width: 768px) {
    /* Oculta o logo no mobile e mostra o texto "EDITORA NIHON" */
    .logo img {
        display: none; /* Oculta o logotipo no mobile */
    }

    .logo-text {
        display: block; /* Mostra o texto "EDITORA NIHON" no mobile */
        font-size: 18px;
        font-weight: bold;
    }

    /* Esconde o menu horizontal no mobile */
    nav ul {
        display: none; /* Esconde o menu no mobile */
    }

    /* Exibe o botão do menu (hamburger) no mobile */
    .menu-toggle {
        display: block;
        margin-left: auto; /* Alinha o ícone à direita */
    }

    /* Exibe o menu mobile (hamburger) quando o botão for clicado */
    .mobile-menu {
        display: none; /* Esconde o menu mobile por padrão no mobile */
    }

    .mobile-menu.open {
        display: block; /* Exibe o menu mobile quando a classe 'open' for adicionada */
    }
}




footer {
	width: 100%;  /* Faz o footer ocupar toda a largura da tela */
    /*position: fixed; /* Fixa o footer no fundo da página */
    left: 0; /* Alinha o footer à esquerda */
    bottom: 0; /* Fixa o footer na parte inferior da tela */
    width: 100%; /* Faz o footer ocupar toda a largura da tela */
	background-color: white; /* Fundo vermelho para o header */
    /*background-color: #c11923; /* Cor de fundo para o footer */
    color: rgb(18, 81, 127); /* Texto branco */
    text-align: center; /* Centraliza o texto */
    padding: 0px 0; /* Adiciona algum espaçamento vertical */
    z-index: 1000; /* Garante que o footer fique acima do conteúdo */
	font-weight:bold;
}

footer p {
    margin: 0;
    flex: 1 1 100%; /* O parágrafo ocupa 100% da largura */
    margin-top: 20px;
    font-size: 0.9rem; /* Tamanho do texto */
    text-align: center;
}

body {
    padding-bottom: 40px; /* Adiciona um espaço na parte inferior da página para que o conteúdo não fique escondido pelo footer fixo */
	font-family: Arial, sans-serif;
    line-height: 1.6;
    color: #333;
    background-color: #f9f9f9;
}

html, body {
    margin: 0;
    padding: 0;
	height: 100%;
}

main {
    padding-bottom: 50px;  /* Adiciona espaçamento para evitar sobreposição do footer */
	width: 100%;
}

/* Container principal */


.container {
    max-width: 1200px;
    margin: auto;
    padding: 20px;
    width: 100%; /* Garante que ocupe a largura disponível */
}

div.container form button {
	width:100%;
}

/* Seções */
section {
    margin: 40px 0;
}

/* Destaques */
.noticias {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
}

.noticia {
    background: #fff;
    border: 1px solid #ddd;
    padding: 15px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.noticia h3 {
    margin-bottom: 10px;
    font-size: 20px;
}

.noticia small {
    color: #777;
}
/*Autores*/.autores {    
    display: grid;    
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));    
    gap: 20px;}.autor {    background: #fff;    
    border: 1px solid #ddd;    
    padding: 15px;    
    text-align: center;    
    border-radius: 5px;    
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);}
.autor a img {    
    max-width: 100%;    
    /*height: auto;*/    
    margin-bottom: 10px;	
    max-height:200px;	
    height:200px;	
    width:200px;	
    border-radius:50%;} 
.autor h3 {    
    font-size: 18px;    
    margin-bottom: 10px;    
    color: #0073e6;}
.autor p {    
    margin: 5px 0;    
    color: #555;}
    
/* Loja */
.livros {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
}

.livro {
    background: #fff;
    border: 1px solid #ddd;
    padding: 15px;
    text-align: center;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.livro img {
    max-width: 100%;
    height: auto;
    margin-bottom: 10px;
}

.livro h3 {
    font-size: 18px;
    margin-bottom: 10px;
    color: #0073e6;
}

.livro p {
    margin: 5px 0;
    color: #555;
}

/* Responsividade */
@media (max-width: 768px) {
    header .container {
        flex-direction: column;
        text-align: center;
    }

    header nav ul {
        flex-direction: column;
        margin-top: 10px;
    }

    header nav ul li {
        margin: 5px 0;
    }
}


.imagens-noticia {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
}

.img-noticia {
    max-width: 100%;
    height: auto;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}


#sobre {
    padding: 20px;
    background: #f9f9f9;
}

.conteudo-sobre {
    font-size: 1rem;
    line-height: 1.6;
    color: #333;
    text-align: justify;
}

#galeria {
    padding: 20px;
    background: #f9f9f9;
}


.grid-galeria {
    display: grid;
    /* O minmax(150px...) garante que em telas MUITO pequenas (tipo Galaxy Fold) ele não quebre */
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); 
    gap: 15px;
    width: 100%;
}

.item-galeria {
    text-align: center;
    background: #fff;
    padding: 10px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

.img-galeria {
    width: 100%;
    height: auto;
    border-radius: 5px;
    margin-bottom: 10px;
}

.item-galeria p {
    font-size: 0.9rem;
    color: #555;
}

#contacto {
    padding: 20px;
    background: #f9f9f9;
}

form {
    max-width: 600px;
    margin: 0 auto;
}

.form-group {
    margin-bottom: 15px;
}

label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
}

input, textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 1rem;
}

button {
    background-color: #007BFF;
    color: #fff;
    padding: 10px 20px;
    border: none;
    border-radius: 5px;
    font-size: 1rem;
    cursor: pointer;
}

button:hover {
    background-color: #0056b3;
}

.success {
    color: green;
    font-weight: bold;
    margin-bottom: 15px;
}

.error {
    color: red;
    font-weight: bold;
    margin-bottom: 15px;
}





.whatsapp-fixed {
    position: fixed;
    bottom: 40px;
    right: 40px;
    z-index: 9999; /* Garante que fica acima de tudo */
}

.btn-whatsapp {
    background-color: #30bf39;
    color: #fff;
    border-radius: 50%;
    width: 60px; /* Tamanho fixo */
    height: 60px; /* Tamanho fixo */
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 2px 2px 6px rgba(0,0,0,0.4);
    transition: background-color 0.3s, transform 0.3s;
    text-decoration: none;
    position: relative;
    z-index: 2;
}



.btn-whatsapp:hover {
    background-color: #25d366;
    transform: scale(1.1); /* Efeito de crescer um pouco */
}

.btn-whatsapp i {
    font-size: 32px; /* Tamanho do ícone */
}

.whatsapp-fixed a.video-vemo-icon.btn-whatsapp i {
    font-size: 32px;
    color: #fff;
    animation: sm-shake-animation linear 1.5s infinite;
    animation-delay: 3s;
}

.rs-video .animate-border .video-vemo-icon:before {
    content: "";
    border: 2px solid #fff;
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    opacity: 0;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    animation: zoomBig 3.25s linear infinite;
    -webkit-animation-delay: 4s;
    animation-delay: 4s;
}

.rs-video .animate-border .video-vemo-icon:after {
    content: "";
    border: 2px solid #fff;
    position: absolute;
  opacity: 0;
    z-index: 0;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    animation: zoomBig 3.25s linear infinite;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
}

.btn-whatsapp:after, .btn-whatsapp:before {
    border: 2px solid #30bf39 !important;
    width: 80px!important;
    height: 80px!important;
}

.sm-red-dot {
    position: absolute;
    right: 4px;
    top: 4px;
    width: 12px; 
    height: 12px;
    margin: 0 auto;
    background: red;
    transform: scale(0);
    border-radius: 50%;
    animation-name: notificationPoint;
    animation-duration: 300ms;
    animation-fill-mode: forwards;
    animation-delay: 3s;
}

/* O Balão de Texto */
.quick-message {
    position: absolute;
    bottom: 10px;    /* Alinhado com o botão */
    right: 70px;     /* Posicionado à esquerda do botão */
    background-color: #393b39;
    color: #fff;
    padding: 8px 15px;
    border-radius: 5px;
    white-space: nowrap; /* Texto numa linha só */
    font-size: 14px;
    
    /* SEGREDOS PARA O EFEITO HOVER */
    opacity: 0;             /* Invisível */
    visibility: hidden;     /* Não clicável */
    transform: translateX(20px); /* Começa um pouco deslocado para a direita */
    transition: all 0.3s ease-in-out; /* Animação suave */
    pointer-events: none;   /* O balão não atrapalha o clique */
}

.line-up {
    opacity: 0;
    animation-name: anim-lineUp;
    animation-duration: 0.75s;
    animation-fill-mode: forwards;
    animation-delay: 5s;
}

.quick-message p {
    line-height: 40px;
    font-size: 15px;
    padding: 4px 16px;
    height: 40px;
    position: relative;
    color: #fff;
    margin: 0;
}

/* A Seta do Balão */
.quick-message::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -6px; /* Posiciona a ponta da seta */
    margin-top: -6px;
    border-width: 6px;
    border-style: solid;
    border-color: transparent transparent transparent #393b39;
}

.quick-message .seta-direita:before {
    display: inline-block;
    content: "";
    vertical-align: middle;
    margin-right: 10px;
    width: 0;
    height: 0;
    border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 20px solid #393b39;
    position: absolute;
    bottom: 3px;
    right: -30px;
}

#hover-message {
    display: none;
}

.whatsapp-fixed:hover #hover-message {
    display: block;
}

/* A MÁGICA: Quando passar o mouse no container geral (.whatsapp-fixed) */
.whatsapp-fixed:hover .quick-message {
    opacity: 1;             /* Torna visível */
    visibility: visible;
    transform: translateX(0); /* Volta para a posição original */
}

@keyframes zoomBig {
    0% { transform: translate(-50%, -50%) scale(.5); opacity: 1; border-width: 3px }
    40% { opacity: .5; border-width: 2px }
    65% { border-width: 1px }
    100% { transform: translate(-50%, -50%) scale(1); opacity: 0; border-width: 1px }
}

@keyframes sm-shake-animation {
    0% { transform: rotate(0) scale(1) skew(0.017rad) }
    25% { transform: rotate(0) scale(1) skew(0.017rad) }
    35% { transform: rotate(-0.3rad) scale(1) skew(0.017rad) }
    45% { transform: rotate(0.3rad) scale(1) skew(0.017rad) }
    55% { transform: rotate(-0.3rad) scale(1) skew(0.017rad) }
    65% { transform: rotate(0.3rad) scale(1) skew(0.017rad) }
    75% { transform: rotate(0) scale(1) skew(0.017rad) }
    100% { transform: rotate(0) scale(1) skew(0.017rad) }
}

@keyframes notificationPoint {
    from { transform: scale(0) }
    to { transform: scale(1) }
}

/* --- CORREÇÃO AQUI: Fechei a chave que faltava e completei a animação --- */
@keyframes anim-lineUp {
    from {
        opacity: 0;
        transform: translateY(100%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* --- RESET GLOBAL IMPORTANTE --- */
/* Isso garante que padding e bordas não aumentem a largura dos elementos */
* {
    box-sizing: border-box;
}

/* --- GRID DA NOTÍCIA --- */
.noticias {
    display: grid;
    /* minmax(300px, 1fr) cria colunas responsivas */
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
    width: 100%; /* Garante que o grid não passe da tela */
}

.noticia {
    background: #fff;
    border: 1px solid #ddd;
    padding: 15px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    
    /* O SEGREDO: min-width: 0 impede o item de estourar o grid */
    min-width: 0; 
    width: 100%;
    overflow: hidden; /* Corta qualquer coisa que tentar sair */
}

/* --- PLAYER DE VÍDEO --- */
.media-container {
    margin-top: 10px;
    position: relative;
    display: block;
    width: 100%; /* Ocupa 100% da largura da .noticia */
}

.custom-video-wrapper {
    width: 100%;
    background: #000;
    border-radius: 4px;
    overflow: hidden; /* Garante que o vídeo não saia das bordas arredondadas */
    position: relative;
}

video {
    width: 100% !important; /* Força bruta para obedecer o pai */
    height: auto !important; /* Mantém a proporção */
    max-height: 400px; /* Limite de altura visual */
    display: block;
    object-fit: contain; /* Ajusta o vídeo dentro da caixa */
}

/* Controles */
.video-controls {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #333;
    padding: 8px;
    width: 100%; /* Garante largura total */
    flex-wrap: wrap; /* Permite quebrar linha em celulares muito pequenos */
}

.btn-control {
    background: #fff;
    color: #333;
    border: none;
    padding: 0;
    cursor: pointer;
    font-size: 14px;
    border-radius: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    flex-shrink: 0; /* Não deixa o botão esmagar */
}

.vol-container {
    display: flex;
    align-items: center;
    gap: 5px;
}

/* Slider de volume responsivo */
input[type=range] {
    width: 60px;
    max-width: 20vw; /* Diminui se a tela for pequena */
    cursor: pointer;
}

/* Container do Modal */
#zoomimg {
    position: fixed;
    top: 0; 
    left: 0;
    width: 100vw; 
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.9); /* Fundo mais escuro para destaque */
    z-index: 99999;
    display: none;
    /* Flexbox para centralizar setas e imagem */
    display: flex; 
    justify-content: center;
    align-items: center;
    /* Importante para o swipe funcionar sem arrastar a tela de fundo */
    touch-action: none; 
}

/* A Imagem em si (agora via tag IMG para melhor controle) */
#zoomimg-content {
    max-width: 90%;
    max-height: 90%;
    object-fit: contain;
    user-select: none; /* Impede selecionar a imagem ao arrastar */
}

/* Botões de Navegação (Setas) */
.nav-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(255, 255, 255, 0.1);
    color: white;
    border: none;
    font-size: 40px;
    padding: 20px;
    cursor: pointer;
    z-index: 100000;
    transition: background 0.3s;
    user-select: none;
}

.nav-btn:hover {
    background: rgba(255, 255, 255, 0.3);
}

.prev-btn { left: 10px; }
.next-btn { right: 10px; }

/* Botão Fechar (X) */
.close-btn {
    position: absolute;
    top: 20px;
    right: 30px;
    color: white;
    font-size: 40px;
    cursor: pointer;
    z-index: 100001;
}

/* Responsividade: botões menores no celular */
@media (max-width: 768px) {
    .nav-btn { font-size: 30px; padding: 10px; }
}

/* Oculta o emblema flutuante do reCAPTCHA */
.grecaptcha-badge {
    visibility: hidden;
}

/* --- CORREÇÃO DE COR DO POPUP (PUBLICIDADE) --- */
#advertising {
    color: #ffffff !important; /* Força o texto a ser branco */
    text-shadow: 1px 1px 2px rgba(0,0,0,0.8); /* Dá uma sombra para leitura melhor */
    font-weight: bold;
    text-align: center;
}

/* Se houver links dentro da publicidade, coloque-os numa cor clara */
#advertising a {
    color: #ffcc00 !important; /* Amarelo dourado para destacar */
    text-decoration: underline;
}

/* Se o texto estiver dentro de parágrafos */
#advertising p {
    color: #ffffff !important;
}