body{
    background-color: #000;
}
/* 
  O container geral terá scroll-snap para travar em cada slide.
  Definimos overflow-y: scroll para que cada section seja uma "tela".
*/
.slides-container {
    height: 100vh;
    width: 100%;
    overflow-y: scroll;
    scroll-snap-type: y mandatory; /* Força o snap em cada slide */
    /* Evite margin/padding para não gerar barras de rolagem extras */
    margin: 0;
    padding: 0;
  }
  
  /* Cada slide */
  .slide {
    position: relative;       /* Para podermos posicionar o vídeo */
    width: 100%;
    height: 100vh;
    scroll-snap-align: start; /* Ajusta para travar no topo quando scrollar */
    display: flex;            /* Usado para centralizar conteúdo, se desejar */
    /* justify-content: center; */
    align-items: center;
    overflow: hidden;         /* Caso o vídeo extrapole algo */
  }
  
  /* Vídeo ocupando toda a área do slide */
  .slide-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Mantém proporção do vídeo, cortando bordas se precisar */
    z-index: -1;       /* Fica atrás do conteúdo textual */
  }
  
  /* Conteúdo que fica na frente do vídeo */
  .slide-content {
    position: relative;
    text-align: center;
    color: #000;
    max-width: 900px;
    margin: 0 1rem;
    /* Para dar destaque, pode adicionar um background semitransparente */
    /* background: rgba(0, 0, 0, 0.3); */
    padding: 1rem 2rem;
    border-radius: 10px;
    margin-top: 3em;
  }
  
  .slide-content h1 {
    font-weight: 400;
    font-size: 2rem;
    line-height: 1.3;
    margin: 0;
  }
  
  /* ---- Animação de fade-in ao entrar na tela (opcional) ---- */
  /* Inicialmente, invisível */
  .slide {
    opacity: .5;
    filter: contrast(7);
    transition: all 0.6s ease;
  }
  
  .slide.slide-in {
    opacity: 1;
    filter: contrast(1);

  }

.slide-content h1{
    color: #fff;
}
   
.section-video-1 video.slide-video{
    width: 40%;
    height: 100%;
    right: 0;
    left: auto;
}
.section-video-1 .slide-content{
    text-align: left;
    max-width: 60%;
}
.section-video-1 .slide-content h1{
    font-size: 1.5em;
}

.section-video-1{
    height: 60vh;
}

.section-video-2 video.slide-video{
    width: 60%;
}
.section-video-2 .slide-content h1{
    text-align: left;
    font-size: 1.6em;
}
.section-video-2{
    justify-content: end;
}
.section-video-2 .slide-content{
    padding: 0;
    max-width: 30%;
    text-align: left;
}
.section-video-3 .slide-content{
    max-width: none;
    width: 100%;
}
.section-video-3 .slide-content h1{
    font-size: 1.6em;
}
.section-video-3 video.slide-video{
    opacity: .8;
}
.section-video-3 .slide-content h1,.section-video-3 .slide-content a.nav-link{
    	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.7), 0 0 10px rgba(0, 0, 0, 0.5);     
    }

.section-video-4 video.slide-video{
    height: 40%;
    transform: scale(1.1);
}
.section-video-4{
    align-items: end;
    height: 150vh;
}
.section-video-4 .slide-content h1{
    text-align: left;
    font-size: 1.4em;
    padding-bottom: 4em;
    padding-left: 2em;
    padding-right: 3em;
}


.section-video-4 .slide-content{
    padding: 0;
    margin: 0;
    max-width: none;
}

.slide-content a.nav-link{
    transition: all .3s;
    text-align: left;
    padding: 0;
    /* text-decoration: underline; */
    color: #fff;
    cursor: pointer;
    margin-top: 2em;
    display: inline-block;
    background-color: transparent;
    color: #fff;
    padding: .3em;
    border: 1px solid #fff;
    text-transform: uppercase;
}
.slide-content a.nav-link:hover{
    background-color: #fff;
    color: #000;
}

.marcatexto {
    border-bottom: 5px solid #ffffff;
  }