:root{--bg-deep:#030305;--bg-base:#09090b;--bg-raised:#121214;--bg-card:#18181b;--bg-hover:#27272a;--bg-alt:#050507;--text-primary:#fff;--text-secondary:#a1a1aa;--text-muted:#52525b;--accent:#8b5cf6;--accent-hover:#a78bfa;--accent-muted:#8b5cf626;--accent-glow:#8b5cf64d;--emerald:#06b6d4;--emerald-muted:#06b6d426;--border:#f0ece40f;--border-hover:#f0ece41f;--glass:#16161fb3;--glass-strong:#16161fd9;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 4px 16px #0006;--shadow-lg:0 12px 40px #00000080;--shadow-glow:0 0 30px var(--accent-glow);--font-body:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-display:"Syne", sans-serif;--font-mono:"JetBrains Mono", "Fira Code", monospace;--font-pixel:"Press Start 2P", monospace;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--ease-out:cubic-bezier(.16, 1, .3, 1);--transition-fast:.15s var(--ease-out);--transition-base:.25s var(--ease-out);--transition-slow:.4s var(--ease-out);--max-width:1120px;--nav-height:64px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{background:var(--bg-base);color:var(--text-primary);font-family:var(--font-body);font-size:16px;font-weight:400;line-height:1.65;overflow-x:hidden}a{color:inherit;text-decoration:none}button{appearance:none;color:inherit;font:inherit;cursor:pointer;background:0 0;border:none}img{max-width:100%;display:block}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.container{width:100%;max-width:var(--max-width);padding:0 var(--space-6);margin:0 auto}.container--narrow{max-width:720px}.reveal{opacity:0;transition:opacity .6s var(--ease-out), transform .6s var(--ease-out);transform:translateY(24px)}.reveal.visible{opacity:1;transform:translateY(0)}@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transition:none;transform:none}html{scroll-behavior:auto}}.nav{z-index:9000;height:var(--nav-height);padding:0 var(--space-8);transition:background var(--transition-base), box-shadow var(--transition-base);background:0 0;justify-content:space-between;align-items:center;display:flex;position:fixed;top:0;left:0;right:0}.nav.scrolled{background:var(--glass-strong);-webkit-backdrop-filter:blur(16px);box-shadow:0 1px 0 var(--border)}.nav__logo{font-family:var(--font-mono);color:var(--accent);letter-spacing:-.5px;transition:opacity var(--transition-fast);font-size:18px;font-weight:700}.nav__logo:hover{opacity:.8}.nav__links{align-items:center;gap:var(--space-8);display:flex}.nav__link{color:var(--text-secondary);transition:color var(--transition-fast);cursor:pointer;font-size:14px;font-weight:500}.nav__link:hover{color:var(--text-primary)}.nav__link--rpg{color:var(--accent);align-items:center;gap:6px;display:flex}.nav__link--cta{color:var(--bg-base);background:var(--accent);padding:var(--space-2) var(--space-5);border-radius:var(--radius-sm);transition:background var(--transition-fast), transform var(--transition-fast);font-weight:600}.nav__link--cta:hover{background:var(--accent-hover);color:var(--bg-base);transform:translateY(-1px)}.nav__burger{padding:var(--space-2);flex-direction:column;gap:5px;display:none}.nav__burger span{background:var(--text-primary);width:22px;height:2px;transition:transform var(--transition-base), opacity var(--transition-fast);border-radius:2px;display:block}.mobile-menu{z-index:8999;background:var(--bg-deep);justify-content:center;align-items:center;gap:var(--space-10);opacity:0;pointer-events:none;transition:opacity var(--transition-base);flex-direction:column;display:flex;position:fixed;inset:0}.mobile-menu.open{opacity:1;pointer-events:all}.mobile-menu__link{color:var(--text-secondary);transition:color var(--transition-fast);font-size:20px;font-weight:600}.mobile-menu__link:hover{color:var(--accent)}.hero--funky{background:var(--bg-deep);align-items:center;width:100%;min-height:100vh;display:flex;position:relative;overflow:hidden}.hero__glow{filter:blur(120px);z-index:0;opacity:.5;pointer-events:none;border-radius:50%;width:60vw;height:60vh;animation:10s ease-in-out infinite alternate float-glow;position:absolute}.hero__glow--1{background:radial-gradient(circle, var(--emerald) 0%, transparent 70%);top:-10%;right:-10%}.hero__glow--2{background:radial-gradient(circle, var(--accent) 0%, transparent 70%);animation-delay:-5s;bottom:-20%;left:-10%}@keyframes float-glow{0%{transform:scale(1)translate(0)}to{transform:scale(1.2)translate(-50px,50px)}}.hero__container{z-index:1;position:relative}.hero__content{max-width:900px}.hero__tagline{font-family:var(--font-mono);color:var(--accent);text-transform:uppercase;letter-spacing:3px;margin-bottom:var(--space-6);align-items:center;gap:var(--space-3);font-size:14px;display:flex}.hero__tagline:before{content:"";background:var(--accent);width:50px;height:2px;display:block}.hero__title{font-family:var(--font-display);letter-spacing:-3px;margin-bottom:var(--space-8);flex-direction:column;font-size:clamp(60px,11vw,130px);font-weight:800;line-height:.9;display:flex}.hero__title-line{color:var(--text-primary);display:block}.outline-text{color:#0000;-webkit-text-stroke:2px var(--text-primary);filter:drop-shadow(4px 4px 0px var(--accent));transition:all var(--transition-base);font-style:italic}.outline-text:hover{-webkit-text-stroke:2px var(--emerald);filter:drop-shadow(6px 6px #3aff8a80)}.hero__subtitle{color:var(--text-secondary);margin-bottom:var(--space-10);max-width:600px;font-size:clamp(18px,3vw,24px);font-weight:300;line-height:1.5}.text-highlight{color:var(--text-primary);font-weight:500}.hero__actions{gap:var(--space-4);flex-wrap:wrap;display:flex}.marquee{background:var(--accent);width:100%;color:var(--bg-deep);font-family:var(--font-display);white-space:nowrap;z-index:5;border-top:2px solid #000;border-bottom:2px solid #000;padding:12px 0;font-size:24px;font-weight:800;position:absolute;bottom:0;left:0;overflow:hidden;transform:rotate(-2deg)scale(1.05)}.marquee__inner{align-items:center;animation:20s linear infinite marquee;display:inline-flex}.marquee__dot{margin:0 30px}@keyframes marquee{0%{transform:translate(0)}to{transform:translate(-50%)}}.btn--shadow{box-shadow:4px 4px 0px var(--accent);border:1px solid var(--accent)}.btn--shadow:hover{box-shadow:2px 2px 0px var(--accent);background:var(--accent);color:var(--bg-deep);transform:translate(2px,2px)}.btn--emerald{color:var(--emerald);box-shadow:4px 4px 0px var(--emerald);border:1px solid var(--emerald);background:0 0}.btn--emerald:hover{background:var(--emerald);color:var(--bg-deep);box-shadow:2px 2px 0px var(--emerald);transform:translate(2px,2px)}.section{padding:var(--space-24) 0;position:relative}.section--alt{background:var(--bg-alt)}.section__label{font-family:var(--font-mono);color:var(--accent);text-transform:uppercase;letter-spacing:2px;margin-bottom:var(--space-3);font-size:12px;font-weight:500}.section__title{font-family:var(--font-display);letter-spacing:-2px;color:var(--text-primary);margin-bottom:var(--space-12);font-size:clamp(40px,6vw,64px);font-weight:800;line-height:1.1}.section__subtitle{color:var(--text-secondary);margin-top:calc(var(--space-6) * -1);margin-bottom:var(--space-12);font-size:17px;font-weight:300}.projects{gap:var(--space-20);flex-direction:column;display:flex}.project-card{gap:var(--space-12);grid-template-columns:1.1fr 1fr;align-items:center;display:grid}.project-card--reverse{direction:rtl}.project-card--reverse>*{direction:ltr}.project-card__visual-link{color:inherit;text-decoration:none;display:block}.project-card__visual{cursor:pointer;position:relative}.project-card__mockup{border-radius:var(--radius-lg);transition:transform var(--transition-slow);overflow:hidden}.project-card:hover .project-card__mockup{transform:translateY(-4px)}.mockup-browser{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden}.mockup-browser__bar{background:var(--bg-raised);border-bottom:1px solid var(--border);align-items:center;gap:6px;padding:10px 14px;display:flex}.mockup-dot{background:var(--bg-hover);border-radius:50%;width:10px;height:10px}.mockup-dot:first-child{background:#ff5f57}.mockup-dot:nth-child(2){background:#febc2e}.mockup-dot:nth-child(3){background:#28c840}.mockup-url{margin-left:var(--space-3);font-family:var(--font-mono);color:var(--text-muted);background:var(--bg-base);border-radius:var(--radius-sm);flex:1;max-width:200px;padding:3px 10px;font-size:11px}.mockup-browser__body{aspect-ratio:16/10;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.mockup-browser__body--tibo{background:linear-gradient(135deg,#1a0c06 0%,#2a1208 40%,#3d1a0a 100%)}.mockup-browser__body--kingston{background:linear-gradient(135deg,#060a14 0%,#0a1628 40%,#0f1f3a 100%)}.mockup-content{text-align:center;padding:var(--space-8)}.mockup-hero-text{font-family:var(--font-body);color:var(--text-primary);letter-spacing:4px;margin-bottom:var(--space-3);font-size:clamp(20px,3vw,32px);font-weight:700}.mockup-sub{color:var(--text-secondary);margin-bottom:var(--space-5);font-size:12px}.mockup-btn-placeholder{border-radius:var(--radius-sm);background:var(--accent-muted);border:1px solid var(--accent);opacity:.5;width:100px;height:30px;margin:0 auto}.project-card__tag{font-family:var(--font-mono);color:var(--accent);letter-spacing:1px;text-transform:uppercase;font-size:11px}.project-card__name{margin-top:var(--space-2);margin-bottom:var(--space-4);letter-spacing:-.3px;font-size:clamp(24px,3vw,32px);font-weight:700}.project-card__desc{color:var(--text-secondary);margin-bottom:var(--space-6);font-weight:300;line-height:1.75}.project-card__stack{gap:var(--space-2);margin-bottom:var(--space-6);flex-wrap:wrap;display:flex}.project-card__stack span{font-family:var(--font-mono);padding:var(--space-1) var(--space-3);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-secondary);font-size:11px}.btn{align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);font-size:14px;font-weight:600;display:inline-flex}.btn--primary{background:var(--accent);color:var(--bg-base)}.btn--primary:hover{background:var(--accent-hover);box-shadow:var(--shadow-glow);transform:translateY(-1px)}.btn--primary:active{transform:translateY(0)}.btn--primary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.btn--outline{color:var(--text-primary);background:0 0;border:1px solid #ffffff1a}.btn--outline:hover{border-color:var(--accent);color:var(--accent)}.btn--outline svg{color:var(--accent)}.about-grid{gap:var(--space-16);grid-template-columns:1.2fr 1fr;align-items:start;display:grid}.about-text p{color:var(--text-secondary);margin-bottom:var(--space-6);font-size:17px;font-weight:300;line-height:1.8}.about-text__personal{font-family:var(--font-mono);font-style:italic;color:var(--text-muted)!important;font-size:13px!important;font-weight:400!important}.about-stack__title{text-transform:uppercase;letter-spacing:1.5px;color:var(--text-muted);margin-bottom:var(--space-6);font-size:14px;font-weight:600}.stack-grid{gap:var(--space-3);grid-template-columns:1fr 1fr;display:grid}.stack-item{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-secondary);transition:border-color var(--transition-fast), background var(--transition-fast);font-size:13px;font-weight:500;display:flex}.stack-item:hover{border-color:var(--border-hover);background:var(--bg-hover)}.stack-item__icon{color:var(--accent);opacity:.7;display:flex}.bento{gap:var(--space-5);grid-template-columns:repeat(3,1fr);display:grid}.bento__card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-8);transition:border-color var(--transition-base), transform var(--transition-base), box-shadow var(--transition-base)}.bento__card:hover{border-color:var(--accent-muted);box-shadow:var(--shadow-md);transform:translateY(-2px)}.bento__card--wide{grid-column:span 1}.bento__icon{width:48px;height:48px;margin-bottom:var(--space-5);background:var(--accent-muted);border-radius:var(--radius-md);color:var(--accent);justify-content:center;align-items:center;display:flex}.bento__card h3{margin-bottom:var(--space-3);font-size:18px;font-weight:600}.bento__card p{color:var(--text-secondary);font-size:14px;font-weight:300;line-height:1.7}.process{align-items:flex-start;gap:0;display:flex}.process__step{text-align:center;padding:0 var(--space-5);flex:1}.process__number{font-family:var(--font-mono);color:var(--accent);margin-bottom:var(--space-4);opacity:.5;font-size:32px;font-weight:700}.process__step h3{margin-bottom:var(--space-3);font-size:16px;font-weight:600}.process__step p{color:var(--text-secondary);font-size:14px;font-weight:300;line-height:1.7}.process__connector{background:linear-gradient(to right, var(--border), var(--accent-muted), var(--border));width:48px;min-width:48px;height:1px;margin-top:52px}.contact-card{gap:var(--space-4);flex-direction:column;display:flex}.contact-link{align-items:center;gap:var(--space-4);padding:var(--space-5) var(--space-6);background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-secondary);transition:all var(--transition-fast);cursor:pointer;font-size:15px;font-weight:500;display:flex}.contact-link:hover{border-color:var(--accent-muted);color:var(--text-primary);background:var(--bg-hover);transform:translate(4px)}.contact-link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.contact-link svg{color:var(--accent);flex-shrink:0}.footer{padding:var(--space-10) 0;border-top:1px solid var(--border)}.footer__text{color:var(--text-muted);text-align:center;font-size:13px}.footer__copy{margin-top:var(--space-2);font-size:12px;display:block}@media (width<=1024px){.project-card{gap:var(--space-8);grid-template-columns:1fr}.project-card--reverse{direction:ltr}.about-grid{gap:var(--space-10);grid-template-columns:1fr}.bento{grid-template-columns:1fr}.bento__card--wide{grid-column:span 1}.process{gap:var(--space-8);flex-direction:column;align-items:center}.process__connector{background:linear-gradient(to bottom, var(--border), var(--accent-muted), var(--border));width:1px;min-width:1px;height:32px;margin-top:0}}@media (width<=768px){:root{--nav-height:56px}.nav{padding:0 var(--space-5)}.nav__links{display:none}.nav__burger{display:flex}.hero__hint{font-size:9px}.section{padding:var(--space-16) 0}.section__title{margin-bottom:var(--space-8)}.container{padding:0 var(--space-5)}.stack-grid{grid-template-columns:1fr 1fr}}@media (width<=375px){.hero__hint{display:none}.stack-grid{grid-template-columns:1fr}}.project-card__visual:before{content:"";border-radius:calc(var(--radius-lg) + 1px);background:linear-gradient(135deg, var(--accent-muted), transparent 40%, transparent 60%, var(--emerald-muted));opacity:0;transition:opacity var(--transition-slow);z-index:-1;position:absolute;inset:-1px}.project-card:hover .project-card__visual:before{opacity:1}::selection{background:var(--accent);color:var(--bg-base)}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg-deep)}::-webkit-scrollbar-thumb{background:var(--bg-hover);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}