/* =========================================================
   CONTACT · FAQ · À PROPOS · PAGES LÉGALES
   ========================================================= */

/* ---------- Contact ---------- */
.contact-cards { display: grid; gap: var(--space-2); grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); list-style: none; padding: 0; }
.contact-card {
  display: flex; gap: var(--space-2);
  padding: var(--space-3);
  background: var(--c-surface);
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
}
.contact-card > div { display: grid; gap: .15rem; min-width: 0; }
.contact-card strong { font-size: var(--fs-base); }
.contact-card span { font-size: var(--fs-xs); color: var(--c-muted); }
.contact-card a, .contact-card address { margin-top: .35rem; font-style: normal; font-weight: 600; color: var(--c-primary); overflow-wrap: anywhere; }
.contact-card__icon {
  flex-shrink: 0; display: grid; place-items: center;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--c-accent-soft); color: var(--c-accent-strong);
}
.contact-card--wa { border-color: color-mix(in srgb, #25D366 45%, var(--c-line)); }
.contact-card--wa .contact-card__icon { background: color-mix(in srgb, #25D366 15%, #fff); color: #128C4A; }
.contact-card--wa a { color: #128C4A; }
.contact-map { overflow: hidden; border-radius: var(--radius-l); aspect-ratio: 16 / 9; background: var(--c-sand); }
.contact-map iframe { width: 100%; height: 100%; border: 0; }
.contact-licence { display: flex; gap: .5rem; font-size: var(--fs-sm); color: var(--c-muted); }
.contact-licence .icon { flex-shrink: 0; margin-top: .2rem; color: var(--c-accent-strong); }

/* ---------- FAQ ---------- */
.faq-page { display: grid; gap: var(--space-4); }
.faq-nav { display: flex; flex-wrap: wrap; gap: .5rem; }
.faq-nav__link {
  display: inline-flex; align-items: center; min-height: 42px; padding: .45rem 1rem;
  border: 1.5px solid var(--c-line); border-radius: var(--radius-pill);
  font-size: var(--fs-sm); font-weight: 600; text-decoration: none;
  transition: border-color var(--dur) var(--ease), background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.faq-nav__link:hover { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }
.faq-groups { display: grid; gap: var(--space-5); max-width: 860px; }
.faq-group { display: grid; gap: var(--space-2); }
.faq-group h2 { font-size: var(--fs-h3); }
.faq-more {
  display: grid; gap: var(--space-3);
  padding: var(--space-4);
  border-radius: var(--radius-l);
  background: var(--c-primary); color: var(--c-on-dark);
}
.faq-more h2 { color: #fff; font-size: var(--fs-h3); }
.faq-more p { color: var(--c-on-dark-muted); }
.faq-more__actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.faq-more .btn--ghost { color: #fff; border-color: rgba(255, 255, 255, .45); }
.faq-more .btn--ghost:hover { background: #fff; color: var(--c-primary); }
@media (min-width: 1024px) {
  .faq-page { grid-template-columns: 220px minmax(0, 1fr); align-items: start; }
  .faq-nav { position: sticky; top: calc(var(--header-h) + var(--space-2)); flex-direction: column; }
  .faq-more { grid-template-columns: 1fr auto; align-items: center; }
}

/* ---------- À propos ---------- */
.about-intro { display: grid; gap: var(--space-5); align-items: center; }
.about-intro__text { display: grid; gap: var(--space-2); max-width: 62ch; }
.about-intro__text h2 { font-size: var(--fs-h2); }
.about-intro__text p:not(.eyebrow) { color: var(--c-muted); }
.about-stats { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); list-style: none; padding: 0; }
.about-stats li {
  display: grid; gap: .2rem;
  padding: var(--space-3);
  border-radius: var(--radius-l);
  background: var(--c-surface);
  border: 1px solid var(--c-line);
}
.about-stats strong { font-family: var(--font-title); font-size: clamp(1.8rem, 1.4rem + 1.5vw, 2.6rem); color: var(--c-primary); line-height: 1.1; }
.about-stats span { font-size: var(--fs-sm); color: var(--c-muted); }
.about-cta { display: grid; justify-items: center; gap: var(--space-3); text-align: center; }
.about-cta h2 { font-size: var(--fs-h2); }
.about-cta__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--space-2); }
@media (min-width: 1024px) { .about-intro { grid-template-columns: 1.2fr 1fr; } }

/* ---------- Pages légales ---------- */
.prose { display: grid; gap: var(--space-2); max-width: 760px; }
.prose h2 { font-size: var(--fs-h4, 1.35rem); margin-top: var(--space-3); }
.prose p { color: var(--c-muted); }
.prose a { color: var(--c-primary); }