html{scroll-behavior:smooth}:root{--bg: #0a0a0a;--text: #e8e8e8;--text-dim: #999;--accent: #02c4da;--accent-glow: rgba(2, 196, 218, .3);--surface: #161616;--border: #2a2a2a;--font-headline: "Figtree", sans-serif}[data-theme=light]{--bg: #ffffff;--text: #1a1a1a;--text-dim: #555;--accent: #02a8bc;--accent-glow: rgba(2, 168, 188, .2);--surface: #f5f5f5;--border: #e0e0e0}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Familjen Grotesk,sans-serif;font-family:Figtree;background:var(--bg);color:var(--text);line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smooth:always}a{color:var(--accent)}.img-full{max-width:100%}.img-wide{max-width:80%}.centered{display:block;margin:0 auto}.padded{padding:5rem}.roundbox{padding:3rem;border-radius:4rem}@media(max-width:600px){.roundbox{padding:1.5rem;border-radius:2rem}.img-wide{max-width:100%}.hero-description br,.hero-meta br{display:none}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.wave{animation:wave-animation 2.5s infinite;transform-origin:70% 70%;display:inline-block}@keyframes wave-animation{0%{transform:rotate(0)}10%{transform:rotate(14deg)}20%{transform:rotate(-8deg)}30%{transform:rotate(14deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(10deg)}60%{transform:rotate(0)}to{transform:rotate(0)}}nav{position:fixed;top:0;left:0;right:0;padding:2rem;transition:transform .35s cubic-bezier(.4,0,.2,1);display:flex;justify-content:space-between;align-items:center;z-index:1000;background:linear-gradient(180deg,#0a0a0af2,#0a0a0a00);backdrop-filter:blur(10px)}[data-theme=light]{nav{background:linear-gradient(180deg,#fffffff2,#0a0a0a00)}}nav.nav--hidden{transform:translateY(-100%)}.back-link{color:var(--text);text-decoration:none;display:flex;align-items:center;gap:.5rem;font-weight:500;transition:color .3s ease}.back-link:hover{color:var(--accent)}.back-link:before{content:"←";font-size:1.25rem}.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;padding:2rem}.hero-content{text-align:center;max-width:900px;animation:fadeInUp 1s ease-out}.hero-label{font-size:.875rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:1.5rem;font-weight:500;animation:fadeInUp 1s ease-out .2s both}h1{font-family:var(--font-headline);font-size:clamp(3rem,8vw,6.5rem);font-weight:600;line-height:1;margin-bottom:1.5rem;background:linear-gradient(135deg,#fff 0%,var(--text-dim) 100%);background-clip:text;animation:fadeInUp 1s ease-out .4s both}.hero-description{font-size:clamp(1.125rem,2vw,1.5rem);color:var(--text-dim);max-width:600px;margin:0 auto 1.5rem;animation:fadeInUp 1s ease-out .6s both}.hero-meta{font-size:clamp(.875rem,1.25vw,1rem);color:var(--text-dim);max-width:600px;margin:0 auto 1.5rem;opacity:.7;line-height:1.6;animation:fadeInUp 1s ease-out .75s both}.hero-meta a{color:inherit;text-decoration:underline;text-underline-offset:3px}.hero-meta a:hover{color:var(--accent)}.cta-group{display:flex;gap:1rem;align-items:center;justify-content:center;animation:fadeInUp 1s ease-out .8s both}.cta-button{display:inline-block;padding:1rem 2.5rem;background:var(--accent);color:var(--bg);text-decoration:none;font-weight:600;border-radius:0;border:none;-webkit-appearance:none;appearance:none;font-family:inherit;cursor:pointer;position:relative;overflow:hidden;transition:all .3s ease}.cta-button:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#ffffff4d;transform:translate(-50%,-50%);transition:width .6s,height .6s}.cta-button:hover:before{width:300px;height:300px}.cta-button:hover{transform:translateY(-2px);box-shadow:0 10px 40px var(--accent-glow)}.cta-button-secondary{background:transparent;color:var(--text);border:1px solid var(--border)}.cta-button-secondary:before{background:#02c4da1a}.cta-button-secondary:hover{border-color:var(--accent);color:var(--accent);box-shadow:0 10px 40px #02c4da26}p.hireme{animation:fadeInUp 1s ease-out 1s both}.project-hero{padding:8rem 2rem 4rem;max-width:1400px;margin:0 auto;animation:fadeInUp .8s ease-out}.project-meta{display:flex;gap:3rem;margin-bottom:2rem;flex-wrap:wrap;animation:fadeInUp .8s ease-out .1s both}.meta-item{display:flex;flex-direction:column;gap:.25rem}.meta-label{font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text-dim);font-weight:500}.meta-value{font-size:1rem;color:var(--text);font-weight:500}.project-intro{font-size:clamp(1.125rem,2vw,1.5rem);color:var(--text-dim);max-width:800px;line-height:1.7;animation:fadeInUp .8s ease-out .5s both}.image-stack{animation:fadeInUp .8s ease-out .8s both}.projects{max-width:1400px;margin:0 auto;padding:8rem 2rem}.section-header{margin-bottom:5rem;text-align:center}.section-title{font-family:var(--font-headline);font-size:clamp(2.5rem,5vw,4rem);font-weight:600;margin-bottom:1rem;background-clip:text}.section-subtitle{color:var(--text-dim);font-size:1.125rem}.projects-grid{display:grid;gap:6rem}.project-card{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;opacity:0;transform:translateY(50px);animation:fadeInUp .8s ease-out forwards}.project-card:nth-child(1){animation-delay:.1s}.project-card:nth-child(2){animation-delay:.2s}.project-card:nth-child(3){animation-delay:.3s}.project-card:nth-child(4){animation-delay:.4s}.project-card:nth-child(2n){grid-template-columns:1fr 1fr}.project-card:nth-child(2n) .project-image{order:2}.project-image{position:relative;aspect-ratio:16/10;background:var(--surface);overflow:hidden;border:1px solid var(--border)}.project-image a{display:block;position:relative;height:100%;width:100%;cursor:pointer;z-index:1;background:transparent}.project-image:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,var(--accent-glow) 0%,transparent 100%);opacity:0;transition:opacity .4s ease;z-index:1}.project-card:hover .project-image:before{opacity:1}.project-image img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.16,1,.3,1)}.project-card:hover .project-image img{transform:scale(1.05)}.placeholder-img{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1a1a1a,#0f0f0f);color:var(--text-dim);font-size:1rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;position:relative;z-index:1}.project-card:nth-child(2) .placeholder-img{background:transparent}.project-content{padding:2rem 0}.project-number{font-size:.875rem;color:var(--accent);letter-spacing:.2em;text-transform:uppercase;margin-bottom:.5rem;font-weight:500}.project-title{font-family:var(--font-headline);font-size:clamp(1.75rem,3vw,2.5rem);font-weight:600;margin-bottom:1rem;color:var(--text)}.project-description{color:var(--text-dim);font-size:1.125rem;line-height:1.8;margin-bottom:1.5rem}.project-tags{display:flex;flex-wrap:wrap;gap:.75rem;margin-bottom:2rem}.tag{padding:.5rem 1rem;background:#ff6b351a;border:1px solid rgba(255,107,53,.3);color:var(--accent);font-size:.875rem;font-weight:500}.project-link{display:inline-flex;align-items:center;gap:.5rem;color:var(--text);text-decoration:none;font-weight:600;transition:all .3s ease;position:relative}.project-link:after{content:"→";transition:transform .3s ease}.project-link:hover{color:var(--accent)}.project-link:hover:after{transform:translate(5px)}.slider-container{margin:6rem auto;max-width:1600px;padding:0 2rem;overflow:hidden;animation:fadeInUp 1s ease-out .8s both}.slider-wrapper{position:relative;width:100%;cursor:grab;user-select:none}.slider-wrapper.dragging{cursor:grabbing}.slider-track{display:flex;gap:2rem;transition:transform .5s cubic-bezier(.16,1,.3,1);will-change:transform}.slider-track.no-transition{transition:none}.slide{flex-shrink:0;max-width:1200px;aspect-ratio:16/9;background:var(--surface);border:1px solid var(--border);overflow:hidden;position:relative;border-radius:10px}.slide img,.slide video{width:100%;height:100%;object-fit:cover;pointer-events:none}.slide-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#1a1a1a,#0f0f0f);color:var(--text-dim);font-size:1.25rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase}.slider-nav{display:flex;justify-content:center;align-items:center;gap:1.5rem;margin-top:3rem}.slider-btn{width:48px;height:48px;background:var(--surface);border:1px solid var(--border);color:var(--text);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;font-size:1.25rem}.slider-btn:hover:not(:disabled){background:var(--accent);border-color:var(--accent);color:var(--bg)}.slider-btn:disabled{opacity:.3;cursor:not-allowed}.slider-dots{display:flex;gap:.75rem}.dot{width:8px;height:8px;border-radius:50%;background:var(--border);cursor:pointer;transition:all .3s ease}.dot.active{background:var(--accent);width:24px;border-radius:4px}.project-content{max-width:900px;margin:6rem auto;padding:0 2rem}.content-section{margin-bottom:4rem;opacity:0;transform:translateY(30px);animation:fadeInUp .8s ease-out forwards}.content-section:nth-child(1){animation-delay:.4s}.content-section:nth-child(2){animation-delay:.5s}.content-section:nth-child(3){animation-delay:.6s}.section-text{font-size:1.125rem;line-height:1.8;color:var(--text-dim);margin-bottom:1.5rem}.highlight-box{background:#ff6b350d;border-left:3px solid var(--accent);padding:2rem;margin:2rem 0}.highlight-box p{font-size:1.25rem;line-height:1.7;color:var(--text);font-weight:500}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;margin:3rem 0}.stat-item{text-align:center;padding:2rem;background:var(--surface);border:1px solid var(--border);display:flex;flex-direction:column;justify-content:center;min-height:180px}.stat-value{font-family:var(--font-headline);font-size:clamp(1.5rem,3vw,1.75rem);font-weight:600;color:var(--accent);margin-bottom:.5rem;line-height:1.2;word-wrap:break-word;hyphens:auto}.stat-label{font-size:.875rem;color:var(--text-dim);line-height:1.5;text-transform:uppercase;letter-spacing:.1em}.next-project{margin:8rem auto 4rem;padding:0 2rem;max-width:1400px}.next-project-link{display:block;text-decoration:none;color:var(--text);padding:3rem;background:var(--surface);border:1px solid var(--border);transition:all .4s ease;position:relative;overflow:hidden}.next-project-link:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(2,196,218,.1),transparent);transition:left .6s ease}.next-project-link:hover:before{left:100%}.next-project-link:hover{border-color:var(--accent);transform:translateY(-4px)}.next-label{font-size:.875rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:1rem;font-weight:500}.next-title{font-family:var(--font-headline);font-size:clamp(1.75rem,3vw,2.5rem);font-weight:600;margin-bottom:.5rem}.next-arrow{font-size:2rem;color:var(--accent);transition:transform .3s ease}.next-project-link:hover .next-arrow{transform:translate(10px)}.testimonial-marquee{overflow:hidden;padding:3rem 0}.testimonial-marquee-track{display:flex;gap:1.5rem;animation:tm-scroll 60s linear infinite;width:max-content}.testimonial-marquee:hover .testimonial-marquee-track{animation-play-state:paused}.tm-card{width:360px;flex-shrink:0;padding:1.75rem;background:var(--surface);border:1px solid var(--border);display:flex;flex-direction:column;justify-content:space-between;transition:border-color .3s ease}.tm-card:hover{border-color:var(--accent)}.tm-card:hover .tm-img{filter:grayscale(0%)}.tm-text{font-size:.95rem;line-height:1.7;color:var(--text);margin-bottom:1.25rem;flex:1}.tm-text strong{font-weight:600}.tm-author{display:flex;align-items:center;gap:.75rem;border-top:1px solid var(--border);padding-top:1rem}.tm-img{width:40px;height:40px;border-radius:50%;object-fit:cover;filter:grayscale(100%);transition:filter .3s ease}.tm-name{font-weight:600;font-size:.9rem;color:var(--text)}.tm-role{font-size:.75rem;color:var(--text-dim);line-height:1.3}@keyframes tm-scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}@media(max-width:600px){.tm-card{width:300px;padding:1.25rem}.tm-text{font-size:.9rem}}footer{border-top:1px solid var(--border);padding:4rem 2rem;text-align:center}.footer-content{max-width:600px;margin:0 auto}.footer-title{font-family:var(--font-headline);font-size:clamp(1.75rem,3vw,2.5rem);margin-bottom:1rem}.footer-description{color:var(--text-dim);margin-bottom:2rem}.footer-hire-btn{display:inline-block;background:var(--text);color:var(--bg);text-decoration:none;font-family:Figtree,sans-serif;font-size:.95rem;font-weight:600;padding:.75rem 2rem;margin-bottom:2rem;transition:opacity .2s ease}.footer-hire-btn:hover{opacity:.8}.social-links{display:flex;gap:2rem;justify-content:center;margin-bottom:2rem}.social-links a{color:var(--text);text-decoration:none;font-weight:500;transition:color .3s ease}.social-links a:hover{color:var(--accent)}.copyright{color:var(--text-dim);font-size:.875rem}@media(max-width:968px){.project-card,.project-card:nth-child(2n){grid-template-columns:1fr}.project-card:nth-child(2n) .project-image{order:1}.projects{padding:4rem 1.5rem}.section-header{margin-bottom:3rem}}@media(max-width:768px){nav{padding:1.5rem}.project-hero{padding:6rem 1.5rem 3rem}.project-meta{gap:2rem}.slide{width:85vw}.slider-container{margin:4rem auto}.project-content{margin:4rem auto;padding:0 1.5rem}.content-section{margin-bottom:3rem}.stats-grid{grid-template-columns:1fr}.next-project-link{padding:2rem}}@media(max-width:968px){.hero{min-height:80vh}.cta-group{flex-direction:column;gap:.75rem}.cta-button{padding:.875rem 2rem;width:100%;max-width:280px}.project-tags{gap:.5rem}.tag{padding:.375rem .75rem;font-size:.8125rem}.project-card{display:unset}}:root{--brand-bg-primary: #020617;--brand-light-blue: #3A3AD0;--brand-orange: #FFA624;--brand-purple: #6666A3;--brand-light-purple: #7F7FEC}.project-dot-matrix-background{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;z-index:0;pointer-events:none;opacity:.6;background:var(--brand-bg-primary)}.dot-matrix-el{background:conic-gradient(from 180deg at 50% 70%,var(--brand-bg-primary) 0deg,var(--brand-light-blue) 72deg,var(--brand-orange) 144deg,var(--brand-purple) 216deg,var(--brand-light-purple) 288deg,var(--brand-bg-primary) 360deg);width:100%;height:100%;mask:radial-gradient(circle at 50% 50%,white 2px,transparent 2.5px) 50% 50% / 20px 20px,url(https://assets.codepen.io/605876/noise-mask.png) 256px 50% / 256px 256px;-webkit-mask:radial-gradient(circle at 50% 50%,white 2px,transparent 2.5px) 50% 50% / 20px 20px,url(https://assets.codepen.io/605876/noise-mask.png) 256px 50% / 256px 256px;mask-composite:intersect;-webkit-mask-composite:source-in;animation:flicker 20s infinite linear}@keyframes flicker{to{mask-position:50% 50%,0 50%;-webkit-mask-position:50% 50%,0 50%}}