/*Setup*/
body {
    font-family: 'Poppins', sans-serif;
    background: #171717;
}

html {
    scroll-behavior: smooth;
}

:root {
    --metal-light: #d9d9d9;
    --metal-mid: #8c8c8c;
    --metal-dark: #4d4d4d;
    --industrial-black: #171717;
    --accent-red: #e10600;
}

/*Classes*/

.metal-text {
    background: linear-gradient(to bottom,
            #ffffff 0%,
            #d7d7d7 25%,
            #8e8e8e 50%,
            #f5f5f5 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.metal-card {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(12px);
}

/*Animation */

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(30px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}