/* Public how-to guides (/<lang>/guides). Same dark palette as the tools. */
.page-guide {background:#03070a;color:#e8f6fb}
.guide {width:min(100% - 32px,880px);margin:0 auto;padding:40px 0 80px;font-family:Mulish,system-ui,sans-serif}
.guide__kicker {display:block;margin-bottom:12px;color:#51d7ff;font:800 11px/1.4 Consolas,monospace;letter-spacing:.16em}
.guide h1 {margin:0 0 14px;font:900 clamp(28px,4vw,44px)/1.12 Mulish,sans-serif;letter-spacing:-.03em;color:#f4fcff}
.guide__lead {margin:0 0 26px;color:#b5cad5;font:400 16px/1.7 Mulish,sans-serif}
.guide__diagram {display:flex;gap:4px;height:74px;margin:0 0 30px;padding:10px;border:1px solid #1f3a4a;border-radius:10px;background:#07131c}
.guide__diagram i {flex:1;border:1px solid #4db5d2;border-radius:3px;background:linear-gradient(160deg,#245274,#59b5bb)}
.guide__diagram--split i:last-child {flex:.2}
.guide h2 {margin:34px 0 14px;font:800 20px/1.3 Mulish,sans-serif;color:#f4fcff}
.guide ol.guide__steps {margin:0;padding:0;list-style:none;counter-reset:step;display:grid;gap:10px}
.guide__steps li {counter-increment:step;display:grid;grid-template-columns:40px minmax(0,1fr);gap:4px 14px;padding:16px;border:1px solid #1f3a4a;border-radius:10px;background:#0a1721}
.guide__steps li::before {content:counter(step);grid-row:1/3;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#163743;color:#51d7ff;font:800 14px Mulish,sans-serif}
.guide__steps b {font:800 15px/1.4 Mulish,sans-serif;color:#eefaff}
.guide__steps p {margin:0;color:#a9bfcb;font:400 14px/1.65 Mulish,sans-serif}
.guide__faq {display:grid;gap:8px}
.guide__faq details {padding:12px 16px;border:1px solid #1f3a4a;border-radius:10px;background:#0a1721}
.guide__faq summary {cursor:pointer;font:700 14px/1.5 Mulish,sans-serif;color:#eefaff}
.guide__faq p {margin:8px 0 0;color:#a9bfcb;font:400 14px/1.65 Mulish,sans-serif}
.guide__cta {display:inline-flex;align-items:center;gap:8px;margin-top:30px;padding:14px 22px;border-radius:8px;background:#49d7f7;color:#03131a;font:800 15px Mulish,sans-serif;text-decoration:none}
.guide__cta:hover {background:#7fe4fb}
.guide__more {display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;margin-top:10px}
.guide__more a {display:block;padding:14px 16px;border:1px solid #1f3a4a;border-radius:10px;background:#0a1721;color:#eefaff;text-decoration:none;font:700 14px/1.45 Mulish,sans-serif}
.guide__more a:hover {border-color:#51d7ff}
.guide__more small {display:block;margin-top:6px;color:#8fa9b6;font:400 12px/1.5 Mulish,sans-serif}
