:root {
    --primary:        #315c85;  /* Slate Blue */
    --primary-dark:   #23425f;  /* Deep Slate Blue */
    --primary-light:  #4a81b8;  /* Light Slate Blue */
    --primary-subtle: #f4f7f9;  /* Off White Blue */
    --accent:         #E8B634;  /* Golden Yellow */
    --accent-light:   #FFE27C;  /* Pale Yellow */
    --neutral:        #d1d5db;  /* Cool Gray */
}

.bg-primary {
    background-color: var(--primary);
}

.bg-primary-dark {
    background-color: var(--primary-dark);
}

.text-primary {
    color: var(--primary);
}

body {
    font-family: 'Inter', sans-serif;
    letter-spacing: 0.3px;
}

h1, h2, h3, h4 {
    font-weight: 700;
    letter-spacing: 0.5px;
}

/* Smooth Transitions */
a, button {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hover Effects */
.hover-lift:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15);
}

.hover-glow:hover {
    box-shadow: 0 0 20px rgba(49, 92, 133, 0.4); /* Slate Blue rgba */
}

/* Navbar Scrolled Effect */
.navbar-scrolled {
    background-color: var(--primary-dark) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 10px;
}

::-webkit-scrollbar-track {
    background: #F8F9F8; /* Off White */
}

::-webkit-scrollbar-thumb {
    background: var(--primary);
    border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--primary-dark);
}

/* Touch Ripple */
.touch-ripple {
    position: fixed;
    width: 20px;
    height: 20px;
    pointer-events: none;
    border-radius: 9999px;
    background: rgba(49, 92, 133, 0.4); /* Slate Blue rgba */
    transform: translate(-50%, -50%) scale(0);
    animation: ripple-soft 0.6s ease-out forwards;
    z-index: 999999;
}

@keyframes ripple-soft {
    0%   { opacity: 0.9; transform: scale(0.2); }
    100% { opacity: 0;   transform: scale(10);  }
}