/* Hordva guides — follows the Hordva Guides Design (claude.ai/artifact/8QBiwv9TaGaFdgFyygEuay).
   Values from design/tokens.json (light theme) and the Website board. Self-hosted Plus Jakarta Sans
   comes from the site's own styles.css; nothing third-party (strict CSP). */
.g-theme-hordva { --g-ground: #F7F8FA; --g-text: #14161C; --g-text2: #5D6270; --g-line: #E1E4EB;
  --g-surface: #FFFFFF; --g-primary: #1A73E8; --g-primary-ink: #1557B0; --g-primary-soft: #E3EEFD;
  --g-warn-soft: #FFF4E0; --g-warn-text: #6B4000; --g-chip: #EFF1F5; --g-dark: #14161C; --g-dark-muted: #AEAEB2; }
.g-page { background: var(--g-ground); color: var(--g-text); }
.g-wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.g-hero .g-wrap { padding-top: 24px; }
.g-crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: 14px; color: var(--g-text2); }
.g-crumbs a { color: var(--g-text2); }
.g-eyebrow { margin: 12px 0 0; font-size: 13px; font-weight: 700; color: var(--g-primary-ink); }
.g-title { margin: 8px 0 0; font-size: clamp(36px, 5vw, 56px); line-height: 1.06; font-weight: 800; letter-spacing: -0.035em; max-width: 860px; }
.g-intro { font-size: 19px; line-height: 1.6; color: var(--g-text2); max-width: 640px; }
.g-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 14px; color: var(--g-text2); }
.g-layout { display: flex; flex-wrap: wrap; gap: 48px; align-items: flex-start; padding-top: 32px; padding-bottom: 64px; }
.g-main { flex: 999 1 560px; min-width: 0; max-width: 760px; display: flex; flex-direction: column; gap: 32px; font-size: 17px; line-height: 1.7; }
.g-aside { flex: 1 1 280px; min-width: 0; }
.g-toc { background: var(--g-surface); border: 1px solid var(--g-line); border-radius: 26px; padding: 22px; display: flex; flex-direction: column; gap: 10px; font-size: 15px; }
.g-toc .g-eyebrow { margin: 0; color: var(--g-text2); }
.g-toc a { color: var(--g-text); text-decoration: none; }
.g-answer { background: var(--g-primary-soft); border-radius: 26px; padding: 26px 28px; }
.g-answer-label { margin: 0; font-size: 13px; font-weight: 700; color: var(--g-primary-ink); }
.g-answer p { margin: 8px 0 0; font-size: 18px; line-height: 1.6; }
.g-section h2, .g-related-wrap h2 { margin: 0 0 12px; font-size: 30px; line-height: 1.15; font-weight: 800; letter-spacing: -0.02em; }
.g-section h3 { font-size: 18px; margin: 20px 0 6px; }
.g-note { background: var(--g-warn-soft); color: var(--g-warn-text); border-radius: 20px; padding: 18px 20px; }
.g-note p { margin: 0; }
.g-table { overflow-x: auto; border: 1px solid var(--g-line); border-radius: 20px; background: var(--g-surface); }
.g-table table { width: 100%; border-collapse: collapse; font-size: 15px; }
.g-table th, .g-table td { padding: 12px 16px; text-align: left; border-top: 1px solid var(--g-line); }
.g-table thead th { border-top: 0; background: var(--g-chip); }
.g-faq { background: var(--g-surface); border: 1px solid var(--g-line); border-radius: 20px; padding: 16px 20px; margin-top: 10px; }
.g-faq summary { font-weight: 700; cursor: pointer; min-height: 28px; }
.g-faq p { color: var(--g-text2); font-size: 16px; margin: 8px 0 0; }
.g-sources, .g-disclaimer { font-size: 14px; color: var(--g-text2); border-top: 1px solid var(--g-line); padding-top: 18px; }
.g-related-wrap { padding-bottom: 56px; }
.g-related-grid, .g-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 20px; }
.g-grid { margin: 32px 0 72px; }
.g-related, .g-card { background: var(--g-surface); border: 1px solid var(--g-line); border-radius: 26px; padding: 24px; display: flex; flex-direction: column; gap: 8px; color: var(--g-text); text-decoration: none; }
.g-related .g-eyebrow, .g-card .g-eyebrow { align-self: flex-start; margin: 0; padding: 4px 10px; border-radius: 999px; background: var(--g-chip); color: var(--g-text2); font-size: 12px; font-weight: 600; }
.g-related-title, .g-card h3 { margin: 0; font-size: 20px; line-height: 1.3; font-weight: 700; }
.g-card p { margin: 0; color: var(--g-text2); font-size: 15px; }
.g-cta { padding: 0 0 72px; background: var(--g-ground); }
.g-cta-inner { background: var(--g-dark); color: #F5F5F7; border-radius: 32px; padding: 44px; display: flex; flex-wrap: wrap; gap: 24px; align-items: center; justify-content: space-between; }
.g-cta-copy { flex: 1 1 400px; }
.g-cta h2 { margin: 0; font-size: 32px; line-height: 1.1; font-weight: 800; letter-spacing: -0.03em; }
.g-cta p { color: var(--g-dark-muted); }
.g-btn { display: inline-flex; align-items: center; min-height: 52px; padding: 0 26px; border-radius: 999px; background: var(--g-primary); color: #fff; font-weight: 700; text-decoration: none; }
