/* Guide public : captures et légendes, sans modifier les styles du site existant. */
.guide-section{padding-bottom:80px;scroll-margin-top:90px}
.guide-section [hidden]{display:none!important}
.guide-empty{padding:28px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--muted)}
.guide-player{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);border:1px solid #377991;border-radius:18px;overflow:hidden;background:linear-gradient(130deg,#10364a,#0a2131);box-shadow:0 18px 50px #0003}
.guide-capture{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;padding:28px;background:radial-gradient(ellipse at center,#19546b,#071b2a 75%);min-height:500px}
.guide-capture>img{display:block;max-width:100%;width:auto;height:430px;object-fit:contain;border-radius:12px;filter:drop-shadow(0 12px 20px #0006)}
.guide-capture>p{color:var(--muted);max-width:260px;text-align:center}
.guide-zoom-button{background:transparent;border:1px solid #437b90;color:var(--text);border-radius:8px;padding:9px 14px;cursor:pointer;font-size:13px}
.guide-explanation{padding:42px;display:flex;flex-direction:column;justify-content:center;min-width:0}
.guide-step{display:inline-block;color:var(--cyan);font-size:12px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.guide-explanation h3{font-size:clamp(1.7rem,3vw,2.8rem);line-height:1.18;letter-spacing:-.03em;margin:16px 0 18px;overflow-wrap:anywhere}
.guide-explanation #guide-description{color:#c8dee8;font-size:17px;white-space:pre-line;overflow-wrap:anywhere;line-height:1.75;margin:0}
.guide-controls{display:flex;gap:12px;align-items:center;margin-top:30px}
.guide-controls button{height:46px;min-width:46px;padding:0 16px;border-radius:9px;border:1px solid #4e8ba0;background:#092637;color:var(--text);font:inherit;font-weight:700;cursor:pointer}
.guide-controls #guide-toggle{background:var(--cyan);border-color:var(--cyan);color:#052434;min-width:100px}
.guide-controls button:disabled{opacity:.4;cursor:default}
.guide-controls button:hover:not(:disabled),.guide-zoom-button:hover{border-color:var(--cyan)}
.guide-hint{font-size:12px;color:var(--muted);margin:12px 0 20px}
.guide-dots{display:flex;flex-wrap:wrap;gap:8px}
.guide-dots button{width:30px;height:30px;border:1px solid #4b7f93;border-radius:50%;background:transparent;color:var(--muted);font-size:11px;cursor:pointer}
.guide-dots button[aria-current="step"]{background:var(--cyan);color:#062332;border-color:var(--cyan);font-weight:850}
.guide-section button:focus-visible{outline:3px solid var(--orange);outline-offset:4px}
.guide-zoom{max-width:95vw;max-height:95vh;border:1px solid #447d92;border-radius:14px;padding:16px;background:#071b2a;color:var(--text)}
.guide-zoom::backdrop{background:#000c}
.guide-zoom>button{display:block;margin:0 0 12px auto;padding:10px 16px;border-radius:8px;background:#123e50;color:var(--text);border:1px solid #447d92;cursor:pointer}
.guide-zoom>img{display:block;max-width:85vw;max-height:78vh;object-fit:contain;margin:auto}
@media(max-width:760px){.guide-section{padding-bottom:60px}.guide-player{grid-template-columns:1fr}.guide-capture{padding:22px;min-height:0}.guide-capture>img{height:360px;max-height:65vh}.guide-explanation{padding:26px}.guide-explanation #guide-description{font-size:15px}.guide-controls{margin-top:24px}}
