/* Custom Geometric Animations and Utilities */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700&family=Playfair+Display:ital,wght@0,600;1,600&display=swap');

body {
    font-family: 'Outfit', sans-serif;
}

h1, h2, h3, h4 {
    font-family: 'Playfair Display', serif;
}

/* Smooth Scrolling */
html {
    scroll-behavior: smooth;
}

/* Geometric Shape Utilities */
.shape-blob-1 {
    position: absolute;
    top: -10%;
    right: -5%;
    width: 500px;
    height: 500px;
    background: linear-gradient(45deg, #00E5FF, #00B8D4);
    border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
    z-index: -1;
    opacity: 0.1;
    animation: blob-float 10s infinite ease-in-out;
}

.shape-blob-2 {
    position: absolute;
    bottom: 10%;
    left: -10%;
    width: 400px;
    height: 400px;
    background: #0A192F;
    border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
    z-index: -1;
    opacity: 0.05;
    animation: blob-float 15s infinite ease-in-out reverse;
}

@keyframes blob-float {
    0% { transform: translate(0, 0) rotate(0deg); }
    50% { transform: translate(20px, 40px) rotate(10deg); }
    100% { transform: translate(0, 0) rotate(0deg); }
}

/* Mobile Menu Transitions */
#mobile-menu {
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.mobile-link {
    transition: color 0.2s ease;
}

.mobile-link:hover {
    color: #00E5FF;
}

/* Custom Selection Color */
::selection {
    background: #00E5FF;
    color: #0A192F;
}