/* MDC · À Propos — multi-designs */
.mdc-ab{ --mdc-accent:#b8252e; --mdc-dark:#080a0a; }
.mdc-ab-banner{ position:relative; min-height:500px; background-size:cover; background-position:center; border-radius:22px; overflow:hidden; display:flex; align-items:center; }
.mdc-ab-banner.is-parallax{ background-attachment:fixed; }
.mdc-ab-overlay{ position:absolute; inset:0; background:rgba(8,10,10,.72); z-index:1; }

.mdc-ab-eyebrow{ display:inline-block; text-transform:uppercase; letter-spacing:3px; font-size:12.5px; font-weight:700; color:#fff; background:var(--mdc-accent); padding:7px 16px; border-radius:30px; margin-bottom:16px; }
.mdc-ab-title{ margin:0 0 18px; font-size:clamp(26px,3.6vw,40px); line-height:1.15; font-weight:800; color:#fff; }
.mdc-ab-hl{ color:var(--mdc-accent); }
.mdc-ab-text{ font-size:1.04rem; line-height:1.7; color:rgba(255,255,255,.85); }
.mdc-ab-text p{ margin:0 0 12px; } .mdc-ab-text p:last-child{ margin:0; }

/* Stats génériques */
.mdc-ab-stats{ display:flex; gap:14px; flex-wrap:wrap; margin:24px 0 28px; }
.mdc-ab-stat{ flex:1; min-width:120px; padding:18px 16px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.12); border-radius:14px; text-align:center; transition:.25s ease; }
.mdc-ab-stat:hover{ background:rgba(184,37,46,.2); border-color:rgba(184,37,46,.45); transform:translateY(-4px); }
.mdc-ab-stat-num{ display:block; font-size:32px; font-weight:800; color:var(--mdc-accent); line-height:1; margin-bottom:6px; }
.mdc-ab-stat:hover .mdc-ab-stat-num{ color:#fff; }
.mdc-ab-stat-label{ display:block; font-size:12.5px; color:rgba(255,255,255,.72); line-height:1.3; }

/* Boutons */
.mdc-ab-btnwrap{ display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.mdc-ab-btn{ display:inline-flex; align-items:center; gap:10px; padding:15px 32px; border-radius:8px; text-decoration:none; font-weight:700; font-size:15px; line-height:1; font-family:inherit; color:#fff !important; border:0; cursor:pointer; box-shadow:0 8px 22px rgba(184,37,46,.3); transition:transform .25s ease, box-shadow .25s ease, background .3s ease, color .3s ease; }
.mdc-ab-btn span{ color:#fff !important; }
.mdc-ab-btn:hover{ transform:translateY(-3px); box-shadow:0 14px 32px rgba(0,0,0,.3); }
.mdc-ab-btn-ico{ display:inline-flex; align-items:center; transition:transform .25s ease; }
.mdc-ab-btn-ico svg{ width:15px; height:15px; fill:#fff !important; }
.mdc-ab-btn:hover .mdc-ab-btn-ico{ transform:translateX(4px); }
.mdc-ab-btn--outline{ background:transparent !important; border:2px solid rgba(255,255,255,.6); box-shadow:none; padding:13px 30px; }
.mdc-ab-btn--outline:hover{ background:#fff !important; color:var(--mdc-accent) !important; }
.mdc-ab-btn--outline:hover span{ color:var(--mdc-accent) !important; }
.mdc-ab-btn--outline:hover svg{ fill:var(--mdc-accent) !important; }

/* ===== ① BANNER — encart pleine largeur ===== */
.mdc-ab--banner .mdc-ab-inner{ position:relative; z-index:2; width:100%; padding:50px 56px; }
.mdc-ab--banner .mdc-ab-text{ max-width:760px; }
.mdc-ab--banner .mdc-ab-stats{ max-width:680px; }

/* ===== ② FLOATING — texte + chiffres flottants à droite ===== */
.mdc-ab--floating .mdc-ab-float-grid{ position:relative; z-index:2; width:100%; padding:50px 56px; display:grid; grid-template-columns:1.4fr 1fr; gap:40px; align-items:center; }
.mdc-ab-float-stats{ display:flex; flex-direction:column; gap:16px; }
.mdc-ab-fstat{ padding:24px 26px; background:rgba(255,255,255,.1); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,.18); border-radius:18px; box-shadow:0 16px 40px rgba(0,0,0,.25); transition:.3s ease; }
.mdc-ab-fstat:hover{ transform:translateX(-6px); background:rgba(184,37,46,.25); border-color:rgba(184,37,46,.5); }
.mdc-ab-fstat .mdc-ab-stat-num{ font-size:40px; }
.mdc-ab-fstat .mdc-ab-stat-label{ font-size:14px; }

/* ===== ③ FRAMED — image encadrée + contenu ===== */
.mdc-ab--framed .mdc-ab-framed{ display:grid; grid-template-columns:1fr 1fr; gap:46px; align-items:center; }
.mdc-ab--framed.imgside-left .mdc-ab-framed-img{ order:0; } .mdc-ab--framed.imgside-left .mdc-ab-framed-body{ order:1; }
.mdc-ab--framed.imgside-right .mdc-ab-framed-img{ order:1; }
.mdc-ab-framed-img{ position:relative; border-radius:22px; overflow:hidden; aspect-ratio:4/3; box-shadow:0 24px 60px rgba(8,10,10,.2); }
.mdc-ab-framed-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.mdc-ab-framed-badge{ position:absolute; bottom:18px; left:18px; background:var(--mdc-accent); color:#fff; padding:16px 20px; border-radius:14px; text-align:center; box-shadow:0 12px 26px rgba(184,37,46,.4); }
.mdc-ab-framed-badge .mdc-ab-stat-num{ color:#fff; font-size:28px; }
.mdc-ab-framed-badge .mdc-ab-stat-label{ color:rgba(255,255,255,.9); }
.mdc-ab--framed .mdc-ab-title{ color:var(--mdc-dark); }
.mdc-ab--framed .mdc-ab-eyebrow{ color:var(--mdc-accent); background:rgba(184,37,46,.1); }
.mdc-ab--framed .mdc-ab-text{ color:#555; }
.mdc-ab--framed .mdc-ab-stat{ background:#f6f6f7; border-color:rgba(8,10,10,.06); }
.mdc-ab--framed .mdc-ab-stat-label{ color:#777; }
.mdc-ab--framed .mdc-ab-stat:hover{ background:var(--mdc-accent); } .mdc-ab--framed .mdc-ab-stat:hover .mdc-ab-stat-label{ color:#fff; }

/* ===== ④ QUOTE — éditorial ===== */
.mdc-ab-quote{ position:relative; z-index:2; width:100%; max-width:880px; margin:0 auto; padding:60px 50px; text-align:center; }
.mdc-ab-quote-mark{ display:block; font-size:90px; line-height:.6; color:var(--mdc-accent); font-family:Georgia,serif; margin-bottom:10px; }
.mdc-ab-quote-title{ font-size:clamp(24px,3.2vw,36px); margin-bottom:22px; }
.mdc-ab-quote .mdc-ab-text{ font-size:1.15rem; max-width:680px; margin:0 auto 20px; }
.mdc-ab-signature{ font-style:italic; color:var(--mdc-accent); font-weight:700; font-size:1.05rem; margin-bottom:26px; }
.mdc-ab-quote .mdc-ab-stats{ justify-content:center; max-width:620px; margin-left:auto; margin-right:auto; }
.mdc-ab-quote .mdc-ab-btnwrap{ justify-content:center; }

/* ===== RESPONSIVE ===== */
@media (max-width:900px){
    .mdc-ab-banner.is-parallax{ background-attachment:scroll; }
    .mdc-ab--floating .mdc-ab-float-grid{ grid-template-columns:1fr; gap:28px; padding:34px 24px; }
    .mdc-ab-fstat:hover{ transform:none; }
    .mdc-ab--framed .mdc-ab-framed{ grid-template-columns:1fr; gap:26px; }
    .mdc-ab--framed.imgside-right .mdc-ab-framed-img,
    .mdc-ab--framed.imgside-left .mdc-ab-framed-img{ order:0; }
    .mdc-ab--banner .mdc-ab-inner{ padding:34px 24px; }
    .mdc-ab-quote{ padding:40px 22px; }
}