:root {
  --primary-color: #6a1b9a; /* Deep Purple */
  --primary-color-dark: #4a148c; /* Darker Purple */
  --secondary-color: #ff4081; /* Vivid Pink Accent */
  --text-color: #1c1c1e; /* Almost Black Text */
  --text-color-light: #fefefe; /* Near-White Text */
  --text-color-muted: #9e9e9e; /* Neutral Gray */
  --background-light: #f8f5fc; /* Very Light Lavender */
  --background-medium: #e6d7f0; /* Soft Pastel Purple */
  --success-color: #00c853; /* Bright Green */
  --warning-color: #ff5722; /* Deep Orange */
  --border-color: #d1c4e9; /* Soft Purple Border */
  --shadow-color: rgba(0, 0, 0, 0.12); /* Slightly Deeper Shadow */
  --icon-color: var(--secondary-color);
}

.hero-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  background-color: rgb(106 27 154 / 70%);
} /* Deep purple overlay */