*{margin:0;padding:0;box-sizing:border-box;z-index:1}body{font-family:Roboto,sans-serif;color:#fff;background-color:#0d0f1f;line-height:1.6}a{text-decoration:none;color:#4ecca3}a:hover{color:#76d7b8}.app{position:relative;min-height:100vh;width:100vw;display:flex;flex-direction:column;justify-content:space-between}.header{background:linear-gradient(135deg,#14141ee6,#000c);color:#e0e0e0;padding:.7rem 1.5rem;display:flex;justify-content:center;align-items:center;position:relative;z-index:10}.nav{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:1200px}.logo{font-size:1.7rem;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:1px;transition:color .3s;cursor:pointer}.logo:hover{color:#0af}.nav-links{list-style:none;display:flex;gap:1.5rem}.nav-links li a{color:inherit;text-decoration:none;font-size:1.1rem!important;font-weight:500;position:relative;transition:color .3s;text-transform:lowercase}.nav-links li a:hover{color:#0af}.nav-links li a:before{content:"";position:absolute;bottom:-2px;left:0;width:0;height:2px;background:linear-gradient(90deg,#0af,#036);transition:width .3s}.nav-links li a:hover:before{width:100%}.menu-icon{display:none}@media (max-width: 768px){.nav{position:relative}.nav-links{display:none;flex-direction:column;gap:1rem;background:#14141ef2;width:100%;padding:1rem 0;position:absolute;top:100%;left:0}.nav-links:first-of-type{margin-bottom:1rem;padding-bottom:1rem;border-radius:10px 10px 0 0;border-right:1px solid rgba(255,255,255,.1)}.nav-links:last-of-type{border-bottom:1px solid rgba(255,255,255,.1);border-right:1px solid rgba(255,255,255,.1);margin-top:5.8rem;border-radius:0 0 10px 10px;background:#14141ee6}.nav-links li{margin-left:8px!important}.nav-links.active{display:flex}.menu-icon{display:flex;flex-direction:column;cursor:pointer;font-size:1.5rem;color:#0af;transition:transform .3s ease}}.footer{background:linear-gradient(180deg,#0d0f1f,#1b1d36);color:#e0e0e0;padding:2rem 1rem;text-align:center;position:relative;z-index:1;box-shadow:0 -4px 10px #00000080;font-family:Roboto,sans-serif}.footer p{font-size:1rem;color:#a0a0a0;margin-right:auto;margin-left:auto;transition:color .3s ease-in-out,text-shadow .3s ease-in-out;width:fit-content}.footer p:hover{color:#fff;text-shadow:0 0 5px #00aaff,0 0 10px #00d4ff}.footer:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:80%;height:3px;background:linear-gradient(90deg,#0af,#00d4ff);border-radius:3px;animation:pulse 3s infinite ease-in-out}@keyframes pulse{0%,to{transform:translate(-50%) scaleX(1);opacity:1}50%{transform:translate(-50%) scaleX(.9);opacity:.8}}.footer:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:40%;height:5px;background:radial-gradient(circle,rgba(0,255,255,.2),transparent);border-radius:50%;pointer-events:none}@media (max-width: 768px){.footer{padding:1.5rem 1rem}.footer:before{width:90%}.footer:after{width:50%}.footer p{font-size:.9rem}}.modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#0009;display:flex;justify-content:center;align-items:center;z-index:1000}.modal .modal-content{background:#1b1d36;border-radius:15px;padding:2rem;width:90%;max-width:500px;color:#fff;text-align:left;box-shadow:0 4px 15px #00000080;position:relative;animation:fadeIn .3s ease-in-out}.modal .modal-content h2{font-size:2rem;margin-bottom:1rem;color:#0db9e9}.modal .modal-content p{font-size:1rem;margin-bottom:1rem}.modal .modal-content strong{font-weight:700;color:#0db9e9}.modal .modal-content .modal-close-button{position:absolute;top:10px;right:10px;background:#0db9e9;border:none;border-radius:5px;color:#fff;font-size:1rem;padding:.5rem 1rem;cursor:pointer;transition:background .3s ease}.modal .modal-content .modal-close-button:hover{background:#0b7f9e}.projects{padding:4rem 2rem;background:linear-gradient(180deg,#0d0f1f,#1b1d36);color:#fff;min-height:calc(100vh - 66px);width:100vw}.projects h2{text-align:center;font-size:2.5rem;margin-bottom:2rem}.projects button{cursor:pointer}.projects .projects-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;justify-content:center}.projects .project-card,.projects .skeleton-card{background-color:#1b1d36;padding:1.5rem;border-radius:10px;text-align:center;box-shadow:0 4px 8px #0003;transition:transform .3s}.projects .project-card:hover{transform:translateY(-5px)}.projects h3{font-size:1.5rem;margin-bottom:1rem;color:#0cf}.projects p{font-size:1rem}.projects .btn-primary{margin-top:1rem;display:inline-block;padding:.5rem 1rem;color:#fff;background-color:#0af;border:none;border-radius:5px;text-decoration:none;font-size:1rem;transition:background-color .3s}.projects .btn-primary:hover{background-color:#07c}.projects .skeleton{background:linear-gradient(90deg,#ffffff1a 25%,#fff3,#ffffff1a 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:10px}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.projects .skeleton-title{height:20px;width:70%;margin:0 auto 1rem}.projects .skeleton-text{height:15px;width:90%;margin:.5rem auto}.projects .skeleton-button{height:35px;width:50%;margin:1rem auto 0}.modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:#1b1d36;animation:fadeIn .3s ease-in-out;padding:2.5rem;border-radius:10px;text-align:center;color:#fff;max-width:500px;width:90%;box-shadow:0 4px 8px #0003}.modal-content h3{margin-bottom:1.5rem;font-size:1.8rem;color:#0cf}.modal-content p{font-size:1rem;line-height:1.5;margin-bottom:1rem}.modal-content a{color:#0af;text-decoration:underline;word-break:break-word}.modal-content .btn-primary{margin-top:1.5rem;padding:.8rem 1.2rem}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@media screen and (max-width: 600px){.modal-content{padding:1.5rem;width:90%;max-width:400px;max-height:90vh}.modal-content .btn-primary{margin-top:0}.modal-content p{margin-bottom:.5rem}}@media screen and (max-width: 768px){.modal-content{padding:2rem;max-width:600px}}.home .hero{height:calc(100vh - 66px);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:linear-gradient(135deg,#0d0f1f,#1b1d36);color:#fff;padding:0 2rem;animation:fadeIn 1s ease-out}.home .hero h1{font-size:3rem;margin-bottom:1rem;text-shadow:2px 2px 6px rgba(0,0,0,.4)}.home .hero p{font-size:1.2rem;text-shadow:1px 1px 4px rgba(0,0,0,.3)}.home .hero p .highlight{color:#0db9e9;font-weight:700}.home .hero .cta-buttons{margin-top:2rem}.home .hero .cta-buttons .btn-primary,.home .hero .cta-buttons .btn-secondary{display:inline-block;margin:0 1rem;padding:.8rem 1.5rem;text-decoration:none;border-radius:5px;font-weight:700;transition:all .3s ease}.home .hero .cta-buttons .btn-primary{background-color:#0db9e9;color:#0d0f1f}.home .hero .cta-buttons .btn-primary:hover{background-color:#0b7f9e;transform:scale(1.05);box-shadow:0 4px 10px #0003}.home .hero .cta-buttons .btn-secondary{background-color:#1b1d36;border:2px solid #0db9e9;color:#0db9e9}.home .hero .cta-buttons .btn-secondary:hover{background-color:#0db9e9;color:#1b1d36;transform:scale(1.05);box-shadow:0 4px 10px #0003}@media (max-width: 768px){.home .hero{height:auto;padding:4rem 1rem}.home h1{font-size:2.5rem}.home p{font-size:1rem}.home .cta-buttons{margin-top:1.5rem}.home .cta-buttons .btn-primary,.home .cta-buttons .btn-secondary{padding:.6rem 1.2rem;width:100%;font-size:1rem;margin-left:0!important}.home .cta-buttons .btn-secondary{margin-top:10px!important}}.about{padding:4rem 2rem;background:linear-gradient(180deg,#0d0f1f,#1b1d36);color:#e6e6e6;min-height:calc(100vh - 66px);display:flex;justify-content:center;align-items:center;flex-direction:column}.about h2{position:relative;margin-bottom:2rem;text-align:center;font-size:2.5rem;color:#fff}.about .about-content{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:1rem;max-width:1000px}.about .conversation{display:flex;flex-direction:column;gap:1rem;align-items:flex-start;max-width:80%}.about .bubble{position:relative;padding:1rem;border-radius:15px;max-width:75%;font-size:1rem;line-height:1.6;background:#333;margin-bottom:1rem;box-shadow:0 2px 10px #0003;transition:all .3s ease}.about .bubble:hover{box-shadow:0 6px 15px #0000004d;transform:translateY(-5px)}.about .bubble.left{background:#374355;align-self:flex-start}.about .bubble.left:after{content:"";position:absolute;left:-10px;top:50%;width:0;height:0;border-top:10px solid transparent;border-right:10px solid #374355;border-bottom:10px solid transparent;transform:translateY(-50%)}.about .bubble.left .highlight{color:#19faff}.about .bubble.right{background:#0db9e9;align-self:flex-end}.about .bubble.right:after{content:"";position:absolute;right:-10px;top:50%;width:0;height:0;border-top:10px solid transparent;border-left:10px solid #0db9e9;border-bottom:10px solid transparent;transform:translateY(-50%)}.about .bubble.right .highlight{color:#374355}.about .highlight{font-weight:700;color:#19faff}.contact{padding:4rem 2rem;background:linear-gradient(180deg,#0d0f1f,#1b1d36);color:#fff;min-height:calc(100vh - 66px);display:flex;margin-top:10rem;align-items:center;flex-direction:column;text-align:center}.contact h1{font-size:3rem;margin-bottom:1rem;color:#fff}.contact p{font-size:1.2rem;margin-bottom:2rem;color:#d3d3d3}.contact .social-links{display:flex;gap:2rem;justify-content:center;align-items:center;flex-wrap:wrap}.contact .social-links .social-link{display:flex;align-items:center;text-decoration:none;font-size:1.3rem;color:#fff;border-radius:5px;padding:.8rem 1.5rem;background-color:#0db9e9;transition:all .3s ease;margin:10px;width:200px;justify-content:center;text-align:center}.contact .social-links .social-link:hover{background-color:#0b7f9e;transform:translateY(-5px)}.contact .social-links .social-link .social-icon{margin-right:10px;font-size:1.5rem}.skills{padding:4rem 2rem;background:linear-gradient(180deg,#0d0f1f,#1b1d36);color:#fff;min-height:calc(100vh - 66px);display:flex;align-items:center;flex-direction:column;text-align:center}.skills h1{font-size:3rem;margin-bottom:2rem;color:#fff}.skills .skills-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:2rem;max-width:1000px;width:100%}.skills .skill{background-color:#0db9e9;border-radius:15px;padding:1rem;text-align:center;transition:transform .3s ease,background-color .3s ease;color:#fff;cursor:pointer}.skills .skill:hover{background-color:#0b7f9e;transform:translateY(-5px)}.skills .skill .skill-icon{font-size:3rem;margin-bottom:1rem}.skills .skill p{font-size:1.2rem;font-weight:700}.skills .skill-description{margin-top:2rem;background-color:#1b1d36;padding:2rem;border-radius:15px;max-width:800px;width:100%;text-align:left;box-shadow:0 4px 10px #0000004d}.skills .skill-description h2{font-size:2rem;margin-bottom:1.5rem;color:#0db9e9}.skills .skill-description p{font-size:1rem;margin-bottom:1rem}.skills .skill-description strong{font-weight:700;color:#0db9e9}