/* ── Apéro Express – Écran Menu (grille de catégories) ───────────────────── */

.aez-menu-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-top: 16px;
}

.aez-menu-card {
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(193, 80, 46, 0.18);
    border-radius: 16px;
    background: #ffffff;
    overflow: hidden;
    text-decoration: none;
    min-height: 210px;
}

.aez-menu-card__vignette {
    display: block;
    height: 130px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.aez-menu-card__nom {
    margin: 14px 14px 2px;
    font-family: 'Fraunces', Georgia, serif;
    font-weight: 700;
    font-size: 1.15em;
    color: #3D2C22;
}

.aez-menu-card__compte {
    margin: 0 14px 14px;
    color: #7A8B6F;
    font-size: 0.86em;
}

/* Desktop : grille fluide (2→3→4+ colonnes) au lieu de rester figée à 2
   colonnes dans la colonne 680px partagée avec les pages "formulaire"
   (aez-page-content) — ce fichier n'est chargé que sur /menu/, donc cette
   règle ne touche aucune autre page. */
@media (min-width: 700px) {
    /* !important : évite de dépendre de l'ordre d'enqueue entre aez-layout.css
       (max-width:680px générique) et ce fichier — voir la note sur les bugs
       de cascade récurrents dans project_apero_theme_and_brand.md. */
    .aez-page-content {
        max-width: 1100px !important;
    }

    .aez-menu-grid {
        grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
        gap: 20px;
    }
}