/* ==========================================================================
   Page « album photo de mariage » (templates/pages/album_photo_mariage.html.twig)
   La page reprend la mise en page de l'accueil (classes .accueil de app.css) ;
   ce fichier ne contient que le texte de présentation placé sous le formulaire.
   ========================================================================== */

.mariage__contenu {
    display: grid;
    grid-column: 1 / -1;
    gap: 40px;
}

.mariage__texte {
    max-width: 60ch;
    margin: 0 0 16px;
    color: var(--gris);
}

.mariage__bouton {
    width: auto;
    max-width: 100%;
}

.mariage__sous-titre {
    margin: 0 0 16px;
    font-size: clamp(1.4rem, 4vw, 1.9rem);
    font-weight: 800;
    line-height: 1.15;
}

.mariage__etapes {
    display: grid;
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.mariage__etape p {
    margin: 0;
    color: var(--gris);
}

.mariage__etape-titre {
    margin: 0 0 8px;
    font-size: 1.15rem;
    font-weight: 800;
}

.mariage__liste {
    max-width: 60ch;
    margin: 0;
    padding-left: 22px;
    color: var(--gris);
}

.mariage__liste li {
    margin-bottom: 8px;
}

.mariage__question {
    margin: 22px 0 6px;
    font-size: 1.1rem;
    font-weight: 800;
}

.mariage__question + p {
    max-width: 60ch;
    margin: 0;
    color: var(--gris);
}

@media (min-width: 720px) {
    .mariage__etapes {
        grid-template-columns: repeat(3, 1fr);
    }
}