*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--color-bg: #0a0a0a;--color-bg-elevated: #111111;--color-text: #ffffff;--color-text-dim: #888888;--color-text-muted: #555555;--color-border: #2a2a2a;--color-border-hover: #444444;--color-accent: #ffffff;--font-display: "Archivo Black", sans-serif;--font-mono: "Space Mono", monospace;--space-xs: .5rem;--space-sm: 1rem;--space-md: 2rem;--space-lg: 4rem;--space-xl: 8rem;--space-2xl: 12rem;--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-medium: .3s cubic-bezier(.4, 0, .2, 1);--transition-slow: .6s cubic-bezier(.4, 0, .2, 1);--transition-bounce: .5s cubic-bezier(.34, 1.56, .64, 1)}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-mono);background-color:var(--color-bg);color:var(--color-text);line-height:1.6;overflow-x:hidden;cursor:default}.grain-overlay{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:9999;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E")}.cursor-glow{position:fixed;width:400px;height:400px;border-radius:50%;pointer-events:none;z-index:1;background:radial-gradient(circle,rgba(255,255,255,.03) 0%,transparent 70%);transform:translate(-50%,-50%);transition:opacity .3s ease;opacity:0}body:hover .cursor-glow{opacity:1}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--color-bg)}::-webkit-scrollbar-thumb{background:var(--color-border);border-radius:0}::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}::selection{background:var(--color-text);color:var(--color-bg)}.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:var(--space-lg);padding-left:clamp(2rem,10vw,12rem);position:relative;opacity:0;transform:translateY(20px);transition:opacity var(--transition-slow),transform var(--transition-slow)}.hero.revealed{opacity:1;transform:translateY(0)}.hero-content{position:relative;z-index:2}.hero-label{font-family:var(--font-mono);font-size:.75rem;letter-spacing:.3em;text-transform:uppercase;color:var(--color-text-muted);margin-bottom:var(--space-md);opacity:0;animation:fadeSlideIn .8s ease .2s forwards}.hero-name{display:flex;flex-direction:column;gap:0}.name-line{font-family:var(--font-display);font-size:clamp(4rem,15vw,12rem);line-height:.85;letter-spacing:-.03em;text-transform:uppercase;display:block;opacity:0;transform:translateY(100%);animation:revealUp 1s cubic-bezier(.16,1,.3,1) forwards}.name-line[data-delay="0"]{animation-delay:.4s}.name-line[data-delay="1"]{animation-delay:.55s;color:var(--color-text-dim)}.hero-title-wrap{display:flex;align-items:center;gap:var(--space-sm);margin-top:var(--space-md);opacity:0;animation:fadeSlideIn .8s ease .9s forwards}.hero-dash{width:60px;height:2px;background:var(--color-text-muted)}.hero-title{font-family:var(--font-mono);font-size:clamp(.875rem,2vw,1.125rem);letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-dim)}.scroll-indicator{position:absolute;bottom:var(--space-lg);right:var(--space-lg);display:flex;flex-direction:column;align-items:center;gap:var(--space-sm);opacity:0;animation:fadeIn 1s ease 1.5s forwards}.scroll-text{font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted);writing-mode:vertical-rl}.scroll-line{width:1px;height:60px;background:linear-gradient(to bottom,var(--color-text-muted),transparent);animation:scrollPulse 2s ease-in-out infinite}@keyframes scrollPulse{0%,to{transform:scaleY(1);opacity:1}50%{transform:scaleY(.6);opacity:.5}}.section{padding:var(--space-xl) var(--space-lg);padding-left:clamp(2rem,10vw,12rem);opacity:0;transform:translateY(60px);transition:opacity var(--transition-slow),transform var(--transition-slow)}.section.revealed{opacity:1;transform:translateY(0)}.section-header{display:flex;align-items:baseline;gap:var(--space-md);margin-bottom:var(--space-lg)}.section-number{font-family:var(--font-display);font-size:clamp(3rem,8vw,6rem);color:var(--color-border);line-height:1;transition:color var(--transition-medium)}.section:hover .section-number{color:var(--color-border-hover)}.section-title{font-family:var(--font-display);font-size:clamp(2rem,5vw,3.5rem);text-transform:uppercase;letter-spacing:-.02em}.services-container{display:flex;flex-direction:column;gap:1px;background:var(--color-border);max-width:900px;margin-bottom:var(--space-lg)}.service-item{display:grid;grid-template-columns:auto 1fr auto;gap:var(--space-md);align-items:center;padding:var(--space-md) var(--space-lg);background:var(--color-bg);transition:all var(--transition-medium);cursor:default;opacity:0;transform:translate(-20px)}.service-item.revealed{opacity:1;transform:translate(0)}.service-item:hover{background:var(--color-bg-elevated);padding-left:calc(var(--space-lg) + 1rem)}.service-index{font-family:var(--font-mono);font-size:.75rem;color:var(--color-text-muted);min-width:2rem}.service-content h3{font-family:var(--font-display);font-size:clamp(1rem,2.5vw,1.5rem);margin-bottom:var(--space-xs);text-transform:uppercase;letter-spacing:-.01em}.service-content p{font-size:.875rem;color:var(--color-text-dim)}.service-arrow{font-size:1.5rem;color:var(--color-text-muted);opacity:0;transform:translate(-10px);transition:all var(--transition-medium)}.service-item:hover .service-arrow{opacity:1;transform:translate(0)}.services-contact{display:flex;align-items:center;gap:var(--space-md);font-size:1.125rem}.contact-prompt{color:var(--color-text-dim)}.contact-link{color:var(--color-text);text-decoration:none;display:inline-flex;align-items:center;gap:var(--space-xs);padding-bottom:2px;border-bottom:1px solid var(--color-text);transition:all var(--transition-fast)}.contact-link:hover{gap:var(--space-sm)}.link-arrow{transition:transform var(--transition-fast)}.contact-link:hover .link-arrow{transform:translate(2px,-2px)}.diagonal-divider{height:150px;background:linear-gradient(to bottom right,var(--color-bg) 49.5%,var(--color-bg-elevated) 50%);margin:var(--space-lg) 0}.projects{background:var(--color-bg-elevated);padding-right:var(--space-lg)}.projects-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:var(--space-md);max-width:1400px}.project-item{position:relative;display:flex;flex-direction:column;min-height:320px;overflow:hidden;background:var(--color-bg);border:1px solid var(--color-border);transition:all var(--transition-medium);opacity:0;transform:translateY(30px)}.project-item.revealed{opacity:1;transform:translateY(0)}.project-item.revealed:hover{border-color:var(--color-text-muted);transform:translateY(-4px)}.project-pattern{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.08;transition:opacity var(--transition-medium)}.project-item:hover .project-pattern{opacity:.15}[data-pattern=stripes] .project-pattern{background:repeating-linear-gradient(45deg,transparent,transparent 10px,var(--color-text) 10px,var(--color-text) 12px)}[data-pattern=dots] .project-pattern{background-image:radial-gradient(circle,var(--color-text) 1.5px,transparent 1.5px);background-size:20px 20px}[data-pattern=lines] .project-pattern{background:repeating-linear-gradient(0deg,transparent,transparent 8px,var(--color-text) 8px,var(--color-text) 9px)}[data-pattern=circles] .project-pattern{background:radial-gradient(circle at center,transparent 20%,var(--color-text) 20.5%,var(--color-text) 21%,transparent 21.5%),radial-gradient(circle at center,transparent 40%,var(--color-text) 40.5%,var(--color-text) 41%,transparent 41.5%),radial-gradient(circle at center,transparent 60%,var(--color-text) 60.5%,var(--color-text) 61%,transparent 61.5%),radial-gradient(circle at center,transparent 80%,var(--color-text) 80.5%,var(--color-text) 81%,transparent 81.5%)}[data-pattern=mesh] .project-pattern{background:linear-gradient(45deg,var(--color-text) 1px,transparent 1px),linear-gradient(-45deg,var(--color-text) 1px,transparent 1px);background-size:30px 30px}.project-info{position:relative;z-index:2;padding:var(--space-lg);display:flex;flex-direction:column;height:100%}.project-category{font-family:var(--font-mono);font-size:.7rem;color:var(--color-text-muted);letter-spacing:.15em;text-transform:uppercase;margin-bottom:var(--space-sm)}.project-title{font-family:var(--font-display);font-size:clamp(1.1rem,2vw,1.4rem);text-transform:uppercase;letter-spacing:-.01em;margin-bottom:var(--space-sm);color:var(--color-text);line-height:1.2}.project-description{font-size:.9rem;color:var(--color-text-dim);line-height:1.5;margin-bottom:auto;padding-bottom:var(--space-md)}.project-tech-stack{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:auto}.tech-badge{font-family:var(--font-mono);font-size:.7rem;color:var(--color-text);background:var(--color-border);padding:.35rem .75rem;letter-spacing:.05em;transition:all var(--transition-fast)}.project-item:hover .tech-badge{background:var(--color-text-muted)}.contact{background:var(--color-bg);min-height:80vh;display:flex;flex-direction:column;padding-right:var(--space-lg)}.contact-container{max-width:800px;flex:1}.contact-intro{margin-bottom:var(--space-lg)}.contact-intro p{font-family:var(--font-display);font-size:clamp(1.5rem,4vw,2.5rem);text-transform:uppercase;line-height:1.2}.contact-links{display:flex;flex-direction:column;gap:1px;background:var(--color-border)}.contact-item{display:grid;grid-template-columns:120px 1fr auto;gap:var(--space-md);align-items:center;padding:var(--space-md) var(--space-lg);background:var(--color-bg);text-decoration:none;color:var(--color-text);transition:all var(--transition-medium)}.contact-item:hover{background:var(--color-text);color:var(--color-bg)}.contact-label{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--color-text-muted);transition:color var(--transition-medium)}.contact-item:hover .contact-label{color:var(--color-text-muted)}.contact-value{font-family:var(--font-mono);font-size:clamp(.875rem,2vw,1.125rem)}.contact-arrow{font-size:1.25rem;opacity:0;transform:translate(-10px);transition:all var(--transition-medium)}.contact-item:hover .contact-arrow{opacity:1;transform:translate(0)}.footer{margin-top:auto;padding-top:var(--space-xl);padding-bottom:var(--space-md);display:flex;align-items:center;gap:var(--space-sm);font-size:.75rem;color:var(--color-text-muted);letter-spacing:.1em}.footer-divider{color:var(--color-border)}@keyframes fadeSlideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes revealUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media screen and (max-width: 1024px){.hero,.section{padding-left:var(--space-md)}}@media screen and (max-width: 768px){:root{--space-lg: 3rem;--space-xl: 5rem}.hero{padding:var(--space-md);justify-content:flex-end;padding-bottom:var(--space-xl)}.name-line{font-size:clamp(2.5rem,12vw,4rem)}.hero-title-wrap{flex-wrap:wrap}.hero-dash{width:40px}.hero-title{font-size:.75rem}.scroll-indicator{position:absolute;bottom:var(--space-md);right:var(--space-sm)}.scroll-text{font-size:.6rem}.scroll-line{height:40px}.section{padding:var(--space-lg) var(--space-md)}.section-header{flex-direction:column;gap:var(--space-xs)}.section-number{font-size:2.5rem}.service-item{grid-template-columns:1fr;gap:var(--space-sm);padding:var(--space-md)}.service-index{font-size:.65rem}.service-arrow{display:none}.projects-container{grid-template-columns:1fr}.project-item{min-height:280px}.project-info{padding:var(--space-md)}.contact-item{grid-template-columns:1fr;gap:var(--space-xs)}.contact-label{font-size:.65rem}.contact-arrow{display:none}.diagonal-divider{height:80px}.cursor-glow{display:none}}@media (hover: none){.service-item:hover{padding-left:var(--space-lg);background:var(--color-bg)}.service-item,.project-item{opacity:1;transform:none}.project-pattern{opacity:.12}.cursor-glow{display:none}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}html{scroll-behavior:auto}.hero,.section{opacity:1;transform:none}.name-line,.hero-label,.hero-title-wrap,.scroll-indicator{opacity:1;transform:none;animation:none}.service-item,.project-item{opacity:1;transform:none}}
