:root{--font-sans: "Inter", sans-serif;--font-mono: "Roboto Mono", monospace;--transition-speed: .3s}[data-theme=dark]{--bg-color: #121826;--surface-color: #1e293b;--text-color: #e2e8f0;--text-muted-color: #94a3b8;--primary-color: #38bdf8;--primary-hover-color: #7dd3fc;--border-color: #334155}[data-theme=light]{--bg-color: #f1f5f9;--surface-color: #ffffff;--text-color: #1e293b;--text-muted-color: #475569;--primary-color: #0ea5e9;--primary-hover-color: #38bdf8;--border-color: #cbd5e1}body{background-color:var(--bg-color);color:var(--text-color);font-family:var(--font-sans);line-height:1.7;transition:background-color var(--transition-speed),color var(--transition-speed);margin:0;padding:2rem 1rem}#tsparticles{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1}h1,h2,h3{color:var(--text-color);font-weight:700}h1{font-size:clamp(2.5rem,5vw,3.5rem);margin-bottom:.5rem}h2{font-size:1.8rem;border-bottom:2px solid var(--primary-color);padding-bottom:.5rem;margin-bottom:1.5rem}.subtitle{font-family:var(--font-mono);font-size:1.3rem;color:var(--text-muted-color);margin:0}p{color:var(--text-muted-color)}a{color:var(--primary-color);text-decoration:none;transition:color var(--transition-speed)}a:hover{color:var(--primary-hover-color)}.container{max-width:1100px;margin:0 auto;padding:0 1rem}main{padding-top:1rem}section{margin-bottom:4rem}footer{text-align:center;margin-top:4rem;padding-top:2rem;border-top:1px solid var(--border-color);color:var(--text-muted-color)}.btn{display:inline-flex;align-items:center;justify-content:center;height:44px;font-weight:700;padding:0 24px;border-radius:8px;border:none;cursor:pointer;box-sizing:border-box;transition:all .2s ease-out;box-shadow:0 4px 15px #0000001a;background-color:var(--primary-color);color:var(--bg-color)}.btn:hover{transform:translateY(-3px);box-shadow:0 6px 20px #00000026;color:var(--bg-color);background-color:var(--primary-hover-color)}.btn:active{transform:translateY(-1px);box-shadow:0 2px 10px #0000001a}.btn-outline{background-color:transparent;color:var(--primary-color);border:2px solid var(--primary-color)}.btn-outline:hover{background-color:var(--primary-color);color:var(--bg-color)}.btn-icon-only,.btn-paypal{height:44px;box-sizing:border-box;padding:0 20px}.btn-icon-only{background-color:var(--border-color);border:1px solid var(--border-color)}.btn-icon-only:hover{border-color:var(--primary-hover-color);background-color:var(--border-color)}.btn-icon-logo{height:18px;width:auto}.btn-paypal{gap:.75rem;background-color:#ffc439;color:#003087}.btn-paypal:hover{transform:scale(1.05) translateY(0);background-color:#ffc439;color:#003087;box-shadow:0 6px 20px #00000026}.btn-paypal img{height:18px}.project-card,.game-card{background-color:var(--surface-color);border:1px solid var(--border-color);border-radius:12px;padding:2rem;transition:transform var(--transition-speed),box-shadow var(--transition-speed)}.project-card:hover,.game-card:hover{transform:translateY(-8px);box-shadow:0 12px 24px #00000040}.project-card-interactive{display:flex;align-items:center;gap:2rem;flex-wrap:wrap}.project-card-interactive .card-content-text{flex:2;min-width:300px}.project-card-interactive .card-image-content{flex:1;text-align:center}.project-card-interactive .card-image-content img{max-width:160px;width:100%;height:auto;border-radius:12px}.theme-switcher{position:fixed;top:20px;right:20px;z-index:100;background-color:var(--surface-color);border:1px solid var(--border-color);width:44px;height:44px;border-radius:50%;cursor:pointer;display:flex;justify-content:center;align-items:center;padding:0;overflow:hidden}.theme-switcher .sun{display:none}.theme-switcher .moon,[data-theme=light] .theme-switcher .sun{display:block}[data-theme=light] .theme-switcher .moon{display:none}.hero-section{display:flex;align-items:center;min-height:80vh;padding:2rem 0}.hero-content-grid{display:grid;grid-template-columns:repeat(2,1fr);align-items:center;gap:3rem;width:100%}.hero-text-content{text-align:left}.hero-headline{font-size:clamp(2.8rem,6vw,4.5rem);margin-bottom:.5rem;background:linear-gradient(45deg,var(--primary-hover-color),var(--primary-color));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 2px 15px rgba(56,189,248,.1)}.hero-description{font-size:1.1rem;max-width:500px;margin:1.5rem 0 2rem}.hero-actions,.hero-socials{display:flex;align-items:center;justify-content:flex-start;gap:1rem;margin-top:1rem}.hero-actions .btn:not(.btn-outline){background:linear-gradient(45deg,var(--primary-color),var(--primary-hover-color));border:none}.hero-visual-content{position:relative;height:400px;width:100%;top:-50px}.skill-bubble{position:absolute;width:var(--size);height:var(--size);top:var(--y);left:var(--x);background-color:#ffffff0d;border-radius:50%;display:flex;align-items:center;justify-content:center;padding:15%;box-shadow:0 8px 32px #0003;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.1);animation:float var(--duration) ease-in-out var(--delay) infinite}.skill-bubble img{width:100%;height:auto}.contact-buttons{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}.contact-buttons .btn{margin-top:0}.section-subtitle{text-align:center;font-size:1.2rem;color:var(--text-muted-color);max-width:600px;margin:-1rem auto 3rem}.game-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:2rem}.game-card{text-align:center;display:flex;flex-direction:column}.game-card-icon{font-size:3rem;line-height:1;margin-bottom:1.5rem}.game-card-title{font-size:1.6rem;margin:0 0 .75rem;color:var(--text-color)}.game-card-description{color:var(--text-muted-color);flex-grow:1;margin-bottom:2rem}.game-card .btn{width:100%;margin-top:auto}.back-to-games-container{text-align:left;margin-bottom:2rem}#legal-content h2,#legal-content h3{font-size:1.5rem;color:var(--text-color);margin-top:2rem;margin-bottom:1rem;border-bottom:1px solid var(--border-color);padding-bottom:.5rem}#legal-content p,#legal-content ul{color:var(--text-muted-color);margin-bottom:1rem}#legal-content a{text-decoration:underline}@keyframes float{0%{transform:translateY(0) rotate(0)}50%{transform:translateY(-25px) rotate(10deg)}to{transform:translateY(0) rotate(0)}}@media (max-width: 900px){.hero-content-grid{grid-template-columns:1fr;text-align:center}.hero-text-content{order:2;text-align:center}.hero-visual-content{order:1;height:300px;margin-bottom:2rem}.hero-actions,.hero-socials{justify-content:center}}@media (max-width: 768px){.section-subtitle{font-size:1rem;margin-bottom:2rem}.game-grid{grid-template-columns:1fr;gap:1.5rem}.game-card{padding:1.5rem}}@media (max-width: 480px){.hero-visual-content{height:250px}.skill-bubble{padding:12%}}.main-header{padding:1rem 0;margin-bottom:2rem}.navbar{display:flex;justify-content:space-between;align-items:center;max-width:1100px;margin:0 auto;padding:0 1rem}.logo-container{display:flex;align-items:center;gap:1rem}.logo-img{height:40px;width:auto}.logo-name{font-size:1.5rem;font-weight:700;color:var(--text-color)}.nav-links{list-style:none;display:flex;gap:2rem;margin:0;padding:0}.nav-links a{font-family:var(--font-mono);font-size:1rem;position:relative;padding-bottom:5px}.nav-links a:after{content:"";position:absolute;width:0;height:2px;bottom:0;left:50%;background-color:var(--primary-color);transition:all .3s ease-in-out}.nav-links a:hover:after,.nav-links a.active:after{width:100%;left:0}.nav-links a.active{color:var(--primary-color)}.hamburger{display:none;cursor:pointer;background:none;border:none;padding:0}.hamburger .bar{display:block;width:25px;height:3px;margin:5px auto;background-color:var(--text-color);transition:all .3s ease-in-out}@media (max-width: 768px){.nav-links{position:fixed;left:-100%;top:0;gap:0;flex-direction:column;background-color:var(--bg-color);width:100%;height:100vh;text-align:center;transition:.3s;padding-top:5rem;z-index:10}.nav-links.active{left:0}.nav-links li{padding:1.5rem 0}.hamburger{display:block;z-index:11}.hamburger.active .bar:nth-child(2){opacity:0}.hamburger.active .bar:nth-child(1){transform:translateY(8px) rotate(45deg)}.hamburger.active .bar:nth-child(3){transform:translateY(-8px) rotate(-45deg)}}