/***************************************************************
Présentation et étapes
***************************************************************/

.about {
    display: grid;
    gap: 80px;
    padding-bottom: 60px;
    padding-top: 65px;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    align-items: start;
}

.about p {
    color: var(--muted);
}

.steps>div {
    display: flex;
    gap: 20px;
    margin-bottom: 24px;
    align-items: flex-start;
}

.steps>div>span {
    background: var(--surface);
    min-width: 45px;
    height: 45px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-weight: 700;
    color: var(--pink-strong);
    flex: 0 0 45px;
}

.steps h3 {
    font-size: 20px;
    margin-top: 3px;
}

.steps p {
    margin: 0;
}

.about .steps {
    padding-top: 34px;
}

.steps>div>div {
    min-width: 0;
}

/***************************************************************
Adaptations : @media(max-width:1000px)
***************************************************************/

@media(max-width:1000px) {
    .about {
        gap: 35px;
    }

}

/***************************************************************
Adaptations : @media(max-width:720px)
***************************************************************/

@media(max-width:720px) {
    .about {
        gap: 25px;
        padding-bottom: 35px;
        grid-template-columns: 1fr;
    }

    .about .steps {
        padding-top: 0;
    }

}