/* I4 — Démonstrations interactives 100% fictives, sans compte.
   Complète site-vitrine.css. */
.demo-hero{background:radial-gradient(ellipse at 85% 16%,#d0ebe0 0%,transparent 38%),linear-gradient(130deg,#f3faf6,#e9f5f2 64%,#f9fbf8)}
.demo-hero h1{max-width:950px}
.demo-hero-note{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:12px;font-weight:760;color:#366e65;margin-top:19px}
.demo-area{padding:65px 0 80px;background:linear-gradient(180deg,#f8fcfa,#f1f8f5)}
.demo-intro{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:29px}
.demo-intro h2{font:700 clamp(31px,4vw,44px)/1.2 Lora,serif;margin:11px 0 14px}
.demo-intro p{font-size:15px;color:#587274;max-width:690px;line-height:1.8;margin:0}
.demo-guide-link{font-size:13px;font-weight:800;color:#2d7167;text-decoration:underline;white-space:nowrap}
.demo-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:15px}
.demo-tab{cursor:pointer;text-align:left;min-height:85px;display:flex;align-items:center;gap:12px;border:1px solid #d9e7e2;border-radius:15px;background:#fff;color:#244c52;padding:17px 19px;font-family:inherit;font-weight:850;line-height:1.3;transition:background .15s,border-color .15s,box-shadow .15s}
.demo-tab>span:first-child{font-size:26px;flex:0 0 auto}
.demo-tab small{font-weight:550;font-size:11px;color:#6b8183;display:block;margin-top:6px}
.demo-tab:hover{background:#f4faf7;border-color:#b1d9cd}
.demo-tab.is-active{background:#e7f4ec;border-color:#4b9f8f;box-shadow:inset 0 0 0 1px #4b9f8f}
.demo-tab.is-active small{color:#456e67}
.demo-panel[hidden]{display:none!important}
.demo-panel{border:1px solid #d6e8e0;border-radius:19px;background:#fff;overflow:hidden;box-shadow:0 18px 53px #1549440e}
.demo-workspace{display:grid;grid-template-columns:minmax(290px,.78fr) minmax(0,1.22fr)}
.demo-config{padding:29px 26px 33px;background:#fcfefd;border-right:1px solid #e1ebe7}
.demo-stage{color:#318071;font:800 16px Lora,serif;display:flex;align-items:center;gap:9px}
.demo-stage span{font:800 11px "DM Sans",system-ui,sans-serif;letter-spacing:.11em;text-transform:uppercase}
.demo-config h3{font:700 25px/1.28 Lora,serif;letter-spacing:-.03em;margin:13px 0 10px}
.demo-config>p{font-size:13px;color:#597375;line-height:1.7;margin:0 0 19px}
.demo-fieldset{border:0;padding:0;margin:19px 0 22px;min-width:0}
.demo-fieldset legend{padding:0 0 9px;color:#385b60;font-size:12px;font-weight:850}
.demo-choice-row{display:flex;flex-wrap:wrap;gap:8px}
.demo-choice{cursor:pointer;display:flex;align-items:center;gap:9px;padding:11px 12px;border:1px solid #cadfd7;background:#fff;border-radius:10px;font-size:12px;font-weight:820;color:#35645e}
.demo-choice input{accent-color:#237467;width:17px;height:17px;margin:0;flex:0 0 17px}
.demo-choice:has(input:checked){background:#e8f6ee;border-color:#63a98c;box-shadow:inset 0 0 0 1px #63a98c}
.demo-choice-block{margin-bottom:9px;padding:12px 13px}
.demo-choice-block strong{font-size:12px;display:block}
.demo-choice-block small{display:block;color:#66817d;font-size:11px;font-weight:520;margin-top:2px}
.demo-action{width:100%;cursor:pointer;white-space:normal}
.demo-side-note{padding:12px 13px;border:1px solid #e9dfc9;border-radius:9px;background:#fff9ef;color:#756346!important;font-size:11px!important;line-height:1.6!important;margin-top:15px!important}
.demo-result{padding:25px 26px 20px;min-width:0}
.demo-preview-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:4px}
.demo-preview-head small{font-size:10px;letter-spacing:.11em;font-weight:850;color:#518079}
.demo-preview-head h3{font:700 24px/1.3 Lora,serif;letter-spacing:-.02em;margin:7px 0 5px}
.demo-status{font-size:11px;color:#256d60;background:#e7f5ed;padding:6px 10px;border-radius:999px;white-space:nowrap;font-weight:800}
.demo-preview-sub{color:#617b7a;font-size:12px;padding-bottom:13px;border-bottom:1px solid #e4eeea}
.demo-journal-row{display:grid;grid-template-columns:60px minmax(0,1fr);gap:11px;padding:11px 0;border-bottom:1px solid #edf1ef;align-items:start}
.demo-journal-row time{font-size:12px;font-weight:850;color:#34736b;padding-top:10px;font-variant-numeric:tabular-nums}
.demo-journal-card{border-radius:10px;background:#f2f9f5;padding:11px 14px;border-left:3px solid #6ba99a;min-width:0}
.demo-journal-card strong{font-size:13px;color:#255b57;display:block}
.demo-journal-card span{font-size:12px;color:#56787a;display:block;margin-top:4px;line-height:1.55}
.demo-journal-card small{font-size:11px;color:#4a8172;display:block;margin-top:5px}
.demo-journal-row.break .demo-journal-card{background:#f6f8f7;border-left-color:#a1b9b5}
.demo-journal-warning{background:#fff9ec;border:1px solid #eee1bf;color:#786a53;border-radius:9px;font-size:11px;padding:12px 14px;margin-top:13px;line-height:1.6}
.demo-result-foot{display:flex;align-items:center;justify-content:space-between;gap:13px;flex-wrap:wrap;color:#708887;font-size:11px;font-weight:710;padding-top:15px}
.demo-days{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.demo-day{border:1px solid #cde1d9;background:#fff;border-radius:11px;padding:11px;cursor:pointer;font:800 13px "DM Sans",sans-serif;color:#456c67}
.demo-day:hover{background:#f4faf6}
.demo-day.is-active{background:#237568;color:white;border-color:#237568}
.demo-mini-guide{background:#f0f8f5;border:1px solid #d5e8df;border-radius:13px;padding:16px;margin-top:19px}
.demo-mini-guide strong{color:#276c61;font-size:13px}
.demo-mini-guide p{margin:5px 0 0;color:#577476;font-size:12px;line-height:1.65}
.demo-school-card{display:flex;align-items:flex-start;gap:17px;background:#eff8f4;border:1px solid #d9eae2;border-radius:14px;padding:17px;margin-top:17px}
.demo-school-icon{display:grid;place-items:center;background:#dbeee5;width:52px;height:52px;border-radius:14px;font-size:27px;flex:0 0 auto}
.demo-school-card small{font-size:10px;letter-spacing:.1em;font-weight:850;color:#307969}
.demo-school-card h4{font:700 22px Lora,serif;margin:2px 0 4px}
.demo-school-card p{font-size:12px;font-weight:800;margin:0;color:#446d67}
.demo-school-card span{font-size:12px;color:#5e7b78;display:block;margin-top:3px}
.demo-day-agenda{margin-top:11px}
.demo-select{display:block;width:100%;min-height:48px;border:1px solid #cadbd5;border-radius:9px;background:white;color:#275f57;font:700 12px "DM Sans",sans-serif;padding:10px 14px;cursor:pointer}
.demo-reset{border:0;background:transparent;color:#2b7466;text-decoration:underline;font:800 12px "DM Sans",sans-serif;cursor:pointer;margin-top:14px}
.demo-progress-list{display:grid;gap:12px;margin:17px 0}
.demo-progress-card{border:1px solid #d9e9e3;background:#fafdfb;border-radius:14px;padding:17px}
.demo-progress-title{display:flex;justify-content:space-between;align-items:start;gap:12px}
.demo-progress-title small{font-size:10px;font-weight:850;letter-spacing:.1em;color:#34786d}
.demo-progress-title h4{font:700 20px Lora,serif;margin:4px 0 11px}
.demo-progress-count{font-size:11px;color:#3c7668;font-weight:800;background:#e8f4ee;border-radius:8px;padding:6px 9px;white-space:nowrap}
.demo-progress-meter{height:7px;border-radius:8px;background:#e2eee9;overflow:hidden}
.demo-progress-meter span{display:block;height:100%;background:#4d9d8b;border-radius:8px}
.demo-progress-bottom{margin-top:13px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.demo-progress-bottom strong{font-size:11px;color:#436764}
.demo-status-pill{font-size:10px;font-weight:850;padding:7px 10px;border-radius:999px;background:#e7ebeb;color:#627472}
.demo-status-pill.assumed,.demo-status-pill.done{background:#dff3e9;color:#256c56}
.demo-status-pill.partial{background:#fff1d4;color:#816021}
.demo-status-pill.notdone{background:#fbe9e5;color:#914c3c}
.demo-next{background:#eff8f4;border:1px solid #d6e9e0;border-radius:12px;padding:15px;margin-top:13px}
.demo-next strong{font-size:13px;color:#2f6e65}
.demo-next p{color:#557475;font-size:12px;line-height:1.65;margin:6px 0}
.demo-next small{font-size:11px;color:#6a817c}
.demo-bottom{display:flex;align-items:center;justify-content:space-between;gap:23px;margin-top:17px;padding:19px 22px;border-radius:15px;background:#e4f2ea;border:1px solid #cde6db}
.demo-bottom strong{font-size:14px}
.demo-bottom p{margin:3px 0 0;color:#52746f;font-size:12px;line-height:1.6}
.demo-bottom .btn{white-space:nowrap}
.demo-cta-pair{display:flex;align-items:center;justify-content:end;gap:9px;flex-wrap:wrap}
.demo-cta-pair .btn{font-size:12px;padding-inline:13px}
@media(max-width:1040px){.demo-workspace{grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr)}.demo-tab{padding:15px 13px}.demo-tab>span:first-child{font-size:23px}}
@media(max-width:850px){.demo-workspace{grid-template-columns:1fr}.demo-config{border-right:0;border-bottom:1px solid #e1ebe7}.demo-tab{min-height:79px}.demo-tab small{display:none}.demo-bottom{align-items:flex-start;flex-direction:column}.demo-intro{flex-direction:column;align-items:flex-start}}
@media(max-width:600px){.demo-area{padding:44px 0 55px}.demo-tabs{gap:6px}.demo-tab{flex-direction:column;align-items:center;text-align:center;justify-content:center;padding:10px 6px;min-height:78px;font-size:11px;gap:7px}.demo-tab>span:first-child{font-size:22px}.demo-tab>span:last-child{max-width:100%}.demo-config,.demo-result{padding:20px 16px}.demo-config h3{font-size:23px}.demo-preview-head h3{font-size:21px}.demo-preview-head{align-items:start}.demo-school-card{gap:11px;padding:13px}.demo-school-card h4{font-size:18px}.demo-school-icon{width:39px;height:39px;flex-basis:39px;font-size:20px}.demo-bottom{padding:17px}.demo-bottom .btn{width:100%}.demo-cta-pair{width:100%;flex-direction:column;align-items:stretch}.demo-journal-row{grid-template-columns:48px minmax(0,1fr);gap:6px}.demo-journal-card{padding:10px}.demo-journal-row time{font-size:11px}.demo-progress-title h4{font-size:18px}.demo-progress-count{font-size:10px}.demo-intro h2{font-size:31px}}
@media(prefers-reduced-motion:reduce){.demo-tab{transition:none}}