@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600&family=Montserrat:wght@600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Inter:wght@300;400;600&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,sans-serif;color:#333;background-color:#fff;line-height:1.6}h1,h2,h3,h4,h5,h6{font-family:Bebas Neue,sans-serif;letter-spacing:1px;text-transform:uppercase}button,.btn{font-family:Bebas Neue,sans-serif;font-size:18px;text-transform:uppercase;padding:12px 24px;border:none;cursor:pointer;transition:all .3s ease}button:hover,.btn:hover{opacity:.8}a{text-decoration:none;color:inherit}@media (max-width: 768px){h1{font-size:2rem}h2{font-size:1.8rem}body{font-size:16px}}.navbar{position:fixed;top:0;width:100%;background-color:#fffffff2;padding:15px 20px;box-shadow:0 4px 6px #0000001a;z-index:1000;transition:background-color .3s ease,padding .3s ease}.navbar.scrolled{background-color:#ffffffd9;padding:10px 20px}.navbar-container{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto}.logo{font-size:1.8rem;font-weight:700;color:#222;text-decoration:none}.nav-links{display:flex;list-style:none}.nav-links li{margin:0 20px}.nav-links a{font-size:1rem;font-weight:700;color:#222;text-decoration:none;position:relative;padding:5px 0;transition:color .3s ease}.nav-links a:after{content:"";position:absolute;width:100%;height:2px;background-color:#000;bottom:0;left:0;transform:scaleX(0);transform-origin:right;transition:transform .3s ease-in-out}.nav-links a:hover:after{transform:scaleX(1);transform-origin:left}.nav-links a.active{color:#000}.menu-icon{display:none;position:absolute;right:20px;top:20px;z-index:1200;font-size:2rem;cursor:pointer;color:#000;transition:color .3s ease-in-out,transform .3s ease-in-out}@media (max-width: 768px){.nav-links{position:fixed;top:0;right:-100%;width:70vw;height:100vh;background:#000000e6;flex-direction:column;justify-content:center;align-items:center;text-align:center;transition:right .3s ease-in-out}.nav-links.open{right:0}.nav-links li{margin:20px 0}.nav-links a{font-size:1.5rem;color:#fff}.menu-icon{color:#000;display:block}.menu-icon.open{color:#fff;transform:rotate(180deg)}}.hero{display:flex;justify-content:center;align-items:center;height:90vh;background-color:#fff;text-align:center;padding:0 20px}.hero-content{max-width:900px}h1{font-size:3rem;font-weight:700;color:#000;margin-bottom:10px}p{font-size:1.5rem;color:#333;margin-bottom:20px}.cta-button{background-color:transparent;color:#333;border:2px solid #333;padding:10px 20px;text-decoration:none;font-weight:700;transition:all .3s ease}.cta-button:hover{background-color:#333;color:#fff}.social-icons{display:flex;justify-content:center;align-items:center;gap:15px;margin-top:20px}.social-icons .icon{font-size:2.5rem;color:#000;transition:color .3s ease,transform .3s ease}.social-icons .icon:hover{color:#0077b5;transform:scale(1.1)}.social-icons a:first-child .icon:hover{color:#333}.skills-container{display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;margin:50px 0}.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:600px;width:100%}.skill-box{background:#f9f9f9;padding:15px;border-radius:10px;transition:transform .3s ease,box-shadow .3s ease;text-align:center;color:#000}.skill-box:hover{transform:translateY(-5px);box-shadow:0 8px 16px #00000026}.skill-box h3{font-size:1rem;margin-top:10px}.skill-icon{font-size:2rem;color:#333;transition:color .3s ease,transform .3s ease}.skill-box:hover .skill-icon{color:#000;transform:rotate(10deg)}@media (max-width: 768px){.skills-grid{grid-template-columns:1fr;width:80%}}.portfolio{padding:50px;text-align:center;background-color:#fff}.portfolio h2{font-size:2rem;margin-bottom:40px;font-weight:700;color:#333}.portfolio-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.project-card{position:relative;overflow:hidden;border-radius:10px;box-shadow:0 10px 20px #0000001a;transition:transform .5s ease,box-shadow .5s ease}.project-card:hover{transform:scale(1.05);box-shadow:0 15px 30px #0003}.project-image{width:100%;height:auto;object-fit:cover;border-radius:10px}.overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#000000b3;color:#fff;opacity:0;transition:opacity .3s ease;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px}.project-card:hover .overlay{opacity:1}.overlay h3{font-size:1.5rem;margin-bottom:10px}.overlay p{font-size:1rem;margin-bottom:20px;color:#fff}.view-project-btn{background-color:#fff;color:#000;padding:10px 20px;border-radius:5px;text-decoration:none;border:2px solid #fff;transition:.3s}.view-project-btn:hover{background-color:#000;color:#fff}.tech-stack{position:absolute;bottom:10px;left:50%;transform:translate(-50%);display:flex;gap:12px;transition:opacity .3s ease,transform .3s ease}.project-card:hover .tech-stack{opacity:1;transform:translate(-50%) scale(1.1)}.tech-stack svg{font-size:40px;opacity:.8;transition:opacity .3s ease,transform .3s ease}.fa-html5{color:#e44d26}.fa-css3-alt{color:#1572b6}.fa-js-square{color:#f7df1e}.fa-react{color:#61dafb}.fa-wordpress{color:#21759b}.fa-shopify{color:#7ab55c}.faJsSquare{color:#e5c100}.project-card:hover .tech-stack svg{opacity:1;transform:scale(1.2)}.tech-stack i{font-size:25px;color:#fff;opacity:.7;transition:opacity .3s ease,transform .3s ease}.project-card:hover .tech-stack i{opacity:1;transform:scale(1.2)}.project-card{transform-style:preserve-3d;transition:transform .5s ease}.project-card:hover{transform:rotateY(10deg) rotateX(10deg)}@media (max-width: 768px){.portfolio{padding:0}.portfolio-grid{grid-template-columns:1fr}.project-card{width:90vw;max-width:700px;margin:0 auto}.project-image{width:100%;height:auto;max-height:600px;object-fit:contain;border-radius:10px}.overlay{padding:15px}.overlay h3{font-size:1.2rem;margin-bottom:5px}.overlay p{font-size:.9rem;margin-bottom:10px}.view-project-btn{font-size:.9rem;padding:8px 15px}.tech-stack svg{font-size:30px}}.about-me{padding:100px 5%;background-color:#f9f9f9}.about-me-container{display:flex;align-items:center;justify-content:center;max-width:1100px;margin:0 auto;gap:50px}.about-me-image img{width:250px;height:250px;object-fit:cover;object-position:top;border-radius:12px;box-shadow:0 8px 20px #00000026;transition:transform .3s ease-in-out,box-shadow .3s ease-in-out}.about-me-image img:hover{transform:scale(1.05);box-shadow:0 12px 30px #0003}.about-me-content{max-width:600px}.about-me-content h2{font-size:2.5rem;font-weight:700;margin-bottom:10px;line-height:1.2;color:#000}.about-me-content h2 span{font-size:2rem;font-weight:600;color:#222}.about-me-content p{font-size:1.1rem;line-height:1.6;color:#333;margin-bottom:15px}@media (max-width: 768px){.about-me-container{flex-direction:column;text-align:center}.about-me-image img{width:200px;height:200px}.about-me-content h2{font-size:2rem}.about-me-content h2 span{font-size:1.8rem}}.contact{text-align:center;padding:80px 20px;max-width:600px;margin:0 auto}.contact-title{font-size:2rem;font-weight:700;margin-bottom:10px}.contact-subtitle{font-size:1.2rem;color:#555;margin-bottom:30px}.contact-form{display:flex;flex-direction:column;gap:15px}.form-group{display:flex;flex-direction:column;text-align:left}input,textarea{width:100%;padding:12px;font-size:1rem;border:1px solid #ccc;border-radius:5px;outline:none;transition:border-color .3s ease}input:focus,textarea:focus{border-color:#000}.error{border-color:red!important}.error-text{color:red;font-size:.9rem;margin-top:5px}.contact-button{background-color:#000;color:#fff;border:none;padding:12px 20px;font-size:1rem;border-radius:5px;cursor:pointer;transition:background .3s ease}.contact-button:hover{background-color:#333}