@font-face { font-family: SCP; src: url('Montserrat-SemiBold.ttf'); } 
@font-face { font-family: 'NotoMono'; src: url('NotoSansMono-Medium.ttf'); }


body {
    background-image: linear-gradient(to bottom, #1a1a1a, #41727d);
    background-attachment: fixed;
    margin: 0;
    font-family: 'SCP', sans-serif;
    color: #ede5d8;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}



.name-header {
    font-family: 'NotoMono', monospace;
    font-size: 28px;
    opacity: 0;
    animation: fadeInName 1s ease-out forwards;

    
}

.line {
    width: 2px;
    height: 100px; 
    background-color: #ede5d8;

}

.container {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 40px; 
    z-index: 2;

}



@keyframes fadeInName {
    0% { opacity: 0; transform: translateY(10px); }
    100% { opacity: 1; transform: translateY(0); }
}

.social-icons {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.social-icons a {
    color: #ede5d8;
    text-decoration: none;
    font-size: 32px;
    transition: filter 0.1s ease, transform 0.2s ease;
    display: inline-block;
}

.social-icons a:hover {
    filter: brightness(0);
    transform: scale(1.1);
}