:root{--color-bg: #ffffff;--color-bg-secondary: #f8f8f8;--color-text: #1a1a1a;--color-text-muted: #666666;--color-accent: #1a1a1a;--color-border: #e5e5e5;--font-primary: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--font-size-base: 16px;--line-height-base: 1.6;--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 2rem;--spacing-lg: 4rem;--spacing-xl: 6rem;--transition-fast: .2s ease;--transition-medium: .4s ease;--transition-slow: .6s ease;--header-height: 80px;--container-max: 1400px;--container-padding: 4vw}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{font-size:var(--font-size-base);scroll-behavior:smooth}body{font-family:var(--font-primary);background-color:var(--color-bg);color:var(--color-text);line-height:var(--line-height-base);overflow-x:hidden}a{color:inherit;text-decoration:none;cursor:pointer}img,video{max-width:100%;height:auto;display:block}.cursor,.cursor-follower,.page-transition{display:none}.header{position:fixed;top:0;left:0;width:100%;height:var(--header-height);display:flex;justify-content:space-between;align-items:center;padding:0 var(--container-padding);z-index:1000;background:#ffffffe6;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:transform var(--transition-medium),box-shadow var(--transition-medium)}.header.hidden{transform:translateY(-100%)}.header.scrolled{box-shadow:0 1px 0 var(--color-border)}.logo{font-size:1rem;font-weight:500;letter-spacing:.15em;text-transform:uppercase;transition:opacity var(--transition-fast)}.logo:hover{opacity:.6}.nav{display:flex;gap:var(--spacing-md)}.nav-link{font-size:.875rem;font-weight:400;letter-spacing:.05em;position:relative;padding:.5rem 0;transition:opacity var(--transition-fast)}.nav-link:after{content:"";position:absolute;bottom:0;left:0;width:0;height:1px;background:var(--color-text);transition:width var(--transition-medium)}.nav-link:hover{opacity:.6}.nav-link.active:after{width:100%}.hero{min-height:60vh;display:flex;align-items:center;justify-content:center;padding:calc(var(--header-height) + var(--spacing-xl)) var(--container-padding) var(--spacing-lg)}.hero-content{text-align:center;max-width:800px}.hero-title{font-size:clamp(2.5rem,8vw,5rem);font-weight:300;line-height:1.1;letter-spacing:-.02em;margin-bottom:var(--spacing-sm)}.hero-title .line{display:block;opacity:0;transform:translateY(30px);animation:fadeInUp .8s ease forwards}.hero-title .line:nth-child(1){animation-delay:.1s}.hero-title .line:nth-child(2){animation-delay:.2s}.hero-subtitle{font-size:1.125rem;font-weight:300;color:var(--color-text-muted);opacity:0;animation:fadeIn .8s .4s forwards}@keyframes fadeInUp{to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{to{opacity:1}}.section-title{font-size:clamp(1.5rem,4vw,2rem);font-weight:400;letter-spacing:.05em;margin-bottom:var(--spacing-lg);text-transform:uppercase}.work-section{padding:var(--spacing-lg) var(--container-padding) var(--spacing-xl);max-width:var(--container-max);margin:0 auto}.portfolio-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-md)}@media (max-width: 768px){.portfolio-grid{grid-template-columns:1fr}}.project-card{position:relative;overflow:hidden;cursor:pointer;transition:transform var(--transition-medium)}.project-card:hover{transform:translateY(-4px)}.project-media{position:relative;aspect-ratio:16 / 9;overflow:hidden;background:var(--color-bg-secondary)}.project-media video{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-slow),opacity var(--transition-medium)}.project-card:hover .project-media video,.project-card.previewing .project-media video{transform:scale(1.02)}.project-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#0000004d;display:flex;align-items:center;justify-content:center;opacity:1;transition:opacity var(--transition-medium),background var(--transition-medium);cursor:pointer;z-index:10}.project-card:hover .project-overlay{background:#00000026}.project-card.playing .project-overlay{opacity:0;pointer-events:none}.project-card.previewing .project-overlay{background:#0000001a}.play-indicator{width:70px;height:70px;background:#fffffff2;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:transform var(--transition-medium),background var(--transition-fast);box-shadow:0 4px 20px #00000026}.play-indicator svg{width:24px;height:24px;margin-left:3px;color:var(--color-text);transition:transform var(--transition-fast)}.project-card:hover .play-indicator{transform:scale(1.1)}.project-card:active .play-indicator{transform:scale(.95)}.fullscreen-btn{position:absolute;bottom:16px;right:16px;width:40px;height:40px;background:#ffffffe6;border:none;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;opacity:0;transition:opacity var(--transition-fast),background var(--transition-fast);z-index:20}.fullscreen-btn svg{width:20px;height:20px;color:var(--color-text)}.project-card.playing .fullscreen-btn,.project-card.playing:hover .fullscreen-btn{opacity:1}.fullscreen-btn:hover{background:#fff}.project-media:fullscreen{background:#000}.project-media:fullscreen video{width:100%;height:100%;object-fit:contain}.project-media:fullscreen .project-overlay{display:none}.project-media:fullscreen .fullscreen-btn{position:fixed;bottom:20px;right:20px;opacity:0;transition:opacity .3s}.project-media:fullscreen:hover .fullscreen-btn{opacity:1}.project-info{padding:var(--spacing-sm) 0;display:flex;justify-content:space-between;align-items:baseline}.project-title{font-size:1rem;font-weight:500;letter-spacing:.02em}.project-category{font-size:.75rem;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.1em}.contact-section{min-height:80vh;display:flex;align-items:center;justify-content:center;padding:var(--spacing-xl) var(--container-padding);background:var(--color-bg-secondary)}.contact-content{text-align:center;max-width:500px}.contact-intro{font-size:1.125rem;color:var(--color-text-muted);margin-bottom:var(--spacing-lg)}.contact-details{display:flex;flex-direction:column;gap:var(--spacing-sm);margin-bottom:var(--spacing-lg)}.contact-link{display:flex;flex-direction:column;gap:.25rem;padding:var(--spacing-md);border:1px solid var(--color-border);transition:all var(--transition-fast)}.contact-link:hover{border-color:var(--color-text);background:var(--color-bg)}.contact-label{font-size:.75rem;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.1em}.contact-value{font-size:1.25rem;font-weight:400}.social-links{display:flex;justify-content:center;gap:var(--spacing-sm)}.social-link{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:1px solid var(--color-border);border-radius:50%;transition:all var(--transition-fast)}.social-link svg{width:18px;height:18px}.social-link:hover{border-color:var(--color-text);background:var(--color-text);color:var(--color-bg)}.footer{padding:var(--spacing-md) var(--container-padding);text-align:center;border-top:1px solid var(--color-border)}.footer p{font-size:.75rem;color:var(--color-text-muted);letter-spacing:.05em}.reveal{opacity:0;transform:translateY(20px);transition:all .6s ease}.reveal.visible{opacity:1;transform:translateY(0)}@media (max-width: 768px){:root{--container-padding: 1.5rem;--header-height: 60px}.nav{gap:var(--spacing-sm)}.project-info{flex-direction:column;align-items:flex-start;gap:.25rem}}@media (max-width: 480px){.hero-title{font-size:2.5rem}.play-indicator{width:56px;height:56px}.play-indicator svg{width:20px;height:20px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}html{scroll-behavior:auto}}