/* Guide article styles. Loaded alongside assets/style.css + assets/nav-menu.css.
   Uses the site's existing CSS variables (--ink, --dim, --faint, --gold, --line, --panel, --sans, --display, --mono). */

.guide-hero{padding:120px 0 40px}
.guide-hero .wrap{max-width:78ch}
.guide-crumbs{font-size:.85rem;color:var(--faint, rgba(248,247,244,.56));margin-bottom:14px}
.guide-crumbs a{color:var(--dim, rgba(248,247,244,.78));text-decoration:underline}
.guide-hero h1{font-family:var(--display,"Space Grotesk",sans-serif);font-size:clamp(1.7rem,3.4vw,2.5rem);line-height:1.2;margin:0 0 14px}
.guide-byline{color:var(--faint, rgba(248,247,244,.56));font-size:.9rem;margin:0 0 6px}
.guide-updated{color:var(--faint, rgba(248,247,244,.56));font-size:.85rem;margin:0 0 20px}

.guide-body{padding:0 0 60px}
.guide-body .wrap{max-width:78ch}
.guide-body h2{font-family:var(--display,"Space Grotesk",sans-serif);font-size:1.4rem;margin:38px 0 14px;scroll-margin-top:90px}
.guide-body h3{font-size:1.1rem;margin:26px 0 10px}
.guide-body p{color:var(--dim, rgba(248,247,244,.78));margin:0 0 16px}
.guide-body ul,.guide-body ol{color:var(--dim, rgba(248,247,244,.78));margin:0 0 18px;padding-left:22px}
.guide-body li{margin:0 0 8px}
.guide-body a{color:var(--gold,#E4B65F)}

.guide-toc{border:1px solid var(--line, rgba(255,255,255,.13));border-radius:10px;padding:18px 22px;margin:0 0 34px;background:var(--panel,#1D242E)}
.guide-toc p{margin:0 0 10px;font-weight:600;color:var(--ink,#F8F7F4)}
.guide-toc ol{margin:0;padding-left:20px}
.guide-toc a{color:var(--dim, rgba(248,247,244,.78));text-decoration:none}
.guide-toc a:hover{color:var(--gold,#E4B65F)}

.guide-table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:.92rem}
.guide-table th,.guide-table td{border:1px solid var(--line, rgba(255,255,255,.13));padding:10px 12px;text-align:left;vertical-align:top}
.guide-table th{background:var(--panel,#1D242E);color:var(--ink,#F8F7F4)}
.guide-table td{color:var(--dim, rgba(248,247,244,.78))}

.guide-note{border-left:3px solid var(--gold,#E4B65F);padding:10px 16px;margin:0 0 20px;background:rgba(228,182,95,.08);color:var(--dim, rgba(248,247,244,.78));font-size:.92rem}

.guide-cta{border:1px solid var(--line, rgba(255,255,255,.24));border-radius:12px;padding:24px;margin:34px 0;background:var(--panel,#1D242E)}
.guide-cta p{margin:0 0 14px}
.guide-cta .btn-gold{display:inline-block;background:var(--gold,#E4B65F);color:#12161C;font-weight:600;padding:12px 22px;border-radius:8px;text-decoration:none}
.guide-cta .guide-related{margin-top:14px;font-size:.9rem;color:var(--faint, rgba(248,247,244,.56))}
.guide-cta .guide-related a{color:var(--dim, rgba(248,247,244,.78))}

.guide-index-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px;margin:20px 0 40px}
.guide-index-card{border:1px solid var(--line, rgba(255,255,255,.13));border-radius:10px;padding:18px 20px;background:var(--panel,#1D242E);text-decoration:none;display:block}
.guide-index-card h3{margin:0 0 8px;font-size:1.05rem;color:var(--ink,#F8F7F4)}
.guide-index-card p{margin:0;color:var(--dim, rgba(248,247,244,.78));font-size:.9rem}