.vue-ensemble {
    --ve-ink: #382d27;
    --ve-muted: #765f51;
    --ve-line: #e8ddd1;
    --ve-paper: #fffdf9;
    --ve-warm: #f8ecdf;
    padding-block: .55rem 1.25rem;
}

/* Bandeau fin, aligné sur toute la largeur de la page. */
.ve-bandeau {
    display: flex;
    min-height: 56px;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: .85rem;
    padding: .45rem .85rem;
    border: 1px solid var(--ve-line);
    border-radius: 14px;
    background: linear-gradient(100deg, #f8ecdf, #fbf4e7);
}
.ve-bandeau-identite,
.ve-bandeau-actions { display: flex; min-width: 0; align-items: baseline; gap: .7rem; }
.ve-bandeau-identite > span:first-child { color: #8d4b36; font-size: .92rem; font-weight: 750; white-space: nowrap; }
.ve-bandeau-identite h1 { margin: 0; color: var(--ve-ink); font-family: Georgia, serif; font-size: clamp(1.2rem, 2vw, 1.55rem); font-weight: 700; line-height: 1.15; overflow-wrap: anywhere; }
.ve-bandeau-identite .ve-periode-vie { color: var(--ve-muted); font-size: .9rem; white-space: nowrap; }
.ve-bandeau-actions { align-items: center; flex: 0 0 auto; }
.ve-bandeau-actions .text-start { margin: 0; }
.ve-bandeau-actions .btn { padding: .35rem .65rem; font-size: .88rem; }

/* Sous le bandeau : fiche texte complète à gauche, activité à droite. */
.vue-ensemble-disposition {
    display: grid;
    grid-template-columns: minmax(250px, 320px) minmax(0, 1fr);
    align-items: start;
    gap: .9rem;
}
.vue-ensemble-fiche,
.vue-ensemble-contenu { min-width: 0; }
.vue-ensemble-fiche,
.ve-statistique,
.ve-activite {
    border: 1px solid var(--ve-line);
    border-radius: 15px;
    background: var(--ve-paper);
    box-shadow: 0 3px 12px rgb(61 42 30 / 4%);
}
.vue-ensemble-fiche { padding: .9rem 1rem; }
.ve-fiche-nom { margin: 0; color: var(--ve-ink); font-size: 1.15rem; font-weight: 750; overflow-wrap: anywhere; }
.ve-fiche-sous-titre { margin: .1rem 0 .55rem; padding-bottom: .5rem; border-bottom: 1px solid var(--ve-line); color: var(--ve-muted); font-size: .84rem; }
.ve-fiche-details { display: grid; gap: 0; margin: 0; }
.ve-fiche-ligne { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: .45rem; padding: .38rem 0; border-bottom: 1px solid #eee7df; }
.ve-fiche-ligne:last-child { border-bottom: 0; }
.ve-fiche-ligne dt,
.ve-fiche-ligne dd { min-width: 0; margin: 0; font-size: .84rem; line-height: 1.35; overflow-wrap: anywhere; }
.ve-fiche-ligne dt { color: var(--ve-muted); font-weight: 550; }
.ve-fiche-ligne dd { color: var(--ve-ink); font-weight: 650; }

.ve-statistiques { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin-bottom: .8rem; }
.ve-statistique { min-height: 105px; padding: .9rem 1rem; }
.ve-statistique span { display: block; color: var(--ve-muted); font-size: .92rem; }
.ve-statistique span i { margin-right: .25rem; color: #8d4b36; }
.ve-statistique strong { display: block; margin-top: .45rem; color: #8d4b36; font-size: clamp(1.55rem, 2.5vw, 2rem); line-height: 1.05; }

.ve-activite { padding: 1rem 1.1rem; }
.ve-activite h2 { margin: 0 0 .6rem; color: var(--ve-ink); font-size: 1.05rem; }
.ve-lignes-activite { display: grid; gap: 0; margin: 0; }
.ve-lignes-activite > div { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: .55rem 0; border-bottom: 1px solid var(--ve-line); }
.ve-lignes-activite > div:last-child { border-bottom: 0; }
.ve-lignes-activite dt,
.ve-lignes-activite dd { margin: 0; font-size: .9rem; }
.ve-lignes-activite dt { color: var(--ve-ink); font-weight: 500; }
.ve-lignes-activite dt a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 2px; }
.ve-lignes-activite dd { color: var(--ve-ink); font-weight: 650; text-align: right; }
.ve-note-activite { margin: .75rem 0 0; padding: .7rem .8rem; border-radius: 10px; background: #faf7f2; color: var(--ve-muted); font-size: .87rem; }

@media (max-width: 900px) {
    .vue-ensemble-disposition { grid-template-columns: minmax(230px, 275px) minmax(0, 1fr); gap: .7rem; }
    .ve-lignes-activite > div { gap: .6rem; }
}
@media (max-width: 680px) {
    .ve-bandeau { align-items: flex-start; flex-wrap: wrap; padding: .65rem .75rem; }
    .ve-bandeau-identite { flex-wrap: wrap; gap: .25rem .55rem; }
    .ve-bandeau-actions { width: 100%; justify-content: flex-end; }
    .vue-ensemble-disposition { grid-template-columns: minmax(0, 1fr); }
    .vue-ensemble-fiche { order: 0; }
    .vue-ensemble-contenu { order: 1; }
}
@media (max-width: 430px) {
    .ve-statistiques { gap: .5rem; }
    .ve-statistique { min-height: 90px; padding: .7rem; }
    .ve-statistique span { font-size: .82rem; }
    .ve-lignes-activite > div { align-items: flex-start; }
    .ve-lignes-activite dd { max-width: 55%; }
}