:root {
    --primary: #0D579B;
    --secondary: #E11D48;
    --dark: #374151;
    --light: #F8FAFC;
}

body {
    background: #fff;
    min-height: 100vh;
    overflow-x: hidden;
}

.fractal-border {
    background: linear-gradient(45deg, rgba(29, 78, 216, 0.1), rgba(225, 29, 72, 0.1));
}

.fractal-glow {
    position: absolute;
    width: 150%;
    height: 150%;
    top: -25%;
    left: -25%;
    background: 
        radial-gradient(circle at 50% 0%, rgba(29, 78, 216, 0.2), transparent 70%),
        radial-gradient(circle at 80% 20%, rgba(225, 29, 72, 0.15), transparent 60%),
        radial-gradient(circle at 20% 20%, rgba(147, 51, 234, 0.15), transparent 60%);
    filter: blur(60px);
    opacity: 0.6;
    mix-blend-mode: soft-light;
    transform: rotate(-3deg);
    animation: slow-drift 30s ease-in-out infinite alternate;
}

@keyframes fractal-spin {
    0% { transform: rotate(0deg) scale(1); }
    50% { transform: rotate(180deg) scale(1.05); }
    100% { transform: rotate(360deg) scale(1); }
}

@keyframes fractal-pulse {
    0%, 100% { transform: scale(1); opacity: 0.2; }
    50% { transform: scale(1.05); opacity: 0.3; }
}

@keyframes fractal-reveal {
    0% { transform: scale(0.9); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

.animate-fractal-spin {
    animation: fractal-spin 20s linear infinite;
}

.animate-fractal-pulse {
    animation: fractal-pulse 3s ease-in-out infinite;
}

.animate-fractal-reveal {
    animation: fractal-reveal 0.5s ease-out forwards;
}

@media (prefers-reduced-motion: reduce) {
    .animate-fractal-spin,
    .animate-fractal-pulse,
    .animate-fractal-reveal {
        animation: none;
    }
}