/* ── Backward-compatible aliases (used by script.js inline HTML & project/article/privacy pages) ── */
:root {
    --brand-50:  var(--gold-50);
    --brand-100: var(--gold-100);
    --brand-200: var(--gold-200);
    --brand-300: var(--gold-300);
    --brand-400: var(--gold-400);
    --brand-500: var(--gold-500);
    --brand-600: var(--gold-600);
    --brand-700: var(--gold-700);
    --brand-800: var(--gold-800);
    --brand-900: var(--gold-900);
    --brand-950: var(--gold-950);
    --font-sans:  var(--font-body);
    --font-serif: var(--font-display);
}

/* MBEFFECTS — "TEJ" TEMPLATE DESIGN SYSTEM (monochrome, editorial-minimal) */

:root {
    /* Raw template palette (black / white / gray / silver / light) */
    --black:  #000000;
    --white:  #ffffff;
    --dark:   #1a1a1a;
    --gray:   #555555;
    --silver: #888888;
    --line:   #c9c9c9;

    /* "gold-*" tokens are kept only for naming/back-compat — they now hold
       the monochrome accent scale. Default (root) values = DARK context,
       i.e. what's used on black sections (hero, footer, testimonials).
       Sections with a light/off-white background locally override this
       whole block below (see "SECTION THEMES"), so every component that
       already reads these variables re-themes itself automatically. */
    --gold-50:  #ffffff;
    --gold-100: #f2f2f2;
    --gold-200: #e0e0e0;
    --gold-300: #c9c9c9;
    --gold-400: #ffffff;
    --gold-500: #ffffff;
    --gold-600: #e6e6e6;
    --gold-700: #aaaaaa;
    --gold-800: #777777;
    --gold-900: #4d4d4d;
    --gold-950: #262626;

    --bg:        #000000;
    --bg-1:      #000000;
    --bg-2:      #000000;
    --bg-3:      #0d0d0d;
    --surface:   rgba(255,255,255,0.05);
    --surface-2: rgba(255,255,255,0.09);
    --border:    rgba(255,255,255,0.16);
    --border-gold: rgba(255,255,255,0.32);

    --text-primary:   #ffffff;
    --text-secondary: #c9c9c9;
    --text-muted:     #8f8f8f;

    --font-display: 'Montserrat', sans-serif;
    --font-body:    'Raleway', sans-serif;
    --font-mono:    'DM Mono', 'Courier New', monospace;

    --section-pad: clamp(70px, 9vw, 110px);
    --radius-sm:   0px;
    --radius-md:   0px;
    --radius-lg:   0px;
    --radius-xl:   0px;

    --ease-out:    cubic-bezier(0.455, 0.03, 0.515, 0.955);
    --ease-spring: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
