/* Public how-to guides (/<lang>/guides). Site v2 look: Montserrat, navy panels,
   cyan #1fc9f1 with a violet accent — same tokens as site-theme.css. */
.page-guide {background:#03070a;color:#e9f3ff}
.page-guide .guide {min-height:calc(100vh - 220px)}
.guide {width:min(100% - 32px,880px);margin:0 auto;padding:40px 0 80px;font-family:Montserrat,system-ui,sans-serif}
.guide__kicker {display:block;margin-bottom:12px;color:#1fc9f1;font:700 11px/1.4 Consolas,monospace;letter-spacing:.16em;text-transform:uppercase}
.guide h1 {margin:0 0 14px;font:800 clamp(28px,4vw,44px)/1.12 Montserrat,sans-serif;letter-spacing:-.02em;color:#f4f9ff}
.guide__lead {margin:0 0 26px;color:rgba(214,229,250,.72);font:500 16px/1.7 Montserrat,sans-serif}
.guide__diagram {display:flex;gap:4px;height:74px;margin:0 0 30px;padding:10px;border:1px solid rgba(110,170,255,.2);border-radius:12px;background:linear-gradient(160deg,#0e1a3c,#050a1c)}
.guide__diagram i {flex:1;border:1px solid rgba(31,201,241,.55);border-radius:3px;background:linear-gradient(160deg,rgba(31,201,241,.35),rgba(138,125,255,.35))}
.guide__diagram--split i:last-child {flex:.2}
.guide h2 {margin:34px 0 14px;font:800 20px/1.3 Montserrat,sans-serif;color:#f4f9ff}
.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 rgba(110,170,255,.18);border-radius:12px;background:linear-gradient(160deg,rgba(14,26,60,.92),rgba(5,10,28,.95))}
.guide__steps li::before {content:counter(step);grid-row:1/3;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:rgba(31,201,241,.14);border:1px solid rgba(31,201,241,.45);color:#6fe3ff;font:800 14px Montserrat,sans-serif}
.guide__steps b {font:700 15px/1.4 Montserrat,sans-serif;color:#f4f9ff}
.guide__steps p {margin:0;color:rgba(214,229,250,.68);font:500 14px/1.65 Montserrat,sans-serif}
.guide__faq {display:grid;gap:8px}
.guide__faq details {padding:12px 16px;border:1px solid rgba(110,170,255,.18);border-radius:12px;background:linear-gradient(160deg,rgba(14,26,60,.92),rgba(5,10,28,.95))}
.guide__faq summary {cursor:pointer;font:700 14px/1.5 Montserrat,sans-serif;color:#f4f9ff}
.guide__faq summary:hover {color:#6fe3ff}
.guide__faq p {margin:8px 0 0;color:rgba(214,229,250,.68);font:500 14px/1.65 Montserrat,sans-serif}
.guide__cta {display:inline-flex;align-items:center;gap:8px;margin-top:30px;padding:14px 22px;border:1px solid #1fc9f1;border-radius:10px;background:#1fc9f1;color:#03131a;font:800 15px Montserrat,sans-serif;text-decoration:none;transition:background .18s,box-shadow .18s,transform .18s}
.guide__cta:hover {background:#6fe3ff;border-color:#6fe3ff;box-shadow:0 0 26px rgba(31,201,241,.35);transform:translateY(-1px)}
.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 rgba(110,170,255,.18);border-radius:12px;background:linear-gradient(160deg,rgba(14,26,60,.92),rgba(5,10,28,.95));color:#f4f9ff;text-decoration:none;font:700 14px/1.45 Montserrat,sans-serif;transition:border-color .18s,transform .18s,box-shadow .18s}
.guide__more a:hover {border-color:rgba(111,227,255,.6);box-shadow:0 12px 30px rgba(0,0,0,.3);transform:translateY(-1px)}
.guide__more small {display:block;margin-top:6px;color:rgba(200,214,238,.6);font:500 12px/1.5 Montserrat,sans-serif}
