/* MDC · Étapes — multi-designs */
.mdc-ep{ --mdc-accent:#b8252e; --mdc-dark:#080a0a; --mdc-ep-radius:18px; }
.mdc-ep-head{ text-align:center; max-width:620px; margin:0 auto 44px; }
.mdc-ep-eyebrow{ display:inline-flex; align-items:center; gap:8px; text-transform:uppercase; letter-spacing:3px; font-size:13px; font-weight:700; color:var(--mdc-accent); margin-bottom:12px; }
.mdc-ep-eyebrow::before{ content:''; width:28px; height:2px; background:var(--mdc-accent); }
.mdc-ep-title{ margin:0; font-size:clamp(26px,4vw,40px); line-height:1.15; font-weight:800; color:var(--mdc-dark); }
.mdc-ep-hl{ color:var(--mdc-accent); }
.mdc-ep-step-title{ margin:0 0 8px; font-size:19px; font-weight:700; color:var(--mdc-dark); line-height:1.3; }
.mdc-ep-step-text{ margin:0; font-size:14.5px; line-height:1.6; color:#666; }
.mdc-ep-ico{ display:inline-flex; align-items:center; justify-content:center; color:var(--mdc-accent); }
.mdc-ep-ico svg{ fill:var(--mdc-accent); }

/* ===== ① SERPENTIN ===== */
.mdc-ep-serp{ position:relative; max-width:780px; margin:0 auto; display:flex; flex-direction:column; gap:0; }
.mdc-ep-serp-item{ position:relative; display:flex; align-items:center; gap:24px; padding:22px 0; opacity:0; transform:translateY(24px); }
.mdc-ep-serp-item.is-in{ opacity:1; transform:none; transition:opacity .5s ease, transform .5s cubic-bezier(.2,.7,.2,1); transition-delay:calc(var(--mdc-ep-i,1) * .1s); }
.mdc-ep-serp-item.is-rev{ flex-direction:row-reverse; }
.mdc-ep-serp-num{ flex:0 0 auto; width:64px; height:64px; border-radius:50%; background:linear-gradient(135deg,var(--mdc-accent),var(--mdc-dark)); color:#fff; display:flex; align-items:center; justify-content:center; font-size:22px; font-weight:800; box-shadow:0 10px 26px rgba(184,37,46,.3); position:relative; z-index:2; }
.mdc-ep-serp-card{ flex:1; display:flex; align-items:center; gap:18px; background:#fff; border:1px solid rgba(8,10,10,.07); border-radius:var(--mdc-ep-radius); padding:22px 26px; box-shadow:0 8px 26px rgba(8,10,10,.06); }
.mdc-ep-serp-item.is-rev .mdc-ep-serp-card{ flex-direction:row-reverse; text-align:right; }
.mdc-ep-serp-card .mdc-ep-ico{ flex:0 0 auto; width:52px; height:52px; border-radius:14px; background:linear-gradient(135deg,rgba(184,37,46,.12),rgba(184,37,46,.04)); font-size:22px; }
.mdc-ep-serp-card .mdc-ep-ico svg{ width:22px; height:22px; }
/* tracé serpentin */
.mdc-ep-serp-item::before{ content:''; position:absolute; left:31px; top:50%; bottom:-50%; width:3px; background:repeating-linear-gradient(var(--mdc-accent) 0 6px, transparent 6px 12px); opacity:.4; z-index:0; }
.mdc-ep-serp-item.is-rev::before{ left:auto; right:31px; }
.mdc-ep-serp-item:last-child::before{ display:none; }

/* ===== ② WHEEL ===== */
.mdc-ep-wheel{ position:relative; width:420px; height:420px; margin:20px auto 0; }
.mdc-ep-wheel-center{ position:absolute; top:50%; left:50%; width:150px; height:150px; transform:translate(-50%,-50%); border-radius:50%; background:linear-gradient(135deg,var(--mdc-accent),var(--mdc-dark)); color:#fff; display:flex; flex-direction:column; align-items:center; justify-content:center; box-shadow:0 16px 40px rgba(184,37,46,.35); z-index:2; }
.mdc-ep-wheel-center-num{ font-size:48px; font-weight:800; line-height:1; }
.mdc-ep-wheel-center-label{ font-size:13px; text-transform:uppercase; letter-spacing:2px; opacity:.85; }
.mdc-ep-wheel-dot{ position:absolute; top:50%; left:50%; width:74px; height:74px; margin:-37px; border-radius:50%; background:#fff; border:2px solid rgba(8,10,10,.1); cursor:pointer; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; transition:.3s ease; box-shadow:0 8px 22px rgba(8,10,10,.1); transform:rotate(calc(var(--mdc-ep-i) * (360deg / var(--mdc-ep-total,4)))) translateY(-150px) rotate(calc(var(--mdc-ep-i) * (-360deg / var(--mdc-ep-total,4)))); }
.mdc-ep-wheel-dot .mdc-ep-ico{ font-size:18px; } .mdc-ep-wheel-dot .mdc-ep-ico svg{ width:18px;height:18px; }
.mdc-ep-wheel-n{ font-size:11px; font-weight:700; color:var(--mdc-dark); }
.mdc-ep-wheel-dot.is-active{ background:var(--mdc-accent); border-color:var(--mdc-accent); transform:rotate(calc(var(--mdc-ep-i) * (360deg / var(--mdc-ep-total,4)))) translateY(-150px) rotate(calc(var(--mdc-ep-i) * (-360deg / var(--mdc-ep-total,4)))) scale(1.15); }
.mdc-ep-wheel-dot.is-active .mdc-ep-ico, .mdc-ep-wheel-dot.is-active .mdc-ep-ico svg, .mdc-ep-wheel-dot.is-active .mdc-ep-wheel-n{ color:#fff; fill:#fff; }
.mdc-ep-wheel-panels{ position:absolute; top:100%; left:50%; transform:translateX(-50%); width:340px; margin-top:30px; text-align:center; }
.mdc-ep-wheel-panel{ display:none; } .mdc-ep-wheel-panel.is-active{ display:block; animation:mdcEpFade .4s ease; }
@keyframes mdcEpFade{ from{opacity:0;transform:translateY(10px);} to{opacity:1;transform:none;} }

/* ===== ③ STACKED ===== */
.mdc-ep-stacked{ max-width:720px; margin:0 auto; display:flex; flex-direction:column; gap:18px; }
.mdc-ep-stack-card{ display:flex; align-items:center; gap:24px; background:#fff; border:1px solid rgba(8,10,10,.07); border-radius:var(--mdc-ep-radius); padding:26px 30px; box-shadow:0 8px 30px rgba(8,10,10,.07); position:relative; overflow:hidden; opacity:0; transform:translateY(40px) scale(.96); }
.mdc-ep-stack-card.is-in{ opacity:1; transform:none; transition:opacity .55s ease, transform .55s cubic-bezier(.2,.7,.2,1); transition-delay:calc(var(--mdc-ep-i,1) * .12s); }
.mdc-ep-stack-card::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:5px; background:linear-gradient(var(--mdc-accent),var(--mdc-dark)); }
.mdc-ep-stack-side{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; line-height:1; }
.mdc-ep-stack-num{ font-size:42px; font-weight:800; color:var(--mdc-accent); }
.mdc-ep-stack-of{ font-size:13px; color:#aaa; font-weight:600; }
.mdc-ep-stack-card .mdc-ep-ico{ flex:0 0 auto; width:56px; height:56px; border-radius:15px; background:linear-gradient(135deg,rgba(184,37,46,.12),rgba(184,37,46,.04)); font-size:23px; }
.mdc-ep-stack-card .mdc-ep-ico svg{ width:23px;height:23px; }
.mdc-ep-stack-body{ flex:1; }

/* ===== ④ PROGRESS ===== */
.mdc-ep-progress{ position:relative; }
.mdc-ep-progress-track{ position:absolute; top:36px; left:8%; right:8%; height:4px; background:rgba(8,10,10,.08); border-radius:4px; z-index:0; }
.mdc-ep-progress-fill{ display:block; height:100%; width:0; background:linear-gradient(90deg,var(--mdc-accent),var(--mdc-dark)); border-radius:4px; transition:width 1.4s cubic-bezier(.4,0,.2,1); }
.mdc-ep-progress.is-in .mdc-ep-progress-fill{ width:100%; }
.mdc-ep-progress-items{ position:relative; z-index:1; display:flex; gap:20px; }
.mdc-ep-progress-item{ flex:1; text-align:center; opacity:0; transform:translateY(20px); }
.mdc-ep-progress-item.is-in{ opacity:1; transform:none; transition:opacity .5s ease, transform .5s ease; transition-delay:calc(var(--mdc-ep-i,1) * .15s); }
.mdc-ep-progress-dot{ width:72px; height:72px; margin:0 auto 18px; border-radius:50%; background:#fff; border:3px solid var(--mdc-accent); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px; box-shadow:0 8px 22px rgba(184,37,46,.18); }
.mdc-ep-progress-dot .mdc-ep-ico{ font-size:20px; } .mdc-ep-progress-dot .mdc-ep-ico svg{ width:20px;height:20px; }
.mdc-ep-progress-n{ font-size:11px; font-weight:800; color:var(--mdc-accent); }
.mdc-ep-progress-item .mdc-ep-step-text{ max-width:200px; margin:0 auto; }

/* ===== RESPONSIVE ===== */
@media (max-width:768px){
    .mdc-ep-serp-item, .mdc-ep-serp-item.is-rev{ flex-direction:row; gap:16px; }
    .mdc-ep-serp-card, .mdc-ep-serp-item.is-rev .mdc-ep-serp-card{ flex-direction:row; text-align:left; padding:18px; }
    .mdc-ep-serp-item::before, .mdc-ep-serp-item.is-rev::before{ left:31px; right:auto; }
    .mdc-ep-wheel{ width:300px; height:300px; }
    .mdc-ep-wheel-dot{ transform:rotate(calc(var(--mdc-ep-i) * (360deg / var(--mdc-ep-total,4)))) translateY(-110px) rotate(calc(var(--mdc-ep-i) * (-360deg / var(--mdc-ep-total,4)))); }
    .mdc-ep-wheel-dot.is-active{ transform:rotate(calc(var(--mdc-ep-i) * (360deg / var(--mdc-ep-total,4)))) translateY(-110px) rotate(calc(var(--mdc-ep-i) * (-360deg / var(--mdc-ep-total,4)))) scale(1.12); }
    .mdc-ep-wheel-panels{ width:280px; }
    .mdc-ep-stack-card{ flex-wrap:wrap; gap:16px; padding:20px; }
    .mdc-ep-progress-items{ flex-direction:column; gap:30px; }
    .mdc-ep-progress-track{ display:none; }
}