/* ==========================================================================
   Page Qui sommes-nous (/it-project/) — V1.2, sur la base de la piste C validée
   Grille commune à 12 colonnes (composition en « L ») reprise de section en
   section ; photographies réelles à leur taille utile ; orange réservé aux
   secondes parties des titres. Aucun chiffre, aucune citation inventée.
   Classes préfixées (q-).
   ========================================================================== */
.page-about main{overflow-x:clip}
.opt{font-weight:500;color:var(--stone)}
.q-g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,1.8vw,28px);width:min(100% - 2*clamp(20px,4vw,60px),1320px);margin:0 auto}
.q-rub{margin:0 0 14px;font-size:12.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--orange-ink)}
.q-h2{margin:0 0 20px;font-size:clamp(30px,3vw,46px);font-weight:800;line-height:1.06;letter-spacing:-.04em;color:var(--ink)}
.q-h2 .accent,.q-story__t .accent,.q-hero__h1 .accent{color:var(--orange-deep)}

/* ---------- Premier écran : piste C ---------- */
.q-hero{padding:104px 0 0;background:#fff}
.q-hero__k{grid-column:1 / -1;margin:0 0 clamp(14px,1.6vw,22px);font-size:12.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--ink)}
.q-hero__k span{color:#6B6762;font-weight:700}
.q-hero__h1{grid-column:1 / span 11;margin:0 0 clamp(26px,2.6vw,38px);font-size:clamp(40px,4.3vw,66px);font-weight:800;line-height:1;letter-spacing:-.05em;color:var(--ink)}
.q-hero__side{grid-column:1 / span 3;grid-row:3;align-self:center;min-width:0;padding-right:clamp(0px,1vw,12px)}
.q-hero__lead{margin:0 0 22px;font-size:clamp(16px,1.15vw,17.5px);line-height:1.6;color:#3E3A36}
.q-hero__cta{margin:0}
.q-hero__facts{margin:clamp(26px,2.6vw,36px) 0 0;border-top:1px solid var(--ink)}
.q-hero__facts div{display:flex;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid #E3D9CC;font-size:13.5px}
.q-hero__facts dt{color:#7A736B}
.q-hero__facts dd{margin:0;font-weight:700;color:var(--ink);text-align:right}
.q-hero__fig{grid-column:4 / -1;grid-row:3;margin:0;min-width:0}
.q-hero__fig picture,.q-hero__fig img{display:block;width:100%;height:auto}
.q-hero__fig img{border-radius:8px}
.q-hero__fig figcaption{margin-top:10px;font-size:13px;color:#6B6762}
@media (max-width:1000px){.q-hero__h1{grid-column:1 / -1}.q-hero__side{grid-column:1 / span 4}.q-hero__fig{grid-column:5 / -1}}
@media (max-width:760px){
  .q-hero{padding-top:82px}
  .q-hero .q-g{display:flex;flex-direction:column;width:calc(100% - 40px)}
  .q-hero__k{order:1;font-size:11.5px;margin-bottom:12px}.q-hero__k span{display:none}
  .q-hero__h1{order:2;font-size:clamp(34px,10vw,42px);margin-bottom:22px}
  .q-hero__fig{order:3;margin:0 -20px}.q-hero__fig img{border-radius:0}
  .q-hero__fig figcaption{padding:0 20px;margin-top:8px;font-size:12px}
  .q-hero__side{order:4;padding:0;margin-top:16px;display:flex;flex-direction:column}
  .q-hero__facts{order:-1;display:flex;flex-wrap:wrap;gap:4px 14px;margin:0 0 16px;padding:10px 0;border-bottom:1px solid #E3D9CC}
  .q-hero__facts div{display:block;padding:0;border:0;font-size:12.5px}
  .q-hero__facts dt{display:none}
  .q-hero__facts div+div dd::before{content:"· ";color:var(--orange)}
  .q-hero__facts dd{text-align:left}
  .q-hero__lead{font-size:15.5px;margin-bottom:16px}
  .q-hero__cta .btn{width:100%;justify-content:center}
}

/* ---------- Notre histoire : grille en L ---------- */
.q-story{scroll-margin-top:70px;padding:clamp(80px,9vw,124px) 0 clamp(80px,9vw,120px);background:#fff}
.q-story .q-rub{grid-column:1 / span 3;padding-top:clamp(22px,2.4vw,32px);border-top:1px solid var(--ink)}
.q-story__b{grid-column:4 / span 8;min-width:0;padding-top:clamp(22px,2.4vw,32px);border-top:1px solid var(--ink)}
.q-story__t{margin:0 0 clamp(24px,2.6vw,34px);font-size:clamp(30px,3.2vw,50px);font-weight:800;line-height:1.05;letter-spacing:-.045em;color:var(--ink)}
.q-story__t .accent{display:block}
.q-story__txt{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(20px,3vw,48px)}
.q-story__txt p{margin:0;font-size:clamp(16.5px,1.25vw,18.5px);line-height:1.7;color:#3E3A36}
.q-story__txt p:first-child{font-size:clamp(19px,1.6vw,23px);line-height:1.5;font-weight:600;color:var(--ink)}
@media (max-width:900px){.q-story .q-rub,.q-story__b{grid-column:1 / -1}.q-story__b{border-top:0;padding-top:0}.q-story__txt{grid-template-columns:minmax(0,1fr)}}

/* ---------- Notre organisation ---------- */
.q-org{padding:clamp(80px,9vw,124px) 0;background:var(--ivory)}
.q-org__head{grid-column:1 / span 7;min-width:0;margin-bottom:clamp(34px,4vw,56px)}
.q-org__lead{margin:0;max-width:60ch;font-size:clamp(17px,1.35vw,19.5px);line-height:1.6;color:#3E3A36}
.q-org__fig{grid-column:1 / span 6;grid-row:2;position:relative;margin:0;min-width:0;align-self:start}
.q-org__fig img{display:block;width:100%;max-width:800px;height:auto;border-radius:8px}
.q-org__fig figcaption{position:absolute;left:14px;bottom:14px;padding:6px 12px;border-radius:999px;background:rgba(255,250,243,.92);font-size:12.5px;font-weight:600;color:#4A4642}
.q-org__list{grid-column:8 / -1;grid-row:2;margin:0;padding:0;list-style:none;counter-reset:o;border-top:2px solid var(--ink)}
.q-org__list li{counter-increment:o;display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:8px;padding:clamp(16px,1.8vw,22px) 0;border-bottom:1px solid #E3D6C4}
.q-org__list li::before{content:counter(o,decimal-leading-zero);grid-row:span 2;padding-top:4px;font-size:13px;font-weight:800;color:var(--orange-ink)}
.q-org__list h3{margin:0 0 6px;font-size:clamp(18px,1.6vw,21px);letter-spacing:-.02em;color:var(--ink)}
.q-org__list p{margin:0;font-size:15.5px;line-height:1.6;color:#4A4642}
.q-org__list a{font-weight:800;color:var(--ink);text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:4px}
@media (max-width:1000px){.q-org__head{grid-column:1 / -1}.q-org__fig{grid-column:1 / span 6}.q-org__list{grid-column:7 / -1}}
@media (max-width:800px){.q-org .q-g{display:flex;flex-direction:column}.q-org__fig{margin-bottom:24px}}

/* ---------- La direction : portraits, sans hiérarchie appuyée ---------- */
.q-lead{padding:clamp(90px,10vw,140px) 0;background:#fff}
.q-lead__head{grid-column:1 / span 8;min-width:0;margin-bottom:clamp(34px,4vw,56px)}
.q-lead__intro{margin:0;max-width:56ch;font-size:clamp(17px,1.35vw,19px);line-height:1.6;color:#3E3A36}
.q-lead__list{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,48px)}
.q-p{min-width:0;display:flex;flex-direction:column}
.q-p__ph{display:block;width:100%;aspect-ratio:1;object-fit:cover;object-position:50% 30%;border-radius:8px;margin-bottom:20px}
.q-p__name{margin:0 0 6px;font-size:clamp(24px,2.2vw,32px);font-weight:800;line-height:1.05;letter-spacing:-.04em;color:var(--ink)}
.q-p__role{margin:0 0 12px;min-height:2.9em;font-size:13px;font-weight:800;line-height:1.45;letter-spacing:.03em;text-transform:uppercase;color:var(--orange-ink)}
.q-p__txt{margin:0 0 14px;font-size:16px;line-height:1.6;color:#4A4642}
.q-p__mail{margin-top:auto;font-size:14px;font-weight:700;color:var(--ink);text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:4px;overflow-wrap:anywhere}
@media (max-width:860px){.q-lead__head{grid-column:1 / -1}.q-lead__list{grid-template-columns:minmax(0,1fr);gap:30px}.q-p{display:grid;grid-template-columns:clamp(108px,30vw,150px) minmax(0,1fr);column-gap:18px;align-items:start}.q-p__ph{grid-row:span 4;margin:0}.q-p__role{min-height:0}}

/* ---------- Avec Divalto ---------- */
.q-dv{padding:clamp(80px,9vw,124px) 0;background:var(--ivory)}
.q-dv .q-g{align-items:center}
.q-dv__txt{grid-column:1 / span 4;min-width:0}
.q-dv__txt p:not(.q-rub){margin:0 0 14px;font-size:16.5px;line-height:1.65;color:#3E3A36}
.q-dv__txt b{color:var(--ink)}
.q-dv__link{margin-top:20px !important}
.q-dv__fig{grid-column:6 / -1;margin:0;min-width:0}
.q-dv__fig img{display:block;width:100%;height:auto;border-radius:8px}
.q-dv__fig figcaption{margin-top:10px;font-size:13px;color:#6B6762;text-align:right}
@media (max-width:900px){.q-dv__txt,.q-dv__fig{grid-column:1 / -1}.q-dv__fig{margin-top:26px}}

/* ---------- Secteurs ---------- */
.q-sec{padding:clamp(80px,9vw,120px) 0;background:#fff}
.q-sec__p{grid-column:1 / span 11;margin:0;font-size:clamp(25px,3vw,44px);font-weight:800;line-height:1.2;letter-spacing:-.035em;color:#B5AA9C}
.q-sec__p a{color:var(--ink);text-decoration:underline;text-decoration-thickness:3px;text-decoration-color:var(--orange);text-underline-offset:6px}
.q-sec__p a:hover{color:var(--orange-deep)}
@media (max-width:600px){.q-sec__p{grid-column:1 / -1;font-size:clamp(22px,6.6vw,28px)}.q-sec__p a{text-decoration-thickness:2px;text-underline-offset:4px}}

/* ---------- Partout en France : carte des clients et des experts ---------- */
.q-map{padding:clamp(90px,10vw,140px) 0;background:#fff}
.q-map .q-g{align-items:center}
.mp__txt{grid-column:1 / span 4;min-width:0}
.mp__lead{margin:0 0 26px;font-size:clamp(16.5px,1.25vw,18px);line-height:1.65;color:#3E3A36}
.mp__filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.mp__f{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 16px;border:1.5px solid #E3D6C4;border-radius:999px;background:#fff;font:inherit;font-size:14.5px;font-weight:700;color:var(--ink);cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.mp__f i{width:11px;height:11px;border-radius:50%;background:var(--orange)}
.mp__f--expert i{background:#1F1D1B;box-shadow:0 0 0 2px #fff,0 0 0 3px #1F1D1B}
.mp__f[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.mp__f[aria-pressed="true"].mp__f--expert i{box-shadow:0 0 0 2px var(--ink),0 0 0 3px #fff}
.mp__f:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.mp__info{min-height:3em;margin:0;padding:12px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);font-size:15px;line-height:1.5;font-weight:600;color:var(--ink)}
.mp__note{margin:10px 0 26px;font-size:13px;color:#7A736B}
.mp__sec{margin:0;font-size:15px;line-height:1.7;color:#5C554E}
.mp__sec a{font-weight:800;color:var(--ink);text-decoration:underline;text-decoration-color:var(--orange);text-underline-offset:4px}
.mp__map{grid-column:5 / -1;justify-self:end;width:100%;max-width:760px;margin:0;min-width:0}
.mp__stage{position:relative;width:100%;aspect-ratio:1000 / 935}
.mp__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.mp__deps{fill:#F4ECE1;stroke:#fff;stroke-width:1.4;stroke-linejoin:round}
.mp__outline{fill:none;stroke:#2B2724;stroke-width:1.6;stroke-linejoin:round;opacity:.55}
.mp__inset rect{fill:#fff;stroke:#E3D6C4;stroke-width:1.5}
.mp__inset text{font:700 15px/1 var(--font, inherit);fill:#7A736B;letter-spacing:.04em}
.mp__inset path{fill:#F4ECE1;stroke:#2B2724;stroke-width:1.4;opacity:.8}
.mp__pts{position:absolute;inset:0}
.mp__pt{--z:max(var(--s),24px);position:absolute;width:var(--z);height:var(--z);margin:calc(var(--z) / -2) 0 0 calc(var(--z) / -2);padding:0;border:0;border-radius:50%;background:transparent;cursor:pointer;transition:transform .2s,opacity .25s}
/* Le point visible est dessiné par ::before ; le bouton lui-même mesure au moins 24 × 24 px (WCAG 2.2, taille des cibles) */
.mp__pt::before{content:"";position:absolute;left:50%;top:50%;width:var(--s);height:var(--s);margin:calc(var(--s) / -2) 0 0 calc(var(--s) / -2);border-radius:50%;background:var(--pt-bg);box-shadow:var(--pt-ring)}
.mp__pt::after{content:"";position:absolute;inset:-8px;border-radius:50%}
.mp__pt--client{--s:13px;--pt-bg:var(--orange);--pt-ring:0 0 0 2.5px #fff;z-index:1}
.mp__pt--client.is-plural{--s:18px}
.mp__pt--client.is-group{--s:calc(16px + var(--k) * 2.5px);--pt-bg:var(--orange-deep)}
.mp__pt--expert{--s:10px;--pt-bg:#1F1D1B;--pt-ring:0 0 0 2.5px #F4ECE1;z-index:2}
.mp__pt--expert.is-plural{--s:13px}
.mp__pt--expert.is-group{--s:calc(12px + var(--k) * 1.5px)}
.mp__pt:hover,.mp__pt.is-on{transform:scale(1.25)}
.mp__pt:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.mp__pt--client:focus-visible{outline-color:var(--orange-deep)}
/* Point double (clients et experts au même endroit) : pastille orange avec un cœur sombre, même étiquette pour les deux informations */
.mp__pt--client.is-both{--pt-bg:radial-gradient(circle,#1F1D1B 0 3px,#F4ECE1 3px 4.5px,var(--orange) 4.5px)}
.mp__pt--client.is-both.is-group{--pt-bg:radial-gradient(circle,#1F1D1B 0 3.5px,#F4ECE1 3.5px 5px,var(--orange-deep) 5px)}
.mp[data-filter="client"] .mp__pt--expert,.mp[data-filter="expert"] .mp__pt--client:not(.is-both){opacity:0;visibility:hidden;pointer-events:none}
@media (max-width:1000px){.mp__txt{grid-column:1 / span 5}.mp__map{grid-column:6 / -1}}
@media (max-width:800px){
  .q-map .q-g{display:flex;flex-direction:column;align-items:stretch}
  .mp__map{order:2;max-width:none;margin:6px 0 4px}
  .mp__txt{display:contents}
  .mp__txt .q-rub{order:0}.mp__txt .q-h2{order:0}.mp__lead{order:0}
  .mp__filters{order:1}
  .mp__info{order:3}.mp__note{order:4}.mp__sec{order:5}
}
@media (max-width:520px){.mp__pt--client{--s:11px}.mp__pt--client.is-plural{--s:14px}.mp__pt--client.is-group{--s:calc(13px + var(--k) * 2px)}.mp__pt--expert{--s:8px}.mp__pt--expert.is-plural{--s:10px}.mp__inset text{font-size:22px}}
@media (prefers-reduced-motion:reduce){.mp__pt{transition:none}}
@media (max-width:800px){.mp__map{width:calc(100% + 40px);margin:10px -20px 6px}}
/* Ordre de tabulation : filtres → points de la carte → liens sectoriels (affichage inchangé) */
@media (min-width:801px){.mp__txt{grid-row:1}.mp__map{grid-row:1 / span 2;align-self:center}.mp__sec{grid-column:1 / span 4;grid-row:2;align-self:start}}
@media (min-width:801px) and (max-width:1000px){.mp__sec{grid-column:1 / span 5}}
/* V1.4.1 : zones tactiles d’au moins 44 px sans grossir les points (écran tactile ou petit écran) */
.mp.is-touch .mp__pt::after{inset:auto;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%)}
.mp.is-touch .mp__pt:hover{transform:none}
.mp.is-touch .mp__pt.is-on{transform:scale(1.25)}
.mp__f--expert{white-space:nowrap}

/* ---------- Nos valeurs : escalier typographique (V1.5) ---------- */
.q-val{padding:clamp(90px,10vw,140px) 0 clamp(70px,8vw,110px);background:#fff}
.q-val__head{grid-column:1 / span 8;min-width:0;margin-bottom:clamp(30px,3.6vw,52px)}
.q-val__list{grid-column:1 / -1;margin:0;border-top:2px solid var(--ink)}
.q-val__row{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:10px clamp(24px,4vw,64px);align-items:center;padding:clamp(18px,2vw,26px) 0 clamp(18px,2vw,26px) calc(var(--i, 0) * clamp(0px,4.2vw,64px));border-bottom:1px solid var(--line)}
.q-val__row:nth-child(2){--i:1}.q-val__row:nth-child(3){--i:2}.q-val__row:nth-child(4){--i:3}.q-val__row:nth-child(5){--i:4}
.q-val__row dt{margin:0;font-size:clamp(34px,4.4vw,68px);font-weight:800;line-height:1;letter-spacing:-.05em;color:var(--ink)}
.q-val__row:last-child dt{color:var(--orange-deep)}
.q-val__row dd{margin:0;max-width:52ch;font-size:clamp(15.5px,1.2vw,17.5px);line-height:1.6;color:#4A4642}
@media (max-width:900px){.q-val__head{grid-column:1 / -1}.q-val__row{grid-template-columns:minmax(0,1fr);padding-left:0}.q-val__row dt{font-size:clamp(32px,8.6vw,46px)}}

/* ---------- ScoreFact 2026 (V1.6) : photo de remise et label officiel ---------- */
.q-sf{padding:clamp(80px,9vw,124px) 0;background:var(--ivory)}
.q-sf .q-g{align-items:center}
.q-sf__fig{grid-column:1 / span 7;margin:0;min-width:0}
.q-sf__fig picture,.q-sf__fig img{display:block;width:100%;height:auto}
.q-sf__fig img{border-radius:8px}
.q-sf__fig figcaption{margin-top:10px;font-size:13px;color:#6B6762}
.q-sf__txt{grid-column:9 / -1;min-width:0}
.q-sf__label{display:block;width:clamp(170px,17vw,240px);height:auto;margin:0 0 clamp(20px,2.2vw,30px)}
.q-sf__txt p{margin:0 0 14px;font-size:16.5px;line-height:1.65;color:#3E3A36}
.q-sf__txt b{color:var(--ink)}
@media (max-width:1000px){.q-sf__fig{grid-column:1 / span 7}.q-sf__txt{grid-column:8 / -1}}
@media (max-width:800px){.q-sf .q-g{display:flex;flex-direction:column;align-items:stretch}.q-sf__txt{order:-1;margin-bottom:24px}.q-sf__label{width:180px}}
@media (max-width:600px){.q-sf__fig{margin:0 -20px}.q-sf__fig img{border-radius:0}.q-sf__fig figcaption{padding:0 20px}.q-sf__label{width:160px}}
