/* « Qui sommes-nous » (11/10/2026) : l'équipe d'abord, dans le style de l'accueil.
   Bandeau court et sombre → photo d'équipe à explorer → qui fait quoi → logos → FAQ → appel. */

/* Bandeau */
.about-site .about-top { position:relative; overflow:hidden; padding:clamp(120px,12vw,150px) 0 clamp(48px,6vw,72px); background:var(--gradient-hero); color:#fff; }
.about-site .about-top::after { content:""; position:absolute; right:-12%; bottom:-40%; width:60%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle, rgba(249,115,22,.28), transparent 65%); pointer-events:none; }
.about-top-grid { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.5fr) minmax(260px,.75fr); gap:clamp(36px,6vw,96px); align-items:center; }
.about-top-eyebrow { display:inline-flex; align-items:center; gap:10px; color:#ffb27a; font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.about-top-eyebrow::before { content:""; width:24px; height:2px; background:#f97316; }
.about-site.ui-polish .about-top h1 { margin:16px 0 18px; padding:0; max-width:none; color:#fff; text-align:left; font-size:clamp(38px,4.6vw,64px); line-height:1.02; letter-spacing:-.035em; }
.about-site.ui-polish .about-top h1 span { display:block; color:#9fc0ff; }
.about-site.ui-polish .about-top-copy > p:not(.about-top-seal) { max-width:54ch; margin:0; color:#d6e1f2; text-align:left; font-size:clamp(16px,1.3vw,18px); line-height:1.65; }
.about-top-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.about-site .about-btn-light, .about-site .about-btn-outline { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:14px 24px; border-radius:12px; font-size:15px; font-weight:700; text-decoration:none; transition:background .2s, border-color .2s, color .2s; }
.about-site .about-btn-light { background:#fff; color:#163b84; border:1px solid #fff; }
.about-site .about-btn-light:hover { background:#eef3fc; color:#163b84; }
.about-site .about-btn-outline { background:transparent; color:#fff; border:1px solid rgba(255,255,255,.45); }
.about-site .about-btn-outline:hover { border-color:#fff; background:rgba(255,255,255,.08); color:#fff; }
.about-site .about-btn-light svg { width:18px; height:18px; }
.about-site :is(.about-btn-light, .about-btn-outline):focus-visible { outline:3px solid #f97316; outline-offset:3px; }
.about-site.ui-polish .about-top-seal { margin:22px 0 0; }

/* Chiffres du bandeau */
.about-top-figures { display:grid; gap:0; margin:0; padding:0; list-style:none; border-left:1px solid rgba(255,255,255,.18); }
.about-top-figures li { display:flex; flex-direction:column; gap:2px; padding:14px 0 14px 28px; }
.about-top-figures li + li:not(.about-top-figures-link) { border-top:1px solid rgba(255,255,255,.1); }
.about-top-figures strong { color:#fff; font:800 clamp(34px,3.4vw,46px)/1 var(--font-heading); letter-spacing:-.03em; }
.about-top-figures strong small { margin-left:2px; color:#9fc0ff; font-size:.5em; letter-spacing:0; }
.about-top-figures span { color:#c4d2e8; font-size:13px; }
.about-top-figures-link a { color:#fff; font-size:13px; font-weight:600; text-decoration:underline; text-underline-offset:4px; }

/* Photo d'équipe : pleine largeur, juste sous le bandeau */
.about-site .about-team { position:relative; overflow:clip; padding:0 0 12px; background:var(--white); scroll-margin-top:90px; }

/* Qui fait quoi */
.about-site .about-people { padding:clamp(56px,7vw,96px) 0; background:var(--gray-50); }
.about-section-head { max-width:720px; margin:0 auto clamp(32px,4vw,48px); text-align:center; }
.about-site.ui-polish .about-section-head h2 { margin:12px 0 12px; font-size:clamp(30px,3.4vw,44px); line-height:1.08; }
.about-site.ui-polish .about-section-head h2 span { color:var(--primary); }
.about-site.ui-polish .about-section-head p { margin:0 auto; color:var(--text-secondary); font-size:16px; }
.about-people-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; margin:0; padding:0; list-style:none; }
.about-people-swipe { display:none; align-items:center; justify-content:center; gap:8px; margin:-8px 0 16px; color:var(--text-secondary); font-size:13px; font-weight:600; }
.about-people-swipe span { color:#f97316; font-size:18px; line-height:1; }
.about-person { position:relative; display:flex; flex-direction:column; border:1px solid var(--gray-200); border-radius:18px; background:var(--white); overflow:hidden; transition:border-color .2s, box-shadow .2s, translate .2s; }
.about-person:hover { border-color:#94afea; box-shadow:0 18px 36px -24px rgba(23,48,92,.45); translate:0 -3px; }
.about-person > a:first-child { display:flex; flex-direction:column; flex:1; color:inherit; text-decoration:none; }
.about-person > a:first-child:focus-visible { outline:3px solid #f97316; outline-offset:-3px; border-radius:18px; }
.about-person-photo { display:block; aspect-ratio:4 / 5; overflow:hidden; background:linear-gradient(180deg,#eef2f8,#dfe6f1); }
.about-person-photo img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 12%; transition:transform .4s ease; }
.about-person:hover .about-person-photo img { transform:scale(1.04); }
.about-person-text { display:flex; flex-direction:column; gap:3px; padding:14px 16px 16px; }
.about-person-text strong { color:var(--gray-900); font-size:16px; line-height:1.25; }
.about-person-field { color:var(--primary); font-size:13px; font-weight:600; line-height:1.35; }
.about-person-title { color:var(--text-secondary); font-size:12px; }
.about-person--caller { border-color:#f97316; box-shadow:0 0 0 1px #f97316; }
.about-person-call { display:flex; align-items:center; justify-content:center; gap:8px; margin:0 12px 12px; padding:10px 8px; border-radius:10px; background:#f97316; color:#fff; font-size:14px; font-weight:800; white-space:nowrap; text-decoration:none; }
.about-person-call:hover { background:#ea580c; color:#fff; }
.about-person-call svg { width:14px; height:14px; flex:none; }

/* Bandeau d'appel final */
.about-site .about-cta { padding:clamp(56px,7vw,88px) 0; background:var(--gradient-hero); color:#fff; }
.about-cta-inner { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:28px 48px; }
.about-site.ui-polish .about-cta h2 { margin:0 0 10px; color:#fff; text-align:left; font-size:clamp(30px,3.4vw,46px); line-height:1.05; }
.about-site.ui-polish .about-cta h2 span { color:#9fc0ff; }
.about-site.ui-polish .about-cta p { max-width:52ch; margin:0; color:#d6e1f2; text-align:left; font-size:16px; line-height:1.6; }
.about-cta .about-top-actions { margin-top:0; }

/* Thème sombre */
[data-theme="dark"] .about-site .about-team { background:var(--white); }
[data-theme="dark"] .about-person-photo { background:linear-gradient(180deg,#1e293b,#162033); }

/* Tablette */
@media (max-width:1100px) {
  .about-people-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width:900px) {
  .about-top-grid { grid-template-columns:1fr; }
  .about-top-figures { grid-template-columns:repeat(3,minmax(0,1fr)); border-left:0; border-top:1px solid rgba(255,255,255,.18); }
  .about-top-figures li { padding:16px 12px 0 0; }
  .about-top-figures li + li:not(.about-top-figures-link) { border-top:0; }
  .about-top-figures-link { grid-column:1 / -1; }
  .about-people-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
/* Téléphone */
@media (max-width:600px) {
  .about-site .about-top { padding-top:108px; }
  .about-top-actions { flex-direction:column; }
  .about-site :is(.about-btn-light, .about-btn-outline) { width:100%; }
  .about-top-figures strong { font-size:30px; }
  .about-top-figures span { font-size:12px; }
  /* Carrousel : une carte à la fois, la suivante dépasse pour inviter à faire glisser. */
  .about-people-grid { display:flex; gap:12px; margin-inline:-20px; padding:4px 20px 18px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scroll-padding-inline:20px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
  .about-people-grid::-webkit-scrollbar { display:none; }
  .about-person { flex:0 0 72%; scroll-snap-align:start; }
  .about-person:hover { translate:none; box-shadow:none; }
  .about-person-text { padding:12px 14px 14px; }
  .about-person-text strong { font-size:16px; }
  .about-people-swipe { display:flex; }
}
@media (prefers-reduced-motion:reduce) {
  .about-person, .about-person-photo img { transition:none; }
  .about-person:hover { translate:none; }
  .about-person:hover .about-person-photo img { transform:none; }
}
