/* =====================================================================
   Design tokens — Independent Mine Sustainability Advisory
   Adopted from the MineRating brand system: deep green + mining gold,
   Manrope / Inter typography, rounded SaaS surfaces, green-tinted shadow.
   ===================================================================== */

:root {
  /* --- Brand & neutral palette (MineRating green + gold) --- */
  --ink: #111827;            /* primary text */
  --ink-2: #0f4c3a;          /* deep green (dark surfaces) */
  --ink-3: #063728;          /* darkest green */
  --slate: #1f2937;          /* charcoal / strong secondary */
  --muted: #4b5563;          /* secondary text */
  --muted-2: #6b7280;        /* tertiary text (slate gray) */

  --mineral: #0f4c3a;        /* primary deep green */
  --mineral-deep: #063728;   /* darkest green */
  --mineral-bright: #13a66f; /* emerald accent */
  --mineral-tint: #e8f3ee;   /* soft green wash */

  --copper: #d4af37;         /* mining gold accent */
  --copper-deep: #9c7414;    /* darker gold (text on light) */
  --copper-soft: #e6c766;    /* light gold (on dark) */
  --copper-tint: #fbf2d9;    /* pale gold wash */

  --earth: #9c7414;          /* warm gold-earth */
  --sand: #e8f3ee;           /* soft neutral (green-tinted) */
  --sand-deep: #cfe0d7;
  --sage: #0b7a55;           /* mid green */
  --sage-tint: #dff2e8;

  --paper: #f8fafc;          /* page background */
  --paper-2: #eef3f0;        /* alt background */
  --surface: #ffffff;        /* card surface */
  --surface-2: #f6faf8;      /* subtle surface */

  --line: #dfe5e2;           /* hairline */
  --line-cool: #dfe5e2;
  --line-strong: #cbd7d2;

  /* --- Semantic --- */
  --critical: #b03a3a;
  --critical-tint: #f7e7e6;
  --warning: #9c7414;
  --success: #0b7a55;
  --focus: #caa53a;          /* gold focus ring (visible on light and green) */

  /* --- Maturity scale (green/gold aligned) --- */
  --m1: #a24b3f;
  --m2: #c9992f;
  --m3: #7d8a2e;
  --m4: #0b7a55;
  --m5: #0f4c3a;

  /* --- Typography (Manrope / Inter, self-safe stack, no external fonts) --- */
  --font: "Manrope", "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-serif: "Manrope", "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: "Manrope", "Inter", system-ui, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", "Cascadia Code", "Segoe UI Mono", Consolas, monospace;

  --fs-hero: clamp(2.6rem, 1.7rem + 3.4vw, 4rem);
  --fs-h1: clamp(2.1rem, 1.55rem + 2.1vw, 3.1rem);
  --fs-h2: clamp(1.7rem, 1.35rem + 1.4vw, 2.4rem);
  --fs-h3: clamp(1.16rem, 1.04rem + .5vw, 1.4rem);
  --fs-h4: clamp(1.02rem, .97rem + .25vw, 1.14rem);
  --fs-lead: clamp(1.05rem, 1rem + .38vw, 1.22rem);
  --fs-body: 1rem;
  --fs-sm: 0.9rem;
  --fs-xs: 0.8rem;

  --lh-tight: 1.1;
  --lh-snug: 1.3;
  --lh-body: 1.6;

  --tracking-eyebrow: 0.14em;

  /* --- Spacing scale --- */
  --space-1: 0.35rem;
  --space-2: 0.6rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2.25rem;
  --space-6: 3.25rem;
  --space-7: 4.75rem;
  --space-8: 6.5rem;

  /* --- Layout --- */
  --max: 1320px;
  --max-narrow: 780px;
  --max-mid: 1040px;
  --gutter: clamp(1.15rem, 0.6rem + 2.5vw, 2.75rem);

  /* --- Radius (rounded SaaS surfaces) --- */
  --radius-sm: 12px;
  --radius: 16px;
  --radius-lg: 20px;
  --radius-pill: 999px;

  /* --- Elevation (green-tinted) --- */
  --shadow-sm: 0 1px 2px rgba(15, 76, 58, .05), 0 8px 20px rgba(17, 24, 39, .05);
  --shadow: 0 12px 28px rgba(17, 24, 39, .07), 0 2px 8px rgba(15, 76, 58, .06);
  --shadow-lg: 0 24px 60px rgba(15, 76, 58, .18);
  --shadow-green: 0 14px 28px rgba(15, 76, 58, .22);
  --ring: 0 0 0 3px rgba(212, 175, 55, .45);

  /* --- Motion --- */
  --ease: cubic-bezier(.4, .1, .2, 1);
  --dur: .28s;
  --dur-fast: .18s;

  /* --- Header --- */
  --header-h: 74px;
}

@media (max-width: 640px) {
  :root { --header-h: 62px; }
}