.slide-up{animation:fadeIn .6s ease-in-out}.App{font-family:Montserrat,sans-serif;display:flex;flex-direction:column;align-items:center;background:#121212;min-height:100vh;color:#fff;transition:all .3s ease-in-out;animation:fadeIn 1s ease-in-out}.App-main{margin-top:100px;padding:20px;flex:1;width:90%;text-align:center;background:#ffffff0d;box-shadow:0 4px 10px #ffffff1a;border-radius:10px;transition:all .3s ease-in-out;animation:slideUp .8s ease-in-out}@media (max-width: 1024px){.App-main{max-width:750px;padding:18px}}@media (max-width: 768px){.App-main{max-width:95%;padding:15px;margin-top:80px}}@media (max-width: 480px){.App-main{width:95%;padding:12px;margin-top:70px;font-size:14px}}.header{position:fixed;top:0;left:0;width:100%;height:60px;background:#1a1a1a;color:#fff;display:flex;justify-content:space-between;align-items:center;padding:10px 15px;box-shadow:0 4px 10px #0003;z-index:10000}.header-left-section{display:flex;align-items:center}.header-hamburger{background:none;border:none;color:#fff;font-size:28px;cursor:pointer;transition:color .3s ease-in-out;display:none}.header-hamburger:hover{color:#61dafb}.header-name{font-size:18px;font-weight:700;margin-left:15px;color:#f1f1f1}.header-name-point{color:#61dafb;font-size:20px}.header-right-section{margin-right:80px}.header-right-section .header-nav-menu ul{list-style:none;display:flex;gap:15px;margin:0;padding:0}.header-right-section .header-nav-menu ul li{display:inline}.header-right-section .header-nav-menu ul li a{text-decoration:none;color:#fff;font-size:16px;transition:color .3s ease-in-out}.header-right-section .header-nav-menu ul li a:hover{color:#61dafb}@media (max-width: 1024px){.header{height:55px;padding:8px 12px}.header-hamburger{display:block;font-size:26px}.header-name{font-size:16px}.header-right-section{margin-right:0}.header-right-section .header-nav-menu{display:none}}@media (max-width: 768px){.header{height:50px;padding:6px 10px}.header-name{font-size:14px}.header-hamburger{font-size:24px}.header-right-section{position:absolute;top:60px;left:0;width:100%;background:#1a1a1af2;box-shadow:0 4px 10px #0003;display:none;flex-direction:column;text-align:center;padding:10px 0}.header-right-section.open{display:flex}.header-right-section .header-nav-menu ul{display:flex;flex-direction:column;gap:10px}.header-right-section .header-nav-menu ul li a{font-size:18px;padding:10px;display:block;color:#fff;transition:background .3s ease-in-out,color .3s ease-in-out}.header-right-section .header-nav-menu ul li a:hover{background:#61dafb;color:#fff;border-radius:5px}}@media (max-width: 480px){.header{height:45px;padding:4px 8px}.header-name{font-size:12px}.header-hamburger{font-size:22px}}.aside{position:fixed;top:0;left:-260px;width:260px;height:100vh;background:#222222f2;color:#fff;box-shadow:2px 0 10px #0000004d;transition:left .4s ease-in-out;display:flex;flex-direction:column;padding-top:80px;z-index:1000;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.aside.open{left:0}.aside nav ul{list-style:none;padding:5px 15px}.aside nav ul li{margin:5px 0}.aside nav ul li a{text-decoration:none;color:#fff;font-size:18px;display:block;padding:12px 18px;transition:background .3s ease-in-out,color .3s ease-in-out;border-radius:5px;font-weight:700}.aside nav ul li a:hover{background:#61dafb;color:#fff;box-shadow:0 0 10px #39bee680}@media (max-width: 768px){.aside{width:220px}.aside nav ul li a{font-size:16px;padding:10px}}.footer{background:#1a1a1a;color:#fff;margin-top:35px;padding:0;text-align:center;font-family:Montserrat,sans-serif;z-index:100}.footer-container{display:flex;justify-content:space-around;flex-wrap:wrap;padding:20px;max-width:100%;margin:auto}.footer-section{flex:1;margin:10px;min-width:250px}.footer-section h3{color:#61dafb;margin-bottom:10px}.footer-section p{font-size:14px;color:#ccc}.footer-social-icons{display:flex;justify-content:center;gap:15px;font-size:24px}.footer-social-icons a{color:#fff;transition:color .3s ease-in-out}.footer-social-icons a:hover{color:#61dafb}.footer-bottom{background:#121212;padding:10px;font-size:14px;color:#ccc}@media (max-width: 768px){.footer-container{flex-direction:column;align-items:center}}@keyframes slideUp{0%{transform:translateY(200px);opacity:0}to{transform:translateY(0);opacity:1}}.home{position:relative;display:flex;justify-content:center;align-items:center;height:100vh;text-align:center;color:#fff;animation:fadeIn 1s ease-in-out;background:url(/react-portfolio/assets/background-BbU6r-al.webp) center/cover no-repeat}.home-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#000000b3;z-index:1;pointer-events:none}.home-container{position:relative;max-width:700px;padding:20px;animation:slideUp .8s ease-in-out;z-index:2}.home-profile-pic{width:150px;height:150px;border-radius:50%;object-fit:cover;border:4px solid #61dafb;box-shadow:0 0 15px #61dafb80;transition:transform .3s ease-in-out,box-shadow .3s ease-in-out}.home-profile-pic:hover{transform:scale(1.1);box-shadow:0 0 20px #61dafbcc}.home h1{font-size:42px;font-weight:700;color:#61dafb;margin-bottom:15px;letter-spacing:1.5px}.home p{font-size:18px;color:#b3b3b3;margin-bottom:20px}.home-button-discover{display:inline-block;padding:14px 28px;font-size:18px;font-weight:700;text-decoration:none;background:#61dafb;color:#121212;border-radius:5px;transition:all .3s ease-in-out;box-shadow:0 0 10px #61dafb4d}.home-button-discover:hover{background:#fff;color:#121212;box-shadow:0 0 15px #ffffff80}@media (max-width: 768px){.home h1{font-size:32px}.home p{font-size:16px}.home-profile-pic{width:120px;height:120px}.home-button-discover{font-size:16px;padding:12px 24px}}@media (max-width: 480px){.home h1{font-size:26px}.home p{font-size:14px}.home-profile-pic{width:100px;height:100px}.home-button-discover{font-size:14px;padding:10px 20px}}.services{text-align:center;padding:50px 20px;background:#f8f9fa;color:#121212;border-radius:10px}.services-header h1{font-size:36px;font-weight:700;margin-bottom:10px}.services-header .dot{color:#61dafb}.services-header p{font-size:18px;color:#555}.services-container{display:flex;justify-content:center;gap:20px;margin-top:30px;flex-wrap:wrap}.service-card{width:350px;background:#1a1a1a;color:#fff;border-radius:10px;overflow:hidden;box-shadow:0 4px 15px #0003;transition:transform .3s ease-in-out,box-shadow .3s ease-in-out}.service-card:hover{transform:translateY(-5px);box-shadow:0 6px 20px #0000004d}.service-image{width:100%;height:180px;object-fit:cover}.service-content{padding:20px}.service-category{font-size:14px;font-weight:700;color:#61dafb;text-transform:uppercase}.service-content h2{font-size:22px;font-weight:700;margin:10px 0}.service-content p{font-size:14px;color:#b3b3b3;margin-bottom:15px}.service-button{display:block;width:100%;padding:10px 15px;font-size:16px;font-weight:700;background:#61dafb;color:#121212;border:none;border-radius:5px;cursor:pointer;transition:background .3s ease-in-out,transform .2s ease-in-out}.service-button:hover{background:#fff;color:#1a1a1a;transform:scale(1.05)}.service-link{text-decoration:none;color:inherit}.service-link:hover,.service-link:focus,.service-link:active{text-decoration:none;outline:none}.cta-container{margin-top:40px;padding:20px;background-color:#ff4d4d;text-align:center;border-radius:10px;box-shadow:0 8px 25px #ff4d4d80}.cta-container h2{color:#fff;font-size:24px;font-weight:700;margin-bottom:15px}.cta-button{font-size:18px;font-weight:700;color:#121212;background-color:#fff;border:none;padding:10px 30px;border-radius:5px;cursor:pointer;transition:background-color .3s ease,color .3s ease}.cta-button:hover{background-color:#61dafb;color:#1a1a1a}@media (max-width: 1024px){.services-container{flex-direction:column;align-items:center}.service-card{width:90%;max-width:400px}}.projects{text-align:center;padding:60px 20px;background:#121212;color:#fff}.projects-header h1{font-size:36px;font-weight:700;margin-bottom:10px}.projects-header p{font-size:18px;color:#b3b3b3}.projects-header .dot{color:#61dafb}.projects-container{display:flex;flex-direction:column;gap:50px;margin-top:40px}.project,.project-reverse{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#fff;border-radius:var(--border-radius);box-shadow:0 4px 15px #ffffff1a;padding:30px;transition:transform .3s ease-in-out,box-shadow .3s ease-in-out}.project:hover,.project-reverse:hover{transform:translateY(-5px);box-shadow:0 6px 20px #fff3}.project-image{width:30%;height:auto;border-radius:var(--border-radius);box-shadow:0 4px 10px #fff3;transition:transform .3s,box-shadow .3s}.project-image:hover{transform:scale(1.05);box-shadow:0 6px 15px #ffffff4d}.project-content{width:70%;padding:20px;text-align:left}.project-content h2{font-size:26px;font-weight:700;color:#61dafb;margin-bottom:10px}.project-content p{font-size:16px;color:#5f5f5f;margin-bottom:15px}.project-content a{display:inline-block;padding-top:5px;color:#ffa200;text-decoration:none;font-weight:700;transition:color .3s ease-in-out,text-decoration .3s ease-in-out}.project-content a:hover{text-decoration:underline;color:#fc6}.project-button{display:block;margin-top:15px;padding:12px 24px;font-size:16px;font-weight:700;text-decoration:none;background:#61dafb;color:#121212;border:none;border-radius:5px;cursor:pointer;transition:background .3s ease-in-out,transform .2s ease-in-out}.project-button:hover{background:#fff;color:#121212;transform:scale(1.05)}.project-reverse{flex-direction:row-reverse;text-align:right}.project-reverse .project-content{text-align:left}@media (max-width: 1024px){.project,.project-reverse{flex-direction:column;text-align:center;gap:30px}.project-image{width:100%}.project-content{width:100%;text-align:center}.project-reverse{flex-direction:column}.project-reverse .project-content{text-align:center}.project-button{width:100%;margin-top:15px}}.contact{text-align:center;padding:60px 20px;background:#121212;color:#fff}.contact-container{max-width:600px;margin:auto;padding:30px;background:#ffffff0d;border-radius:var(--border-radius);box-shadow:0 4px 15px #ffffff1a}.contact-container h1{font-size:36px;font-weight:700;margin-bottom:10px}.contact-container .profile-image{width:150px;height:150px;border-radius:50%;object-fit:cover;display:block;margin:0 auto 20px}.contact-container p{font-size:18px;color:#b3b3b3;margin-bottom:20px}.contact-info{display:flex;flex-direction:column;gap:15px;margin-bottom:30px}.contact-info a{display:flex;align-items:center;justify-content:center;gap:10px;color:#ffa200;text-decoration:none;font-size:18px;transition:color .3s ease-in-out}.contact-info a:hover{color:#fc6}.whatsapp-button{background:#25d366;color:#fff!important;font-weight:700;padding:10px 15px;border-radius:5px;text-align:center;display:inline-block;transition:background .3s ease-in-out}.whatsapp-button:hover{background:#1ebe57}.contact-form{display:flex;flex-direction:column;gap:15px}.contact-form input,.contact-form textarea{width:100%;padding:12px;font-size:16px;border:none;border-radius:5px;background:#ffffff1a;color:#fff;resize:none}.contact-form input::placeholder,.contact-form textarea::placeholder{color:#bbb}.contact-form button{padding:12px;font-size:16px;font-weight:700;background:#61dafb;color:#121212;border-radius:5px;border:none;cursor:pointer;transition:background .3s ease-in-out,transform .2s ease-in-out}.contact-form button:hover{background:#fff;color:#121212;transform:scale(1.05)}@media (max-width: 768px){.contact-container{width:90%}}.not-found{min-height:calc(100vh - 160px);position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem;color:#fff;background:radial-gradient(circle at top,#ffffff0f,#000000e6);animation:fadeIn .6s ease-in-out}.not-found h1{font-size:clamp(4rem,10vw,7rem);font-weight:800;margin-bottom:.5rem;letter-spacing:2px}.not-found p{font-size:1.2rem;opacity:.85;margin-bottom:2rem}.not-found-link{display:inline-block;padding:.75rem 1.8rem;color:#00bcd4;border:2px solid #00bcd4;border-radius:30px;font-weight:600;text-decoration:none;transition:all .25s ease}.not-found-link:hover{background-color:#00bcd4;color:#000;transform:translateY(-2px)}@keyframes fadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 480px){.not-found h1{font-size:4rem}.not-found p{font-size:1rem}}*{box-sizing:border-box}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animated-fade-in{animation:fadeIn .7s ease}
