/* Estilos gerais para a nova seção */
#new-section {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden; /* Garante que o vídeo não ultrapasse os limites da seção */
}

/* Estilos do vídeo de fundo */
#pa-yt-video-background-new {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    pointer-events: none; /* Impede interação com o vídeo */
    overflow: hidden; /* Corta qualquer borda extra do vídeo */
    background: black; /* Cor de fundo enquanto o vídeo carrega */
}

/* Conteúdo centralizado */
#new-section .pa-hero-content {
    z-index: 2;
    color: white;
    position: relative;
    padding-top: 50px; /* Ajusta a distância do topo da tela */
}

/* Título com mais afastamento do topo */
.pa-h1-new {
    font-size: 3em;
    font-weight: bold;
    margin-bottom: 20px;
    margin-top: 50px; /* Adiciona espaço entre o topo e o título */
}

.youtube-play-frame {
    width: 80%;
    height: 450px;
    margin: 0 auto;
    border: none;
    z-index: 2;
}




/*-- NOVA SESSÂO TESTE -->
/* Reseta margens e padding padrões */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Estilo básico para a página */
body {
  font-family: Arial, sans-serif;
  background-color: #000;
  color: #fff;
  overflow-x: hidden;
}

/* Sessão do vídeo */
.video-section {
  position: relative;
  text-align: center;
  padding-top: 50px; /* Diminui a margem superior */
  min-height: 100vh; /* Garante que a seção ocupe pelo menos a altura total da tela */
}

/* Estilo do título */
.video-title {
  font-size: 3rem; /* Tamanho maior para o título */
  margin-bottom: 30px; /* Espaçamento entre o título e o player */
  z-index: 10;
  position: relative;
  margin-top: 0; /* Remove margem extra no topo */
  color: #fff;
  
}

/* Player do YouTube */
.youtube-player {
  margin: 0 auto;
  z-index: 10;
  position: relative;
  width: 90%; /* Aumenta a largura do player para 90% da tela */
  height: 700px; /* Aumenta a altura do player */
  display: flex;
  justify-content: center; /* Centraliza o player */
}



/* Vídeo local (fundo) */
.local-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}

.local-video video {
  width: 100%; /* Ajusta a largura para 100% da tela */
  height: 100%; /* Ajusta a altura para 100% da tela */
  object-fit: cover; /* Garante que o vídeo cubra toda a tela sem distorcer */
}

@media (max-width: 768px) {
  /* Para telas menores (como tablets e smartphones) */
  .local-video video {
    object-fit: cover; /* Mantém a cobertura do vídeo */
  }
}


