:root{
     --rosa-transparente:#f01a27ad;
}

#segmento-1 {padding: 94px 0;}
#segmento-1 .conteudo {display: flex; justify-content: space-between; gap: 30px;}
/* #segmento-1 .img img {width: 100%; height: 100%; object-fit: cover; border-radius: 20px; object-position: right;} */

#segmento-1 .images {max-width: 570px; width: 100%; display: flex; flex-direction: column; justify-content: center; min-width: 425px; gap: 31px;}
#segmento-1 .images .img {display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;}
#segmento-1 .images img {width: 100%; height: 100%; object-fit: cover; border-radius: 20px;}
/* #segmento-1 .images .img-main img {aspect-ratio: 570 / 393;} */
#segmento-1 .images .img-main {width: 100%; height: 100%;}
#segmento-1 .images .img-main img {width: 100%; height: 100%;}
#segmento-1 .images .thumbs {display: flex; gap: 31px;}
#segmento-1 .images .thumbs .img img {aspect-ratio: 269 / 245;}

#segmento-1 .info {max-width: 538px;}
#segmento-1 .texto {font: 400 15px / 2em var(--mont); color: var(--cinza); margin: 0 0 59px;}
#segmento-1 .titulo {font: 400 clamp(24px,4vw,32.15px) / 1.26em var(--futura); color: var(--cinza); margin-bottom: 46px; display: flex; flex-direction: column;}
#segmento-1 .titulo span {font: 400 17.12px / 1.26em var(--mont); color: var(--vermelho); margin: 0 0 9px 2px;}
#segmento-1 .titulo strong {font-weight: 700;}

#segmento-2 {padding: 0 0 101px;}

#segmento-2 .conteudo .card.card-01 {display: flex; width: calc((100% / 2) - 1%); cursor: auto; padding: 34px 33px 0 61px; order: 3;}
#segmento-2 .conteudo .card.card-02 {order: 1;}
#segmento-2 .conteudo .card.card-03 {order: 2;}
#segmento-2 .conteudo .card {order: 4;}
#segmento-2 .conteudo .card.card-01 .titulo {font: 400 clamp(24px,3.6vw,32.16px) / 1.27em var(--futura); color: var(--cinza); position: relative; margin-bottom: 14px; text-align: right;}
#segmento-2 .conteudo .card.card-01 .titulo strong {font-weight: 700;}
#segmento-2 .conteudo .card.card-01 .texto {font: 400 15px / 2em var(--mont); color: var(--cinza);}

#segmento-2 .conteudo .card.card-01 .titulo .icone { position: absolute; transform: translate(-5%, -60%); width: clamp(35px, 6vw, 75px); height: clamp(23px, 5vw, 63px);}
#segmento-2 .conteudo .card.card-01 .titulo .icone svg {width: 100%; height: 100%;}

#segmento-2 .conteudo {display: flex; flex-direction: row; flex-wrap: wrap; gap: 35px 2%;}
#segmento-2 .conteudo .card {width: calc((100% / 4) - 1.5%); display: flex; flex-direction: column; gap: 23px;cursor: pointer;}
#segmento-2 .conteudo .card .sub-titulo {font: 400 clamp(18px,2vw,20.11px) / 1.35em var(--futura); color: var(--cinza); text-align: center;}
#segmento-2 .conteudo .card .sub-titulo strong {font-weight: 700;}
#segmento-2 .conteudo .card .gp-img {width: 100%; height: auto; display: flex; justify-content: center; align-items: center; position: relative; overflow: hidden; border-radius: 20px;}
#segmento-2 .conteudo .card:hover .saiba-mais {transform: scale(1); opacity: 1;}
#segmento-2 .conteudo .card .saiba-mais {position: absolute; background: var(--branco); border-radius: 13px; padding: 15px 20px; font: 500 15px var(--mont); color: var(--vermelho); cursor: pointer; transition: 0.2s; transform: scale(0); opacity: 0;}
#segmento-2 .conteudo .card .saiba-mais:hover {transform: scale(1.06); box-shadow: 0 0 5px 2px #e2dbdb;}
#segmento-2 .conteudo .card .img {width: 100%; height: auto; display: flex; justify-content: center; align-items: center;}
#segmento-2 .conteudo .card .gp-img::before {content: ''; display: flex;width: 100%; height: 100%; position: absolute; background: var(--rosa-transparente); opacity: 0; transition: 0.2s;}
#segmento-2 .conteudo .card:hover .gp-img::before {opacity: 1;}
#segmento-2 .conteudo .card .img img {width: 100%; height: 100%; object-fit: cover;}

@media (max-width:1200px) {
     #segmento-2 .conteudo .card.card-01 { padding: 34px 33px 0 61px;}
}
@media (max-width:990px) {
     #segmento-1 {padding: 25px 0;}
     #segmento-1 .conteudo {flex-direction: column-reverse; justify-content: center; align-items: center; gap: 15px;}
     #segmento-1 .images {min-width: auto;}
     #segmento-1 .info {max-width: 100%;}

     #segmento-1 .texto {text-align: justify; hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; margin-bottom: 10px;}
     #segmento-1 .titulo {text-align: center; margin-bottom: 15px; font-size: var(--tt-mb);}

     .btn-whats {margin: 0 auto;}

     #segmento-1 .images {gap: 15px;}
     #segmento-1 .images .thumbs {gap: 3%;}

     #segmento-2 {padding: 0 0 25px;}
     #segmento-2 .conteudo {gap: 25px 2%;}
     #segmento-2 .conteudo .card {width: calc((100% / 3) - 1.34%); order: 1; gap: 10px;}
     #segmento-2 .conteudo .card.card-01 {order: 0; width: 100%; padding: 0; text-align: center; gap: 15px; justify-content: center; align-items: center;}
     #segmento-2 .conteudo .card.card-01 .titulo .icone {transform: translate(-55%, -60%);}
     #segmento-2 .conteudo .card.card-01 .titulo {text-align: center; margin: 0; width: fit-content; font-size: var(--tt-mb);}

     #segmento-2 .conteudo .card .sub-titulo {font-size: clamp(16px,2vw,18px)}
     
     
}
@media (max-width:750px) {
     #segmento-2 .conteudo {gap: 25px 3%;}
     #segmento-2 .conteudo .card {width: calc((100% / 2) - 1.5%);}
}

@media (max-width:520px) {
     #segmento-2 .conteudo .card.card-01 .titulo .icone {display: none;}
}

@media (max-width:350px) {
     #segmento-2 .conteudo .card {width: calc(100%);}
}