/* ============================================
   CSS VARIABLES — Araca Dark Theme
   ============================================ */
:root {
    --bg-primary: #1f1f1f;
    --bg-secondary: #2a2a2a;
    --bg-tertiary: #353535;
    --bg-hover: #383838;
    --accent: #3b82f6;
    --accent-hover: #2563eb;
    --accent-pressed: #1d4ed8;
    --text-primary: #e0e0e0;
    --text-secondary: #a0a0a0;
    --text-muted: #707070;
    --text-on-accent: #ffffff;
    --border: #3d3d3d;
    --border-light: #4a4a4a;
    --success: #22c55e;
    --danger: #ef4444;
    --brand-red: #ef4444;

    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    --font-display: 'Instrument Serif', Georgia, serif;
    --font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

    --section-pad: clamp(60px, 8vw, 120px);
    --container-max: 1240px;
    --radius: 10px;
    --radius-lg: 16px;
}