/* Estilo do card de vídeo */
.card-video {
    width: 60%; /* Largura inicial do card */
    max-width: 800px; /* Limite máximo de largura */
    margin: 0 auto; /* Centraliza o card horizontalmente */
    overflow: hidden; /* Garante que os cantos arredondados do vídeo sejam aplicados */
    border-radius: 15px; /* Ajuste o valor para arredondar mais ou menos */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* Adiciona uma sombra para destaque */
    background-color: #fff; /* Fundo branco para destacar o card */
}

/* Estilo do container de vídeo */
.video-container {
    width: 100%; /* O vídeo ocupa toda a largura do card */
    padding-top: 56.25%; /* Proporção 16:9 para vídeos */
    position: relative; /* Necessário para o iframe ocupar corretamente o espaço */
}

/* Estilo do iframe do vídeo */
.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; /* Largura total do container */
    height: 100%; /* Altura total do container */
    border: none;
    border-radius: 0; /* Remove o arredondamento do próprio iframe, já que o card controla isso */
}

/* Responsividade - Ajusta o tamanho do card para telas menores */
@media (max-width: 768px) {
    .card-video {
        width: 80%; /* Reduz a largura do card para tablets e dispositivos menores */
    }
}

@media (max-width: 480px) {
    .card-video {
        width: 100%; /* O card ocupa toda a largura da tela para dispositivos móveis */
    }
}






/* Resetando margens e padding padrão */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Estilo para o container da seção */
#sobre-nos {
    background-color: #d3570532;
    padding: 60px 20px;
}

/* Título da seção */
/* Estilo padrão do título */
#sobre-nos h2 {
    text-align: center;
    font-size: 3.5rem;
    margin-bottom: 20px;
    font-family: 'Poppins', sans-serif;

    /* Gradiente no texto */
    background: linear-gradient(90deg, #ff6f00, #00000090);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    /* Animação de suavidade */
    opacity: 1; /* Tornar visível */
    transform: translateY(0); /* Posição inicial */
    transition: opacity 3.0s ease, transform 0.4s ease;
}

/* Classe de animação */
.titulo-animado {
    opacity: 8; /* Totalmente visível */
    transform: translateY(0); /* Retorna à posição original */
}

/* Parágrafo da seção */
#sobre-nos p {
    font-size: 1.125rem;
    color: #000000;
    line-height: 1.6;
    text-align: center;
    margin: 0 auto;
    max-width: 800px; /* Limita a largura do texto para melhor leitura */
}



/* Estilo do container */
.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 15px;
}

/* Responsividade */
@media (max-width: 768px) {
    #sobre-nos h2 {
        font-size: 2rem; /* Tamanho do título reduzido para telas pequenas */
    }

    #sobre-nos p {
        font-size: 1rem; /* Texto ajustado para telas menores */
        padding: 0 15px; /* Adiciona espaçamento nas laterais do texto */
    }
}
#sobre-nos {
    position: relative; /* Para posicionar o pseudo-elemento */
    overflow: hidden; /* Garante que a imagem não ultrapasse os limites */
}

#sobre-nos::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('../image/70cb658a-9c7a-4854-9340-e12045bb973a.png') no-repeat center center;
    background-size: cover;
    

    background-size: cover;
    background-attachment: fixed;
    z-index: -1; /* Garante que a imagem fique atrás do conteúdo */
    opacity: 0.4; /* Ajuste a opacidade da imagem de fundo aqui */
}

.container {
    padding: 40px;
    position: relative; /* Para garantir que o conteúdo fique visível sobre a imagem */
    z-index: 1; /* Garante que o conteúdo da seção fique sobre a imagem */
}

.card-video {
    margin-top: 20px;
}

.video-container iframe {
    width: 100%;
    height: 100%;
    border-radius: 10px;
}