/* ==========================================================================
   FUTURE POWER CAPITAL — DESIGN TOKENS
   Institutional holding / venture & development capital identity.
   ========================================================================== */

:root {
  /* ---------------------------------------------------------------------
     COLOR — Primary (deep institutional ink), Accent (sober metallic),
     full neutral scale. No SaaS gradients, no green/energy cliché.
     --------------------------------------------------------------------- */

  /* Primary — Obsidian Ink (deep blue-graphite, near-black but with weight) */
  --fpc-ink-900: #0a0f16;
  --fpc-ink-800: #0e1620;
  --fpc-ink-700: #131e2b;
  --fpc-ink-600: #1a2a3a;
  --fpc-ink-500: #223650;
  --fpc-ink-400: #33506f;
  --fpc-ink-300: #5c7690;
  --fpc-ink-200: #9fb0c1;
  --fpc-ink-100: #dce3ea;

  /* Accent — Sober Metallic (desaturated bronze / pewter-gold, not shiny) */
  --fpc-bronze-700: #6b5735;
  --fpc-bronze-600: #8a713f;
  --fpc-bronze-500: #a8894c;
  --fpc-bronze-400: #bfa066;
  --fpc-bronze-300: #d3bc8c;
  --fpc-bronze-200: #e6dbc3;
  --fpc-bronze-100: #f3ede1;

  /* Neutral scale */
  --fpc-gray-950: #0b0c0e;
  --fpc-gray-900: #14161a;
  --fpc-gray-800: #21242a;
  --fpc-gray-700: #33373f;
  --fpc-gray-600: #4b505a;
  --fpc-gray-500: #6b7078;
  --fpc-gray-400: #8d9198;
  --fpc-gray-300: #b3b7bd;
  --fpc-gray-200: #d6d8db;
  --fpc-gray-100: #eceeef;
  --fpc-gray-50:  #f6f6f7;
  --fpc-white:    #ffffff;

  /* Semantic status (forms, legal callouts) */
  --fpc-success-600: #2f6f4f;
  --fpc-success-100: #e5f0ea;
  --fpc-error-600:   #8c2f2f;
  --fpc-error-100:   #f4e6e6;
  --fpc-warning-600: #8a6a1f;
  --fpc-warning-100: #f6efdc;

  /* Semantic aliases — use these in components, not raw scale values */
  --color-bg: var(--fpc-white);
  --color-surface: var(--fpc-gray-50);
  --color-surface-raised: var(--fpc-white);
  --color-border: var(--fpc-gray-200);
  --color-border-strong: var(--fpc-gray-300);
  --color-text-primary: var(--fpc-ink-900);
  --color-text-secondary: var(--fpc-gray-600);
  --color-text-muted: var(--fpc-gray-500);
  --color-text-inverse: var(--fpc-white);
  --color-brand-primary: var(--fpc-ink-700);
  --color-brand-primary-strong: var(--fpc-ink-900);
  --color-accent: var(--fpc-bronze-500);
  --color-accent-strong: var(--fpc-bronze-600);
  --color-accent-soft: var(--fpc-bronze-200);
  --color-inverse-surface: var(--fpc-ink-900);
  --color-inverse-surface-alt: var(--fpc-ink-800);

  /* ---------------------------------------------------------------------
     TYPOGRAPHY
     Display serif: Spectral (authority, editorial, financial-report feel)
     Text sans: Inter (clean reading face, wide weight range)
     --------------------------------------------------------------------- */
  --font-serif: "Spectral", "Iowan Old Style", "Palatino Linotype", Georgia, "Times New Roman", serif;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-mono: "IBM Plex Mono", "SF Mono", Menlo, Consolas, monospace;

  /* Modular scale — ratio ~1.25, base 16px */
  --text-xs:   0.75rem;   /* 12px */
  --text-sm:   0.875rem;  /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-md:   1.125rem;  /* 18px */
  --text-lg:   1.375rem;  /* 22px */
  --text-xl:   1.75rem;   /* 28px */
  --text-2xl:  2.25rem;   /* 36px */
  --text-3xl:  2.875rem;  /* 46px */
  --text-4xl:  3.75rem;   /* 60px */
  --text-5xl:  4.75rem;   /* 76px */

  --leading-tight: 1.1;
  --leading-snug: 1.3;
  --leading-normal: 1.55;
  --leading-relaxed: 1.75;

  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;
  --tracking-wider: 0.12em;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* ---------------------------------------------------------------------
     SPACING — 4px base unit
     --------------------------------------------------------------------- */
  --space-1:  0.25rem;  /* 4px */
  --space-2:  0.5rem;   /* 8px */
  --space-3:  0.75rem;  /* 12px */
  --space-4:  1rem;     /* 16px */
  --space-5:  1.5rem;   /* 24px */
  --space-6:  2rem;     /* 32px */
  --space-7:  2.5rem;   /* 40px */
  --space-8:  3rem;     /* 48px */
  --space-9:  4rem;     /* 64px */
  --space-10: 5rem;     /* 80px */
  --space-11: 6.5rem;   /* 104px */
  --space-12: 8rem;     /* 128px */

  /* ---------------------------------------------------------------------
     RADIUS, SHADOW, BORDER, TRANSITION
     --------------------------------------------------------------------- */
  --radius-sm: 2px;
  --radius-md: 4px;
  --radius-lg: 8px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(10, 15, 22, 0.06);
  --shadow-md: 0 4px 16px rgba(10, 15, 22, 0.08);
  --shadow-lg: 0 12px 32px rgba(10, 15, 22, 0.12);
  --shadow-xl: 0 24px 64px rgba(10, 15, 22, 0.18);
  --shadow-inset: inset 0 0 0 1px rgba(10, 15, 22, 0.08);

  --border-hairline: 1px solid var(--color-border);
  --border-strong: 1px solid var(--color-border-strong);

  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --duration-fast: 120ms;
  --duration-base: 220ms;
  --duration-slow: 420ms;

  /* Layout */
  --container-max: 1200px;
  --container-narrow: 760px;
  --header-height: 84px;
}
