/* 404 page styles */

@font-face {
    font-family: 'Plus Jakarta Sans';
    src: url('/fonts/Plus_Jakarta_Sans/PlusJakartaSans-VariableFont_wght.woff2') format('woff2');
    font-weight: 300 800;
    font-display: swap;
}

@font-face {
    font-family: 'Fira Code';
    src: url('/fonts/Fira_Code/FiraCode-VariableFont_wght.woff2') format('woff2');
    font-weight: 400 600;
    font-display: swap;
}

body {
    font-family: 'Plus Jakarta Sans', sans-serif;
    background-color: #020617;
    color: #F8FAFC;
    overflow: hidden;
}

.mono {
    font-family: 'Fira Code', monospace;
}

.glitch-text {
    animation: glitch 1s linear infinite;
}

@keyframes glitch {

    2%,
    64% {
        transform: translate(2px, 0) skew(0deg);
    }

    4%,
    60% {
        transform: translate(-2px, 0) skew(0deg);
    }

    62% {
        transform: translate(0, 0) skew(5deg);
    }
}

.terminal-box {
    background: rgba(15, 23, 42, 0.8);
    border: 1px solid rgba(16, 185, 129, 0.2);
    box-shadow: 0 0 50px rgba(16, 185, 129, 0.1);
}

.dot-grid-bg {
    background-image: radial-gradient(#10B981 1px, transparent 1px);
    background-size: 20px 20px;
}