.preto {color: var(--cinza3);}
.branco {color: var(--branco);}
.hide {display: none;}

.component.cuidando {padding: 90px 0 101px;}
.component.cuidando.branco {background-color: var(--branco);}
.component.cuidando.preto {background-color: var(--preto1);}
.component.cuidando .conteudo {display: flex; flex-direction: column;}
.component.cuidando .conteudo .titulos {display: flex; flex-direction: column; align-items: center; margin: 0 0 29px;}
.component.cuidando .conteudo .titulos .adv {font: 300 20px/24.57px garet; color: var(--cinza2); text-transform: uppercase; letter-spacing: 18%;}
.component.cuidando .conteudo .titulos .adv.marrom {color: var(--marrom1); text-align: center;}
.component.cuidando .conteudo .titulos .titulo {font: 500 41.33px/1.224 garet; text-align: center;}
.component.cuidando .conteudo .meio {display: flex; justify-content: space-between; gap: 50px;}
.component.cuidando .conteudo .meio .imagem {position: relative; max-width: 510px; width: 100%;}
.component.cuidando .conteudo .meio .imagem.inteiro {max-width: 499px; max-height: 618px;}
.component.cuidando .conteudo .meio .imagem .img {width: 100%; height: 100%; overflow: hidden; border-radius: 10px; display: flex;}
.component.cuidando .conteudo .meio .imagem .img img {width: 100%; height: 100%; object-fit: cover; display: flex;}
.component.cuidando .conteudo .meio .imagem .icone {position: absolute; top: 22px; right: -31px; border-radius: 10px; display: flex; width: 85px; height: 85px; align-items: center; justify-content: center;}
.component.cuidando .conteudo .meio .imagem .icone.bege {background: #F0BC6D; background: linear-gradient(135deg, #F0BC6D 0%, #D59940 100%);}
.component.cuidando .conteudo .meio .imagem .icone.preto {background-color: var(--preto2);}
.component.cuidando .conteudo .meio .textos {width: 100%; max-width: 585px; display: flex; flex-direction: column; padding: 32px 0 0;}
.component.cuidando .conteudo .meio .textos .nome {font: 500 32.32px/1.225 garet;}
.component.cuidando .conteudo .meio .textos .oab {font: 300 20px/1 garet; letter-spacing: 18%; color: var(--cinza2); margin: 6px 0 33px;}
.component.cuidando .conteudo .meio .textos .oab.marrom {color: #C88418;}
.component.cuidando .conteudo .meio .textos .texto {font: 400 15px/2.082 montserrat; hyphens: auto; -webkit-hyphens: auto; -moz-hyphens: auto; margin: 0 0 20px;}
.component.cuidando .conteudo .meio .textos .component.whatsapp {margin: auto 0 0 18px;}

.component.cuidando .conteudo .imgs {margin: 47px 0 0;}
.component.cuidando .conteudo .imgs .splide__slide {overflow: hidden; border-radius: 10px;}
.component.cuidando .conteudo .imgs .splide__slide .img {width: 100%; height: 100%;}
.component.cuidando .conteudo .imgs .splide__slide .img img {width: 100%; object-fit: cover;}

.component.cuidando .splide__arrow {background-color: var(--bege1); width: 30px; height: 30px; right: unset; left: unset; opacity: 1;}
.component.cuidando .splide__arrow--prev {left: 0; translate: -50% 0;}
.component.cuidando .splide__arrow--next {right: 0; translate: 50% 0;}

@media (max-width: 990px) {
    .component.cuidando {padding: 25px 0;}
    .component.cuidando .conteudo .titulos .adv {font-size: 17px;}
    .component.cuidando .conteudo .titulos .titulo {font-size: clamp(22px, 4.6vw, 28px);}
    .component.cuidando .conteudo .meio {flex-direction: column; gap: 20px;}
    .component.cuidando .conteudo .meio .imagem {max-width: 650px; max-height: 550px; height: 100%; margin: 0 auto;}
    .component.cuidando .conteudo .meio .imagem .img {max-height: 550px;}
    .component.cuidando .conteudo .meio .imagem .icone {display: none;}

    .component.cuidando .conteudo .meio .textos  {max-width: unset; padding: 0;}
    .component.cuidando .conteudo .meio .textos .oab {text-align: center; margin: 7px 0;}
    .component.cuidando .conteudo .meio .textos .nome {text-align: center; font-size: clamp(20px, 4.6vw, 28px);}
    .component.cuidando .conteudo .meio .textos .component.whatsapp {margin: 0 auto;}

    .component.cuidando .conteudo .imgs {margin: 0;}
}

@media (max-width: 600px) {
    .component.cuidando .conteudo .titulos {margin: 0 0 15px;}
    .component.cuidando .conteudo .meio .textos .oab {font-size: 16px;}

    .component.cuidando .splide {max-width: 450px; width: 100%; margin: 0 auto;}

}