.water-drop-loader{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#0a0a0a;z-index:9999;display:flex;justify-content:center;align-items:flex-start;overflow:hidden}.water-drop-loader .drop{width:20px;height:20px;background-color:#fff;border-radius:0 50% 50%;transform:rotate(45deg);position:absolute;left:50%;margin-left:-10px}.water-drop-loader .ripple{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:20px;height:20px;border-radius:50%;border:2px solid #fff;pointer-events:none}.app-content{width:100%;min-height:100vh;position:relative}html{scroll-behavior:smooth}.hero{height:100vh;display:flex;align-items:center;justify-content:center;padding-top:60px}.hero .hero-content{display:flex;align-items:center;justify-content:space-between;width:100%}@media(max-width:768px){.hero .hero-content{flex-direction:column-reverse;text-align:center;gap:40px}}.hero .text-content{flex:1}.hero .text-content .greeting{font-size:14px;letter-spacing:4px;margin-bottom:20px;color:#fff}.hero .text-content h1{display:flex;flex-direction:column;font-size:80px;line-height:.9;font-weight:900;margin-bottom:8px}@media(max-width:768px){.hero .text-content h1{font-size:48px;align-items:center}}.hero .text-content h1 .first-name{color:#fff}.hero .text-content h1 .last-name{color:#27272a;-webkit-text-stroke:1px #52525b;color:#52525b}.hero .text-content .role{font-size:24px;font-weight:700;letter-spacing:2px;color:#a1a1aa;margin-bottom:32px;display:inline-block;width:fit-content;border-bottom:1px solid #27272a;padding-bottom:4px}.hero .text-content .welcome{font-size:12px;letter-spacing:4px;color:#52525b;text-transform:uppercase}.hero .image-content{flex:1;display:flex;justify-content:flex-end;position:relative;transition:filter .4s ease}@media(max-width:768px){.hero .image-content{justify-content:center}}.hero .image-content img{max-width:400px;width:100%;height:auto;border-radius:10px;box-shadow:0 0 80px -10px #aaa9ff40;filter:contrast(1.1);transition:box-shadow .5s ease,transform .3s ease,filter .4s ease;transition:box-shadow .5s ease,transform .3s ease}.hero .image-content img:hover{transform:scale(1.02);box-shadow:0 0 100px -10px #1f29b6c2}.about{min-height:100vh;display:flex;align-items:center;justify-content:center;background-color:#0d0d0d}.about h2{font-size:48px;margin-bottom:24px;letter-spacing:-2px}.about p{max-width:600px;color:#a1a1aa;font-size:18px;line-height:1.6;margin-bottom:48px}.about .about-content{display:grid;grid-template-columns:1fr 1fr;gap:64px;width:100%}@media(max-width:768px){.about .about-content{grid-template-columns:1fr}}.about h3{font-size:24px;margin-bottom:24px;border-bottom:1px solid #27272a;padding-bottom:8px;display:inline-block}.about .icons{display:flex;gap:24px}.about .icons .social-icon{font-size:24px;color:#fff;transition:transform .3s,color .3s}.about .icons .social-icon:hover{color:#a1a1aa;transform:translateY(-4px)}.about .tech-stack-card{background:#121214;padding:32px;border-radius:12px;border:1px solid #27272a}.about .tech-stack-card .tech-icons{display:flex;flex-wrap:wrap;gap:24px;justify-content:center}.about .tech-stack-card .tech-icons .tech-icon{font-size:32px;filter:grayscale(100%);transition:filter .3s ease,transform .3s ease;cursor:pointer;display:flex;align-items:center;justify-content:center}.about .tech-stack-card .tech-icons .tech-icon:hover{filter:grayscale(0%);transform:scale(1.1)}.projects{min-height:100vh;padding:120px 0;background-color:#0a0a0a}.projects h2{font-size:48px;margin-bottom:64px;letter-spacing:-2px;text-align:center}.projects .projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:32px}.projects .project-card{background:#000;border:1px solid #27272a;border-radius:12px;overflow:hidden;transition:transform .3s}.projects .project-card:hover{transform:translateY(-8px)}.projects .project-card .card-image{height:200px;overflow:hidden}.projects .project-card .card-image img{width:100%;height:100%;object-fit:cover;opacity:.7;transition:opacity .3s}.projects .project-card .card-image img:hover{opacity:1}.projects .project-card .card-content{padding:24px}.projects .project-card .card-content h3{margin-bottom:12px;font-size:20px}.projects .project-card .card-content p{color:#a1a1aa;font-size:14px;margin-bottom:24px;line-height:1.5}.projects .project-card .card-content .btn-container{display:flex;justify-content:flex-start}.projects .project-card .card-content .btn-project{display:inline-block;padding:12px 24px;background:#fff;color:#000;font-weight:700;text-transform:uppercase;font-size:12px;letter-spacing:1px;border-radius:4px;position:relative;z-index:1;overflow:hidden;transition:color .3s}.projects .project-card .card-content .btn-project:before{content:"";position:absolute;top:0;left:0;width:0%;height:100%;background:linear-gradient(90deg,#a1a1aa,#fff);z-index:-1;transition:width .4s ease}.projects .project-card .card-content .btn-project:hover:before{width:100%}.navbar{position:fixed;top:0;left:0;width:100%;padding:20px 0;z-index:100;background:#0a0a0acc;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.navbar ul{display:flex;justify-content:center;list-style:none;gap:32px}.navbar ul li a{font-size:14px;text-transform:uppercase;letter-spacing:2px;color:#a1a1aa;transition:color .3s}.navbar ul li a:hover{color:#fff}*{margin:0;padding:0;box-sizing:border-box}body{background-color:#0a0a0a;color:#fff;font-family:Inter,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}a{text-decoration:none;color:inherit}button{cursor:pointer;border:none;outline:none;font-family:inherit}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#0a0a0a}::-webkit-scrollbar-thumb{background:#fff;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#3f3f3f}.container{max-width:1200px;margin:0 auto;padding:0 16px}
