/* Octagon Capital - Design Tokens (Warm Beige & Ivory Light Edition) */
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Manrope:wght@300;400;500;600;700;800&display=swap');

:root {
  /* ===================================================================
     BRAND COLOR PALETTE (Strict adherence to Octagon Brand Rules p. 7-9)
     Warm Sand, Ivory White, Oxford Blue, Slate Blue
  =================================================================== */
  --color-oxford-blue: #182943;
  --color-oxford-dark: #101c2e;
  --color-slate-blue: #546882;
  --color-slate-light: #7E93AC;
  --color-warm-sand: #D2C7BA;
  --color-sand-accent: #BFA993;
  --color-ivory-white: #F7F5F1;
  --color-pure-white: #FFFFFF;

  /* Surface & Background Tokens (Warm Beige Luxury Palette) */
  --bg-base: #F7F5F1;
  --bg-surface: #FFFFFF;
  --bg-surface-sand: #F0ECE4;
  --bg-card: #FFFFFF;
  --bg-card-hover: #FBF9F6;
  --bg-alt: #EFECE5;
  --bg-glass: rgba(247, 245, 241, 0.92);
  --bg-modal: #FFFFFF;

  /* Borders & Dividers */
  --border-subtle: #E6E1D8;
  --border-medium: #D5CEBF;
  --border-sand: #BFA993;
  --border-dark: #182943;

  /* Octagon Data Highlight Palette (Brand Rules p. 9) */
  --data-blue-1: #15334F;
  --data-blue-2: #3E5F82;
  --data-blue-3: #6D8DB4;
  --data-accent-ochre: #C48E3A;
  --data-sand-light: #F6F2EC;
  --data-sand-mid: #E8DECC;

  /* Financial Metrics */
  --perf-positive: #16a34a;
  --perf-negative: #dc2626;

  /* Typography Colors */
  --text-primary: #182943;
  --text-secondary: #4A5E77;
  --text-muted: #74869D;
  --text-sand: #A38769;

  /* Fonts (Brand Rules p. 8: Lora for Headings, Manrope for Body/UI) */
  --font-serif: 'Lora', Georgia, 'Times New Roman', serif;
  --font-sans: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  /* Radii */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-full: 9999px;

  /* Shadows (Subtle, clean, architectural) */
  --shadow-subtle: 0 2px 10px rgba(24, 41, 67, 0.04);
  --shadow-card: 0 8px 24px -4px rgba(24, 41, 67, 0.06), 0 2px 6px -1px rgba(24, 41, 67, 0.03);
  --shadow-elevated: 0 20px 40px -10px rgba(24, 41, 67, 0.12);

  /* Transitions */
  --transition-fast: 0.15s ease-out;
  --transition-normal: 0.25s ease-out;
}