@import"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Poppins,sans-serif;background:linear-gradient(to right,#f9f9f9,#f3f0ff,#f9f9f9)}html.dark body{background:linear-gradient(to right,#121130,#1e1d4b,#121130)}.hero{width:100%;display:flex;justify-content:space-between;align-items:center;text-align:left;padding:0 8vw;overflow:hidden;position:relative}.text-container{flex:1;max-width:50%}.text-container span{font-size:2.5rem;color:#232155;display:block;margin-bottom:10px}html.dark .text-container span{color:#f9f9f9}.text-container h1{font-size:4rem;color:#3931e1;margin-bottom:30px;line-height:1.2}html.dark h1{color:#f9f9f9}.text-container p{color:#4a4b6d;margin-bottom:20px}html.dark .text-container p{color:#f9f9f9}.btn{background-color:#3931e1;padding:15px 50px;border-radius:6px;color:#fff;cursor:pointer;text-decoration:none;font-size:1.2rem;transition:background-color .3s ease,transform .3s ease;display:inline-block;margin-top:20px}.btn:hover{opacity:.9;transform:translateY(-3px)}.image-container{flex:1;display:flex;justify-content:center;align-items:center}.image-container img{width:80%;height:auto;position:relative;z-index:1;margin-left:100px}.circle-bg{position:absolute;width:400px;height:400px;background-color:#3931e1;border-radius:50%;z-index:0}@media (max-width: 768px){.hero{flex-direction:column;text-align:center;height:auto;padding-top:50px}.text-container{max-width:100%}.image-container{display:none}}.home{margin-top:80px}body{display:flex;justify-content:center}.about-details{width:100%;display:flex;align-items:center;justify-content:space-between;padding:0 8vw;margin-top:50px;overflow:hidden}.about-details img{width:40%;max-width:350px;z-index:1;border-radius:30px}.about-infos{flex:1;max-width:50%;text-align:left}.about-infos h1{font-size:3rem;color:#232155;margin-bottom:20px}.about-infos p{color:#4a4b6d;line-height:1.6;margin-bottom:20px}html.dark .about-infos p{color:#e0e0e0}.experience-section{display:flex;justify-content:center;align-items:center;gap:30px;margin-top:20px}.circle-bg{max-width:550px;max-height:550px}.experience{text-align:center}.experience i{font-size:2rem;color:#3931e1;margin-bottom:10px}.experience span{font-size:2rem;font-weight:700;color:#3931e1}.experience p{color:#4a4b6d;margin-top:5px}html.dark .experience p{color:#e0e0e0}@media (max-width: 768px){.about-details{flex-direction:column;align-items:center;padding-top:50px}.circle-bg{width:200px;height:200px}.about-details img{width:60%;margin-bottom:20px}.about-infos{text-align:center;max-width:100%}.about-infos h1{font-size:2.5rem}}.skills{text-align:center;margin-top:50px;padding:0 8vw}.skills h1{font-size:3rem;font-weight:700;color:#232155}.skills .skills-base{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));grid-gap:1rem;margin-top:50px}.skills .skills-base .skills-box{text-align:start;border:1px solid #ccc;padding:35px 10px;text-align:center;box-shadow:0 4px 6px #0000001a;border-radius:10px}html.dark .skills .skills-base .skills-box{border:1px solid #49478d}.skills .skills-base .skills-box i{font-size:2.3rem;color:#3931e1}.skills .skills-base .skills-box h3{font-size:1.2rem;font-weight:600;padding:13px 0 7px;color:#232155}html.dark .skills .skills-base .skills-box h3{color:#e8e6f3}.skills .skills-base .skills-box p{font-weight:400;color:#4a4b6d}html.dark .skills .skills-base .skills-box p{color:#f9f9f9}.portfolio{text-align:center;margin-top:50px;padding:0 8vw}.portfolio h1{font-size:3rem;font-weight:700;color:#232155;margin-bottom:40px}.portfolio-container{display:grid;grid-template-columns:1fr;gap:20px}.portfolio-card{display:flex;border-radius:10px;border:1px solid #ccc;overflow:hidden;box-shadow:0 4px 6px #0000001a;transition:transform .3s ease}html.dark .portfolio-card{border:1px solid #49478d;background-color:#232155}.portfolio-image{width:50%;object-fit:cover}.portfolio-content{width:50%;padding:20px;display:flex;flex-direction:column;justify-content:space-between}.portfolio-content h3{font-size:1.2rem;color:#232155;font-weight:600}html.dark .portfolio-content h3{color:#e0e0e0}.portfolio-content p{font-weight:400;color:#4a4b6d}html.dark .portfolio-content p{color:#e0e0e0}.demo-button{display:inline-block;padding:10px 15px;background-color:#3931e1;color:#fff;text-align:center;border-radius:5px;text-decoration:none;transition:background .3s ease}.demo-button:hover{opacity:.9}@media (min-width: 768px){.portfolio-container{grid-template-columns:1fr 1fr}}@media (max-width: 600px){.portfolio-card{flex-direction:column}.portfolio-image,.portfolio-content{width:100%}}.contact{padding:0vw 8vw;text-align:center;margin-top:50px}.contact h1{font-size:3rem;font-weight:700;color:#232155;margin-bottom:40px}html.dark .contact h1{color:#fff}.contact-container{display:flex;flex-wrap:wrap;margin:auto;box-shadow:0 4px 10px #0000001a;border-radius:8px;overflow:hidden}.contact-info{background:#3931e1;color:#fff;padding:40px;flex:1;text-align:center;display:flex;align-items:center;justify-content:center;min-width:300px}.info-content{width:100%}.icon{font-size:60px;margin-bottom:15px}.contact-info p{font-size:16px;margin:10px 0}.contact-info i{margin-right:10px}.contact-form{flex:1;padding:40px;display:flex;flex-direction:column;justify-content:center;min-width:300px;border:1px solid #ccc}html.dark .contact-form{border:1px solid #49478d}.contact-form h2{margin-bottom:20px;font-size:24px;color:#232155}html.dark h2{color:#fff}.contact-form form{display:flex;flex-direction:column}.contact-form input,.contact-form textarea{width:100%;padding:12px;margin:10px 0;border:1px solid #ddd;border-radius:5px;font-size:16px;outline:none}html.dark .contact-form input{background-color:#232155;border:1px solid #49478d;color:#fff}.contact-form textarea{height:100px;resize:none}html.dark .contact{background-color:#232155;border:1px solid #49478d;color:#fff}.contact-form button{display:inline-block;padding:10px 15px;background:#3931e1;color:#fff;text-align:center;border-radius:5px;text-decoration:none;transition:background .3s ease;border:none;cursor:pointer;font-size:16px}.contact-form button:hover{opacity:.9}@media (max-width: 768px){.contact-container{flex-direction:column}.contact-info,.contact-form{min-width:100%}.contact-info{border-radius:8px 8px 0 0}.contact-form{border-radius:0 0 8px 8px}}nav{position:fixed;top:0;width:100%;display:flex;flex-direction:row;justify-content:space-between;padding:1vw 8vh;align-items:center;z-index:999;box-shadow:0 1px 3px #0000001a;background:linear-gradient(to right,#f9f9f9,#f3f0ff,#f9f9f9)}html.dark nav{background:linear-gradient(to right,#121130,#1e1d4b,#121130);box-shadow:0 1px 3px #ffffff1a}nav ul.active{right:0}nav img{width:150px}nav ul{display:flex;list-style:none;margin:0;padding:0}nav ul li{margin-right:20px;padding:0 20px}nav ul li a{text-decoration:none;color:#232155;font-size:1rem;position:relative;transition:color .3s ease}html.dark nav ul li a{color:#fff}nav ul li a:after{content:"";width:0;height:3px;background:#3931e1;position:absolute;left:0;bottom:-6px;transition:width .5s ease}nav ul li a:hover:after{width:100%}nav .fa-solid{display:none}@media (max-width: 768px){nav .fa-solid{display:block;font-size:25px}nav ul{background:#3934e1;position:fixed;color:#fff;top:0;right:-100%;width:200px;height:100vh;padding-top:50px;z-index:2;transition:right .5s;display:flex;flex-direction:column;gap:20px;align-items:center}nav ul li{display:block;margin:25px}nav ul li a{color:#fff}nav ul li a:hover{opacity:.8}nav ul .fa-solid{position:absolute;top:25px;left:25px;cursor:pointer}nav ul .fa-bars{color:#232155}html.dark .fa-bars{color:#fff}}.theme-toggle-button{display:flex;align-items:center;padding:10px 15px;background-color:#3931e1;color:#fff;border-radius:8px;font-size:20px;cursor:pointer;transition:background-color .3s,color .3s;border:none}.theme-toggle-button:hover{opacity:.8}footer{background:linear-gradient(to right,#121130,#1e1d4b,#121130);padding:20px 8vw;color:#fff;margin-top:50px;text-align:center}.social-icons{display:flex;justify-content:center;gap:15px;margin:15px 0}.social-icons a{color:#fff;font-size:20px;transition:transform .3s ease,color .3s ease}.social-icons a:hover{transform:scale(1.2);color:#3931e1}@media (max-width: 600px){.social-icons{gap:10px}.social-icons a{font-size:18px}}