.site-header{position:sticky;top:0;z-index:1000;background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:.75rem 1rem}.header-inner{display:flex;align-items:center;justify-content:space-between;margin:0 auto}.left{display:flex;align-items:center;gap:1.5em}.logo{font-size:1.5rem;display:flex;align-items:center;justify-content:center;height:40px;width:40px;border-radius:var(--border-radius);border:2px solid transparent;cursor:pointer}.logo:hover{border:2px solid var(--color-highlight-border)}.nav-links{display:flex;gap:1rem}.nav-links a{font-weight:600;padding:.25rem .75em;border-bottom:2px solid transparent;display:flex;align-items:center;justify-content:center;height:40px;border-radius:var(--border-radius);border:2px solid transparent;cursor:pointer}.nav-links a:hover{border:2px solid var(--color-highlight-text)}.right{display:flex;align-items:center;gap:.5rem}.theme-toggle,.menu-toggle{font-size:1.5rem;background:none;height:40px;width:40px;border-radius:var(--border-radius);border:2px solid transparent;cursor:pointer;color:var(--color-text-primary);display:flex;align-items:center;justify-content:center}.theme-toggle:hover,.menu-toggle:hover{border:2px solid var(--color-highlight-border)}@media (max-width: 768px){.nav-links{position:fixed;top:0;right:0;height:100vh;width:100%;flex-direction:column;align-items:center;justify-content:center;background:var(--color-surface);transform:translate(100%);transition:transform .3s ease-in-out;z-index:999;visibility:hidden;pointer-events:none}.nav-links.open{transform:translate(0);visibility:visible;pointer-events:all}.nav-links a{font-size:2rem;padding:1.5em 2em}.menu-toggle{display:flex}.drawer-close{position:absolute;top:1rem;right:1rem;font-size:1.25rem;background:none;height:40px;width:40px;border-radius:var(--border-radius);display:flex;align-items:center;justify-content:center;color:var(--color-text-primary);border:2px solid transparent;cursor:pointer;margin-top:-.25em}.drawer-close:hover{color:#f86363;border:2px solid var(--color-highlight-border)}}@media (min-width: 769px){.menu-toggle,.drawer-close{display:none}}:root{--color-background: #f5f5f5;--color-surface: #fafafa;--color-text-primary: #111111;--color-text-secondary: #555555;--color-border: #e9e9e9;--color-accent: #111111;--color-accent-contrast: #ffffff;--color-highlight-bg: #e0e7ff;--color-highlight-text: #1e3a8a;--color-highlight-border: #1e3a8a;--color-card-bg: rgba(255, 255, 255, .9);--color-card-border: var(--color-border);--gradient-overlay: linear-gradient( to bottom, transparent, rgba(35, 67, 155, .04) );--font-family-base: "Sora", system-ui, sans-serif;--font-size-h1: 2.5rem;--font-size-h2: 1.5rem;--font-size-h3: 1.25rem;--font-size-body: 1rem;--font-weight-normal: 400;--font-weight-bold: 700;--space-xs: .5rem;--space-sm: 1rem;--space-md: 2rem;--space-lg: 4rem;--border-radius: 8px;--border-width: 2px;--transition-fast: .3s ease}[data-theme=dark]{--color-background: #111111;--color-surface: #1a1a1a;--color-text-primary: #ffffff;--color-text-secondary: #bbbbbb;--color-border: #333333;--color-accent: #ffffff;--color-accent-contrast: #111111;--color-highlight-bg: #1e2a4f;--color-highlight-text: #a0c4ff;--color-highlight-border: #a0c4ff;--color-card-bg: rgba(255, 255, 255, .04);--color-card-border: var(--color-border);--gradient-overlay: linear-gradient( to top, transparent, rgba(160, 196, 255, .08) )}::selection{background-color:var(--color-highlight-text);color:var(--color-highlight-bg)}*{margin:0;padding:0;box-sizing:border-box}body.no-scroll{overflow:hidden;position:fixed;top:0;left:0;right:0;width:100%;height:100vh;padding-right:var(--scrollbar-width, 0px)}h1{line-height:1.4em}body{font-family:var(--font-family-base);background-color:var(--color-background);background-image:var(--gradient-overlay);background-repeat:no-repeat;background-attachment:fixed;background-size:cover;color:var(--color-text-primary);font-size:var(--font-size-body);line-height:1.6}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;pointer-events:none;background:linear-gradient(120deg,#e0e7ff,#f3f4f6,#e5e9ff,#e0e7ff);background-size:400% 400%;animation:gradientAnimation 25s ease infinite;filter:blur(60px);opacity:.3}[data-theme=dark] body:before{background:linear-gradient(120deg,#1e2a4f,#1f2937,#1e3a8a,#1e2a4f);opacity:.15}@keyframes gradientAnimation{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}a{text-decoration:none;color:inherit}.app{display:flex;flex-direction:column;min-height:100vh}main{flex:1;padding:var(--space-md)}footer{padding:var(--space-sm);background-color:var(--color-surface);border-top:1px solid var(--color-border);text-align:center;font-size:var(--font-size-h3)}.container{max-width:1440px;margin:0 auto;padding:0 var(--space-sm);display:flex;flex-direction:column;align-items:center}.home-section{display:flex;flex-direction:column;align-items:center;padding:var(--space-md) 0;text-align:center}.location{display:flex;align-items:center;gap:.5em;background-color:var(--color-highlight-bg);color:var(--color-highlight-text);padding:.25rem .75em;border-radius:var(--border-radius);margin-bottom:1.25em}.location p{margin-top:2px}.project-container{max-width:900px;margin:0 auto}.breadcrumb{text-align:left;width:100%;color:var(--color-text-secondary);margin-bottom:var(--space-md);font-size:1.1em}.breadcrumb a{color:var(--color-highlight-text)}.breadcrumb a:hover{text-decoration:underline}.project-container h1{font-size:var(--font-size-h1);font-weight:var(--font-weight-bold)}.project-container .subtitle{font-size:var(--font-size-h2);font-weight:var(--font-weight-normal);color:var(--color-text-secondary);margin-bottom:var(--space-sm)}.project-container .tags{margin-bottom:var(--space-md)}.project-container .tags .tag{font-size:.9em;background-color:var(--color-highlight-bg);color:var(--color-highlight-text);padding:.25rem .75em;border-radius:var(--border-radius)}.project-container #img{background-color:var(--color-card-bg);border:2px solid var(--color-card-border);padding:var(--space-xs);margin-bottom:var(--space-md)}#spotify{margin-bottom:var(--space-md)}.demo-button{color:var(--color-highlight-text);display:flex;align-items:center;gap:.75em;font-weight:600;font-size:1.1em}.featured-projects .breadcrumb{display:none}.demo-button:hover{text-decoration:underline}.project-container .home-cta-buttons,.project-container .home-button{margin-top:0}.project-container section{margin-bottom:var(--space-md)}.project-container #last-section{margin-bottom:0}.project-container section h2{margin-bottom:var(--space-xs)}.project-page p{color:var(--color-text-secondary);font-size:1.1em;line-height:1.7}.project-page ul{font-size:1.1em;padding-left:1.25rem;margin-top:.25rem}.project-page li{color:var(--color-text-secondary);margin-bottom:.25rem;list-style-type:disc}.home-section h1{font-size:var(--font-size-h1);font-weight:var(--font-weight-bold);margin-top:var(--space-xs);margin-bottom:var(--space-sm)}.home-section h2{width:70%;font-size:var(--font-size-h2);font-weight:var(--font-weight-normal);color:var(--color-text-secondary);margin-bottom:var(--space-lg);line-height:1.5}.home-section h2 a{font-weight:var(--font-weight-bold);color:var(--color-highlight-text)}.home-section h2 a:hover{text-decoration:underline}.home-points{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-md);padding:0 var(--space-sm);margin-bottom:var(--space-md)}.home-points-mobile{display:none}.home-point{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 var(--space-sm);opacity:0;transform:translateY(20px);animation:fadeUp .8s var(--transition-fast) forwards}.icon{font-size:2rem;color:var(--color-highlight-text);margin-bottom:var(--space-sm)}.home-point h3{font-size:var(--font-size-h3);font-weight:var(--font-weight-bold);color:var(--color-text-primary);margin-bottom:.25em}.home-point p{font-size:.95rem;color:var(--color-text-secondary)}.home-button{margin-top:var(--space-sm);font-size:1.25em;padding:var(--space-xs) var(--space-sm);border:2px solid var(--color-accent);border-radius:var(--border-radius);font-weight:var(--font-weight-bold);background-color:var(--color-accent);color:var(--color-accent-contrast);display:flex;align-items:center;gap:1rem}.home-button svg{font-size:1.25em}.home-button:hover{background-color:var(--color-accent-contrast);color:var(--color-accent);cursor:pointer}.highlight{background-color:var(--color-highlight-bg);padding:.15rem .4rem;border-radius:var(--border-radius);font-weight:var(--font-weight-bold);color:var(--color-text-primary)}.featured-projects{text-align:center}.featured-projects h2{font-size:var(--font-size-h1);margin-bottom:var(--space-sm)}.project-cards{display:grid;grid-template-columns:repeat(3,1fr);margin-top:var(--space-xs);gap:var(--space-md)}.project-card{display:flex;flex-direction:column;background:var(--color-card-bg);border:2px solid var(--color-card-border);border-radius:16px;padding:var(--space-md);text-align:left;text-decoration:none;color:inherit;overflow:hidden;opacity:0;transform:translateY(20px);animation:fadeInUp .8s var(--transition-fast) forwards;transition:transform .3s ease,box-shadow 0s ease,border-color 0s ease}.project-card:hover{border-color:var(--color-highlight-border)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.project-card img{transition:filter .3s ease}.project-image{width:100%;object-fit:cover;border-radius:var(--border-radius)}.project-card h3{font-size:var(--font-size-h3);margin-top:var(--space-xs);margin-bottom:var(--space-sm);font-weight:var(--font-weight-bold)}.tags{margin-top:var(--space-sm);display:flex;flex-wrap:wrap;gap:.5rem;align-items:flex-start}.tag{font-size:.9em;background-color:var(--color-highlight-bg);color:var(--color-highlight-text);padding:.25rem .75em;border-radius:var(--border-radius)}.view-project-link{font-size:1rem;color:var(--color-highlight-text);font-weight:var(--font-weight-bold);margin-bottom:var(--space-sm)}@media (max-width: 900px){.project-cards{grid-template-columns:repeat(2,1fr)}}@media (max-width: 600px){.project-cards{grid-template-columns:1fr}}.home-cta-buttons{margin-top:var(--space-md);margin-bottom:var(--space-md);display:flex;flex-wrap:wrap;gap:var(--space-sm);justify-content:center;opacity:0;transform:translateY(20px);animation:fadeUp .8s var(--transition-fast) forwards}.home-button.secondary{background:none;color:var(--color-accent);border-color:var(--color-accent)}.home-button.secondary:hover{background-color:var(--color-accent);color:var(--color-accent-contrast)}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.app main{padding:var(--space-md)!important;margin-bottom:var(--space-sm)}#desktop-work-label{display:none}.featured-projects .breadcrumb{display:block;margin-bottom:.75em}.location{margin-top:var(--space-xs)}.home-points{display:none;grid-template-columns:1fr;padding:0;margin-top:var(--space-sm);margin-bottom:var(--space-lg);row-gap:var(--space-md);justify-items:start}.container,.home-section,.home-point{align-items:flex-start;text-align:left;padding:0}.home-section h2{width:100%;margin-bottom:0;font-size:1.15em}#about-heading{margin-bottom:var(--space-md)}.featured-projects h2{margin-bottom:0}.home-button{margin-top:0;width:100%;display:flex;justify-content:center}.home-cta-buttons{width:100%;margin-top:0;margin-bottom:0}#last-section{margin-bottom:0}#project-button{margin-top:var(--space-md)}.project-cards{margin-top:var(--space-sm)}.project-card{padding:1.5em;margin:0}.project-cards a{margin:0}.tags{margin-top:var(--space-xs)}}
