/* VELIN guide pages (SEO landing pages). Loads after app.css; only adds .g-* classes. */
.docs .g-p { color: var(--ink); line-height: 1.7; font-size: 16px; max-width: 46em; margin: 10px 0 14px; }
.docs h3 { font-family: var(--sans); font-size: 17px; margin: 22px 0 4px; }
.docs h1 { overflow-wrap: anywhere; }
.docs code { background: var(--paper-2); padding: 1px 5px; border-radius: 4px; overflow-wrap: anywhere; }
.docs pre code { background: none; padding: 0; }
.docs pre { max-width: 100%; }
.docs a { color: var(--ink); text-underline-offset: 3px; }
.docs a:hover { background: var(--yellow); }
.docs a.fra-btn { text-decoration: none; margin: 6px 10px 6px 0; display: inline-flex; }
.g-note { color: var(--muted); font-size: 13.5px; line-height: 1.65; max-width: 52em; margin: 8px 0 18px; }
.g-table-wrap { border: 3px solid var(--ink); border-radius: 14px; overflow-x: auto; margin: 14px 0 12px; background: #fff; -webkit-overflow-scrolling: touch; }
.g-table { border-collapse: collapse; width: 100%; min-width: 560px; font-size: 14px; line-height: 1.5; }
.g-table th { background: var(--yellow); text-align: left; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; padding: 10px 14px; }
.g-table td { padding: 10px 14px; border-top: 2px solid var(--line); vertical-align: top; }
.g-table td:first-child { font-weight: 700; }
.g-table td.us { background: #f7fadb; font-weight: 800; }
.g-steps { margin: 10px 0 16px; padding-left: 22px; line-height: 1.75; max-width: 52em; }
.g-steps li { margin-bottom: 8px; }
.g-cta { margin-top: 44px; padding: 28px 24px; border: 3px solid var(--ink); border-radius: 18px; background: var(--card); }
.g-cta h2 { margin-top: 0; }
.g-more { margin-top: 40px; border-top: 3px solid var(--ink); padding-top: 8px; }
@media (max-width: 640px) {
  .page.docs { padding-left: 18px; padding-right: 18px; }
  .g-table { min-width: 520px; font-size: 13px; }
  .g-cta { padding: 20px 16px; }
}