/* Beginner guide in the existing shared visual system. */
.howto-topics { display:flex; flex-wrap:wrap; gap:12px 24px; margin-top:30px; padding:20px 0; border-block:1px solid var(--line); color:var(--green); font-size:13px; font-weight:700; }
.howto-section { margin-top:40px; scroll-margin-top:100px; min-width:0; }
.howto-section h2 { color:var(--gold); line-height:1.3; margin:0 0 20px; font-size:clamp(21px,2.3vw,28px); }
.howto-section h3 { font-size:18px; line-height:1.4; margin:24px 0 12px; }
.howto-section p,.howto-section li { max-width:920px; color:var(--muted); line-height:1.8; }
.howto-section a { color:var(--green); font-weight:700; }
.howto-section a:hover { color:var(--gold); }
.howto-section ol { padding-left:24px; }
.howto-section li { padding-left:4px; margin:14px 0; }
.howto-section li strong { color:#fff; }
.howto-section > p > strong { color:var(--gold); }
.howto-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin:24px 0; }
.howto-grid article { min-width:0; padding:24px; background:var(--panel); border:1px solid var(--line); border-radius:12px; }
.howto-grid h3 { margin-top:0; }
.howto-number { display:block; color:var(--green); font-size:13px; font-weight:700; margin-bottom:20px; }
.howto-faq details { padding:20px 0; border-bottom:1px solid var(--line); }
.howto-faq summary { font-weight:700; line-height:1.6; }
@media(max-width:800px) { .howto-grid { grid-template-columns:1fr; } }
@media(max-width:600px) { .howto-section { margin-top:30px; } .howto-grid article { padding:20px; } }