/* ============================================================
   Life'Scape — Avis escapegame.fr sur les pages salles
   ============================================================
   Couleurs reprises telles quelles du site, jamais inventées :
     #DEDBC3  parchemin, le fond de page (global.css, body)
     #f5f3eb  crème, le fond des blocs de la page réservation
     #483c3c  brun du texte
     #C19A59  or des chiffres
   ============================================================ */

.eg-avis {
    /* Exactement le parchemin de la page : la section ne se détache plus, elle
       s'y fond. Le fond clair précédent (#f4f2e3) créait une bande froide,
       visiblement rapportée sous le reste de la page. */
    padding: 70px 0;
    background: #DEDBC3;
    position: relative;
    overflow: hidden;
}

/* Voile de fumée : sans lui, un aplat de parchemin sur toute la largeur paraît
   plat.

   Le masque dégradé est INDISPENSABLE. La fumée assombrit le fond (mesuré :
   222,219,195 -> 209,203,181), et `overflow: hidden` la tranchait net au bord
   de la section : il en résultait une ligne horizontale franche, exactement la
   démarcation que ce fond commun devait supprimer. Le masque la fait naître et
   mourir dans le vide, si bien qu'aucune arête ne subsiste.

   L'opacité est aussi abaissée : à 0.07 l'écart de teinte se voyait à l'œil
   nu, alors qu'on ne cherche qu'à suggérer une matière. */
.eg-avis__fumee {
    position: absolute;
    /* Le calque épouse EXACTEMENT la section (0 / 100%), et non un cadre plus
       grand : sinon `overflow: hidden` le coupe alors que son masque n'a pas
       fini son fondu, et il reste une marche de teinte au bord — mesurée à 3
       unités, encore perceptible. Calé ainsi, c'est le masque seul qui décide,
       et il commence comme il finit : à zéro. */
    top: 0;
    left: -25%;
    width: 150%;
    height: 100%;
    background-image: url('../images/general/smoke-2-6.webp');
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    opacity: 0.05;
    pointer-events: none;
    z-index: 0;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 30%, #000 70%, transparent 100%);
    mask-image: linear-gradient(to bottom, transparent 0%, #000 30%, #000 70%, transparent 100%);
}

.eg-avis .container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    position: relative;
    z-index: 1;
}

/* --- En-tête : source à gauche, chiffres globaux à droite --- */

.eg-avis__entete {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
    padding-bottom: 30px;
    margin-bottom: 35px;
    border-bottom: 1px solid rgba(72, 60, 60, 0.15);
}

.eg-avis__source {
    display: flex;
    align-items: center;
    gap: 18px;
}

/* Le logo du partenaire reste discret : il crédite la source, il ne doit pas
   concurrencer le titre de la section. Coins arrondis et fond blanc pour que
   le JPEG ne fasse pas tache sur le parchemin. */
.eg-avis__logo {
    width: 72px;
    height: auto;
    border-radius: 12px;
    background: #fff;
    padding: 4px;
    box-shadow: 0 2px 10px rgba(72, 60, 60, 0.12);
    flex-shrink: 0;
}

.eg-avis__titre {
    font-family: Gelasio, serif;
    font-size: 32px;
    color: #483c3c;
    margin: 0 0 4px 0;
    line-height: 1.2;
}

.eg-avis__soustitre {
    font-family: 'Work Sans', sans-serif;
    font-size: 15px;
    color: #6b5c5c;
    margin: 0;
    line-height: 1.5;
}

.eg-avis__soustitre a {
    color: #483c3c;
    text-decoration: underline;
}

.eg-avis__soustitre a:hover {
    color: #C19A59;
}

/* --- Chiffres globaux --- */

.eg-avis__chiffres {
    display: flex;
    gap: 38px;
}

.eg-avis__chiffre {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.eg-avis__valeur {
    font-family: Gelasio, serif;
    font-size: 40px;
    font-weight: 700;
    color: #C19A59;
    line-height: 1;
}

.eg-avis__valeur small {
    font-size: 20px;
    font-weight: 400;
}

.eg-avis__label {
    font-family: 'Work Sans', sans-serif;
    font-size: 13px;
    color: #6b5c5c;
    margin-top: 6px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* --- Liste d'avis --- */

.eg-avis__liste {
    list-style: none;
    margin: 0;
    padding: 0;
    columns: 2;
    column-gap: 28px;
}

/* Crème et ombre identiques aux blocs de la page réservation
   (.booking-info-block) : les cartes appartiennent visiblement à la même
   famille, sur les deux pages. */
.eg-avis__carte {
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    background: #f5f3eb;
    border-radius: 12px;
    padding: 22px 24px;
    margin-bottom: 28px;
    box-shadow: 0 4px 20px rgba(72, 60, 60, 0.08);
}

.eg-avis__carte-tete {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 12px;
}

.eg-avis__note {
    font-family: Gelasio, serif;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    background: #483c3c;
    border-radius: 999px;
    padding: 5px 14px;
    line-height: 1.2;
    flex-shrink: 0;
}

.eg-avis__note small {
    font-size: 12px;
    font-weight: 400;
    opacity: 0.75;
}

.eg-avis__auteur {
    font-family: 'Work Sans', sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #483c3c;
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.eg-avis__niveau {
    font-size: 12.5px;
    font-weight: 400;
    font-style: normal;
    color: #8a7a7a;
}

.eg-avis__texte {
    font-family: 'Work Sans', sans-serif;
    font-size: 15px;
    line-height: 1.65;
    color: #464646;
    margin: 0;
}

/* --- Pied de section --- */

.eg-avis__pied {
    text-align: center;
    margin: 10px 0 0 0;
}

.eg-avis__lien {
    display: inline-block;
    font-family: 'Work Sans', sans-serif;
    font-size: 16px;
    font-weight: 600;
    color: #483c3c;
    background: #f5f3eb;
    border: 1px solid #483c3c;
    border-radius: 6px;
    padding: 13px 32px;
    text-decoration: none;
    transition: all 0.25s ease;
}

.eg-avis__lien:hover {
    background: #483c3c;
    color: #f5f3eb;
}

/* --- Adaptations --- */

@media (max-width: 900px) {
    .eg-avis__liste {
        columns: 1;
    }

    .eg-avis__entete {
        gap: 24px;
    }

    .eg-avis__chiffres {
        gap: 26px;
        width: 100%;
        justify-content: space-around;
    }
}

@media (max-width: 600px) {
    .eg-avis {
        padding: 50px 0;
    }

    .eg-avis__titre {
        font-size: 26px;
    }

    .eg-avis__logo {
        width: 58px;
        border-radius: 10px;
    }

    .eg-avis__valeur {
        font-size: 32px;
    }

    .eg-avis__label {
        font-size: 11.5px;
    }

    .eg-avis__carte {
        padding: 18px 20px;
    }
}