@font-face {font-family: 'VT323'; src: url('VT323-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal;}
:root {--bg-color: #121212; --text-color: #98FB98; --highlight-color: #FFFFFF; --secondary-text: #808080; --blue-color: #4169E1; --red-color: #FF6347;}
.header-nav {display: flex; justify-content: center; gap: 2rem;}
.header-nav a {color: var(--text-color); text-decoration: none; font-size: 1.5rem; transition: color 0.3s ease;}
.header-nav a:hover {color: var(--highlight-color); text-decoration: underline;}
.header-nav .gamedev-link {color: var(--blue-color);}
.header-nav .cv-link {color: var(--red-color);}
* {margin: 0; padding: 0; box-sizing: border-box; font-family: 'VT323', monospace;}
body {background-color: var(--bg-color); color: var(--text-color); line-height: 1.6; padding: 2rem; font-size: 20px;}
.portfolio-container {max-width: 1400px; margin: 0 auto;}
.welcome-section {text-align: center; margin-bottom: 3rem;}
.welcome-section h1 {font-size: 4rem; color: var(--highlight-color); margin-bottom: 1rem;}
.project-grid {display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem;}
.project-card {background-color: rgba(255,255,255,0.05); padding: 2rem; border-left: 4px solid var(--text-color); transition: all 0.3s ease; height: 100%; display: flex; flex-direction: column; justify-content: space-between;}
.project-card:hover {background-color: rgba(255,255,255,0.1);}
.project-card.blackwall {background-color: rgba(0,0,0,0.5); opacity: 0.7; text-align: center;}
.project-title {font-size: 2.5rem; color: var(--highlight-color); margin-bottom: 0.5rem;}
.primary-lang {color: var(--highlight-color); font-weight: bold; font-size: 1.2rem;}
.databases {color: var(--red-color);}
.web-stack {color: var(--blue-color);}
.secondary-langs {color: var(--secondary-text); font-size: 1rem;}
.project-description {margin-top: 0.5rem; flex-grow: 1; display: flex; align-items: flex-end;}
.site-footer {text-align: center; padding: 2rem; margin-top: 2rem; border-top: 2px solid var(--text-color); font-size: 1rem;}
@media (max-width: 1200px) {.project-grid {grid-template-columns: repeat(2, 1fr);} .project-card.blackwall {grid-column: 1 / span 2;}}
@media (max-width: 768px) {.project-grid {grid-template-columns: 1fr;} .project-card.blackwall {grid-column: 1;} body {padding: 1rem; font-size: 18px;} .welcome-section h1 {font-size: 3rem;}}