#modal-video {
    margin-top: 4rem;
    /*margin-bottom: 4rem;*/
}
#videoModal {
    margin-top: 0rem;
}

/* 1. Estilo do Gatilho (Imagem Clicável) */
#modal-video .video-trigger, 
.video-trigger {
    cursor: pointer;
    width: 100%;
    height: auto;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s;
}

#modal-video .video-trigger:hover,
.video-trigger:hover {
    transform: scale(1.05);
}

/* 2. Estilo do Modal (Oculto por padrão) */
#modal-video .modal,
.modal {
    display: none;
    /* Esconde o modal por padrão */
    position: fixed;
    /* Fica fixo na tela */
    z-index: 1;
    /* Acima de todo o resto */
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    /* Fundo escuro transparente */
    justify-content: center;
    align-items: center;
}

/* 3. Estilo do Conteúdo do Modal (Onde o vídeo fica) */
#modal-video .modal-content,
.modal-content {
    background-color: #fefefe;
    padding: 20px;
    border-radius: 5px;
    max-width: 800px;
    /* Largura máxima do player */
    width: 90%;
    position: relative;
}

/* 4. Estilo do Botão de Fechar (X) */
#modal-video .close,
.close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 15px;
}

#modal-video .close:hover,
#modal-video .close:focus,
.close:hover,
.close:focus {
    color: #fff;
    text-decoration: none;
    cursor: pointer;
}

/* ajustes no template governo digital*/
#governo-digital .secao-governo-digital .internal-pages-mufpp .agrupa-noticia .conteudo-governo-digital div#modal-video:last-child {
    margin-bottom: 0rem !important;
}