/* Hallmark · macrostructure: Workbench / comparison · genre: modern-minimal
 * theme: studied-DNA (source: landing-codex) · tone: direct, product-led
 * anchor: existing Ghost blue tokens · nav: N5 · footer: Ft2
 * Variation: full-width semantic spec sheet instead of split illustrative hero.
 * Pre-emit critique: P4 H4 E4 S5 R4 V4. No animation or additional font dependency. */
.gp-hero { padding-block: 3rem 4rem; }
.gp-hero h1 { max-width: 19ch; }
.gp-eyebrow { margin: 1.5rem 0 0; color: var(--gf-muted); font: 0.75rem/1.6 var(--gf-mono); }
.gp-heading { max-width: 46rem; margin-bottom: 2rem; }
.gp-heading h2 { margin: 0 0 1rem; font-size: clamp(1.5rem, 3vw, 2rem); line-height: 1.2; letter-spacing: -0.03em; }
.gp-heading p { color: var(--gf-muted); }
.gp-table-wrap { overflow-x: auto; border-block: 1px solid var(--gf-rule); }
.gp-table-wrap:focus-visible { outline: 3px solid var(--fp-color-focus); outline-offset: 5px; }
.gp-table { width: 100%; min-width: 40rem; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.gp-table caption { text-align: left; padding: 1rem 0; color: var(--gf-muted); font-size: 0.8125rem; }
.gp-table th, .gp-table td { padding: 1.25rem 1rem; text-align: left; border-bottom: 1px solid var(--gf-rule); }
.gp-table th:first-child { padding-left: 0; width: 26%; }
.gp-table thead th { font-size: 1.125rem; font-weight: 600; }
.gp-table thead th:first-child { font-size: 0.8125rem; color: var(--gf-muted); font-weight: 400; }
.gp-table tbody th { font-size: 0.875rem; font-weight: 400; color: var(--gf-muted); }
.gp-table tbody tr:first-child td { font: 600 1.75rem/1.3 var(--gf-mono); color: var(--gf-accent); }
.gp-table tbody tr:last-child > * { border-bottom: 0; }
.gp-footnote, .gp-scroll-hint { color: var(--gf-muted); font-size: 0.8125rem; line-height: 1.6; }
.gp-footnote { max-width: 72ch; }
.gp-details { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; }
.gp-definitions { margin: 0; }
.gp-definitions > div { padding: 1.25rem 0; border-top: 1px solid var(--gf-rule); }
.gp-definitions dt { margin-bottom: 0.5rem; font-weight: 600; }
.gp-definitions dd { margin: 0; color: var(--gf-muted); }
.gp-definitions a { color: var(--gf-accent); text-decoration: underline; text-underline-offset: 0.2em; }
.gp-definitions a:hover { color: var(--gf-ink); }
.gp-terms { padding-block: 3rem; margin-bottom: 4rem; background: var(--gf-surface); color: var(--gf-ink); }
.gp-terms h3 { font-size: 1.125rem; margin: 0 0 1rem; }
@media (min-width: 40rem) {
  .gp-hero { padding-block: 5rem 7rem; }
}
@media (min-width: 60rem) {
  .gp-details { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 4rem; }
  .gp-scroll-hint { display: none; }
}
