:root {
        /* ── BACKGROUNDS ─────────────────────────────────────────── */
    --primary-bg:       #071c23;
    --secondary-bg:     #0d2b35;
    --surface-bg:       #123844;
    --header-bg:        #071c23;
    --footer-bg:        #041419;

    /* ── OLD RED SYSTEM → TEAL SYSTEM ───────────────────────── */
    --red-dark:         #0b6d74;
    --red-mid:          #1195a0;
    --red-bright:       #2ac6cf;

    --red-grad:         linear-gradient(135deg,#0b6d74 0%,#1195a0 50%,#2ac6cf 100%);
    --red-grad-h:       linear-gradient(135deg,#0f7e86 0%,#18aeb8 50%,#4cdbe3 100%);

    --red-10:           rgba(42,198,207,0.10);
    --red-20:           rgba(42,198,207,0.20);

    --red-border:       rgba(42,198,207,0.35);
    --red-border-strong:rgba(42,198,207,0.55);

    /* ── MAIN ACCENT (TEAL) ─────────────────────────────────── */
    --accent-gold:      #19b9c3;
    --accent-gold-lt:   #42d5de;
    --accent-gold-dk:   #0d8e96;

    --accent-gold-10:   rgba(25,185,195,0.10);
    --accent-gold-20:   rgba(25,185,195,0.20);

    --border-gold:      rgba(25,185,195,0.35);
    --shadow-gold:      0 4px 20px rgba(25,185,195,0.25);

    --btn-primary-bg:   #19b9c3;
    --btn-primary-txt:  #ffffff;

    --accent-gold-rgb:  25,185,195;

    /* ── TEXT ────────────────────────────────────────────────── */
      --text-primary:     #ffffff;
      --text-secondary:   #d7e4e7;
      --text-muted:       #93aeb5;


    /* ── BORDERS ─────────────────────────────────────────────── */
      --border-color:     #1c4852;

    /* ── FONTS ───────────────────────────────────────────────── */
    --font-heading: 'Sora', sans-serif;
    --font-body: 'DM Sans', sans-serif;

    /* ── TYPE SCALE ──────────────────────────────────────────── */
    --fs-xs:    0.75rem;
    --fs-sm:    0.875rem;
    --fs-base:  1rem;
    --fs-md:    1.125rem;
    --fs-lg:    1.25rem;
    --fs-xl:    1.5rem;
    --fs-2xl:   2rem;
    --fs-hero:  clamp(2.2rem, 5vw, 4rem);

    /* ── SPACING ─────────────────────────────────────────────── */
    --section-py:   4rem;
    --card-p:       2rem;
    --border-r:     0.5rem;
    --border-r-lg:  1rem;

    /* ── EFFECTS ─────────────────────────────────────────────── */
    --shadow-sm:    0 2px 8px rgba(0,0,0,0.7);
    --shadow-md:    0 8px 24px rgba(0,0,0,0.8);
    --transition:   all 0.3s cubic-bezier(0.4, 0, 0.2, 1);

    /* ── LAYOUT ──────────────────────────────────────────────── */
    --header-h:     80px;
}