:root {
    --oasis-blue: #0B4EA2;
    --oasis-light-blue: #1E90FF;
    --oasis-green: #00A67E;
    --oasis-light-green: #4CAF50;
}

@keyframes fade-in-up {
    0% { opacity: 0; transform: translateY(20px); }
    100% { opacity: 1; transform: translateY(0); }
}

.animate-fade-in-up {
    animation: fade-in-up 1s ease-out;
}

.glass-effect {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

.hover-scale {
    transition: transform 0.3s ease;
}
.hover-scale:hover {
    transform: translateY(-5px);
}

@keyframes glitch {
    0% { transform: translate(0); }
    20% { transform: translate(-2px, 2px); }
    40% { transform: translate(-2px, -2px); }
    60% { transform: translate(2px, 2px); }
    80% { transform: translate(2px, -2px); }
    100% { transform: translate(0); }
}

.glitch-effect {
    animation: glitch 1s infinite;
    text-shadow: 2px 2px #ff0000, -2px -2px #00ff00;
}

@keyframes scale-pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

.scale-pulse {
    animation: scale-pulse 3s infinite;
}

/* Add brand-specific styles */
.text-gradient {
    background: linear-gradient(90deg, var(--oasis-blue), var(--oasis-green));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.btn-primary {
    background-color: var(--oasis-blue);
    color: white;
    transition: all 0.3s ease;
}

.btn-primary:hover {
    background-color: var(--oasis-light-blue);
}

@keyframes moveGradient {
    0% {
        transform: translate(-10%, -10%);
    }
    50% {
        transform: translate(10%, 10%);
    }
    100% {
        transform: translate(-10%, -10%);
    }
}

@keyframes pulseLogo {
    0% {
        opacity: 0;
        transform: scale(0.9);
    }
    50% {
        opacity: 0.3;
        transform: scale(1.1);
    }
    100% {
        opacity: 0;
        transform: scale(0.9);
    }
}