/* ============================================================
   patrimoniste — Design tokens
   Source of truth for the SaaS. Import once at app root.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Schibsted+Grotesk:wght@400;500;600;700;800&family=Hanken+Grotesk:wght@400;500;600;700&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;1,6..72,400;1,6..72,500&display=swap');

:root {
  /* ---------- Brand colour scale · Vert Patrimoine ---------- */
  --green-900: #11241D;   /* "Encre" — deepest, near-black green */
  --green-800: #123C30;   /* primary brand green */
  --green-700: #1C5A48;
  --green-500: #2A7D63;
  --green-300: #74B49C;
  --green-100: #CDE3D8;

  --gold:      #BE9E63;    /* accent — "the practitioner" */
  --gold-soft: #EFE4CB;
  --sand:      #F2ECDF;
  --paper:     #FBF8F1;
  --taupe:     #B6A988;
  --white:     #FFFFFF;

  /* ---------- Semantic tokens (use these in the product) ---------- */
  --c-bg:               #FBF8F1;   /* app background */
  --c-surface:          #FFFFFF;   /* cards, panels */
  --c-surface-2:        #F2ECDF;   /* secondary surfaces, table headers */
  --c-surface-ink:      #123C30;   /* dark surfaces (sidebar) */

  --c-text:             #11241D;   /* primary text  (>12:1 on light) */
  --c-text-muted:       #5B6B62;   /* secondary text */
  --c-text-subtle:      #8A968D;   /* captions, placeholders */
  --c-text-invert:      #F2ECDF;   /* text on dark surfaces */

  --c-border:           #E4DBC9;   /* dividers, default borders */
  --c-border-strong:    #CDC2A8;   /* input borders */

  --c-primary:          #123C30;   /* primary actions, nav */
  --c-primary-hover:    #1C5A48;
  --c-primary-press:    #0E2E25;
  --c-primary-contrast: #F4EFE3;   /* text/icon on primary */

  --c-accent:           #BE9E63;   /* highlight, attention point */
  --c-accent-hover:     #AC8B4F;
  --c-accent-soft:      #EFE4CB;

  --c-success: #2A7D63;  --c-success-bg: #E3EFE8;
  --c-warning: #9C6B22;  --c-warning-bg: #F6ECD6;
  --c-danger:  #A8453A;  --c-danger-bg:  #F4E2DE;
  --c-info:    #1C5A48;  --c-info-bg:    #E3EFE8;

  /* ---------- Typography ---------- */
  --font-display: 'Schibsted Grotesk', system-ui, sans-serif; /* titles, logotype */
  --font-body:    'Hanken Grotesk', system-ui, sans-serif;    /* UI + body */
  --font-accent:  'Newsreader', Georgia, serif;               /* editorial italic accents */

  /* type scale — size / line-height / weight / tracking */
  --t-display:  46px;  /* Schibsted 600, lh 1.0,  ls -0.03em */
  --t-h1:       34px;  /* Schibsted 600, lh 1.1,  ls -0.02em */
  --t-h2:       25px;  /* Schibsted 600, lh 1.2,  ls -0.015em */
  --t-body:     16px;  /* Hanken 400,    lh 1.6 */
  --t-label:    13px;  /* Hanken 600,    lh 1.25 */
  --t-caption:  12px;  /* Hanken 600,    uppercase, ls 0.14em */

  /* ---------- Spacing (4px base) ---------- */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
  --sp-12: 48px; --sp-16: 64px;

  /* ---------- Radii ---------- */
  --r-xs: 6px;    /* small chips */
  --r-sm: 9px;    /* buttons, inputs */
  --r-md: 12px;   /* cards */
  --r-lg: 16px;   /* panels */
  --r-xl: 22px;   /* hero containers */
  --r-pill: 999px;

  /* ---------- Elevation ---------- */
  --sh-1: 0 1px 2px rgba(17,36,29,0.06), 0 1px 3px rgba(17,36,29,0.05);
  --sh-2: 0 4px 14px -6px rgba(17,36,29,0.18);
  --sh-3: 0 18px 40px -20px rgba(17,36,29,0.30);
}