:root {
  --bg-main: #ffffff;
  --bg-dark: #0b1120;

  --text-main: #222;
  --text-light: #ffffff;

  --title-light: #003366;
  --title-dark: #ebe5e5;

  --text-muted-light: #475569;
  --text-muted-dark: #cbd5f5;

  --primary: #003366;
  --primary-hover: #339cff;
  --accent: #66ccff;

  --header-light: linear-gradient(
    90deg,
    rgba(232, 232, 232, 0.555),
    rgba(207, 207, 207, 0.555)
  );
  --header-dark: linear-gradient(
    90deg,
    rgba(15, 22, 36, 0.5),
    rgba(30, 41, 59, 0.5),
    rgba(15, 23, 42, 0.5)
  );

  --section-light: linear-gradient(120deg, #0f2e52, #143a63, #003366, #1a4b7a);
  --section-dark: linear-gradient(135deg, #081629, #0b1d33, #011429, #0d203a);

  --section-divider-light: linear-gradient(135deg, #368ee5, #1f334a);
  --section-divider-dark: linear-gradient(135deg, #183a70, #6997cd);

  --skills-bg-light: #ffffff;
  --skills-bg-dark: #0b1120;

  --card-bg-light: #f4f7fb;
  --card-bg-dark: rgba(15, 23, 42, 0.9);

  --card-border-light: rgba(0, 0, 0, 0.08);
  --card-border-dark: rgba(255, 255, 255, 0.15);

  --card-shadow-light: 0 12px 28px rgba(0, 0, 0, 0.06);
  --card-shadow-light-hover: 0 18px 36px rgba(0, 0, 0, 0.079);

  --card-shadow-dark: 0 12px 28px rgba(0, 0, 0, 0.45);
  --card-shadow-dark-hover: 0 18px 36px rgba(0, 0, 0, 0.6);

  --s0: #3596ce;
  --s1: #3924f8;
  --s2: #00c853;
  --s3: #ff6f00;
  --s4: #0f172a;
  --s5: #b8c263;
}