/* Présentation DSI Academy, refonte d'octobre 2026 : en-tête en deux colonnes, photos
   superposées, carte « Exemple » du tableau de bord, FAQ et appel final sur photo. */
.dsi-hero{padding:64px 0 72px}
.dsi-hero-grid{display:grid;gap:48px;align-items:center}
@media(min-width:960px){.dsi-hero-grid{grid-template-columns:1fr 1fr;gap:56px}}
.dsi-hero-text,.dsi-visual{min-width:0}
.dsi-kicker{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
.dsi-hero .lead{text-align:justify;hyphens:auto}
.dsi-ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.dsi-btn-ghost{border:1px solid rgba(129,140,248,.5);color:var(--text);background:transparent}
.dsi-visual{position:relative;min-height:340px}
.dsi-photo{margin:0;border-radius:18px;overflow:hidden;border:1px solid rgba(129,140,248,.35);box-shadow:0 24px 60px rgba(0,0,0,.5)}
.dsi-photo img{width:100%;height:100%;object-fit:cover;display:block}
.dsi-photo--back{width:82%;aspect-ratio:3/2}
.dsi-photo--front{position:absolute;right:0;top:46%;width:52%;aspect-ratio:3/2;border-width:3px;border-color:#0a0a14}
.dsi-example{position:relative;margin-top:110px;background:rgba(22,22,37,.97);border:1px solid rgba(129,140,248,.4);border-left:3px solid var(--accent);border-radius:14px;padding:14px 16px;box-shadow:0 18px 40px rgba(0,0,0,.5)}
@media(min-width:960px){.dsi-example{position:absolute;left:-24px;bottom:-60px;width:300px;margin:0;z-index:3}.dsi-visual{min-height:420px}}
.dsi-ex-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px}
.dsi-tag{font-size:.64rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:3px 8px;border-radius:6px;background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff}
.dsi-mono{font-family:ui-monospace,Consolas,monospace;font-size:.7rem;color:var(--text-muted)}
.dsi-bars{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.dsi-bars li{display:grid;grid-template-columns:1fr 60px 62px;align-items:center;gap:8px;font-size:.72rem;color:#cbd5e1}
.dsi-bars i{height:6px;border-radius:4px;background:rgba(255,255,255,.08);position:relative;overflow:hidden}
.dsi-bars i::after{content:"";position:absolute;inset:0;width:var(--v);background:linear-gradient(90deg,var(--primary-light),var(--accent))}
.dsi-bars b{color:#fff;text-align:right;font-weight:600}
.dsi-faq .wrap{max-width:820px}
.dsi-q{border:1px solid var(--border);border-radius:14px;background:var(--bg-card);margin-top:12px;text-align:left}
.dsi-q summary{cursor:pointer;list-style:none;padding:18px 52px 18px 20px;color:#fff;font-weight:600;position:relative}
.dsi-q summary::-webkit-details-marker{display:none}
.dsi-q summary::after{content:"";position:absolute;right:20px;top:50%;width:10px;height:10px;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:translateY(-70%) rotate(45deg);transition:transform .2s}
.dsi-q[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.dsi-q p{padding:0 20px 18px;color:var(--text-muted);line-height:1.7;text-align:justify;hyphens:auto;margin:0}
.dsi-final{position:relative;border-radius:22px;overflow:hidden;border:1px solid rgba(129,140,248,.3);min-height:320px;display:grid;place-items:center}
.dsi-final>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.dsi-final::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,10,20,.78),rgba(30,20,60,.92));z-index:1}
.dsi-final-copy{position:relative;z-index:2;text-align:center;padding:44px 20px;max-width:660px}
.dsi-hero{text-align:left;overflow:visible;height:auto;min-height:0}
.dsi-hero h1,.dsi-hero .dsi-kicker{text-align:left}
.dsi-hero .lead{margin-left:0;margin-right:0;max-width:none}
@media(max-width:959px){.dsi-visual{min-height:0}.dsi-photo--back{width:100%}.dsi-photo--front{display:none}.dsi-example{margin-top:14px}}
.dsi-bars li span{text-align:left}.dsi-visual{overflow:visible}