/* =====================================================================
   STUDIO REVO — V55 « Offre claire, ambition visible » (couche additive)
   ===================================================================== */
.x55-svg{width:100%;height:auto;display:block;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif}

/* ---- Hero : scène besoin → solution ---- */
.x55-hero-fig{margin:0;max-width:560px;justify-self:end;width:100%}
.x55-hero-svg{width:100%;height:auto;display:block;font-family:Inter,system-ui,sans-serif}
.x55-hero-svg .hxv-k{font-size:12px;fill:#C9C5CC;letter-spacing:.02em;font-weight:600}
.x55-hero-svg .hxv-q{font-size:17px;fill:#F4F2F0;font-weight:600}
.x55-hero-svg .hxv-src rect{fill:#1C1B21;stroke:rgba(255,255,255,.16)}
.x55-hero-svg .hxv-src text{font-size:14px;fill:#ECEAE8}
.x55-hero-svg .hxv-row text{font-size:14px;fill:#ECEAE8}
.x55-hero-svg .hxv-line{fill:none;stroke:rgba(194,85,122,.7);stroke-width:1.5}
.x55-hero-svg .hxv-flow{fill:none;stroke:#C2557A;stroke-width:2;stroke-dasharray:4 5}
.x55-hero-svg .hxv-t{font-size:16px;fill:#17161A;font-weight:650}
.x55-hero-svg .hxv-m{font-size:11px;fill:#6B6870}
.x55-hero-svg .hxv-step text{font-size:12px;fill:#3B3940}
.x55-hero-svg .hxv-n{font-size:13px;fill:#17161A}
.x55-hero-svg .hxv-ok{font-size:12px;fill:#2E5E45;font-weight:600}
@media (prefers-reduced-motion:no-preference){
  .x55-hero-svg .hxv-flow{animation:hxvdash 1.6s linear infinite}
  .x55-hero-svg .hxv-prog{stroke-dasharray:310;stroke-dashoffset:310;animation:hxvprog 2.4s .6s ease-out forwards}
}
@keyframes hxvdash{to{stroke-dashoffset:-18}}
@keyframes hxvprog{to{stroke-dashoffset:0}}
@media (max-width:900px){.x55-hero-fig{justify-self:stretch;margin-top:28px}}

/* ---- Motifs des expertises ---- */
.x54-xp .x55-motif{margin:-6px -4px 14px;padding:10px 8px;border-radius:8px;background:#FAF9FB;border:1px solid rgba(17,17,19,.06)}
.x54-xp .x55-motif svg{max-height:96px}

/* ---- Applications en onglets ---- */
.x55-apps{margin-top:36px;border:1px solid rgba(17,17,19,.12);border-radius:14px;background:#fff;overflow:hidden}
.x55-tabs{display:flex;flex-wrap:wrap;gap:0;border-bottom:1px solid rgba(17,17,19,.12);background:#FAFAFB}
.x55-tabs button{flex:1 1 0;min-width:150px;border:0;background:transparent;padding:16px 14px;font:600 .9rem/1.3 Inter,system-ui,sans-serif;color:#4A474F;cursor:pointer;border-right:1px solid rgba(17,17,19,.07);border-bottom:3px solid transparent;text-align:left}
.x55-tabs button:last-child{border-right:0}
.x55-tabs button[aria-selected=true]{color:var(--burgundy,#671032);background:#fff;border-bottom-color:var(--burgundy,#671032)}
.x55-tabs button:focus-visible{outline:2px solid var(--burgundy,#671032);outline-offset:-3px}
.x55-panel{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(20px,3vw,40px);padding:clamp(18px,2.6vw,32px);align-items:start}
.x55-panel[hidden]{display:none}
.x55-panel figure{margin:0;padding:14px;background:#FAF9FB;border:1px solid rgba(17,17,19,.06);border-radius:10px}
.x55-panel h3{margin:0 0 6px;font-size:1.25rem;line-height:1.3}
.x55-panel .x55-tag{display:inline-block;margin:0 0 14px;font-size:.78rem;color:var(--x54-mute,#5F5C63)}
.x55-panel dl{margin:0}
.x55-panel dl div{padding:9px 0;border-bottom:1px solid rgba(17,17,19,.07)}
.x55-panel dt{font-size:.78rem;font-weight:600;color:var(--burgundy,#671032);margin:0 0 2px}
.x55-panel dd{margin:0;font-size:.93rem;line-height:1.55;color:#17161A}
.x55-chips{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0;padding:0;list-style:none}
.x55-chips li{font-size:.78rem;padding:4px 9px;border-radius:5px;background:var(--paper-2,#EEF1F5);color:#17161A}
.no-js .x55-tabs{display:none}
@media (max-width:900px){.x55-panel{grid-template-columns:1fr}.x55-tabs button{min-width:50%;flex:1 1 50%}}
@media (max-width:520px){.x55-tabs button{min-width:100%;border-right:0;border-bottom:1px solid rgba(17,17,19,.07)}}

/* ---- Situations : 8 entrées, défis et ambitions ---- */
.x55-reco{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:34px 0 0;padding:0;list-style:none}
.x55-reco li{background:#fff;border:1px solid rgba(17,17,19,.1);border-radius:10px;padding:20px 18px;display:flex;flex-direction:column;gap:10px}
.x55-reco .x55-kind{font-size:.74rem;font-weight:600;color:var(--x54-mute,#5F5C63)}
.x55-reco .x55-kind.amb{color:#2E5E86}
.x55-reco q{quotes:"«\00a0" "\00a0»";font-weight:600;font-size:1rem;line-height:1.42;color:#17161A}
.x55-reco p{margin:0;font-size:.89rem;line-height:1.52;color:var(--x54-mute,#5F5C63)}
.x55-reco p b{color:#17161A;font-weight:600}
.x55-reco a{margin-top:auto;font-size:.88rem;font-weight:600;color:var(--burgundy,#671032)}
@media (max-width:1100px){.x55-reco{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.x55-reco{grid-template-columns:1fr}}

/* ---- Fiche service (en tête de chaque page) ---- */
.x55-brief{padding:clamp(36px,5vw,56px) 0;background:#fff;border-bottom:1px solid rgba(17,17,19,.08)}
.x55-brief h2{font-size:clamp(22px,2.2vw,28px);margin:0 0 6px;max-width:none}
.x55-brief .x55-lead{margin:0 0 24px;color:var(--x54-mute,#5F5C63);max-width:72ch}
.x55-brief-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:0;border-top:2px solid var(--burgundy,#671032)}
.x55-brief-grid div{padding:18px 18px 4px 0}
.x55-brief-grid div+div{padding-left:18px;border-left:1px solid rgba(17,17,19,.08)}
.x55-brief-grid h3{font-size:.86rem;margin:0 0 8px;color:var(--burgundy,#671032)}
.x55-brief-grid ul{margin:0;padding:0 0 0 16px}
.x55-brief-grid li{font-size:.9rem;line-height:1.5;margin:0 0 5px;color:#17161A}
.x55-brief-grid p{margin:0 0 10px;font-size:.9rem;line-height:1.5}
.x55-brief-grid a.btn{margin-top:4px}
@media (max-width:1100px){.x55-brief-grid{grid-template-columns:repeat(3,1fr)}.x55-brief-grid div:nth-child(4){padding-left:0;border-left:0}}
@media (max-width:700px){.x55-brief-grid{grid-template-columns:1fr}.x55-brief-grid div,.x55-brief-grid div+div{padding:16px 0 4px;border-left:0;border-top:1px solid rgba(17,17,19,.08)}}

/* ---- Hub Services : index des 6 expertises équilibré ---- */
.ens-idx ul{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:8px!important}
@media (max-width:760px){.ens-idx ul{grid-template-columns:1fr 1fr!important}}
@media (max-width:480px){.ens-idx ul{grid-template-columns:1fr!important}}

/* ---- Hero de l'accueil : titre mesuré ---- */
.hx11 #hx-title{font-size:clamp(34px,4.1vw,56px);line-height:1.06;max-width:15ch}
.hx11 .hx-sub{max-width:52ch}

/* ---- IA : exécution d'un agent (interface illustrative) ---- */
.x55-run{background:#fff;border:1px solid rgba(17,17,19,.12);border-radius:14px;box-shadow:0 24px 50px -32px rgba(20,20,30,.35);overflow:hidden;font-size:.92rem}
.x55-run-top{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 18px;background:#17161A;color:#F2F0EE}
.x55-run-top b{font-size:.95rem}
.x55-run-top span{font-size:.76rem;color:#C9C5CC}
.x55-run-goal{padding:14px 18px;border-bottom:1px solid rgba(17,17,19,.08);background:#FAF9FB}
.x55-run-goal small{display:block;font-size:.74rem;font-weight:600;color:var(--burgundy,#671032);margin-bottom:2px}
.x55-run ol{list-style:none;margin:0;padding:6px 18px}
.x55-run li{display:grid;grid-template-columns:22px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid rgba(17,17,19,.06)}
.x55-run li:last-child{border-bottom:0}
.x55-run li i{width:18px;height:18px;border-radius:50%;display:block}
.x55-run .r i{background:#DCE7F1;box-shadow:inset 0 0 0 5px #7FA8C9}
.x55-run .a i{background:#E1EEE5;box-shadow:inset 0 0 0 5px #3A7657}
.x55-run .h i{background:#F5E3EA;box-shadow:inset 0 0 0 5px #671032}
.x55-run li em{font-style:normal;font-size:.72rem;font-weight:600;padding:3px 8px;border-radius:999px;white-space:nowrap}
.x55-run .r em{background:#EEF3F8;color:#2E5E86}.x55-run .a em{background:#EAF3ED;color:#2E5E45}.x55-run .h em{background:#F7EBF0;color:#671032}
.x55-run-out{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(17,17,19,.08)}
.x55-run-out div{padding:12px 14px;text-align:center}
.x55-run-out div+div{border-left:1px solid rgba(17,17,19,.08)}
.x55-run-out b{display:block;font-size:1.35rem;line-height:1.1;color:#17161A}
.x55-run-out span{font-size:.76rem;color:#5F5C63}
.x55-run-foot{padding:9px 18px;font-size:.74rem;color:#6B6870;background:#FAF9FB;border-top:1px solid rgba(17,17,19,.06)}
@media (prefers-reduced-motion:no-preference){.x55-run li{animation:x55in .5s both}.x55-run li:nth-child(2){animation-delay:.25s}.x55-run li:nth-child(3){animation-delay:.5s}.x55-run li:nth-child(4){animation-delay:.75s}.x55-run li:nth-child(5){animation-delay:1s}}
@keyframes x55in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---- Formation : progression ---- */
.x55-learn{background:#fff;border:1px solid rgba(17,17,19,.12);border-radius:14px;padding:20px;box-shadow:0 24px 50px -32px rgba(20,20,30,.35)}
.x55-learn ol{list-style:none;margin:0 0 18px;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:6px;counter-reset:l}
.x55-learn ol li{counter-increment:l;padding:10px 8px 8px;border-radius:8px;background:#F4F2F5;font-size:.84rem;font-weight:600;color:#17161A;position:relative}
.x55-learn ol li::before{content:counter(l);display:block;font-size:.72rem;color:#6B6870;font-weight:600;margin-bottom:2px}
.x55-learn ol li.on{background:var(--burgundy,#671032);color:#fff}.x55-learn ol li.on::before{color:#F1D9E2}
.x55-learn ol li.done{background:#E7EFE9}
.x55-ex{border:1px solid rgba(17,17,19,.1);border-radius:10px;overflow:hidden}
.x55-ex div{display:grid;grid-template-columns:110px 1fr;gap:12px;padding:10px 14px;border-bottom:1px solid rgba(17,17,19,.06);font-size:.88rem;line-height:1.45}
.x55-ex div:last-child{border-bottom:0}
.x55-ex b{font-size:.76rem;color:var(--burgundy,#671032)}
.x55-learn p{margin:12px 0 0;font-size:.76rem;color:#6B6870}
@media (max-width:520px){.x55-learn ol{grid-template-columns:repeat(2,1fr)}.x55-ex div{grid-template-columns:1fr;gap:2px}}
.x55-hero-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center}
@media (max-width:900px){.x55-hero-split{grid-template-columns:1fr}}
.x55-motif-hub{max-width:260px;margin:0 0 14px;padding:8px;border-radius:8px;background:#FAF9FB;border:1px solid rgba(17,17,19,.06)}
/* ---- Mobile : version lisible du visuel du hero + situations en défilement ---- */
.x55-hero-mob{display:none}
@media (max-width:600px){
  .x55-hero-svg{display:none}
  .x55-hero-mob{display:grid;gap:10px;list-style:none;margin:0;padding:0}
  .x55-hero-mob li{border:1px solid rgba(255,255,255,.16);background:#1C1B21;border-radius:10px;padding:12px 14px;color:#ECEAE8;font-size:.92rem;line-height:1.45;display:flex;flex-direction:column;gap:4px}
  .x55-hero-mob small{font-size:.74rem;font-weight:600;color:#C9C5CC}
  .x55-hero-mob li.sol{background:#F6F5F3;color:#17161A;border-color:transparent}
  .x55-hero-mob li.sol small{color:#6B6870}
  .x55-hero-mob .bar{display:block;height:4px;border-radius:2px;background:#D6D3D9;margin:6px 0 2px}
  .x55-hero-mob .bar i{display:block;height:100%;width:68%;background:#671032;border-radius:2px}
  .x55-hero-mob em{font-style:normal;color:#6B6870}
  .x55-reco{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding-bottom:10px;margin-right:-20px;padding-right:20px}
  .x55-reco li{flex:0 0 84%;scroll-snap-align:start}
  .x55-reco:focus-visible{outline:2px solid var(--burgundy,#671032);outline-offset:4px}
}
