@media screen and (min-width: 425px) and (max-width: 768px) {
.main__conteiner:has(.succes-content.hidden){
    --width:     calc(var(--index)*34);
    --height:    auto;
    --v-padding: 4rem;
    --h-padding: 4rem;
    --b-radius:  3.6rem;
}
.main__conteiner:has(.main-content.hidden){
    --width:     calc(var(--index)*28);
    --height:    auto;
    --v-padding: 6.4rem;
    --h-padding: 6.4rem;
    --b-radius:  3.6rem;
}
.main-content{
    --direction: column;
    --row-gap:     var(--spacing-500);
    --column-gap:  var(--spacing-0);
}
.succes-content{
    --width:        100%;
    --height:       100%;  
    --just-content: center; 
    --row-gap:     var(--spacing-400);
    --column-gap:  var(--spacing-0);
}
.img{
    max-height:    35.8rem;
}
.img img{
    max-height:    35.8rem;
    --top-left:    1.6rem;
    --top-right:   1.6rem;
    --bottom-right:1.6rem;
    --bottom-left: 1.6rem;
}
.content{
    --width:       100%;
    --row-gap:     var(--spacing-300);
    --column-gap:  var(--spacing-0);
}
.content__text{
    --row-gap:     var(--spacing-300);
    --column-gap:  var(--spacing-0);
}
.form{
    --row-gap:     var(--spacing-200);
    --column-gap:  var(--spacing-0);
}
}