/* * ═══════════════════════════════════════════════════════════════════════ * darx_tokens.css — Site-wide Design Tokens * Daralbeida.com · DAB-VIS-CSS-TOKENS-001 · v1.0 · May 2026 * * Linked by EVERY page on the site — consumer and system alike: * * * Contains only what every page needs: * · Google Fonts @import * · CSS custom properties (design tokens) * · Universal reset * · Base body rules * * System / internal pages also load darx_system.css (AFTER this file): * * * * Consumer pages (homepage etc.) do NOT load darx_system.css — they * only need the tokens, reset, and base body defined here. * * SPLIT FROM: darx_style_master.css (Sections 1-3 of that file) * darx_system.css carries Sections 4-10 (chrome, layouts, components). * * HOW TO CUSTOMIZE — read this first * ─────────────────────────────────── * Almost everything visual is controlled by CSS variables in SECTION 1. * Want to tweak the site? Open SECTION 1, find the variable, change one * value, save. No need to touch the rule blocks below. * * Common tweaks: * · Change brand background → --olive-1, --olive-2 * · Resize the fixed header/footer → --stripe-h, --banner-h, --topbar-h * · Change the sidebar width → --sidebar-w * · Change body text size → body { font-size: ... } * · Change consumer landing colors → --lp-gold, --lp-dark, --lp-bg * * PER-PAGE ENTITY ACCENT (gold / blue / terracotta) * ────────────────────────────────────────────────── * Each template should set its own --accent in a small