.gsteps{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:28px;counter-reset:g}
.gstep{display:grid;grid-template-columns:1fr;gap:12px;counter-increment:g;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.gstep h3{margin:0 0 6px;font-size:1.1rem}
.gstep h3::before{content:counter(g) ". "}
.gstep p{margin:0;line-height:1.55}
.gstep img{width:100%;max-width:260px;height:auto;justify-self:center;border-radius:10px;border:1px solid var(--line)}
@media (min-width:720px){.gstep{grid-template-columns:1fr 240px;align-items:start}.gstep img{justify-self:end}}
.gnote{padding:14px 16px;border-left:4px solid var(--ok-fg);background:var(--ok-bg);border-radius:8px;margin:18px 0}