/* static guide pages */
body.guide { padding-bottom: 0; }
.g-wrap { max-width: 880px; margin: 0 auto; padding: 30px 22px 60px; }
.g-crumbs { font-size: 13px; color: var(--text-3); margin-bottom: 16px; } .g-crumbs a { color: var(--text-2); }
.g-wrap h1 { font-size: clamp(32px, 4.6vw, 52px); line-height: 1.04; letter-spacing: -0.03em; margin-bottom: 14px; }
.g-wrap h2 { font-size: 26px; margin: 38px 0 12px; }
.g-lead { font-size: 18.5px; color: var(--text-2); line-height: 1.6; }
.g-lead b, .g-body b { color: var(--text); }
.g-body, .g-body li { font-size: 16.5px; line-height: 1.7; color: var(--text-2); }
.g-body ol, .g-body ul { padding-left: 22px; } .g-body li { margin-bottom: 8px; }
.g-sim { margin: 26px 0; border-radius: 22px; overflow: hidden; background: #000; box-shadow: inset 0 0 0 1px var(--line-2), 0 20px 60px rgba(0,0,0,.5); }
.g-sim-head { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; background: var(--bg-3); font-size: 13px; }
.g-sim-head a { color: var(--amber); font-weight: 600; }
.g-sim iframe { width: 100%; height: 540px; border: 0; display: block; }
.g-figs { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.g-fig { margin: 0; border-radius: 16px; overflow: hidden; background: #000; box-shadow: inset 0 0 0 1px var(--line); }
.g-fig img, .g-fig video { width: 100%; height: 220px; object-fit: contain; display: block; background: #000; }
.g-fig figcaption { background: var(--bg-3); padding: 10px 12px; font-size: 13px; color: var(--text-2); }
.g-fig figcaption b { color: var(--text); } .g-fig .credit { display: block; margin-top: 4px; font-size: 11.5px; color: var(--text-3); } .g-fig .credit a { color: var(--text-3); }
.g-cta { display: flex; gap: 18px; align-items: center; justify-content: space-between; flex-wrap: wrap; margin: 40px 0 10px; padding: 24px; border-radius: 22px; background: radial-gradient(circle at 100% 0%, rgba(255,140,50,.22), transparent 60%), var(--bg-3); box-shadow: inset 0 0 0 1px var(--line-2); }
.g-cta > div { flex: 1 1 320px; color: var(--text-2); font-size: 16px; } .g-cta b { color: var(--text); display: block; font-family: var(--display); font-size: 21px; margin-bottom: 4px; }
.g-rel { list-style: none; padding: 0; display: grid; gap: 10px; }
.g-rel li { padding: 14px 16px; border-radius: 14px; background: var(--panel); box-shadow: inset 0 0 0 1px var(--line); }
.g-rel a { font-weight: 600; font-family: var(--display); font-size: 17px; } .g-rel span { display: block; font-size: 13.5px; color: var(--text-3); margin-top: 3px; }
.g-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin-top: 24px; }
.g-card { padding: 18px; border-radius: 18px; background: var(--panel); box-shadow: inset 0 0 0 1px var(--line); color: var(--text); transition: transform .15s; }
.g-card:hover { transform: translateY(-2px); box-shadow: inset 0 0 0 1px var(--line-2); }
.g-card b { display: block; font-family: var(--display); font-size: 18px; margin-bottom: 6px; } .g-card span { font-size: 13.5px; color: var(--text-3); }
.g-note { font-size: 12.5px; margin-top: 30px; }
@media (max-width: 900px) { .g-sim iframe { height: 640px; } .guide .topbar .nav { display: none; } }