.how-it-works {
    background: #212529;
    color: #dee2e6;
    padding-top: clamp(140px, 11vw, 160px);
}

.how-it-works h2 {
    font-family: 'Playfair Display', serif;
}

.subtitle {
    color: #b5b5b5;
    max-width: 600px;
    margin: 30px auto;
}

@media (max-width: 768px) {
    .how-it-works .subtitle {
        margin: 20px auto; /* un peu moins d’espace sur mobile */
        padding: 0 15px;   /* évite que le texte touche les bords */
    }
}

.step i {
    font-size: 2rem;
    margin-bottom: 15px;

    background: linear-gradient(135deg, #fff4b0, #d4af37);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.step h5 {
    margin-top: 10px;
    font-weight: 500;
}

.step p {
    font-size: 0.9rem;
    color: #b5b5b5;
}

.section-title-line {
    display: inline-block;

    padding: 10px 25px;
    margin: 0 auto 40px;

    font-family: 'Playfair Display', serif;
    font-size: 1.8rem;
    letter-spacing: 2px;
    text-transform: uppercase;

    border: 1.5px solid #e6c35c;
    border-radius: 50px;

    color: #ffffff; /* 🔥 texte blanc */
    text-align: center;
}


@media (max-width: 768px) {

    .section-title-line {
        font-size: 1.2rem;
        padding: 8px 18px;
        letter-spacing: 1px;
    }
}