[data-theme="light"] {
  --bg-gradient-onyx: linear-gradient(to bottom right, hsl(0, 0%, 95%) 3%, hsl(0, 0%, 88%) 97%);
  --bg-gradient-jet: linear-gradient(to bottom right, hsla(0, 0%, 85%, 0.5) 0%, hsla(0, 0%, 80%, 0) 100%), hsl(0, 0%, 88%);
  --bg-gradient-yellow-1: linear-gradient(to bottom right, hsl(38, 80%, 50%) 0%, hsla(36, 80%, 48%, 0) 50%);
  --bg-gradient-yellow-2: linear-gradient(135deg, hsla(38, 80%, 50%, 0.25) 0%, hsla(35, 80%, 48%, 0) 59.86%), hsl(0, 0%, 88%);
  --border-gradient-onyx: linear-gradient(to bottom right, hsl(0, 0%, 70%) 0%, hsla(0, 0%, 70%, 0) 50%);
  --text-gradient-yellow: linear-gradient(to right, hsl(38, 90%, 42%), hsl(35, 85%, 38%));

  --jet: hsl(0, 0%, 82%);
  --onyx: hsl(0, 0%, 93%);
  --eerie-black-1: hsl(0, 0%, 91%);
  --eerie-black-2: hsl(0, 0%, 89%);
  --smoky-black: hsl(0, 0%, 97%);

  --white-1: hsl(0, 0%, 10%);
  --white-2: hsl(0, 0%, 14%);

  --orange-yellow-crayola: hsl(38, 90%, 38%);
  --vegas-gold: hsl(38, 54%, 44%);
  --light-gray: hsl(0, 0%, 30%);
  --light-gray-70: hsla(0, 0%, 30%, 0.85);
  --bittersweet-shimmer: hsl(0, 43%, 45%);
  --service-icon-color: hsl(0, 0%, 18%);
  --service-icon-accent: hsl(38, 90%, 38%);

  --shadow-1: -4px 8px 24px hsla(0, 0%, 0%, 0.08);
  --shadow-2: 0 16px 30px hsla(0, 0%, 0%, 0.08);
  --shadow-3: 0 16px 40px hsla(0, 0%, 0%, 0.08);
  --shadow-4: 0 25px 50px hsla(0, 0%, 0%, 0.06);
  --shadow-5: 0 24px 80px hsla(0, 0%, 0%, 0.08);
}

[data-theme="light"] .navbar {
  background: hsla(0, 0%, 94%, 0.85);
  border-color: hsl(0, 0%, 82%);
}