/* hg-guide.css - guide débutant hermesagents.fr - design aéré, zéro classe partagée */
:root{
  --hg-bg:#fdfcfa; --hg-ink:#232323; --hg-muted:#6b6b66; --hg-accent:#1a7f5a; --hg-accent-soft:#e7f4ee;
  --hg-accent-dark:#0f5c40; --hg-line:#e2e0da; --hg-panel:#f4f2ec; --hg-warn:#a3560e;
  --hg-sans:'Segoe UI','Helvetica Neue',Arial,sans-serif; --hg-mono:'SFMono-Regular','Consolas',monospace;
  --hg-step-blue:#eef3fb; --hg-step-blue-ink:#2a4d7f;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--hg-bg);color:var(--hg-ink);font:17px/1.75 var(--hg-sans)}
a{color:var(--hg-accent);text-decoration-color:#b8d8ca;text-underline-offset:3px}
a:hover{color:var(--hg-accent-dark)}
.hg-wrap{max-width:860px;margin:0 auto;padding:0 24px}
.hg-top{background:#fff;border-bottom:1px solid var(--hg-line)}
.hg-top-in{max-width:860px;margin:0 auto;padding:18px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hg-brand{font-size:20px;font-weight:800;color:var(--hg-ink);text-decoration:none;letter-spacing:-.3px}
.hg-brand span{color:var(--hg-accent)}
.hg-menu{display:flex;gap:22px;font-size:14.5px;font-weight:600}
.hg-menu a{color:var(--hg-muted);text-decoration:none}
.hg-menu a:hover{color:var(--hg-accent-dark)}
.hg-breadcrumb{font-size:13.5px;color:var(--hg-muted);margin:26px 0 8px}
.hg-path{display:flex;gap:6px;flex-wrap:wrap}
.hg-badge{display:inline-block;background:var(--hg-accent-soft);color:var(--hg-accent-dark);font-size:12.5px;font-weight:700;padding:3px 12px;border-radius:99px;margin-bottom:14px}
.hg-h1{font-size:36px;line-height:1.18;font-weight:800;letter-spacing:-.5px;margin-bottom:14px}
.hg-intro{font-size:19px;color:#43433f;border-bottom:1px solid var(--hg-line);padding-bottom:26px;margin-bottom:10px}
.hg-body{max-width:700px}
.hg-body p{margin:15px 0}
.hg-body ul,.hg-body ol{margin:15px 0 15px 24px}
.hg-body li{margin:7px 0}
.hg-body h2{font-size:25px;font-weight:800;margin:42px 0 4px;letter-spacing:-.3px}
.hg-body h2::before{content:'';display:block;width:44px;height:3px;background:var(--hg-accent);border-radius:2px;margin-bottom:10px}
.hg-body h3{font-size:18.5px;font-weight:700;margin:24px 0 8px}
.hg-when{background:var(--hg-panel);border-radius:14px;padding:20px 24px;margin:28px 0}
.hg-when-t{font-weight:800;font-size:15px;color:var(--hg-accent-dark);margin-bottom:8px}
.hg-when li{margin:5px 0}
.hg-step{display:grid;grid-template-columns:44px 1fr;gap:16px;margin:26px 0;align-items:start}
.hg-step-n{background:var(--hg-step-blue);color:var(--hg-step-blue-ink);font-weight:800;font-size:17px;border-radius:12px;width:44px;height:44px;display:flex;align-items:center;justify-content:center}
.hg-step h3{margin:6px 0 6px;font-size:18px}
.hg-step p{margin:6px 0;color:#3d3d39}
.hg-check{color:var(--hg-accent);font-weight:700;font-size:14.5px;background:var(--hg-accent-soft);display:inline-block;padding:2px 10px;border-radius:8px;margin-top:6px}
.hg-code{background:#252a2e;color:#e9e7e0;border-radius:10px;padding:14px 18px;margin:14px 0;overflow-x:auto;white-space:pre;font-family:var(--hg-mono);font-size:13.5px;line-height:1.6}
.hg-cmd{background:var(--hg-panel);border:1px solid var(--hg-line);border-radius:6px;padding:2px 8px;font-family:var(--hg-mono);font-size:.85em;color:var(--hg-accent-dark);white-space:nowrap}
.hg-tip{border-left:4px solid var(--hg-accent);background:var(--hg-accent-soft);border-radius:0 10px 10px 0;padding:12px 18px;margin:18px 0;font-size:15.5px}
.hg-caution{border-left:4px solid var(--hg-warn);background:#fdf3e4;border-radius:0 10px 10px 0;padding:12px 18px;margin:18px 0;font-size:15.5px}
.hg-tip b,.hg-caution b{font-weight:800}
.hg-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;margin:22px 0}
.hg-cards a{display:block;border:1px solid var(--hg-line);border-radius:14px;background:#fff;padding:18px 20px;text-decoration:none;color:var(--hg-ink)}
.hg-cards a:hover{border-color:var(--hg-accent);box-shadow:0 2px 10px rgba(26,127,90,.08)}
.hg-cards .hg-cards-t{font-weight:800;font-size:16px;margin-bottom:4px}
.hg-cards .hg-cards-d{font-size:14px;color:var(--hg-muted)}
.hg-faq details{border-bottom:1px solid var(--hg-line);padding:14px 0}
.hg-faq summary{font-weight:700;cursor:pointer;font-size:16.5px}
.hg-faq details[open] summary{color:var(--hg-accent-dark)}
.hg-faq p{margin:10px 0 4px;color:#3d3d39}
.hg-table{width:100%;border-collapse:collapse;margin:16px 0;font-size:15px}
.hg-table th{font-weight:800;text-align:left;border-bottom:2px solid var(--hg-line);padding:9px 12px;background:var(--hg-panel)}
.hg-table td{border-bottom:1px solid var(--hg-line);padding:9px 12px;vertical-align:top}
.hg-foot{border-top:1px solid var(--hg-line);margin-top:60px;padding:26px 0 40px;color:var(--hg-muted);font-size:13.5px}
.hg-foot-in{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.hg-foot a{color:var(--hg-muted)}
.hg-yt{margin:22px 0}
.hg-yt-frame{position:relative;padding-bottom:56.25%;height:0;border-radius:12px;overflow:hidden;border:1px solid var(--hg-line)}
.hg-yt-frame iframe{position:absolute;top:0;left:0;width:100%;height:100%}
.hg-yt-cap{font-size:13px;color:var(--hg-muted);margin-top:8px}
@media(max-width:640px){.hg-h1{font-size:28px}.hg-body{max-width:100%}.hg-step{grid-template-columns:36px 1fr}.hg-step-n{width:36px;height:36px;font-size:15px}}
