@import"https://fonts.googleapis.com/css2?family=Work+Sans:opsz,wght@6..32,300..700&display=swap";:root{font-family:Work Sans,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-optical-sizing:auto;color-scheme:light dark;color:#000000de;background-color:#f1f1f1;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html{scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;background-color:#f1f1f1}:root{--primary-color: #383535;--secondary-color: #5e5e5e;--accent-color: #0532FF;--text-color: #383535;--text-light: #B5B4B4;--background-color: #F1F1F1;--background-alt: #F1F1F1;--border-color: #e1e1e1;--header-height: 60px;--container-width: 1200px;--transition-speed: .3s;--spacing-sm: 1rem;--spacing-md: 2rem;--spacing-lg: 4rem;--spacing-xl: 6vw;--font-family: "Work Sans", sans-serif}@media (prefers-color-scheme: dark){:root{--primary-color: #f5f5f5;--secondary-color: #e0e0e0;--accent-color: #0532ff;--text-color: #f5f5f5;--text-light: #bdbdbd;--background-color: #121212;--background-alt: #1e1e1e;--border-color: #333}}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-family);font-size:16px;line-height:1.6;color:var(--text-color);background-color:var(--background-color);margin:0;font-weight:400;letter-spacing:-.01em;font-optical-sizing:auto}#root{display:flex;flex-direction:column;min-height:100vh;max-width:100%;margin:0;padding:0}.app{display:flex;flex-direction:column;min-height:100vh}.container{max-width:var(--container-width);width:90%;margin:0 auto;padding:0 var(--spacing-sm)}a{color:var(--text-color);text-decoration:none;transition:color var(--transition-speed) ease;font-weight:400}a:hover{color:var(--accent-color)}section{padding:var(--spacing-lg) 0}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.2;margin-bottom:var(--spacing-sm);color:var(--primary-color)}img{max-width:100%;height:auto;display:block}.header{position:fixed;top:0;left:0;width:100%;z-index:1000;background-color:transparent;transition:all var(--transition-speed) ease}.header-inner{height:var(--header-height);display:flex;align-items:center;justify-content:space-between;max-width:var(--container-width);margin:0 auto;padding:0 var(--spacing-sm);width:90%}.site-title{font-size:1.2rem;font-weight:700;color:var(--text-light);text-decoration:none}.nav-list{display:flex;list-style:none;gap:var(--spacing-md)}.nav-item a{color:var(--text-color);font-weight:400;position:relative}.nav-item a:hover{color:var(--accent-color)}.mobile-menu-toggle{display:none;flex-direction:column;justify-content:space-between;height:24px;cursor:pointer;position:relative;width:30px}.mobile-menu-toggle span{height:2px;width:100%;background-color:var(--text-color);transition:all var(--transition-speed) ease;display:block;position:absolute;border-radius:1px}.mobile-menu-toggle span:nth-child(1){top:0}.mobile-menu-toggle span:nth-child(2){top:50%;transform:translateY(-50%)}.mobile-menu-toggle span:nth-child(3){bottom:0}.hero-section{padding-top:calc(var(--header-height) + 2rem);padding-bottom:2rem;display:flex;align-items:center;min-height:40vh}.hero-section h2{font-size:2.5rem;font-weight:600;max-width:800px;line-height:1.2}.section-title{font-size:1rem;margin-bottom:var(--spacing-lg);position:relative;display:inline-block;font-weight:700}.project-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));grid-gap:var(--spacing-lg)}.project-card{border-radius:0;overflow:hidden;background-color:var(--background-color);transition:transform var(--transition-speed) ease}.project-card:hover{transform:translateY(-5px)}.project-media{overflow:hidden;position:relative;height:250px;background-size:cover;background-position:center;background-repeat:no-repeat;display:flex;align-items:center;justify-content:center;border-radius:8px}.project-media:before{content:"";position:absolute;inset:0;background-color:#0000004d;z-index:1;border-radius:8px}.project-media.bruu{background-image:url(../images/background_bruu.png)}.project-media.kniffle{background-image:url(../images/background_kniffle.png)}.project-logo{max-width:120px;max-height:120px;opacity:.95;transition:transform var(--transition-speed) ease;position:relative;z-index:2;filter:brightness(1.1) contrast(1.1)}.project-card:hover .project-logo{transform:scale(1.1)}.project-info{padding-top:1rem;padding-bottom:var(--spacing-md);display:flex;flex-direction:column;gap:1rem}.project-title{font-size:1rem;margin:0;font-weight:700}.project-description{color:var(--text-light);margin:0;font-weight:600}.project-link{display:inline-block;font-weight:400;position:relative;margin:0}.project-link:after{content:"→";margin-left:5px;transition:transform var(--transition-speed) ease;display:inline-block}.project-link:hover:after{transform:translate(5px)}.about-section{background-color:var(--background-color)}.about-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-lg);align-items:start}.about-text p{margin-bottom:var(--spacing-md);color:var(--text-light);font-weight:600}.skills-container h3{margin-bottom:var(--spacing-sm);font-weight:500}.skills-list{list-style-type:none}.skills-list li{margin-bottom:.75rem;padding-left:1.5rem;position:relative;color:var(--text-light);font-weight:600}.skills-list li:before{content:"•";color:var(--accent-color);position:absolute;left:0}.contact-section{text-align:left}.contact-intro{font-size:1.25rem;max-width:600px;margin:0 0 var(--spacing-md) 0;color:var(--text-color);font-weight:600}.contact-info{display:flex;flex-direction:column;align-items:flex-start;margin-top:var(--spacing-sm)}.contact-link{font-size:1rem;font-weight:400;text-decoration:underline;text-underline-offset:2px}.social-links{display:flex;gap:var(--spacing-sm)}.social-link{display:inline-block;padding:.5rem 0;font-weight:400;margin-right:1.5rem}.social-link:hover{color:var(--accent-color)}.project-detail{padding-top:var(--header-height);width:100%}.project-detail-header{padding:2rem 0;position:relative;width:90%;max-width:var(--container-width);margin:0 auto}.back-button{display:inline-block;margin-bottom:1rem;font-weight:400;text-decoration:none;color:var(--text-color)}.back-button:hover{color:var(--accent-color)}.project-detail-header-content h1{font-size:2rem;font-weight:700;margin-bottom:.5rem}.project-subtitle{color:var(--text-light);font-size:1rem;margin-bottom:2rem}.project-detail-content{width:90%;max-width:var(--container-width);margin:0 auto}.project-hero{height:400px;display:flex;align-items:center;justify-content:center;margin-bottom:2rem;border-radius:8px}.project-hero-logo{max-width:200px;max-height:200px}.project-detail-description{margin-bottom:3rem}.project-detail-description h2{font-size:1.5rem;font-weight:700;margin:2rem 0 1rem}.project-detail-description p{margin-bottom:1.5rem;line-height:1.6}.project-technologies{list-style-type:none;padding:0;display:flex;flex-wrap:wrap;gap:1rem}.project-technologies li{background-color:var(--background-alt);padding:.5rem 1rem;border-radius:4px;font-size:.9rem}.project-detail-gallery h2{font-size:1.5rem;font-weight:700;margin:2rem 0 1rem}.project-gallery-item{margin-bottom:2rem}.project-gallery-image{height:300px;display:flex;align-items:center;justify-content:center;margin-bottom:1rem;border-radius:8px}.project-gallery-image img{max-width:80%;max-height:80%}.project-gallery-item p{font-size:.9rem;color:var(--text-light)}.project-not-found{padding:6rem 2rem;text-align:center}.back-link{display:inline-block;margin-top:1rem;font-weight:400;text-decoration:underline}.footer{background-color:var(--background-color);padding:var(--spacing-md) 0 calc(var(--spacing-lg) * 2);margin-top:auto;font-size:.9rem;color:var(--text-color);font-weight:600}.footer-content{display:flex;justify-content:space-between;align-items:center;max-width:var(--container-width);width:90%;margin:0 auto;padding:0 var(--spacing-sm)}.footer-social{display:flex;gap:20px}.social-icon{display:inline-block;width:24px;height:24px;background-size:contain;background-repeat:no-repeat;background-position:center;opacity:.9;transition:opacity var(--transition-speed) ease}.social-icon:hover{opacity:1}.github-icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23383535'%3E%3Cpath d='M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z'/%3E%3C/svg%3E")}.linkedin-icon{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23383535'%3E%3Cpath d='M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z'/%3E%3C/svg%3E")}@media (max-width: 768px){.header-inner{height:var(--header-height)}.header-nav{position:fixed;top:var(--header-height);left:0;width:100%;background-color:var(--background-color);height:0;overflow:hidden;transition:height var(--transition-speed) ease}.header-nav.open{height:calc(100vh - var(--header-height))}.nav-list{flex-direction:column;padding:var(--spacing-md);gap:var(--spacing-md)}.nav-item{width:100%;text-align:left}.nav-item a{font-size:1.25rem;display:block;padding:var(--spacing-sm) 0}.mobile-menu-toggle{display:flex}.mobile-menu-toggle.open span:nth-child(1){transform:translateY(11px) rotate(45deg)}.mobile-menu-toggle.open span:nth-child(2){opacity:0}.mobile-menu-toggle.open span:nth-child(3){transform:translateY(-11px) rotate(-45deg)}.hero-section h2{font-size:2rem}.project-grid,.about-content{grid-template-columns:1fr}.section-title{font-size:2rem}.footer-content{flex-direction:row}}