:root {
  /* ── Brand ─────────────────────────────────── */
  --decoded-orange:       #FF6600;
  --decoded-orange-hover: #E85C00;
  --decoded-orange-light: rgba(255, 102, 0, 0.12);
  --decoded-orange-glow:  rgba(255, 102, 0, 0.25);
  --decoded-orange-tint:  #FFF7F1;
  --decoded-orange-soft:  #FFE9DA;

  /* ── Ventures blue ─────────────────────────── */
  --ventures-blue:        #3D7FE8;
  --ventures-blue-hover:  #2D6DD4;
  --ventures-blue-light:  rgba(61, 127, 232, 0.12);
  --ventures-blue-glow:   rgba(61, 127, 232, 0.28);
  --ventures-blue-tint:   #F0F5FF;
  --ventures-blue-soft:   #DDEAFF;

  /* ── Ventures bronze (active accent) ───────── */
  --ventures-bronze:        #B0793D;
  --ventures-bronze-hover:  #97651F;
  --ventures-bronze-light:  rgba(176, 121, 61, 0.12);
  --ventures-bronze-glow:   rgba(176, 121, 61, 0.28);
  --ventures-bronze-tint:   #FAF5EE;
  --ventures-bronze-soft:   #F0E2CE;

  /* ── Dark palette (hero, dark sections) ────── */
  --dark-bg: #08080D;
  --dark-surface: #0F0F16;
  --dark-raised: #16161F;
  --dark-glass: rgba(255, 255, 255, 0.04);
  --dark-border: rgba(255, 255, 255, 0.08);
  --dark-border-hover: rgba(255, 255, 255, 0.15);
  --dark-text: #F0F0F2;
  --dark-text-secondary: rgba(240, 240, 242, 0.65);
  --dark-text-muted: rgba(240, 240, 242, 0.4);

  /* ── Light palette (content sections) ──────── */
  --light-bg: #FFFFFF;
  --light-surface: #F8F8FA;
  --light-raised: #FFFFFF;
  --light-border: rgba(0, 0, 0, 0.08);
  --light-border-hover: rgba(0, 0, 0, 0.15);
  --light-text: #0F0F16;
  --light-text-secondary: #4A4A56;
  --light-text-muted: #8A8A96;

  /* ── Typography ────────────────────────────── */
  --font-sans: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  --text-xs: 0.75rem;    /* 12px */
  --text-sm: 0.875rem;   /* 14px */
  --text-base: 1rem;     /* 16px */
  --text-lg: 1.125rem;   /* 18px */
  --text-xl: 1.25rem;    /* 20px */
  --text-2xl: 1.5rem;    /* 24px */
  --text-3xl: 1.875rem;  /* 30px */
  --text-4xl: 2.25rem;   /* 36px */
  --text-5xl: 3rem;      /* 48px */
  --text-6xl: 3.75rem;   /* 60px */
  --text-7xl: 4.5rem;    /* 72px */

  --leading-tight: 1.1;
  --leading-snug: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.7;

  --tracking-tight: -0.03em;
  --tracking-normal: 0;
  --tracking-wide: 0.05em;
  --tracking-wider: 0.1em;

  /* ── Spacing ───────────────────────────────── */
  --space-xs: 0.25rem;
  --space-sm: 0.5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;
  --space-5xl: 8rem;

  --section-pad: clamp(4rem, 8vw, 7rem);
  --container: 1280px;
  --container-wide: 1400px;
  --container-narrow: 720px;

  /* ── Radius ────────────────────────────────── */
  --radius-sm: 0;
  --radius-md: 0;
  --radius-lg: 0;
  --radius-xl: 0;
  --radius-full: 9999px;

  /* ── Clip-corner shape (Spade-inspired) ─────── */
  /* Cut 3 corners at 45°, leave one square — the brand shape */
  --clip-card: polygon(20px 0%, calc(100% - 0px) 0%, 100% 0px, 100% calc(100% - 20px), calc(100% - 20px) 100%, 0% 100%, 0% 20px, 0px 0%);
  --clip-card-sm: polygon(12px 0%, 100% 0%, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0% 100%, 0% 12px);
  --clip-img: polygon(24px 0%, 100% 0%, 100% calc(100% - 24px), calc(100% - 24px) 100%, 0% 100%, 0% 24px);

  /* ── Motion ────────────────────────────────── */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 150ms;
  --dur-normal: 300ms;
  --dur-slow: 500ms;

  /* ── Z-index ───────────────────────────────── */
  --z-base: 1;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-overlay: 300;
  --z-nav: 500;
}
