@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Preahvihear&display=swap";@import"https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap";@import"https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&display=swap";*{box-sizing:border-box;padding:0;margin:0;font-family:Comfortaa}body{max-width:100vw;margin:0 auto;overflow-x:hidden;color:#fff;background-color:#000}header{width:100%;display:flex;align-items:end;justify-content:center;padding:50px 0;gap:75px;position:absolute;top:0;z-index:4}header a{color:#fff;text-decoration:none;font-weight:700;font-size:20px;line-height:30px;letter-spacing:0%;transition-duration:.3s}header a.active{color:#fe019a}header a.active:before{content:"●";position:relative;bottom:17px;left:50%;transform:translate(-50%);color:#fe019a}header a:hover{color:#fe019a}main{width:100%}main .banner{width:100%;background-color:#121212;display:flex;align-items:center;justify-content:space-between;padding:100px 100px 30px}main .banner .left-side{width:50%}main .banner .left-side h1{display:flex;flex-direction:column;font-weight:800;font-size:44px;line-height:56px;letter-spacing:0%;color:#fe019a}main .banner .left-side h1 span{opacity:60%;font-size:24px;color:#fff}main .banner .left-side h3{margin-top:20px;font-weight:700;font-size:46px;line-height:75px;letter-spacing:0%}main .banner .left-side p{margin-top:15px;font-weight:500;font-size:20px;line-height:30px;letter-spacing:0%;color:#8f8f8f}main .banner .left-side .media{margin-top:30px;display:flex;gap:30px}main .banner .right-side{width:45%}main .banner .right-side img{width:100%}main .about{display:flex;flex-direction:column;align-items:center;justify-content:center;top:90vh;padding:50px 0}main .about h1{font-weight:700;font-size:50px;line-height:55px;letter-spacing:0%;color:#fff;margin-bottom:20px}main .about h1 .line{width:65px;height:5px;border-radius:25px;background-color:#fe019a;margin:0 auto}main .about p{width:65%;font-family:Poppins;font-weight:500;font-size:24px;line-height:35px;letter-spacing:0%;text-align:center;color:#8f8f8f}main .about p span{color:#fe019a}main .about .skils{margin-top:100px;align-items:center;display:flex;gap:30px;flex-direction:column}main .about .skils .dates{width:70%;display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap}main .about .skils .dates .data{width:15%;display:flex;justify-content:center;flex-direction:column;align-items:center;gap:7px}main .about .skils .dates .data img{width:50%}main .about .skils .dates .data p{width:100%;font-size:20px}main .projects{padding:100px 0}main .projects h1{text-align:center;font-weight:700;font-size:50px;line-height:55px;letter-spacing:0%;color:#fff;margin-bottom:40px}main .projects h1 .line{width:65px;height:5px;border-radius:25px;background-color:#fe019a;margin:5px auto 0}main .projects .cards{width:95%;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;margin:0 auto;gap:20px}main .projects .cards .card{background-color:#3a3a3a;padding:10px;border-radius:20px;width:400px}main .projects .cards .card img{object-fit:contain;width:100%}main .projects .cards .card .text{display:flex;justify-content:space-between;padding:10px;align-items:center;height:64px}main .projects .cards .card .text h2{font-weight:700;font-size:18px;line-height:27px;letter-spacing:0%}main .projects .cards .card .text a{padding:10px 30px;font-weight:600;font-size:16px;line-height:24px;letter-spacing:0%;text-decoration:none;color:#000;background-color:#fe019a;border-radius:10px}footer{margin:0 auto;color:#8f8f8f;font-weight:500;font-size:16px;line-height:30px;letter-spacing:0%;background-color:#121212;padding:30px 0;text-align:center}footer span{color:#fe019a;font-weight:800}@media (max-width: 1175px){main .banner .left-side{width:55%}main .banner .left-side h1{font-size:32px;line-height:40px}main .banner .left-side h1 span{font-size:18px}main .banner .left-side h3{font-size:34px;margin-top:10px;line-height:45px}main .banner .left-side p{margin-top:8px;font-size:18px;line-height:24px}main .banner .left-side .media{margin-top:20px;gap:20px}main .banner .left-side .media a{width:40px;height:40px}main .banner .left-side .media a img{width:100%;height:100%}main .banner .right-side{width:40%}main .about h1{font-size:32px}main .about p{font-size:20px;width:80%}main .about .skils{margin-top:50px}main .about .skils .dates{width:90%}main .about .skils .dates .data p{font-size:18px}main .projects h1{font-size:32px}main .projects .cards .card{width:370px}main .projects .cards .card .text h2{font-size:16px}main .projects .cards .card .text a{font-size:14px}}@media (max-width: 855px){main .banner .left-side{width:100%}main .banner .right-side{display:none}main .projects .cards .card{width:400px}main .projects .cards .card img{height:300px}}@media (max-width: 610px){header{gap:35px}header a{font-size:16px}main .banner{padding:100px 20px 20px}main .banner .left-side h1{font-size:24px;line-height:35px}main .banner .left-side h1 span{font-size:16px}main .banner .left-side h3{font-size:26px;line-height:30px}main .banner .left-side p{font-size:16px}main .about h1{font-size:26px;line-height:36px}main .about h1 .line{width:45px}main .about p{font-size:16px;width:100%;line-height:22px;padding:0 20px}main .about .skils .dates{width:100%;padding:0 20px;gap:15px}main .about .skils .dates .data{width:25%;gap:5px}main .about .skils .dates .data img{width:50%;height:50%}main .about .skils .dates .data p{width:100%;font-size:16px;padding:0}main .projects{padding-top:30px}main .projects h1{font-size:26px;line-height:36px}main .projects h1 .line{width:45px}main .projects .cards{width:100%;padding:0 20px;gap:10px}main .projects .cards .card{width:300px}main .projects .cards .card img{height:200px}main .projects .cards .card .text h2{font-size:14px}main .projects .cards .card .text a{font-size:14px;padding:10px 15px}footer{font-size:12px}}