:root{--color-bg-base: #000000;--color-bg-primary: #1a1a1a;--color-bg-secondary: #242424;--color-bg-tertiary: #2e2e2e;--color-bg-accent: #383838;--color-text-primary: #ffffff;--color-text-secondary: #b8b8b8;--color-text-muted: #808080;--color-border: rgba(255, 255, 255, .08);--color-border-hover: rgba(255, 255, 255, .15);--color-accent: #4a9eff;--color-accent-hover: #6bb0ff;--spacing-xs: .5rem;--spacing-sm: .75rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--spacing-3xl: 4rem;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.5rem;--font-size-2xl: 2rem;--font-size-3xl: 2.5rem;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--line-height-tight: 1.2;--line-height-normal: 1.5;--line-height-relaxed: 1.7;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .4), 0 2px 4px -1px rgba(0, 0, 0, .3);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .5), 0 4px 6px -2px rgba(0, 0, 0, .4);--shadow-glow: 0 0 20px rgba(74, 158, 255, .15);--transition-fast: .15s ease-in-out;--transition-base: .2s ease-in-out;--transition-slow: .3s ease-in-out;--max-width: 1280px;--header-height: 70px}@media (max-width: 768px){:root{--font-size-2xl: 1.75rem;--font-size-3xl: 2rem;--header-height: 60px}}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-family);font-size:var(--font-size-base);font-weight:var(--font-weight-normal);line-height:var(--line-height-normal);color:var(--color-text-primary);background-color:var(--color-bg-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}#root,.app{min-height:100vh}.container{max-width:var(--max-width);margin:0 auto;padding:0 var(--spacing-lg)}@media (min-width: 768px){.container{padding:0 var(--spacing-2xl)}}.header{position:sticky;top:0;z-index:100;background-color:#000c;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);height:var(--header-height)}.header__content{display:flex;align-items:center;justify-content:space-between;height:var(--header-height)}.header__logo{display:flex;align-items:center;gap:.25rem;font-size:var(--font-size-lg);font-weight:var(--font-weight-bold);cursor:pointer;transition:opacity var(--transition-base)}.header__logo:hover{opacity:.8}.logo__bracket{color:var(--color-accent);font-weight:var(--font-weight-bold)}.logo__text{color:var(--color-text-primary)}.header__nav{position:relative}.nav__toggle{display:none;flex-direction:column;gap:.35rem;background:none;border:none;cursor:pointer;padding:.5rem;z-index:110}.nav__toggle span{width:1.5rem;height:2px;background-color:var(--color-text-primary);transition:all var(--transition-base)}.nav__list{display:flex;align-items:center;gap:var(--spacing-xl);list-style:none}.nav__link{display:inline-block;color:var(--color-text-secondary);text-decoration:none;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);transition:all var(--transition-base)}.nav__link:hover,.nav__link:focus{color:var(--color-text-primary);background-color:var(--color-bg-primary)}.nav__link--cta{color:var(--color-text-primary);background-color:var(--color-bg-secondary);border:1px solid var(--color-border)}.nav__link--cta:hover,.nav__link--cta:focus{background-color:var(--color-bg-tertiary);border-color:var(--color-border-hover);box-shadow:var(--shadow-glow)}.hero{padding:var(--spacing-3xl) 0 var(--spacing-2xl)}.hero__content{max-width:800px;text-align:center;margin:0 auto}.hero__title{font-size:var(--font-size-3xl);font-weight:var(--font-weight-bold);line-height:var(--line-height-tight);margin-bottom:var(--spacing-md);color:var(--color-text-primary)}.hero__subtitle{font-size:var(--font-size-lg);font-weight:var(--font-weight-normal);line-height:var(--line-height-relaxed);color:var(--color-text-secondary);max-width:600px;margin:0 auto}@media (max-width: 768px){.hero{padding:var(--spacing-2xl) 0 var(--spacing-xl)}.hero__title{font-size:var(--font-size-2xl)}.hero__subtitle{font-size:var(--font-size-base)}}.projects{padding:var(--spacing-2xl) 0 var(--spacing-3xl)}.projects__grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-xl)}@media (min-width: 640px){.projects__grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 1024px){.projects__grid{grid-template-columns:repeat(3,1fr)}}@media (min-width: 1280px){.projects__grid{grid-template-columns:repeat(3,1fr);gap:var(--spacing-2xl)}}.project-card{display:flex;flex-direction:column;background-color:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden;transition:all var(--transition-base);cursor:pointer;outline:none;text-decoration:none;color:inherit}.project-card--linked{display:flex}.project-card:hover,.project-card--hovered{transform:translateY(-4px);border-color:var(--color-border-hover);box-shadow:var(--shadow-lg),var(--shadow-glow)}.project-card__image{width:100%;height:200px;overflow:hidden;background-color:var(--color-bg-secondary);position:relative}.project-card__image:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.3) 100%);pointer-events:none}.project-card__image img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-slow)}.project-card:hover .project-card__image img,.project-card--hovered .project-card__image img{transform:scale(1.05)}.project-card__status{display:inline-block;width:fit-content;padding:2px var(--spacing-sm);font-size:10px;font-weight:var(--font-weight-semibold);border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.05em;margin-bottom:0}.project-card__status--production{background-color:#10b98126;color:#10b981;border:1px solid rgba(16,185,129,.3)}.project-card__status--in-progress{background-color:#3b82f626;color:#3b82f6;border:1px solid rgba(59,130,246,.3)}.project-card__content{padding:var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-md);flex:1}.project-card__title{font-size:var(--font-size-xl);font-weight:var(--font-weight-semibold);line-height:var(--line-height-tight);color:var(--color-text-primary);margin-top:0}.project-card__description{font-size:var(--font-size-sm);line-height:var(--line-height-relaxed);color:var(--color-text-secondary);flex:1}.project-card__tags{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);margin-top:auto}.project-card__tag{display:inline-block;padding:var(--spacing-xs) var(--spacing-sm);background-color:var(--color-bg-tertiary);color:var(--color-text-secondary);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);border-radius:var(--radius-sm);border:1px solid var(--color-border);transition:all var(--transition-fast)}.project-card:hover .project-card__tag,.project-card--hovered .project-card__tag{background-color:var(--color-bg-accent);border-color:var(--color-border-hover)}.project-card__link-indicator{margin-top:var(--spacing-sm);padding-top:var(--spacing-md);border-top:1px solid var(--color-border)}.project-card__link-indicator span{display:inline-flex;align-items:center;gap:var(--spacing-xs);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-accent);transition:all var(--transition-fast)}.project-card:hover .project-card__link-indicator span,.project-card--hovered .project-card__link-indicator span{gap:var(--spacing-sm)}.project-card:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}a:focus-visible,button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.project-card__image img[src=""],.project-card__image img:not([src]){background:linear-gradient(135deg,var(--color-bg-secondary) 0%,var(--color-bg-tertiary) 100%)}@media (max-width: 640px){.project-card__image{height:180px}.project-card__title{font-size:var(--font-size-lg)}}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#000000bf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--spacing-lg);animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background-color:var(--color-bg-primary);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:100%;max-width:500px;box-shadow:var(--shadow-lg),var(--shadow-glow);animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-md);border-bottom:1px solid var(--color-border)}.modal-title{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-primary);margin:0}.modal-close{background:none;border:none;color:var(--color-text-secondary);font-size:2rem;line-height:1;cursor:pointer;padding:0;width:2rem;height:2rem;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);transition:all var(--transition-fast)}.modal-close:hover{background-color:var(--color-bg-secondary);color:var(--color-text-primary)}.modal-body{padding:var(--spacing-xl);display:flex;flex-direction:column;gap:var(--spacing-xl)}.contact-field{display:flex;flex-direction:column;gap:var(--spacing-sm)}.contact-label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-secondary)}.contact-input-wrapper{position:relative;display:flex;align-items:stretch;border:1px solid var(--color-border);border-radius:var(--radius-md);background-color:var(--color-bg-secondary);overflow:hidden;transition:all var(--transition-fast)}.contact-input-wrapper:focus-within{border-color:var(--color-border-hover);box-shadow:0 0 0 3px #6366f11a}.contact-copy-btn{background-color:transparent;border:none;border-right:1px solid var(--color-border);color:var(--color-text-secondary);cursor:pointer;padding:var(--spacing-md);min-width:44px;transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center}.contact-copy-btn:hover{background-color:var(--color-bg-tertiary);color:var(--color-text-primary)}.contact-copy-btn:active{transform:scale(.95)}.contact-input{flex:1;background-color:transparent;border:none;padding:var(--spacing-md);color:var(--color-text-primary);font-size:var(--font-size-sm);font-family:var(--font-family);outline:none;transition:all var(--transition-fast)}.contact-action-btn{background-color:transparent;color:var(--color-text-primary);text-decoration:none;border:none;border-left:1px solid var(--color-border);padding:var(--spacing-md) var(--spacing-lg);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);cursor:pointer;transition:all var(--transition-fast);display:flex;align-items:center;justify-content:center;white-space:nowrap}.contact-action-btn:hover{background-color:var(--color-bg-tertiary)}@media (max-width: 640px){.modal-backdrop{padding:var(--spacing-md)}.modal-header,.modal-body{padding:var(--spacing-lg)}.contact-input{font-size:var(--font-size-xs)}.contact-copy-btn{min-width:40px;padding:var(--spacing-sm)}.contact-action-btn{padding:var(--spacing-sm) var(--spacing-md);font-size:var(--font-size-xs)}}