/*
 * wildcatgraphickits.com: resolved design tokens, generated by tools/write-tokens-css.mjs
 * from config/tokens.json (extract-tokens.mjs, 2026-09-29). Source: the live
 * https://www.redlinesuperstore.com/media/templates/site/redline/css/colors.css?20260922b
 * (byte-identical to the local redline6 copy, diffed 2026-09-29). Every value is resolved; no
 * var() chain is copied. Light theme only: the live first-visit theme is data-bs-theme="light".
 */

@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('../fonts/roboto-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Saira Condensed';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('../fonts/saira-condensed-700-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: 'Saira Condensed';
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: url('../fonts/saira-condensed-800-latin.woff2') format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
    color-scheme: light;

    /* Color: brand layer */
    --brand-primary: #C0122D; /* colors.css line 113 */
    --brand-primary-hover: #9D0B17; /* colors.css line 114 */
    --brand-primary-active: #7F0A14; /* colors.css line 115 */
    --brand-primary-subtle: #FDECEE; /* colors.css line 116 */
    --brand-primary-fill: #C0122D; /* colors.css line 123 */
    --brand-primary-fill-hover: #9D0B17; /* colors.css line 124 */
    --brand-secondary: #3D598A; /* colors.css line 127 */
    --brand-ink: #1C1D20; /* colors.css line 134 */
    --brand-ink-2: #26282C; /* colors.css line 135 */
    --brand-ink-rgb: 28, 29, 32; /* colors.css line 189 */
    --brand-bg: #FFFFFF; /* colors.css line 137 */
    --brand-bg-alt: #F4F4F5; /* colors.css line 138 */
    --brand-bg-soft: #F9F9FA; /* colors.css line 139 */
    --brand-text: #282828; /* colors.css line 141 */
    --brand-text-body: #3A3D42; /* colors.css line 142 */
    --brand-text-secondary: #5C6670; /* colors.css line 143 */
    --brand-text-on-primary: #FFFFFF; /* colors.css line 144 */
    --brand-text-on-dark: #FFFFFF; /* colors.css line 145 */
    --brand-text-on-dark-2: #B9BEC5; /* colors.css line 146 */
    --brand-text-on-dark-soft: #E4E6EA; /* colors.css line 147 */
    --brand-border: #E2E4E8; /* colors.css line 151 */
    --brand-border-strong: #8A9099; /* colors.css line 153 */
    --brand-border-dark: #3A3D42; /* colors.css line 154 */
    --brand-link: #C0122D; /* colors.css line 91 (--bs-link-color) */
    --brand-link-hover: #9D0B17; /* colors.css line 93 (--bs-link-hover-color) */

    /* On ink bands: the dark-theme fill (line 123 dark block) because
       #C0122D is only 2.70:1 on #1C1D20 (recomputed in research/style-report.md). */
    --brand-primary-fill-on-ink: #D6203C;
    --brand-primary-fill-on-ink-hover: #B81830; /* colors.css dark .btn-primary:active */
    --focus-outline-on-ink: #FFFFFF; /* template.css .section-dark focus outline */

    /* Type */
    --font-display: 'Saira Condensed', 'Arial Narrow', Arial, sans-serif; /* colors.css line 194 */
    --font-heading: 'Saira Condensed', 'Arial Narrow', Arial, sans-serif; /* colors.css line 195 */
    --font-body: 'Roboto', 'Helvetica Neue', Arial, sans-serif; /* colors.css line 196 */
    --text-xs: .75rem; /* colors.css line 198 */
    --text-sm: .875rem; /* colors.css line 198 */
    --text-base: 1rem; /* colors.css line 198 */
    --text-md: 1.125rem; /* colors.css line 198 */
    --text-lg: 1.25rem; /* colors.css line 198 */
    --text-xl: clamp(1.25rem,1.2vw + .9rem,1.5rem); /* colors.css line 199 */
    --text-2xl: clamp(1.5rem,1.8vw + .9rem,2rem); /* colors.css line 200 */
    --text-3xl: clamp(1.875rem,2.6vw + 1rem,2.75rem); /* colors.css line 201 */
    --text-4xl: clamp(2.25rem,3.6vw + 1rem,3.75rem); /* colors.css line 202 */
    --text-5xl: clamp(2.75rem,5.4vw + 1rem,5.5rem); /* colors.css line 203 */
    --tracking-tight: -0.01em; /* colors.css line 205 */
    --tracking-wide: .04em; /* colors.css line 205 */
    --tracking-widest: .16em; /* colors.css line 205 */

    /* Space, shape, motion */
    --section-py: clamp(3rem,6vw,5.5rem); /* colors.css line 207 */
    --section-py-sm: clamp(2rem,4vw,3.5rem); /* colors.css line 208 */
    --section-py-xs: clamp(1rem,2vw,1.75rem); /* colors.css line 209 */
    --radius-sm: 3px; /* colors.css line 211 */
    --skew: -12deg; /* colors.css line 212 */
    --shadow-sm: 0 1px 2px rgba(20,20,22,.06),0 1px 3px rgba(20,20,22,.08); /* colors.css line 214 */
    --shadow-md: 0 6px 18px rgba(20,20,22,.10),0 2px 6px rgba(20,20,22,.06); /* colors.css line 215 */
    --focus-ring: 0 0 0 3px #FFFFFF, 0 0 0 5px #C0122D; /* colors.css line 217 */
    --transition-fast: 150ms ease; /* colors.css line 219 */
    --transition-base: 250ms ease; /* colors.css line 219 */

    /* Layout (microsite) */
    --container: 1200px;
    --sticky-bar-h: 64px;
}
