/* ============================================================
   GLOSSOLALIE ADVISORY - Page simulateur d'intégration
   Aucun style inline : la CSP du site interdit <style> et style="".
   Design clair : teinte pâle et filet fin, aucun bloc sombre.
   ============================================================ */
.sim-prose > * + * { margin-top: var(--space-4); }
.sim-prose p, .sim-list li, .sim-steps li, .sim-check li { line-height: var(--leading-relaxed); color: var(--grey-700); }
.sim-prose h2 { margin-bottom: var(--space-4); }
.sim-prose h3 { margin-top: var(--space-8); color: var(--navy-profond); font-size: var(--text-xl); line-height: var(--leading-snug); }
.sim-prose strong { color: var(--navy-profond); }
.sim-prose code { font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace; font-size: 0.92em; background: var(--teal-light); padding: 0.1em 0.35em; border-radius: var(--radius-sm); }
.sim-prose a { color: var(--teal-dark); text-decoration: underline; }

.sim-list, .sim-steps, .sim-check { padding-left: var(--space-6); display: grid; gap: var(--space-3); }
.sim-list { list-style: disc; }
.sim-steps { list-style: decimal; }
.sim-list li::marker, .sim-steps li::marker { color: var(--teal-signal); font-weight: var(--weight-semibold); }
.sim-check { list-style: none; padding-left: 0; }
.sim-check li { position: relative; padding-left: var(--space-8); }
.sim-check li::before { content: ""; position: absolute; left: 0; top: 0.35em; width: 1.05rem; height: 1.05rem; border: 2px solid var(--teal-signal); border-radius: 3px; background: var(--white); }

.sim-table-wrap { overflow-x: auto; max-width: 100%; border: 1px solid var(--grey-200); background: var(--white); }
.sim-table { width: 100%; border-collapse: collapse; font-size: var(--text-sm); line-height: var(--leading-normal); }
.sim-table th, .sim-table td { padding: var(--space-3) var(--space-4); text-align: left; vertical-align: top; border-bottom: 1px solid var(--grey-200); color: var(--grey-700); min-width: 8rem; }
.sim-table thead th { background: var(--teal-light); color: var(--navy-profond); font-weight: var(--weight-semibold); border-bottom: 2px solid var(--teal-signal); }
.sim-table tbody th { color: var(--navy-profond); font-weight: var(--weight-semibold); background: var(--ivory); }
.sim-table tbody tr:last-child th, .sim-table tbody tr:last-child td { border-bottom: 0; }

.sim-code { margin: 0; padding: var(--space-4) var(--space-5); overflow-x: auto; max-width: 100%; background: var(--ivory); border: 1px solid var(--grey-200); border-left: 3px solid var(--teal-signal); font-size: var(--text-sm); line-height: var(--leading-normal); }
.sim-code code { background: transparent; padding: 0; color: var(--navy-profond); white-space: pre; }

.sim-fig { margin: var(--space-6) 0 0; }
.sim-fig img { display: block; width: 100%; height: auto; border: 1px solid var(--grey-200); background: var(--white); }
.sim-fig figcaption { margin-top: var(--space-2); font-size: var(--text-sm); color: var(--grey-600); line-height: var(--leading-normal); }
.sim-scroll { overflow-x: auto; max-width: 100%; border: 1px solid var(--grey-200); background: var(--white); padding: var(--space-3); }
.sim-svg { display: block; width: 100%; min-width: 640px; height: auto; }

.svg-box { fill: var(--white); stroke: var(--grey-600); stroke-width: 1.25; }
.svg-box--state { fill: var(--teal-light); stroke: var(--teal-signal); stroke-width: 1.5; }
.svg-box--lever { fill: #FBEFD9; stroke: #9A5B0F; stroke-width: 1.5; }
.svg-box--hi { stroke-width: 2.5; fill: #BFE4DF; }
.svg-link { fill: none; stroke: var(--grey-600); stroke-width: 1.25; }
.svg-link--off { stroke-dasharray: 4 4; }
.svg-arrowhead { fill: var(--grey-600); }
.svg-name { font-family: var(--font-body); font-size: 13px; font-weight: 600; fill: var(--navy-profond); }
.svg-sub { font-family: var(--font-body); font-size: 11.5px; fill: var(--grey-600); }
.svg-sign { font-family: var(--font-body); font-size: 15px; font-weight: 700; fill: var(--navy-profond); }

.sim-toc { background: var(--white); border: 1px solid var(--grey-200); border-top: 3px solid var(--teal-signal); padding: var(--space-5) var(--space-6); }
.sim-toc__h { margin: 0 0 var(--space-3); color: var(--navy-profond); font-size: var(--text-lg); }
.sim-toc__list { margin: 0; padding-left: var(--space-5); columns: 2 18rem; column-gap: var(--space-8); }
.sim-toc__list li { break-inside: avoid; padding: 2px 0; }
.sim-toc__list a { color: var(--teal-dark); text-decoration: none; }
.sim-toc__list a:hover, .sim-toc__list a:focus { text-decoration: underline; }
.sim-note { padding: var(--space-4) var(--space-5); background: var(--teal-light); border-left: 3px solid var(--teal-signal); color: var(--navy-profond); }
.sim-prose section[id], .section[id] { scroll-margin-top: calc(var(--nav-height) + var(--space-4)); }