/* ════════════════════════════════════════════════════════════════
   Variables CSS — à surcharger au besoin
   ════════════════════════════════════════════════════════════════ */
:root {
  --ep-green:     #128C7E;
  --ep-green2:    #075E54;
  --ep-gold:      #F4A724;
  --ep-dark:      #0f172a;
  --ep-gray:      #64748b;
  --ep-light-bg:  #f8fafc;
  --ep-border:    #e2e8f0;
  --ep-radius:    .75rem;
  --ep-shadow:    0 4px 24px rgba(0,0,0,.07);
  --ep-font:      'Inter', 'Outfit', system-ui, sans-serif;
}

/* ════════════════════════ VITRINE — À propos ═════════════════════ */

.about-hero { background: linear-gradient(135deg, var(--ep-green2), var(--ep-green));
  color: #fff; padding: 5rem 1.5rem; text-align: center; }
.about-hero h1 { font-size: 2.5rem; font-weight: 900; margin: 0 0 1rem; }
.about-hero p { font-size: 1.1rem; opacity: .85; max-width: 560px; margin: 0 auto; }

.about-section { max-width: 900px; margin: 0 auto; padding: 4rem 1.5rem; }
.about-section h2 { font-size: 1.6rem; font-weight: 800; color: var(--ep-dark); margin: 0 0 1rem; }
.about-section p { color: var(--ep-gray); line-height: 1.8; margin-bottom: 1.5rem; }

/* Team */
.team-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1.5rem; margin-top: 2rem; }
.team-card { background: #fff; border: 1px solid var(--ep-border); border-radius: var(--ep-radius);
  padding: 1.5rem; text-align: center; box-shadow: var(--ep-shadow); }
.team-card__photo { width: 80px; height: 80px; border-radius: 50%; object-fit: cover;
  margin: 0 auto 1rem; display: block; background: var(--ep-light-bg); }
.team-card__name { font-weight: 700; color: var(--ep-dark); margin: 0 0 .25rem; }
.team-card__role { color: var(--ep-gray); font-size: .85rem; }

/* Valeurs */
.values-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1.5rem; }
.value-item { padding: 1.5rem; border-left: 3px solid var(--ep-green); }
.value-item__icon { font-size: 1.8rem; margin-bottom: .5rem; }
.value-item__title { font-weight: 700; color: var(--ep-dark); margin: 0 0 .5rem; }
.value-item__text { color: var(--ep-gray); font-size: .9rem; line-height: 1.6; }