/* =======================================
 * 🟢 MEU ESTILO 1 - VERSÃO FINAL CONSOLIDADA
 * (Compatível com o menu antigo e galeria centralizada)
======================================= */

/* 🟢 VARIÁVEIS DE COR E FONTES */

@font-face {
  font-family: 'Segoe Script';
  src: url('https://entrenos.neocities.org/Inicio/fontes/Segoe Script.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
:root {
  --cor-primaria: #fff;
  --cor-secundaria: #daa520; /* Dourado */
  --cor-fundo: #000;
}

/* 🟢 REGRAS GLOBAIS E BODY */
body {
  font-family: Arial, sans-serif;
  background-color: var(--cor-fundo);
  overflow-y: scroll;
  overflow-x: hidden;
  margin: 0;
  padding: 20px;
  text-align: center;
  color: var(--cor-primaria);
}

/* 🟢 CABEÇALHO E LOGOTIPOS (Regras únicas da página de Slides) */
.logo-container {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 20px 0;
  position: relative;
}
.logo-container img,
.logo-container span {
  vertical-align: middle;
}
.logo-container .logo-left {
  margin-right: 120px;
  width: 140px;
  height: 140px;
}
.logo-container .logo-right {
  margin-left: 120px;
  width: 130px;
  height: 130px;
}
.logo-container .logo-text {
  color: var(--cor-primaria);
  font-size: 40px;
  font-weight: bold;
  font-family: 'Segoe Script', cursive, sans-serif;
}

/* 🟢 TÍTULO DA PÁGINA */
.texto {
  color: var(--cor-secundaria);
  text-align: center;
  font-size: 40px;
  font-weight: bold;
  font-family: 'Segoe Script', cursive, sans-serif;
  margin: 50px auto 30px auto;
}

/* =======================================
 * 🟢 MENU DE NAVEGAÇÃO (ESTRUTURA ANTIGA: .nav-text / .nav-link)
======================================= */

.nav-text {
  color: var(--cor-primaria);
  font-size: 30px;
  text-align: center;
  margin-bottom: 50px;
}
.nav-link {
  color: var(--cor-primaria);
  text-decoration: none;
  font-weight: normal;
  transition: color 0.3s, transform 0.3s;
  display: inline-block;
  cursor: pointer;
}
.nav-link:hover {
  color: var(--cor-secundaria);
  transform: scale(1.1);
}
.pagina-atual {
  color: var(--cor-secundaria) !important;
  font-weight: bold;
}

/* 🟢 ÍCONE DE PARTILHA (Adicionado para compatibilidade total, se necessário) */
.share-icon-wrapper {
  position: relative;
  display: inline-block;
  margin-left: 20px;
}
#shareButtonIcon {
  color: var(--cor-primaria);
  background: none;
  border: none;
  padding: 0;
  font-size: 26px;
  cursor: pointer;
  transition: color 0.3s, transform 0.3s;
  position: relative;
}
#shareButtonIcon:hover {
  color: var(--cor-secundaria);
  transform: scale(1.1);
}
#shareButtonIcon svg {
  width: 34px;
  height: 26px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2.5;
}
#copy-message-inline {
  position: absolute;
  top: -30px;
  left: 50%;
  transform: translateX(-50%);
  background:transparent;
  color: var(--cor-secundaria);
  border: 1px solid var(--cor-secundaria);
  padding: 4px 8px;
  border-radius: 3px;
  font-size: 12px;
  white-space: nowrap;
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 10;
}

/* =======================================
 * 🟡 GALERIA (CORREÇÃO FLEXBOX + TAMANHO DE 300px)
======================================= */
.galeria {
  /* Variáveis de tamanho usadas no HTML (ajustadas para o Flexbox) */
  --colunas: 3;
  --largura-img: 300px; /* Aumentado para o tamanho desejado na galeria Slides */
  --altura-img: 450px; /* Aumentado para o tamanho desejado na galeria Slides */
  --gap: 80px;

  /* CHAVE DA CENTRALIZAÇÃO FLEXBOX */
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--gap);
  max-width: calc( (var(--largura-img) * var(--colunas)) + (var(--gap) * (var(--colunas) - 1)) + 40px);
  margin: 50px auto 100px auto;
  padding: 0;
}

.galeria .imagem {
  /* Chave da Centralização: Força a largura para 1/3 */
  width: calc((100% - (var(--gap) * (var(--colunas) - 1))) / var(--colunas));
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-bottom: 30px;
}

.galeria .imagem img {
  width: var(--largura-img);
  height: var(--altura-img);
  object-fit: cover;
  transition: transform 0.3s ease-in-out;
  border: 2px solid var(--cor-fundo);
  border-radius: 20px;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
}

.galeria .imagem img:hover {
  transform: scale(1.05);
  border-color: var(--cor-fundo);
}

.galeria .descricao {
  margin-top: 20px;
}

.galeria .descricao a {
  color: var(--cor-primaria);
  font-size: 20px;
  text-decoration: none;
  transition: color 0.3s;
  font-weight: bold;
}

.galeria .descricao a:hover {
  color: var(--cor-secundaria);
}

.galeria .descricao .linha {
  font-family: 'Segoe Script', cursive, sans-serif;
  font-size: 28px;
  display: block;
  margin-top: 5px;
  font-weight: normal;
}