@import url('fonts.css');
/*
 * Design Tokens for CablePassport.com
 * Aesthetic: Industrial, pragmatic, high contrast. No glassmorphism, no generic gradients.
 * Colors derived from safety signage (safety orange/yellow), technical blueprints, and raw materials (copper, steel, pvc).
 */

:root {
    /* Palette: Industrial / Technical */
    --color-bg: #F5F5F3; /* Bare concrete / off-white paper */
    --color-bg-alt: #E8E8E6;
    --color-surface: #FFFFFF;
    --color-surface-dark: #1A1A1A; /* Matte black */
    --color-surface-accent: #2B2B2B;

    --color-text: #1A1A1A; /* High contrast black */
    --color-text-muted: #595959; /* Industrial grey */
    --color-text-invert: #F5F5F3;

    /* Accents: Safety and Wiring */
    --color-safety-orange: #FF5A00; /* Primary CTA */
    --color-safety-yellow: #FFC72C; /* Warning / Highlight */
    --color-copper: #B87333;
    --color-pvc-blue: #005A9C; /* Technical/Link */

    /* Typography */
    /* Display font: strong, geometric, technical */
    --font-display: 'Oswald', sans-serif;
    /* Text font: readable, highly legible */
    --font-text: 'IBM Plex Serif', serif;
    /* Mono for data, tables, code */
    --font-mono: 'IBM Plex Mono', monospace;

    /* Scale (Major Third) */
    --text-xs: 0.8rem;
    --text-sm: 1rem;
    --text-base: 1.125rem;
    --text-md: 1.414rem;
    --text-lg: 1.999rem;
    --text-xl: 2.827rem;
    --text-xxl: 3.998rem;

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

    /* Borders & Structure */
    --border-width-thin: 1px;
    --border-width-thick: 3px;
    --border-color: #D1D1D1;
    --border-color-dark: #1A1A1A;
    --radius-none: 0px; /* Sharp, industrial corners */
    --radius-sm: 2px;
}