.faq-container {padding: 82px 0 93px;}
.faq-container ul {display: flex; flex-direction: column;}
.faq-container .titulo {font: 400 45.15px / 1.2em var(--futura); color: var(--cinza); text-align: center; margin-bottom: 36px; display: flex; flex-direction: column; justify-content: center; align-items: center;}
.faq-container .sob-titulo {font: 400 17.12px var(--mont); color: var(--vermelho); text-align: center; width: fit-content; letter-spacing: 3.510px; margin-bottom: 9px;}
.faq-container .pergunta {font: 400 30.3px / 1.2em var(--futura); color: var(--cinza); display: block;}

.faq-container h3, .faq-container h4, .faq-container h5, .faq-container h6 {font: 700 16px / 2 var(--mont); color: var(--branco);}

.faq-container summary {display: flex; gap: 20px; cursor: pointer; align-items: center; padding: 12px 12px 12px 30px; border-radius: 10px; border: 3px solid var(--cinza-2);  justify-content: space-between; transition: 0.3s;}
.faq-container summary:hover {background: #f3e5e5;}
.faq-container .icone-sumary {width: 100%; display: flex; justify-content: center; align-items: center; transition: 0.3s; padding: 16px 19px; border-radius: 10px; background: var(--vermelho); max-width: 50px; }
.faq-container .icone-sumary svg {width: 9px; height: 16px;}
.faq-container .icone-sumary svg path {fill: var(--branco);}
.faq-container .resposta {display: none;}
.faq-container details {display: flex; flex-direction: column; gap: 25px;}
.faq-container details p {font: 400 15px / 2em var(--mont); color: var(--cinza); padding: 0 21px 36px;}
.faq-container details:open .icone-sumary {transform: rotate(90deg); background: var(--branco);}
.faq-container details:open .icone-sumary svg path {fill: var(--azul);}
.faq-container details:open summary {background: var(--vermelho); border-color: var(--vermelho);}
.faq-container details:open .pergunta {color: var(--branco);}
.faq-container details:open .resposta {display: unset;}


@media(max-width:990px){
     .faq-container {padding: 25px 0 15px;}

     .faq-container .titulo {font-size: clamp(20px,4vw,37px); margin-bottom: 15px;}
     .faq-container .sob-titulo {margin-bottom: 5px; font-size: 14px;}

     .faq-container ul {gap: 10px;}
     .faq-container .pergunta {font-size:clamp(18px, 4vw, 28.3px);}
     .faq-container details {gap: 15px;}
     .faq-container details p,
     .faq-container details:open .resposta {text-align: justify; hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; text-justify: inter-word; padding: 0 15px 10px;}
     .faq-container summary {gap: 12px; padding: 15px;}
     .faq-container .icone-sumary {min-width: 35px; max-width: 35px; width: 100%; padding: 5px; height: 35px;}
}