/* ==========================================
   BASE STYLES
   ========================================== */

/* Body Styles */
body {
    background-color: #000000;
    color: #94a3b8;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
    font-family: 'Plus Jakarta Sans', sans-serif;
}

body::selection {
    background-color: white;
    color: black;
}

body ::-moz-selection {
    background-color: white;
    color: black;
}

/* Digital Void Background */
.digital-void {
    position: fixed;
    inset: 0;
    background: radial-gradient(circle at 50% 50%, #0a0a0a 0%, #050505 100%);
    z-index: -1;
    overflow: hidden;
}

/* Data Stream Effects */
.data-stream {
    position: absolute;
    top: -10%;
    width: 1px;
    height: 20%;
    background: linear-gradient(to bottom, transparent, rgba(255,255,255,0.1), transparent);
    animation: fall linear infinite;
}

@keyframes fall {
    0% {
        transform: translateY(-100%);
        opacity: 0;
    }
    10% {
        opacity: 1;
    }
    90% {
        opacity: 1;
    }
    100% {
        transform: translateY(1000%);
        opacity: 0;
    }
}

/* Orb Background Elements */
.orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    background: rgba(255, 255, 255, 0.03);
    animation: drift 20s infinite alternate ease-in-out;
}

@keyframes drift {
    0% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(50px, 50px) scale(1.05);
    }
    100% {
        transform: translate(0, 0) scale(1);
    }
}

/* Smooth Scrolling */
html {
    scroll-behavior: smooth;
}

/* Remove default margins and padding */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Links */
a {
    text-decoration: none;
    color: inherit;
}

/* Buttons */
button {
    cursor: pointer;
    border: none;
    outline: none;
    font-family: inherit;
}

button:focus {
    outline: none;
}

/* Images */
img {
    max-width: 100%;
    height: auto;
    display: block;
}

/* Material Symbols */
.material-symbols-outlined {
    font-variation-settings:
    'FILL' 0,
    'wght' 400,
    'GRAD' 0,
    'opsz' 24;
}

/* Reveal Section Animation */
.reveal-section {
    opacity: 0;
    filter: blur(10px);
    transform: translateY(30px);
    transition: all 1.2s cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal-section.visible {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
}