:root{

  /* =========================
     COLORS
  ========================= */

  --color-gold:#c9973e;
  --color-gold-light:#e6c177;
  --color-gold-soft:#f1d777;

  --color-bg:#080808;
  --color-bg-dark:#050505;
  --color-bg-soft:#0b0b0b;

  --color-card:#111;

  --color-text:#ffffff;
  --color-text-secondary:#cccccc;
  --color-text-muted:#888888;

  --color-border:rgba(201,151,62,0.2);

  --color-hover:#fff3cc;

  /* semantic */
  --color-primary:var(--color-gold);
  --color-accent:var(--color-gold-light);


  /* =========================
     SHADOW
  ========================= */

  --shadow-soft:0 8px 20px rgba(0,0,0,0.35);
  --shadow-gold:0 10px 30px rgba(201,151,62,0.15);


  /* =========================
     FONT
  ========================= */

  --font-main:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  --font-regular:400;
  --font-medium:500;
  --font-bold:700;


  /* =========================
     RADIUS
  ========================= */

  --radius-sm:10px;
  --radius-md:14px;
  --radius-lg:18px;


  /* =========================
     SPACING
  ========================= */

  --space-xs:6px;
  --space-sm:10px;
  --space-md:16px;
  --space-lg:24px;
  --space-xl:40px;


  /* =========================
     TRANSITIONS
  ========================= */

  --transition-fast:all .2s ease;
  --transition-base:all .25s ease;
  --transition-slow:all .35s ease;


  /* =========================
     Z-INDEX SYSTEM
  ========================= */

  --z-header:100;
  --z-menu:1000;
  --z-overlay:900;
  --z-modal:2000;


  /* =========================
     LAYOUT
  ========================= */

  --container-width:1200px;

}