.navbar{background-color:#000;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.1);position:sticky;top:0;z-index:1000}.navbar .container{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;padding:0 20px}.navbar .logo{margin:0;font-size:1.5rem;color:var(--primary);cursor:pointer;transition:color .3s ease,opacity .3s ease;display:flex;align-items:center;gap:8px;position:relative}.navbar .logo:hover{color:var(--accent);opacity:.9}.navbar .logo:after{content:attr(title);position:absolute;bottom:-30px;left:50%;transform:translate(-50%);background-color:#000c;color:var(--text);padding:5px 10px;border-radius:5px;font-size:.9rem;white-space:nowrap;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.navbar .logo:hover:after{opacity:1;visibility:visible}.navbar .nav-links{display:flex;align-items:center;gap:20px}.navbar .nav-links a{color:var(--text);text-decoration:none;font-size:1rem;transition:color .3s ease}.navbar .nav-links a:hover{color:var(--primary)}.navbar .nav-links .icon{display:flex;align-items:center}@media (max-width: 768px){.navbar .container{flex-direction:column;gap:15px}.navbar .nav-links{flex-wrap:wrap;justify-content:center;gap:15px}}.hero{height:100vh;display:flex;align-items:center;justify-content:center;background-color:var(--background)}.hero .container{max-width:1200px;margin:0 auto;padding:0 20px}.hero-content{display:flex;align-items:center;justify-content:space-between;gap:40px}.hero-text{max-width:600px;text-align:left}.hero-text h1{font-size:3rem;margin-bottom:20px}.hero-text h2{font-size:2rem;margin-bottom:20px}.hero-text .highlight{color:var(--primary)}.hero-text p{font-size:1.2rem;margin-bottom:20px}.hero-image{flex-shrink:0}.profile-photo{width:300px;height:300px;border-radius:50%;object-fit:cover;border:4px solid var(--primary);box-shadow:0 4px 8px #0003}@media (max-width: 768px){.hero-content{flex-direction:column;text-align:center;gap:20px}.hero-text{text-align:center}.hero-text h1{font-size:2rem}.hero-text h2{font-size:1.5rem}.hero-text p{font-size:1rem;padding:0 20px}.profile-photo{width:200px;height:200px}}.about{padding:80px 0;background-color:var(--background);color:var(--text)}.about .container{max-width:800px;margin:0 auto;padding:0 20px}.about h2{font-size:2.5rem;margin-bottom:20px;color:var(--primary);text-align:center}.about .intro{font-size:1.2rem;text-align:center;margin-bottom:40px}.about h3{font-size:1.8rem;margin-top:30px;margin-bottom:15px;color:var(--primary)}.about ul{list-style-type:none;padding:0}.about ul li{margin-bottom:20px}.about ul li strong{color:var(--primary)}.about ul li p{margin-top:5px;font-size:1rem;color:var(--text)}.about .skills ul,.about .languages ul{display:flex;flex-wrap:wrap;gap:10px}.about .skills ul li,.about .languages ul li{background-color:var(--card-bg);padding:8px 12px;border-radius:5px;font-size:.9rem;color:var(--text)}.about .education p{font-size:1rem;color:var(--text)}@media (max-width: 768px){.about h2{font-size:2rem}.about h3{font-size:1.5rem}.about .intro{font-size:1rem}.about ul li{margin-bottom:15px}.about .skills ul,.about .languages ul{justify-content:center}}.projects{padding:80px 0;background-color:var(--background)}.projects .container{max-width:1200px;margin:0 auto;padding:0 20px}.projects h2{font-size:2.5rem;margin-bottom:40px;color:var(--primary);text-align:center}.projects h3{font-size:2rem;margin-bottom:20px;color:var(--primary)}.professional-projects{margin-bottom:60px}.project-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.project-card{background-color:var(--card-bg);padding:20px;border-radius:8px;box-shadow:0 4px 8px #0003;transition:transform .3s ease,box-shadow .3s ease}.project-card:hover{transform:translateY(-10px);box-shadow:0 8px 16px #0000004d}.project-card h3{font-size:1.5rem;margin-bottom:10px;color:var(--primary)}.project-card p{font-size:1rem;color:var(--text);margin-bottom:15px}.tech-stack{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:15px}.tech-stack span{background-color:var(--primary);color:var(--background);padding:5px 10px;border-radius:4px;font-size:.9rem}.side-projects{margin-top:40px}.side-projects .project-grid{margin-top:20px}.links{display:flex;gap:10px;margin-top:15px}.links a{background-color:var(--primary);color:var(--background);padding:8px 16px;border-radius:4px;text-decoration:none;font-size:.9rem;transition:background-color .3s ease}.links a:hover{background-color:var(--accent)}@media (max-width: 768px){.projects{padding:40px 0}.projects h2{font-size:1.8rem}.project-grid{grid-template-columns:1fr}}.contact{padding:80px 0;background-color:var(--card-bg)}.contact .container{text-align:center}.contact h2{font-size:2.5rem;margin-bottom:20px;color:var(--primary)}.contact p{font-size:1.2rem;max-width:800px;margin:0 auto;color:var(--text)}.contact a{color:var(--primary);text-decoration:none}.contact a:hover{text-decoration:underline}@media (max-width: 768px){.contact h2{font-size:2rem}.contact p{font-size:1rem;padding:0 20px}}.secret-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background-color:var(--background);color:var(--text);text-align:center;padding:20px}.secret-page h1{font-size:2.5rem;margin-bottom:20px;color:var(--primary)}.secret-page p{font-size:1.2rem;margin-bottom:20px}.dog-image{max-width:100%;height:auto;border-radius:10px;box-shadow:0 4px 8px #0003;margin-top:20px}.go-back-button{margin-top:20px;padding:10px 20px;background-color:var(--primary);color:var(--background);border:none;border-radius:5px;cursor:pointer;font-size:1rem;transition:background-color .3s ease}.go-back-button:hover{background-color:var(--accent)}@media (max-width: 768px){.secret-page h1{font-size:2rem}.secret-page p{font-size:1rem}.dog-image{width:90%}}:root{--primary: #61dafb;--background: #282c34;--text: #ffffff;--accent: #ff6b6b;--card-bg: #1e1e1e}body{background-color:var(--background);color:var(--text);font-family:Fira Code,monospace;margin:0;padding:0;line-height:1.6}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}.container{max-width:1200px;margin:0 auto;padding:0 20px}html{scroll-behavior:smooth}:root{--mobile: 480px;--tablet: 768px;--desktop: 1024px}