*, *::before, *::after { box-sizing: border-box; }
.box-dstk-principal { background-color: #E6DDE8 !important; border-radius: 20px;     display: grid;
    grid-auto-flow: column;
    grid-auto-columns: 1fr; gap: 1rem; padding: 2rem; margin: 1rem 0; }
.dstkmain-col1 { padding-left: 4rem; align-self: center;}
.dstkmain-col2 { text-align: center; }
.dsktmain-hl1 { font-size: 36px !important; font-weight: 400 !important; color: #B58DBD !important; margin-bottom: 0.75rem !important; }
.dsktmain-hl2 { font-size: 56px !important; font-weight: bold !important; color: #5B2A66 !important; line-height: 3rem !important; margin-bottom: 1rem !important;}
.dstkbtn { border: #BF94C8 2px solid; border-radius: 5px; padding: 1rem 2rem; background: none; font-size: 16px; font-weight: bold; color: #4C1957; }
.dstkbtn:hover, .dstkbtn:focus { background-color: #BF94C8; color: #340E3B; cursor: pointer; }
.dstk2-bloco-tab { display: flex ; align-items: flex-start; justify-content: flex-start; flex: 1; font-size: 16px; }
.box-dstk-dois { background-color: #FFE7C1 !important; border-radius: 20px; display: flex; align-items: center; justify-content: center; gap: 1rem; padding: 2rem; flex-direction: column; }
.box-dstk-dois h2 { color: #7D5200; font-size: 40px; font-weight: bold; }
.dstkmain-img { width: 100%; }
.dstk2-barra-btns { display: flex; align-items: center; justify-content: center;}
.botao-tab { font-weight: bold; color: #583B04; padding: 0.8rem 2rem 0.8rem 1rem; border-radius: 5px; font-size: 16px; border: 0;    background: none;  margin: 0 0.2rem;     display: flex; align-items: center; justify-content: center; background: linear-gradient(360deg, rgba(217, 217, 217, 0.00) 0%, #ffffff94 100%); outline: 1px dotted #d6950c; }
.botao-tab:hover, .botao-tab:focus { outline: 2px solid #d6960d82;  cursor: pointer;}
.clique-btn-saiba-mais { margin: 0; font-size: 0.8rem !important; color: gray !important; }
.w3-red { background-color: white; }
.botao-tab img { vertical-align: middle; margin: 0 5px 0 0; }

/* SECAO ETAPAS PROCESSO */
.box-dstk-processo { background-color: white !important; border-radius: 20px; display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 1rem; padding: 2rem; margin: 1rem 0;  
background-image: url(imagens/bg-box-process.svg); background-position: left; background-repeat: no-repeat; background-size: cover; }
.box-dstk-processo h2 { color: #772E86; font-size: 40px; font-weight: bold; line-height: 38px;     margin-bottom: 1rem;}
.etapas-sutia { color: #454545; font-size: 16px; line-height: 26px; }
.etapa-processo { display: flex; align-items: center; justify-content: flex-start; margin-bottom: 0.65rem; }
.numero-ball { background-color: #A777B1; color: white; font-size: 24px; border-radius: 50px; text-align: center; display: flex; align-items: center; justify-content: center; font-weight: bold; padding: 1.2rem; width: 2rem; height: 2rem; }
.etapa-processo p { margin: 0 0 0 0.5rem !important; font-size: 18px; color: #434343; }
.col-etapas-txts { display: flex; flex-direction: column; justify-content: center; padding: 2rem; }
.item-negrito { font-weight: bold; }
.coluna-dupla { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; align-items: flex-start; justify-content: flex-start; padding: 1rem; color: #583b04; }

/* SECAO NOTICIAS */
.box-dstk-noticias { background-color: #EEFEF2 !important; border-radius: 20px; padding: 2rem; }
.box-dstk-noticias h2 { color: #154F25; font-size: 38px; font-weight: bold; line-height: 38px; margin-bottom: 1rem;}
.box-dstk-noticias hr { width: 100%; border: 0; border-bottom: 1px solid #6FBB84; margin: 0.4rem 0 1rem 0; }
.grupo-noticias { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; }
.data-noticia { font-size: 12px; color: black;  margin-bottom: 0.5rem !important; text-transform: uppercase;}
.titulo-noticia { font-size: 20px; color: black; line-height: 26px; margin-bottom: 0.5rem; }
.sutia-noticia { font-size: 16px; color: black; line-height: 26px; }
.noticia-blocoinicial { border-bottom: 1px dashed #74B887;}
.mais-noticias { width: 100%; text-align: right; margin-bottom: 0 !important; }
.mais-noticias-link { text-decoration: none; color: black; font-size: 14px; font-weight: 600; border-bottom: 0 !important;}
.mais-noticias-link:hover, .mais-noticias-link:focus { text-decoration: underline;}
.link-noticia-tit { text-decoration: none; border-bottom: 0; color: black !important;}
.link-noticia-tit:hover { text-decoration: underline;  color: #154F25 !important;}

@media only screen and (max-width: 640px) {
.dstkmain-img { width: 80%; }
.dsktmain-hl1 { font-size: 32px;  }
.dsktmain-hl2 { font-size: 38px; line-height: 2.4rem; }
.box-dstk-principal, .box-dstk-processo, .grupo-noticias  { grid-auto-flow: row; }
.dstkmain-col1 { padding-left: 2rem !important; }
.dstk2-barra-btns { flex-wrap: wrap;}
.cols-etapas-txts { padding: 1rem; }
.coluna-dupla { grid-template-columns: 1fr; }
.grupo-noticias { grid-template-columns: 1fr;  }
}

@media only screen and (max-width: 460px) {
.dsktmain-hl1 { font-size: 32px;  }
.dsktmain-hl2 { font-size: 38px; line-height: 2.4rem; }
.dstkmain-col1 { padding-left: 1rem !important; }
.dstk2-barra-btns { flex-direction: column; width: 100%;}
.botao-tab { width: 100%; }
}

/* MODALZ */

.w3-modal{z-index:3;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)}
.w3-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;max-width:1200px; width: 100%;}
.w3-container:after,.w3-container:before,.w3-panel:after,.w3-panel:before,.w3-row:after,.w3-row:before,.w3-row-padding:after,.w3-row-padding:before,
.w3-cell-row:before,.w3-cell-row:after,.w3-clear:after,.w3-clear:before,.w3-bar:before,.w3-bar:after{content:"";display:table;clear:both}
.w3-container { margin-left: 30px; margin-right: 15px; border-radius: 20px; display: flex; align-items: flex-start; padding-bottom: 25px; padding-top: 5px; line-height: 1.5rem; font-size: 1.1rem; }
.w3-container-table { margin-left: 30px; margin-right: 15px; border-radius: 20px; text-align: center; padding-bottom: 25px; }
.w3-animate-top{position:relative;animation:animatetop 0.4s;}@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.w3-teal,.w3-hover-teal:hover{color:#fff!important;background-color:#009688!important}
.image-navega {margin: 0 10px 0 10px; cursor: pointer;} 
.pergunta-modal { font-family: 'Roboto Condensed', sans-serif; margin: 2px 0 2px 0; text-transform: uppercase; font-weight: bold; color: white; font-size: 1.5rem;}
.fechar-modal { cursor: pointer;    text-align: right; width: 100%; color: #6a6a6a !important;    align-items: center;    display: flex; justify-content: flex-end; font-weight: bold;  font-size: 0.9rem;     padding: 0.5rem 0.5rem 0 0; }
.cabeca { display: flex; justify-content: space-between; align-items: baseline;}
.w3-modal-content header {color: white; }
.titulo-modal-noticia { color: #154f25 !important;     font-size: 1.8rem !important;    font-weight: 600;    text-align: left;    border-bottom: 2px #86b794 solid;    line-height: 2.2rem;    margin-bottom: 1rem;    padding-bottom: 1rem;}

/*  MODAL VIDEO  */

/* Botão de abrir */

.btn-open-video {

    cursor: pointer;

}

.btn-open-video:hover,
.btn-open-video:focus {
} 


/* Estilos da Modal */
.modal {
    display: none; /* Escondida por padrão */
    position: fixed; /* Fica fixa na tela */
    z-index: 1000; /* Fica sobre outros conteúdos */
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto; /* Habilita scroll se necessário */
    background-color: rgba(0, 0, 0, 0.6); /* Fundo escuro semi-transparente */
    align-items: center; /* Centraliza verticalmente */
    justify-content: center; /* Centraliza horizontalmente */
    opacity: 0; /* Começa invisível para transição */
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0s linear 0.3s; /* Transição suave */
}

.modal.open {
    display: flex; /* Mostra a modal */
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s ease, visibility 0s linear 0s; /* Transição ao abrir */
}

/* Overlay para fechar ao clicar fora */
.modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer; /* Indica que é clicável */
}

/* Conteúdo da Modal */
.modal-content {
    position: relative; /* Necessário para o overlay e botão fechar */
    background-color: #fefefe;
    margin: auto; /* Centraliza (redundante com flex no .modal, mas seguro) */
    padding: 20px;
    border: 1px solid #888;
    width: 90%; /* Largura responsiva */
    max-width: 920px; /* Largura máxima */
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    border-radius: 8px;
    /* Animação (opcional) */
    animation-name: animatetop;
    animation-duration: 0.4s
}

/* Animação de entrada (opcional) */
@keyframes animatetop {
    from {top: -300px; opacity: 0}
    to {top: 0; opacity: 1}
}

/* Botão de Fechar (X) */
.close-btn {
    color: #aaa;
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 28px;
    font-weight: bold;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0 5px;
    line-height: 1;
}

.close-btn:hover,
.close-btn:focus {
    color: black;
    text-decoration: none;
    outline: 2px solid black; /* Estilo de foco visível */
    outline-offset: 1px;
}

/* Container responsivo para o vídeo */
.video-container {
    position: relative;
    padding-bottom: 56.25%; /* Proporção 16:9 (altura / largura * 100) */
    height: 0;
    overflow: hidden;
    margin-top: 15px; /* Espaço acima do vídeo */
    background-color: #000; /* Fundo preto enquanto carrega */
}

.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0; /* Remove borda do iframe */
}

/* Classe para esconder visualmente, mas manter para leitores de tela */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
