/* GKN public site 2.0 · canonical design tokens
 * Page-level variables remain as compatibility aliases while the five 2.0 pages
 * migrate to the shared system layer in gkn-v2-system.css.
 */
:root {
  /* Typography */
  --gkn-font-family-sans: "Poppins", "PingFang SC", "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --gkn-font-family-serif: "Songti SC", "STSong", "Noto Serif SC", Georgia, serif;
  --gkn-font-family-management-sans: Inter, "SF Pro Display", "PingFang SC", "Microsoft YaHei", sans-serif;
  --gkn-font-family-management-serif: "Songti SC", "STSong", "Noto Serif CJK SC", "Source Han Serif SC", Georgia, serif;

  /* Canonical editorial type scale. Metadata never carries key body copy. */
  --gkn-font-size-2xs: 12px;
  --gkn-font-size-xs: 12px;
  --gkn-font-size-sm: 13px;
  --gkn-font-size-md: 14px;
  --gkn-font-size-base: 16px;
  --gkn-font-size-lg: 20px;
  --gkn-font-size-xl: 24px;
  --gkn-font-size-nav-primary: 13px;
  --gkn-font-size-nav-secondary: 11px;
  --gkn-font-size-sidebar: 13px;
  --gkn-font-size-sidebar-heading: 18px;
  --gkn-font-size-button: 14px;
  --gkn-font-size-button-compact: 13px;
  --gkn-font-size-display: clamp(44px, 4.8vw, 68px);
  --gkn-font-size-section: clamp(30px, 3vw, 48px);
  --gkn-font-size-body-fluid: clamp(15px, 0.96vw, 17px);

  --gkn-line-height-tight: 1.12;
  --gkn-line-height-heading: 1.28;
  --gkn-line-height-control: 1.4;
  --gkn-line-height-body: 1.68;
  --gkn-line-height-reading: 1.82;
  --gkn-copy-width: 68ch;

  --gkn-font-weight-medium: 500;
  --gkn-font-weight-semibold: 650;
  --gkn-font-weight-bold: 700;
  --gkn-font-weight-heavy: 750;

  /* Shared public 2.0 palette */
  --gkn-color-text-primary: #16231d;
  --gkn-color-text-secondary: #68766e;
  --gkn-color-text-soft: #8c978f;
  --gkn-color-primary: #173327;
  --gkn-color-primary-900: #204334;
  --gkn-color-primary-800: #2b5140;
  --gkn-color-primary-700: #345f49;
  --gkn-color-accent: #a39b5c;
  --gkn-color-accent-bright: #b79a3d;
  --gkn-color-eyebrow: #770024;
  --gkn-color-background: #f5f4ee;
  --gkn-color-background-strong: #eeece2;
  --gkn-color-surface: #fffefa;
  --gkn-color-surface-glass: rgba(255, 255, 252, 0.88);
  --gkn-color-surface-glass-strong: rgba(255, 255, 252, 0.9);
  --gkn-color-border: rgba(31, 67, 52, 0.16);
  --gkn-color-border-strong: rgba(31, 67, 52, 0.28);

  /* Intentional page variants */
  --gkn-color-about-text: #17231e;
  --gkn-color-about-background: #f8f7f2;
  --gkn-color-about-border: rgba(31, 67, 52, 0.15);
  --gkn-color-about-border-strong: rgba(31, 67, 52, 0.27);
  --gkn-color-management-primary: #12372f;
  --gkn-color-management-text-secondary: #52645e;
  --gkn-color-management-background: #f5f3ec;
  --gkn-color-management-surface: #fbfaf6;
  --gkn-color-management-background-strong: #ebe9e1;
  --gkn-color-management-border: rgba(18, 55, 47, 0.16);
  --gkn-color-management-border-strong: rgba(18, 55, 47, 0.28);
  --gkn-color-management-accent: #a18a47;
  --gkn-color-management-eyebrow: #7b273b;

  /* Shared navigation */
  --gkn-color-nav-background: rgba(248, 247, 242, 0.985);
  --gkn-color-nav-text: #14382f;
  --gkn-color-nav-muted: #56625c;
  --gkn-color-nav-soft: #828c86;
  --gkn-color-nav-accent: #927640;
  --gkn-color-nav-border: rgba(20, 47, 40, 0.27);

  /* Shape and spacing */
  --gkn-radius-control: 3px;
  --gkn-radius-sm: 8px;
  --gkn-radius-card: 10px;
  --gkn-radius-panel: 18px;
  --gkn-radius-lg: 30px;
  --gkn-radius-pill: 999px;

  /* Canonical semantic spacing scale. */
  --gkn-space-2xs: 4px;
  --gkn-space-xs: 8px;
  --gkn-space-sm: 12px;
  --gkn-space-md: 16px;
  --gkn-space-lg: 24px;
  --gkn-space-xl: 32px;
  --gkn-space-2xl: 48px;
  --gkn-space-3xl: 64px;
  --gkn-space-4xl: 96px;

  /* Compatibility aliases used by existing page CSS. */
  --gkn-space-1: var(--gkn-space-2xs);
  --gkn-space-2: var(--gkn-space-xs);
  --gkn-space-3: 10px;
  --gkn-space-4: var(--gkn-space-sm);
  --gkn-space-5: 14px;
  --gkn-space-6: var(--gkn-space-md);
  --gkn-space-7: 18px;
  --gkn-space-8: 20px;
  --gkn-space-9: var(--gkn-space-lg);
  --gkn-gap-sm: var(--gkn-space-2);
  --gkn-gap-md: var(--gkn-space-4);
  --gkn-gap-lg: var(--gkn-space-9);
  --gkn-card-padding: var(--gkn-space-7);

  /* Buttons */
  --gkn-button-height: 44px;
  --gkn-button-height-compact: 40px;
  --gkn-button-padding-inline: 16px;
  --gkn-button-padding-inline-compact: 11px;
  --gkn-button-radius: var(--gkn-radius-control);
}
