:root {
    --primary-color: #3b2f63; /* Twilight Indigo */
    --primary-color-dark: #2a2047; /* Deeper Indigo */
    --secondary-color: #f7c948; /* Warm Golden Glow */
    --text-color: #1f1f1f; /* Deep Charcoal */
    --text-color-light: #f9f9f9; /* Almost White */
    --text-color-muted: #8a8f98; /* Cool Muted Gray */
    --background-light: #f4f5f7; /* Soft Mist Gray */
    --background-medium: #dcdbe3; /* Muted Lilac Gray */
    --success-color: #4caf50; /* Balanced Green */
    --warning-color: #ff7043; /* Sunset Orange */
    --border-color: #b0b3ba; /* Light Cool Gray */
    --shadow-color: rgba(34, 34, 34, 0.08); /* Soft Shadow */
    --icon-color: var(--secondary-color);
}
.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    background-color: rgba(43, 34, 64, 0.7);
}