/* Banner */
section#banner {
    width: 100%;
}
section#banner .image {
    position: relative;
    display: block;
    width: 100%;
    text-decoration: none;
}
section#banner .image::after {
    content: '';
    display: block;
    width: 100%;
    padding-bottom: 33.33333333333333%;
}
section#banner .image img {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;

    -o-object-fit: cover;
    object-fit: cover;
}



/* Tarja Especialidades */
section#tarja-especialidades {
    width: 100%;
    height: auto;
    
    padding: 50px 0;
    background-color: #29A8E0;
}
section#tarja-especialidades h2.section-title {
    color: #FFF;
    font-size: 48px;
    font-style: normal;
    font-weight: 900;
    line-height: 125%; /* 60px */
    letter-spacing: -1.2px;
    text-align: center;
    margin: 0;
}

/* Especialidades */
section#especialidades {
    margin: 100px 0 0 0;
}
section#especialidades h2.section-title {
    color: #16324B;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-align: center;
    margin: 0 0 30px 0;
}
section#especialidades p.section-desc {
    max-width: 1090px;

    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-align: center;
    margin: 0 auto;
}
section#especialidades nav.nav-atuacoes ul {
    display: flex;
    justify-content: space-between;
    
    list-style: none;
    padding: 0;
    margin: 0;
}
section#especialidades nav.nav-atuacoes ul li {
    position: relative;
    width: 100%;
    height: fit-content;
    
    padding: 50px 25px;
    background: #16324B;
    border-radius: 20px 20px 0px 0px;
    
    margin-top: auto;
}
section#especialidades nav.nav-atuacoes ul li::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    content: '';
    display: block;
    width: 100%;
    height: 100%;

    border-radius: 20px 20px 0px 0px;

    -webkit-transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -ms-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}
section#especialidades nav.nav-atuacoes ul li[data-status="hover"]::before {
    box-shadow: -7px 0 15px 0px rgba(0, 0, 0, 0.25);
}
section#especialidades nav.nav-atuacoes ul li[data-status="hover"] {
    box-shadow: 7px 0px 15px 0px rgba(0, 0, 0, 0.25);
    z-index: 2;
}

section#especialidades nav.nav-atuacoes ul li h4 {
    color: #29A8E0;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 0.194px;
    text-align: center;
    margin: 0;

    -webkit-transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -ms-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}
section#especialidades nav.nav-atuacoes ul li[data-status="hover"] h4 {
    color: #fff;
}
section#especialidades nav.nav-atuacoes ul li p {
    color: #FFF;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.129px;
    text-align: center;
    margin: 20px 0 0 0;

    -webkit-transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -ms-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}
section#especialidades nav.nav-atuacoes ul li[data-status="closed"] p {
    transform: translateY(50px);
    opacity: 0;
}

section#especialidades .atuacao-content {
    display: flex;
    justify-content: center;

    background-color: #16324B;
}
section#especialidades .atuacao-content-item {
    position: relative;
    height: 630px;

    

    -webkit-transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -ms-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}
section#especialidades .atuacao-content-item[data-status="hover"] {
    position: relative;
    z-index: 2;
    box-shadow: 11px 0 4px 0px rgba(0, 0, 0, 0.25);
}
section#especialidades .atuacao-content-item::before {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    content: '';
    display: block;
    width: 100%;
    height: 100%;

    -webkit-transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -ms-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}
section#especialidades .atuacao-content-item[data-status="hover"]::before {
    box-shadow: -11px 0 4px 0px rgba(0, 0, 0, 0.25);
}
section#especialidades:has(.atuacao-content-item[data-status="hover"]) 
.atuacao-content-item[data-status="closed"] {
    opacity: 0.3;
    filter: grayscale(1);
}

section#especialidades .atuacao-content-item {
    opacity: 1;
    filter: blur(0);
}

section#especialidades .atuacao-content-item .image {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;

    overflow: hidden;
}
section#especialidades .atuacao-content-item img {
    width: 100%;
    height: 100%;
    
    -o-object-fit: cover;
    object-fit: cover;

    -webkit-transition: all .25s ease-in-out!important;
    -moz-transition: all .25s ease-in-out!important;
    -ms-transition: all .25s ease-in-out!important;
    -o-transition: all .25s ease-in-out!important;
    transition: all .25s ease-in-out!important;
}
section#especialidades .atuacao-content-item[data-status="hover"] img {
    position: relative;
    z-index: 2;
    transform: scale(1.15);
}




/* Responsabilidade */
section#responsabilidade {
    padding: 200px 0;
    background: #283847;    
}
section#responsabilidade h2.section-title {
    color: #FFF;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin: 0 0 30px 0;
}
section#responsabilidade p.section-desc {
    color: #FFF;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin: 0;
}
section#responsabilidade .responsabilidades {
    display: flex;
    justify-content: flex-end;
    gap: 50px;
}
section#responsabilidade .responsabilidade .image {
    position: relative;
    width: 275px;
    height: 275px;
    
    margin: 0 0 90px 0;
}
section#responsabilidade .responsabilidade .image svg.circle {
    position: absolute;
    display: block;
    fill: rgb(41, 168, 224);
    top: -40px;
    left: -40px;
    width: calc(100% + 80px);
    height: calc(100% + 80px);
    transform: rotate(-45deg);
    opacity: 0;
    z-index: 1;
    
    -webkit-transition: all .25s ease-in-out;
    -moz-transition: all .25s ease-in-out;
    -ms-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}
section#responsabilidade .responsabilidade:hover .image svg.circle {
    opacity: 1;
    transform: rotate(0deg);
}
section#responsabilidade .responsabilidade .image img {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    
    -o-object-fit: cover;
    object-fit: cover;

    border-radius: 300px;
}
section#responsabilidade .responsabilidade h4 {
    color: #29A8E0;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-align: center;
    margin: 0;
}  
@media (max-width: 1200px) {
    section#responsabilidade {
        padding: 100px 0;
    }
    section#responsabilidade .responsabilidades {
        justify-content: flex-start;
        gap: 100px;
        margin-top: 50px;
    }
    section#responsabilidade .responsabilidade .image {
        margin: 0 0 60px 0;
    }
}




/* Mosaico */
section#mosaicos {
    margin: 100px 0;
}
section#mosaicos .mosaico {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
}
section#mosaicos .mosaico .image {
    position: relative;
    width: 50%;
}
section#mosaicos .mosaico .image img {
    width: 100%;
    height: 100%;

    -o-object-fit: cover;
    object-fit: cover;
}
section#mosaicos .mosaico .content {
    display: flex;
    flex-direction: column;
    justify-content: center;

    width: 50%;
    max-width: 590px;
    padding: 75px;
}
section#mosaicos .mosaico .content:nth-child(odd) {
    margin-left: auto;
}
section#mosaicos .mosaico .content h2 {
    color: #16324B;
    font-size: 32px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin: 0 0 20px 0;
}
section#mosaicos .mosaico .content p {
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin: 0;
}
section#mosaicos .mosaico .content ul {
    list-style: none;
    padding: 0;
    margin: 50px 0 0 0;
}
section#mosaicos .mosaico .content ul li:not(:last-child) {
    margin: 0 0 30px 0;
}
section#mosaicos .mosaico .content ul li h4 {
    color: #29A8E0;
    font-size: 18px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin: 0 0 10px 0;
}
section#mosaicos .mosaico .content ul li p {
    color: #6A6A6A;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.14px;
    margin: 0;
}




/* Responsivo */
@media (max-width: 992px) {
    /* Banner */
    section#banner .image::after {
        padding-bottom: 100%;
    }

    /* Tarja Especialidades */
    section#tarja-especialidades {
        padding: 30px 0;
    }
    section#tarja-especialidades h2.section-title {
        font-size: 32px;
        line-height: normal;
        margin-top: 5px;
    }

    /* Especialidades */
    section#especialidades {
        margin: 50px 0;
    }
    
    /* Esconder versão desktop */
    section#especialidades .desktop-atuacoes,
    section#especialidades .desktop-atuacao-content {
        display: none;
    }
    
    /* Exibir versão mobile */
    section#especialidades .mobile-atuacoes {
        display: block;
        margin-top: 50px;
    }
    
    section#especialidades .mobile-atuacao-item {
        margin-bottom: 30px;
    }
    
    section#especialidades .mobile-atuacao-item .nav-atuacoes ul {
        display: block;
    }
    
    section#especialidades .mobile-atuacao-item .nav-atuacoes ul li {
        width: 100%;
        padding: 30px;
        transform: none !important;
    }
    
    section#especialidades .mobile-atuacao-item .nav-atuacoes ul li p {
        opacity: 1;
        transform: none !important;
        margin: 10px 0 0 0;
    }
    
    section#especialidades .mobile-atuacao-item .atuacao-content-item {
        width: 100% !important;
        height: 300px;
    }
    section#especialidades .atuacao-content-item .image {
        background-color: #F0F0F0;
    }
    section#especialidades .atuacao-content-item .image,
    section#especialidades .atuacao-content-item .image img {
        border-radius: 0 0 20px 20px;
        overflow: hidden;
    }



    /* Responsabilidade */
    section#responsabilidade {
        padding: 50px 0;
    }
    section#responsabilidade .responsabilidades {
        justify-content: center;
        gap: 0;
        margin-top: 80px;
    }
    section#responsabilidade .responsabilidade {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        width: 100%;
    }
    section#responsabilidade .responsabilidade .image {
        width: calc(100% - 50px);
        height: auto;
        margin-bottom: 30px;
    }
    section#responsabilidade .responsabilidade .image::after {
        content: '';
        display: block;
        width: 100%;
        padding-bottom: 100%;
    }
    section#responsabilidade .responsabilidade .image svg.circle {
        top: -20px;
        left: -20px;
        width: calc(100% + 40px);
        height: calc(100% + 40px);
        opacity: 1;
    }



    /* Mosaico */
    section#mosaicos .mosaico {
        flex-wrap: wrap;
        padding: 0;
    }
    section#mosaicos .mosaico .image {
        width: 100%;
        order: 0;
    }
    section#mosaicos .mosaico .content {
        order: 1;
        width: 100%;
        max-width: none;

        padding: 30px;
    }
    section#mosaicos .mosaico .content h2 {
        font-size: 26px;
    }
}

@media (min-width: 993px) {
    section#especialidades .mobile-atuacoes {
        display: none;
    }
}