:root {
  --yellow:       #F5C000;   /* PRIMARY — all CTAs, accents, highlights */
  --yellow-hover: #C99A00;   /* Hover state */
  --yellow-deep:  #4A3800;   /* Text ON yellow backgrounds */
  --yellow-soft:  rgba(245, 192, 0, 0.10);

  --dark:         #141412;   /* Page background, hero, sidebar */
  --dark-2:       #1E1E1C;   /* Cards, modals */
  --dark-3:       #242422;   /* Nested cards, inputs */
  --border:       #3A3A38;   /* All borders */

  --light:        #F5F4F0;   /* Light sections bg */
  --white:        #FFFFFF;

  --text-main:    #FFFFFF;   /* Text on dark bg */
  --text-sub:     #C8C7C2;   /* Secondary text on dark */
  --text-muted:   #888884;   /* Hints, placeholders */
  --text-dark:    #141412;   /* Text on yellow or light bg */
}