/*
 * sobre-nos.css
 * 
 * Autor: (WSC TI) wscti.dev.br
 * Atualizado em 15/10/2026 às 09h20
 * 
 */
.secao-principal {min-height: 900px; padding-bottom: 32px; border-top: 3px solid rgba(15, 39, 71, 1); background-color: rgba(245, 246, 248, 1);}

h1 {font-size: 64px; margin-top: 64px; color: rgba(15, 39, 71, 1);}
h6 {font-size: 19px; margin-top: 32px; color: rgba(114, 114, 114, 1);}

.conteudo {min-height: 900px; margin-top: 32px; margin-bottom: 32px; padding: 32px 48px 32px 48px; background: #FFFFFF; box-shadow: 0 0 13px 3px rgba(0, 0, 0, 0.1); border-radius: 12px;}
.enunciado {width: 692px; font-size: 19px; color: rgba(114, 114, 114, 1); line-height: 27px;}

.quem-somos-titulo {margin-top: 16px; margin-bottom: 48px; font-size: 32px; color: rgba(15, 39, 71, 1);}
.quem-somos-linha {position: absolute; margin-top: 72px; width: 106px; height: 3px; border: 2px solid rgba(15, 39, 71, 1) !important; border-radius: 0 0 6px 6px; color: rgba(15, 39, 71, 1); background-color: rgba(15, 39, 71, 1);}
.quem-somos-enunciado {font-size: 16px; color: rgba(114, 114, 114, 1); line-height: 27px;}

.apresentacao {margin-top: 24px; font-size: 19px; color: rgba(15, 39, 71, 1); text-align: justify; line-height: 27px;}

.apresentacao-tab {padding: 64px 96px 64px 96px;}

.apresentacao-triade {height: 194px; border: 1px solid rgba(194, 194, 194, 1); border-radius: 10px; padding-top: 28px;}
.apresentacao-triade-icone {width: 62px; height: 65px; border-radius: 50%; background-color: rgba(15, 39, 71, 1); color: #fff; display: flex; align-items: center; text-align: center;}
.apresentacao-triade-icone svg {margin-left: 17px;}
.apresentacao-triade-numero {font-size: 49px; color: rgba(15, 39, 71, 1); line-height: 49px;}
.apresentacao-triade-experiencia {font-size: 20px; color: rgba(15, 39, 71, 1);}
.apresentacao-triade-texto {font-size: 14px; color: rgba(15, 39, 71, 1); line-height: 22px; margin-top: 8px;}
.apresentacao-triade-tipo {font-size: 20px; color: rgba(15, 39, 71, 1); line-height: 22px; padding-top: 16px; padding-bottom: 16px;}
.apresentacao-triade-foco {font-size: 20px; color: rgba(15, 39, 71, 1); line-height: 22px; padding-top: 16px; padding-bottom: 16px;}

.esg-subtitulo {width: 380px; text-align: center; font-size: 19px; color: rgba(114, 114, 114, 1); margin-top: 12px; margin-bottom: 64px;}
.esg-tab {padding: 42px;}

.tab-content-esg {font-size: 20px; line-height: 39px; color: rgba(118, 118, 119, 1); text-align: justify; margin-top: 56px;}

.destinacao {padding-left: 42px; padding-right: 42px; margin-top: 16px; margin-bottom: 16px;}
.destinacao-caixa {height: 180px; border-radius: 10px; border: 1px solid rgba(255, 106, 0, 1); background-color: rgba(255, 243, 221, 1);}
.destinacao-titulo {font-size: 24px; color: rgba(15, 39, 71, 1);}
.destinacao-texto {font-size: 16px; color: rgba(15, 39, 71, 1); text-align: justify; line-height: 22px; margin-top: 8px;}
.destinacao-imagem {width: 100%; height: 178px; object-fit: cover; border-radius: 0 8px 8px 0;}
.destinacao-gradiente {position: absolute; width: 260px; height: 178px; margin-top: -178px; margin-left: 0; background: linear-gradient(90deg, #FFF3DD 16%, rgba(255, 243, 221, 0) 100%); border-radius: 0 10px 10px 0;}

.tabs-container {display: flex; flex-wrap: wrap;}
.tab-input {display: none;}
.tab-label {width: 33%; padding: 10px 20px; cursor: pointer; transition: color 0.3s; line-height: 64px;}
.tab-label:hover {text-decoration: underline; text-underline-offset: 12px; text-decoration-thickness: 4px; color: #6B7280 !important;}
.tab-label-mvv {font-size: 32px; color: rgba(15, 39, 71, 1) !important;}
.tab-label-ambiental {font-size: 32px; color: rgba(52, 199, 89, 1) !important;}
.tab-label-ambiental:hover {text-decoration: underline; text-underline-offset: 16px; text-decoration-thickness: 6px; color: rgba(52, 199, 89, 1) !important;}
.tab-label-social {font-size: 32px; color: rgba(255, 98, 0, 1) !important;}
.tab-label-social:hover {text-decoration: underline; text-underline-offset: 16px; text-decoration-thickness: 6px; color: rgba(255, 98, 0, 1) !important;}
.tab-label-governamental {font-size: 32px; color: rgba(5, 109, 249, 1) !important;}
.tab-label-governamental:hover {text-decoration: underline; text-underline-offset: 16px; text-decoration-thickness: 6px; color: rgba(5, 109, 249, 1) !important;}
.tab-linha {height: 2px; border-top: 1px solid rgba(224, 224, 224, 1); width: 100%;}
.tab-content {width: 100%; order: 1; display: none; box-sizing: border-box;}
.tab-content-nvv {font-size: 20px; line-height: 30px; color: rgba(15, 39, 71, 1) !important; text-align: justify; padding: 22px;}
.tab-input:checked + .tab-label {background: #fff; border-bottom: 1px solid #fff; margin-bottom: -1px; text-decoration: underline; text-underline-offset: 12px; text-decoration-thickness: 4px;}
.tab-input:checked + .tab-label-ambiental {text-underline-offset: 16px; text-decoration-thickness: 6px;}
.tab-input:checked + .tab-label-social {text-underline-offset: 16px; text-decoration-thickness: 6px;}
.tab-input:checked + .tab-label-governamental {text-underline-offset: 16px; text-decoration-thickness: 6px;}
#tab1:checked ~ .content1,
#tab2:checked ~ .content2,
#tab3:checked ~ .content3,
#tab4:checked ~ .content4,
#tab5:checked ~ .content5,
#tab6:checked ~ .content6 {display: block;}

@media (max-width: 640px) {
    .secao-principal {min-height: 900px; padding-bottom: 32px; border-top: none; background-color: #ffffff;}

    h1 {font-size: 28px; margin-top: 16px; color: rgba(15, 39, 71, 1);}
    h6 {font-size: 9px; margin-top: 8px; color: rgba(114, 114, 114, 1);}

    .conteudo {min-height: 200px; margin-top: 24px; margin-bottom: 16px; padding: 16px; background: #FFFFFF; box-shadow: 0 0 6px 1.5px rgba(0, 0, 0, 0.1); border-radius: 6px;}
    .enunciado {width: 100%; font-size: 9px; color: rgba(114, 114, 114, 1); line-height: 11px; text-align: justify;}

    .quem-somos-titulo {margin-top: 12px; margin-bottom: 12px; font-size: 8px; color: rgba(15, 39, 71, 1);}
    .quem-somos-linha {position: absolute; margin-top: 28px; width: 28px; height: 2px; border: 1px solid rgba(15, 39, 71, 1) !important; border-radius: 0 0 3px 3px; color: rgba(15, 39, 71, 1); background-color: rgba(15, 39, 71, 1);}
    .quem-somos-enunciado {font-size: 5px; color: rgba(114, 114, 114, 1); line-height: 7px;}

    .apresentacao {margin-top: 16px; font-size: 5px; color: rgba(15, 39, 71, 1); text-align: justify; line-height: 7px;}

    .apresentacao-tab {padding: 12px;}

    .tab-label {width: 33%; padding: 10px 20px; cursor: pointer; transition: color 0.3s; line-height: 16px;}
    .tab-label-mvv {font-size: 7px; color: rgba(15, 39, 71, 1) !important;}
    .tab-content-nvv {font-size: 5px; line-height: 7px; color: rgba(15, 39, 71, 1) !important; text-align: justify; padding: 22px;}

    .apresentacao-triade {height: 50px; border: 1px solid rgba(194, 194, 194, 1); border-radius: 4px; padding-top: 4px;}
    .apresentacao-triade-icone {width: 16px; height: 16px; border-radius: 50%; background-color: rgba(15, 39, 71, 1); color: #fff; display: flex; align-items: center; text-align: center;}
    .apresentacao-triade-icone svg {width: 8px; margin-left: 4px;}
    .apresentacao-triade-icones {width: 16px; height: 16px; display: flex; align-items: center; text-align: center; margin-top: 4px;}
    .apresentacao-triade-numero {font-size: 12px; color: rgba(15, 39, 71, 1); line-height: 17px;}
    .apresentacao-triade-experiencia {font-size: 5px; color: rgba(15, 39, 71, 1); line-height: 7px;}
    .apresentacao-triade-texto {font-size: 4px; color: rgba(15, 39, 71, 1); line-height: 6px; margin-top: 4px; width: 100% !important;}
    .apresentacao-triade-tipo-svg {width: 16px;}
    .apresentacao-triade-tipo {font-size: 5px; color: rgba(15, 39, 71, 1); line-height: 7px; padding-top: 2px; padding-bottom: 2px;}
    .apresentacao-triade-foco-svg {width: 16px;}
    .apresentacao-triade-foco {font-size: 4px; color: rgba(15, 39, 71, 1); line-height: 6px; padding-top: 2px; padding-bottom: 2px;}

    .esg-subtitulo {width: 36%; text-align: center; font-size: 5px; line-height: 7px; color: rgba(114, 114, 114, 1); margin-top: 12px; margin-bottom: 16px;}
    .esg-tab {padding: 12px;}
    .esg-icone {width: 10px;}

    .tab-label-ambiental {font-size: 7px; color: rgba(52, 199, 89, 1) !important;}
    .tab-label-ambiental:hover {text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; color: rgba(52, 199, 89, 1) !important;}
    .tab-label-social {font-size: 7px; color: rgba(255, 98, 0, 1) !important;}
    .tab-label-social:hover {text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; color: rgba(255, 98, 0, 1) !important;}
    .tab-label-governamental {font-size: 7px; color: rgba(5, 109, 249, 1) !important;}
    .tab-label-governamental:hover {text-decoration: underline; text-underline-offset: 6px; text-decoration-thickness: 2px; color: rgba(5, 109, 249, 1) !important;}
    .tab-input:checked + .tab-label-ambiental {text-underline-offset: 6px; text-decoration-thickness: 2px;}
    .tab-input:checked + .tab-label-social {text-underline-offset: 6px; text-decoration-thickness: 2px;}
    .tab-input:checked + .tab-label-governamental {text-underline-offset: 6px; text-decoration-thickness: 2px;}

    .tab-content-esg {font-size: 5px; line-height: 9px; color: rgba(118, 118, 119, 1); text-align: justify; margin-top: 16px;}

    .destinacao {padding-left: 8px; padding-right: 8px; margin-top: 8px; margin-bottom: 8px;}
    .destinacao-caixa {height: 48px; border-radius: 10px; border: 1px solid rgba(255, 106, 0, 1); background-color: rgba(255, 243, 221, 1);}
    .destinacao-caixa-svg {width: 18px; height: 18px; margin-top: 14px; margin-left: 10px;}
    .destinacao-titulo {font-size: 6px; color: rgba(15, 39, 71, 1); margin-top: 6px;}
    .destinacao-texto {font-size: 4px; color: rgba(15, 39, 71, 1); text-align: justify; line-height: 5px; margin-top: 4px;}
    .destinacao-imagem {width: 100%; height: 46px; object-fit: cover; border-radius: 0 8px 8px 0;}
    .destinacao-gradiente {position: absolute; width: 50px; height: 46px; margin-top: -46px; margin-left: 0; background: linear-gradient(90deg, #FFF3DD 16%, rgba(255, 243, 221, 0) 100%); border-radius: 0 10px 10px 0;}
}
