/* ============================================
KeynoteData — Design Tokens
Brand: "The Signal" (Concept 1)
Updated: March 2026
============================================ */
:root {
/* ---- Primary Palette ---- */
--color-primary: #0F5132;
--color-primary-dark: #0A3D26;
--color-primary-light: #E8F0EC;
/* ---- Accent ---- */
--color-accent: #5B9E7A;
--color-accent-hover: #4A8B69;
--color-accent-light: #5B9E7A1A; /* 10% opacity */
/* ---- Text ---- */
--color-text: #2D3748;
--color-text-muted: #A0AEC0;
--color-text-light: #CBD5E0;
/* ---- Surfaces ---- */
--color-bg: #F0F4F3;
--color-card: #FAFBFA;
--color-border: #D4DDD8;
--color-border-light: #E8EDEB;
/* ---- Semantic / Status ---- */
--color-success: #38A169;
--color-warning: #D69E2E;
--color-error: #E53E3E;
--color-info: #3182CE;
/* ---- Dark Mode ---- */
--color-dark-bg: #1A202C;
--color-dark-card: #2D3748;
--color-dark-border: #4A5568;
--color-dark-text: #E2E8F0;
--color-dark-text-muted: #718096;
/* ---- Typography ---- */
--font-heading: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif;
--font-body: 'Source Sans 3', -apple-system, BlinkMacSystemFont, sans-serif;
--font-mono: 'IBM Plex Mono', 'Menlo', 'Consolas', monospace;
/* ---- Font Sizes ---- */
--text-xs: 0.75rem; /* 12px — mono tags, metadata */
--text-sm: 0.875rem; /* 14px — secondary body, captions */
--text-base: 1rem; /* 16px — body text */
--text-lg: 1.125rem; /* 18px — lead paragraphs */
--text-xl: 1.25rem; /* 20px — section headers */
--text-2xl: 1.5rem; /* 24px — card titles */
--text-3xl: 1.875rem; /* 30px — page subtitles */
--text-4xl: 2.25rem; /* 36px — page titles */
--text-5xl: 3rem; /* 48px — hero headlines */
/* ---- Font Weights ---- */
--weight-regular: 400;
--weight-medium: 500;
--weight-semibold: 600;
--weight-bold: 700;
--weight-extrabold: 800;
/* ---- Spacing ---- */
--space-1: 0.25rem;
--space-2: 0.5rem;
--space-3: 0.75rem;
--space-4: 1rem;
--space-6: 1.5rem;
--space-8: 2rem;
--space-12: 3rem;
--space-16: 4rem;
--space-24: 6rem;
/* ---- Border Radius ---- */
--radius-sm: 4px;
--radius-md: 8px;
--radius-lg: 12px;
--radius-xl: 16px;
--radius-full: 9999px;
/* ---- Shadows ---- */
--shadow-sm: 0 1px 2px rgba(15, 81, 50, 0.05);
--shadow-md: 0 4px 6px rgba(15, 81, 50, 0.07);
--shadow-lg: 0 10px 15px rgba(15, 81, 50, 0.1);
--shadow-xl: 0 20px 25px rgba(15, 81, 50, 0.12);
}
/* Dark mode intentionally disabled — light-only design */
/* ---- Google Fonts Import ---- */
/* Add to :
*/