/* Inner Edge brand tokens: Sage and Linen. Drop into your global stylesheet. */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,600&family=Inter:wght@400;600&family=Inter+Tight:wght@700&display=swap');

:root {
  --paper: #F4F3EC;         /* page background, linen */
  --surface: #FFFFFF;       /* cards, inputs */
  --ink: #1F2A24;           /* text, logo arms, deep green black */
  --ink-muted: #5E6A62;     /* secondary text */
  --line: #E1E2D8;          /* hairlines */
  --night: #26332C;         /* footer, dark sections */
  --edge: #5E8B72;          /* sage accent: logo stem, icons, highlights */
  --edge-strong: #4A735E;   /* primary button fill */
  --on-edge: #FFFFFF;       /* text on edge-strong */
  --edge-text: #3F6E55;     /* links on paper */
  --edge-tint: #DFE9E1;     /* soft sage background */
  --approve: #3F6E55;       /* Approved status */
  --on-night: #EEF0E8;      /* text on night */
  --on-night-muted: #A6B0A9;/* secondary text on night */
  --night-line: #34413A;    /* hairlines on night */
  --night-accent: #A9CBB6;  /* primary button on night, with --night-accent-text */
  --night-accent-text: #14201A;

  --font-display: "Fraunces", Georgia, serif;
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-wordmark: "Inter Tight", "Helvetica Neue", Arial, sans-serif;

  --radius-sm: 4px; --radius-md: 8px; --radius-pill: 999px;
  --space-1: 4px; --space-2: 8px; --space-4: 16px; --space-6: 24px;
  --space-8: 32px; --space-12: 48px; --space-24: 96px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --paper: #141A17; --surface: #1C2420; --ink: #EEF0E8; --ink-muted: #A6B0A9;
    --line: #2C3631; --night: #2A3830; --edge: #8DB89F; --edge-strong: #8DB89F;
    --on-edge: #14201A; --edge-text: #9CC7AE; --edge-tint: #24352C; --approve: #8DB89F;
    --night-line: #3A4840;
  }
}

body { background: var(--paper); color: var(--ink); font-family: var(--font-sans); font-size: 17px; line-height: 1.6; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 600; letter-spacing: -0.015em; line-height: 1.1; }
h1 { font-size: clamp(40px, 6vw, 64px); }
h2 { font-size: clamp(32px, 4vw, 44px); }
h3 { font-size: 28px; }
a { color: var(--edge-text); }
.eyebrow { font-size: 12px; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-muted); }
.btn { display: inline-block; padding: 14px 22px; border-radius: var(--radius-sm); font-weight: 600; text-decoration: none; }
.btn-primary { background: var(--edge-strong); color: var(--on-edge); }
.btn-secondary { border: 1px solid var(--ink); color: var(--ink); }
:focus-visible { outline: 2px solid var(--edge-strong); outline-offset: 2px; }
