/* ============================================================
   KP Personal Office - design tokens
   Direction: light luxury / editorial. Warm ivory paper, deep
   ink type, an evergreen accent with a bronze hairline detail.
   Premium enough for a PE partner; warm enough for a parent.
   ============================================================ */

:root {
  /* --- Color (oklch) --- */
  --paper:        oklch(98.4% 0.006 85);   /* warm ivory page */
  --paper-sunk:   oklch(96.1% 0.009 83);   /* recessed panels */
  --paper-deep:   oklch(24% 0.012 70);     /* dark band (the guarantee) */
  --surface:      oklch(99.4% 0.004 85);   /* raised cards */

  --ink:          oklch(24% 0.018 67);     /* warm near-black, headings */
  --ink-body:     oklch(38% 0.016 67);     /* body copy */
  --ink-mute:     oklch(54% 0.012 67);     /* captions, meta */
  --ink-on-deep:  oklch(95% 0.008 85);     /* text on the dark band */
  --ink-on-deep-mute: oklch(78% 0.01 85);

  --evergreen:        oklch(43% 0.082 156);  /* primary accent */
  --evergreen-deep:   oklch(33% 0.07 156);   /* hover / pressed */
  --evergreen-tint:   oklch(94% 0.03 156);   /* soft fill */

  --bronze:       oklch(63% 0.085 72);       /* hairline + small detail only (decorative) */
  --bronze-soft:  oklch(82% 0.05 78);

  --line:         oklch(86% 0.012 80);       /* hairlines on paper */
  --line-strong:  oklch(78% 0.016 78);
  --line-on-deep: oklch(40% 0.02 80);

  /* --- Type --- */
  --font-display: 'Fraunces', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
  --font-text:    'Inter', system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;

  /* fluid scale */
  --text-xs:    0.78rem;
  --text-sm:    0.875rem;
  --text-base:  clamp(1rem, 0.97rem + 0.16vw, 1.125rem);
  --text-lg:    clamp(1.15rem, 1.08rem + 0.34vw, 1.4rem);
  --text-xl:    clamp(1.4rem, 1.25rem + 0.7vw, 1.9rem);
  --text-2xl:   clamp(1.85rem, 1.5rem + 1.6vw, 2.9rem);
  --display-sm: clamp(2.1rem, 1.6rem + 2.2vw, 3.4rem);
  --display:    clamp(2.9rem, 1.7rem + 5.6vw, 6.4rem);

  --leading-tight: 1.04;
  --leading-snug:  1.18;
  --leading-body:  1.62;

  --tracking-label: 0.18em;   /* letterspaced eyebrows */
  --tracking-tight: -0.022em; /* display headings */

  /* --- Space --- */
  --space-2:   0.5rem;
  --space-3:   0.75rem;
  --space-4:   1rem;
  --space-6:   1.5rem;
  --space-8:   2rem;
  --space-12:  3rem;
  --space-16:  4rem;
  --space-section: clamp(4.5rem, 3rem + 7vw, 9rem);

  --measure: 38rem;          /* readable line length */
  --wrap:    74rem;          /* max content width */
  --wrap-narrow: 54rem;

  /* --- Radius / depth --- */
  --radius-sm: 4px;
  --radius:    10px;
  --radius-lg: 18px;

  --shadow-sm: 0 1px 2px oklch(24% 0.02 67 / 0.05),
               0 2px 8px oklch(24% 0.02 67 / 0.04);
  --shadow:    0 2px 4px oklch(24% 0.02 67 / 0.05),
               0 12px 30px -10px oklch(24% 0.02 67 / 0.12);
  --shadow-lg: 0 4px 8px oklch(24% 0.02 67 / 0.06),
               0 30px 60px -20px oklch(24% 0.02 67 / 0.20);

  /* --- Motion --- */
  --dur-fast:   160ms;
  --dur:        320ms;
  --dur-slow:   620ms;
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-soft:  cubic-bezier(0.32, 0.72, 0.24, 1);
}