.container-avis, .form__wrap, .footer, .footer__ul {
    width: 100%;
}
/*Texte avis*/
.container-avis__p {
    font-size: clamp(16px, 1.3vw, 10000px);
    letter-spacing: 1px;
    margin: 0 clamp(5px, 4vw, 10000px) clamp(5px, 0.5vw, 10000px) 0;
    transition: transform 1.5s, opacity 1.5s;
    transform: translateX(150%);
    opacity: 0;
}

.container-avis__p.active {
    transform: translateX(0%);
    opacity: 1;
}

/*Formulaire*/
.form {
    position: relative;
    flex-direction: column;
    background-color: rgba(255, 255, 255, 0.8);
    padding: clamp(10px, 0.5vw, 10000px) clamp(20px, 1.5vw, 10000px);
    border-radius: 5px;
    margin-left: calc(50px + 5vw);
}

.form__label, .form__input--submit {
    font-size: clamp(11px, 0.9vw, 10000px);
}

.form__label {
    margin: clamp(10px, 1vw, 10000px) 0 clamp(2px, 0.2vw, 10000px);
}

#message {
    height: clamp(130px, 7vw, 10000px);
}

.form__input {
    border: clamp(2px, 0.2vw, 10000px) double var(--color-2);
    border-radius: clamp(5px, 0.5vw, 10000px);
    color: var(--text-color-4);
    padding: clamp(4px, 0.4vw, 10000px);
    box-shadow:
        -1px 1px 2px 1px #687ab3,
        1px -1px 2px 2px #e8eeff,
        inset 2px -2px 1px 0px #546db8,
        inset -2px 2px 2px 0px #ebf0ff;
    transition: 0.3s ease;
    width: clamp(320px, 35vw, 10000px);
}

.form__input:focus {
    background-color: #ffffff;
    color: var(--text-color-1);
    outline: 1px solid #6382dd;
    box-shadow:
        0 0 0 0 #ffffff,
        0 0 0 0 #ffffff,
        inset -3px 3px 9px 0px #3f5cb1,
        inset 3px -3px 5px #ffffff;
}

.form__submit {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%) translateY(130%);
}

.form__input--submit {
    background-color: var(--color-5);
    color: var(--text-color-2);
    transition: 0.5s;
    padding: clamp(5px, 0.6vw, 10000px) clamp(30px, 0.8vw, 10000px);;
    border: none;
    cursor: pointer;
    border-radius: 8px;
}

.form__input--submit:hover {
    background-color: #afc3ff;
}

.form__response {
    width: 100%;
    height: 50px;
    font-size: clamp(12px, 1.1vw, 100px);
    font-weight: bold;
}

.form__response span {
    opacity: 1;
    transition: opacity 0.5s ease, transform 0.5s ease;
    transform: translateY(0);
}

.form__response span.is-hidden {
    opacity: 0;
    transform: translateY(-6px);
}

.red {
    color: rgb(184, 0, 0);
}

.green {
    color: rgb(26, 189, 26);
}