@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Inika:wght@400;700&family=Lugrasimo&family=Mochiy+Pop+One&family=Montserrat+Alternates: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=Montserrat: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=Nerko+One&family=Poppins:wght@100;200;300;400;500;600;700;800;900&family=Potta+One&family=Righteous&family=Roboto: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&display=swap";.left-nav{position:fixed;top:0;left:0;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;width:20vw;min-width:220px;max-width:300px;height:100vh;background-color:#e2b430;box-shadow:4px 0 25px #00000040;z-index:900;transition:all .3s ease}@media(max-width:768px){.left-nav{position:relative;width:100vw;height:fit-content;background-color:#272727;max-width:1080px}}@media(max-width:300px){.left-nav{width:100vw;max-width:1080px;position:relative;background-color:#272727}}.left-nav .fotoku{width:100%;background-color:#272727;padding:25px;display:flex;justify-content:center;align-items:center;box-sizing:border-box;border-bottom:4px solid rgba(226,180,48,.4)}.left-nav .fotoku img{width:calc(20vw - 50px);height:auto;max-width:210px;border-radius:12px;cursor:pointer;transition:transform .3s ease,box-shadow .3s ease}.left-nav .fotoku img:hover{transform:scale(1.05);box-shadow:0 10px 20px #0006}@media(max-width:768px){.left-nav .fotoku img{width:100%;height:auto;max-width:1080px}}@media(max-width:300px){.left-nav .fotoku img{width:100%;height:auto;max-width:1080px}}.left-nav ul{flex:1;padding:30px 0;list-style:none;width:100%;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:15px;margin:0;box-sizing:border-box;background-color:#e2b430}@media(max-width:768px){.left-nav ul{display:none}}@media(max-width:300px){.left-nav ul{display:none}}.left-nav ul li{text-align:center;width:100%;padding:12px 0;transition:all .3s ease;cursor:pointer}.left-nav ul li span,.left-nav ul li a{color:#272727;font-weight:600;font-size:1.1rem;text-decoration:none;transition:color .3s ease}.left-nav ul li:hover{background-color:#cd9f1d;transform:translate(5px)}.left-nav ul li:hover span,.left-nav ul li:hover a{color:#fff}.left-nav ul li.active{background-color:#272727}.left-nav ul li.active span,.left-nav ul li.active a{color:#fff;font-weight:700}.left-nav .popup-overlay{position:fixed;inset:0;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s ease-in-out}.left-nav .popup-overlay .popup-content{position:relative;background-color:transparent;border-radius:10px;overflow:hidden;animation:scaleIn .3s ease-in-out}.left-nav .popup-overlay .popup-content img{width:60vw;max-width:600px;border-radius:10px;display:block;box-shadow:0 8px 25px #0006}.left-nav .popup-overlay .popup-content .close-btn{position:absolute;top:10px;right:10px;background-color:#e2b430;border:none;color:#fff;font-size:1.2rem;border-radius:50%;width:32px;height:32px;cursor:pointer;transition:background-color .2s ease,transform .2s ease}.left-nav .popup-overlay .popup-content .close-btn:hover{background-color:#272727;transform:rotate(90deg)}.left-nav .kontak{margin-top:auto;width:100%;padding:20px;background-color:#c4981b;text-align:center;color:#272727;font-weight:600;border-top:3px solid rgba(39,39,39,.3)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.right-nav{position:fixed;right:20px;top:50%;transform:translateY(-50%);z-index:1000;height:auto;background:#e2b4301a;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-radius:50px;box-shadow:0 8px 25px #00000040;transition:all .3s ease}.right-nav:hover{background:#e2b43040;box-shadow:0 10px 35px #00000059;transform:translateY(-50%) scale(1.03)}.right-nav ul{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px;padding:10px;box-sizing:border-box;margin:0}.right-nav ul li{padding:15px;background-color:#272727;border-radius:50%;list-style:none;box-shadow:0 5px 12px #00000040;cursor:pointer;transition:transform .3s ease,background-color .3s ease}.right-nav ul li:hover{transform:translateY(-3px) scale(1.1);background-color:#e2b430}.right-nav ul li img{width:25px;height:auto}@media(max-width:768px){.right-nav{inset:auto 0 50px;width:90vw;margin:auto;padding:10px;box-sizing:border-box;height:fit-content;transform:none;border-radius:300px;box-shadow:0 -5px 20px #00000040;background:#e2b43026}.right-nav ul{flex-direction:row;justify-content:space-around;align-items:center;width:100%;padding:10px 0;gap:10px}.right-nav ul li{padding:10px;width:fit-content;height:fit-content}.right-nav ul li img{width:22px}}@media(max-width:300px){.right-nav{inset:auto 0 50px;width:100vw;transform:none;border-radius:0;background:#e2b43040}.right-nav ul{flex-direction:row;justify-content:space-evenly;align-items:center;gap:5px;padding:8px 0}.right-nav ul li{padding:10px;width:fit-content;height:fit-content}.right-nav ul li img{width:22px}}.sosmed-container{display:flex;justify-content:flex-start;width:fit-content;gap:10px}.sosmed-container a img{width:100%;max-width:35px}.sosmed-container a img:hover{transform:scale(1.25)}.home{display:flex;flex-direction:column;justify-content:center;min-height:100vh;max-width:1000px;box-sizing:border-box;gap:50px}@media(max-width:768px){.home{padding:20px}}.home .about{display:flex;flex-direction:column;gap:20px;width:100%;box-sizing:border-box}.home .about h1{font-size:5rem;font-weight:800;margin:0}.home .about h2{font-weight:500;font-size:1.5rem;margin:0}.home .about p{font-size:1 rem;text-align:justify}.home .pendidikan{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px}.home .pendidikan h1{font-size:2rem;text-align:center}.home .pendidikan .logo-container{display:flex;justify-content:center;align-items:center;width:100%;flex-wrap:wrap;gap:50px;box-sizing:border-box}.home .pendidikan .logo-container img{height:50px;width:auto;transition:transform .3s ease,box-shadow .3s ease}.home .pendidikan .logo-container img:hover{transform:scale(1.5);background-color:#eff1f3;padding:10px;border-radius:10px;box-shadow:0 10px 25px #0000004d;z-index:2}.services{display:flex;flex-direction:column;max-width:1000px;box-sizing:border-box;gap:50px;padding:10vh;justify-content:flex-start;min-height:100vh}@media(max-width:768px){.services{padding:20px}}.services .list-layanan-container{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:5px}.services .list-layanan-container .layanan-jenis{display:flex;padding:5px 20px;box-sizing:border-box;background-color:#272727;justify-content:center;align-items:center;border-radius:15px;color:#fff;gap:10px;cursor:pointer}@media(max-width:768px){.services .list-layanan-container .layanan-jenis{padding:20px;border-radius:300px}}.services .list-layanan-container .layanan-jenis p{font-size:.8rem;font-weight:600}@media(max-width:768px){.services .list-layanan-container .layanan-jenis p{display:none}}.services .list-layanan-container .layanan-jenis img{height:25px;width:auto}.services .list-layanan-container .layanan-jenis{transition:transform .3s ease,box-shadow .3s ease}.services .list-layanan-container .layanan-jenis:hover{transform:scale(1.03);box-shadow:0 10px 25px #0000004d;z-index:2}.services .list-layanan-container .active{background-color:#e2b430;color:#272727}.services .isi-layanan{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px}.services .isi-layanan h1,.services .isi-layanan h2{font-size:3rem;font-weight:700;margin:0;text-align:center}.services .isi-layanan h2{font-size:1.5rem}.services .isi-layanan p{text-align:justify;font-size:1rem}.services .isi-layanan .techstack-container{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:20px}.services .isi-layanan .techstack-container img{height:35px;width:auto;transition:transform .3s ease,box-shadow .3s ease}.services .isi-layanan .techstack-container img:hover{transform:scale(1.5);background-color:#eff1f3;padding:10px;border-radius:10px;box-shadow:0 10px 25px #0000004d;z-index:2}.portfolio{display:flex;flex-direction:column;max-width:1000px;gap:50px;padding:10vh;justify-content:flex-start;min-height:100vh;box-sizing:border-box}.portfolio h2{text-align:center}@media(max-width:768px){.portfolio{width:100vw;margin:0;padding:0;gap:10px}}.portfolio .list-layanan-container{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:5px}@media(max-width:768px){.portfolio .list-layanan-container{width:80vw;margin:auto}}.portfolio .list-layanan-container .layanan-jenis{display:flex;padding:5px 20px;box-sizing:border-box;background-color:#272727;justify-content:center;align-items:center;border-radius:15px;color:#fff;gap:10px;cursor:pointer}@media(max-width:768px){.portfolio .list-layanan-container .layanan-jenis{padding:20px;border-radius:300px}}.portfolio .list-layanan-container .layanan-jenis p{font-size:.8rem;font-weight:600}@media(max-width:768px){.portfolio .list-layanan-container .layanan-jenis p{display:none}}.portfolio .list-layanan-container .layanan-jenis img{height:25px;width:auto}.portfolio .list-layanan-container .layanan-jenis{transition:transform .3s ease,box-shadow .3s ease}.portfolio .list-layanan-container .layanan-jenis:hover{transform:scale(1.03);box-shadow:0 10px 25px #0000004d;z-index:2}.portfolio .list-layanan-container .active{background-color:#e2b430;color:#272727}@media(max-width:768px){.portfolio .isi-portfolio{width:90vw;margin:auto}}.portfolio .isi-portfolio h1{text-align:center;font-size:2.5rem;font-weight:800}.portfolio .isi-portfolio .portfolio-grid{display:flex;flex-wrap:wrap;justify-content:space-around;gap:20px;align-items:flex-start}.portfolio .isi-portfolio .portfolio-grid .portfolio-card{display:flex;flex-direction:column;align-items:center;background-color:#e2b430;padding:10px;box-sizing:border-box;border-radius:10px;color:#272727;text-align:center;text-decoration:none;font-weight:600;box-shadow:0 10px 25px #0000004d;transition:transform .25s ease,box-shadow .25s ease}.portfolio .isi-portfolio .portfolio-grid .portfolio-card .icon-wraper{width:140px;height:140px;border-radius:5px;background-size:cover;background-position:center;background-repeat:no-repeat}.portfolio .isi-portfolio .portfolio-grid .portfolio-card .judul{width:100%;max-width:140px;font-size:.9rem}.portfolio .isi-portfolio .portfolio-grid .portfolio-card .techstack-judul{display:none;margin-top:6px;font-size:.75rem;font-weight:600;color:#272727}.portfolio .isi-portfolio .portfolio-grid .portfolio-card .stack{display:none;margin-top:6px;gap:8px;flex-wrap:wrap;justify-content:center}.portfolio .isi-portfolio .portfolio-grid .portfolio-card .stack img{height:26px;width:auto}.portfolio .isi-portfolio .portfolio-grid .portfolio-card:hover{transform:translateY(-4px);box-shadow:0 14px 30px #00000073}.portfolio .isi-portfolio .portfolio-grid .portfolio-card:hover .techstack-judul{display:block}.portfolio .isi-portfolio .portfolio-grid .portfolio-card:hover .stack{display:flex}.gallery{display:flex;flex-direction:column;max-width:1000px;margin:0 auto;box-sizing:border-box;gap:50px;padding:10vh 0px;justify-content:flex-start;min-height:100vh}.gallery .list-layanan-container{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px}.gallery .list-layanan-container .layanan-jenis{display:flex;align-items:center;gap:10px;padding:8px 20px;background-color:#272727;border-radius:15px;color:#fff;cursor:pointer;box-sizing:border-box;transition:all .3s ease}@media(max-width:768px){.gallery .list-layanan-container .layanan-jenis{padding:20px;border-radius:300px}}.gallery .list-layanan-container .layanan-jenis p{font-size:.85rem;font-weight:600}@media(max-width:768px){.gallery .list-layanan-container .layanan-jenis p{display:none}}.gallery .list-layanan-container .layanan-jenis img{height:25px;width:auto}.gallery .list-layanan-container .layanan-jenis:hover{transform:scale(1.05);box-shadow:0 10px 25px #0000004d;z-index:2}.gallery .list-layanan-container .active{background-color:#e2b430;color:#272727;font-weight:700;box-shadow:0 0 15px #e2b43099}.gallery .pengalaman-kerja-container{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.gallery .pengalaman-kerja-container .pengalaman-kerja{width:250px;height:180px;border-radius:10px;overflow:hidden;background-color:#e2b430;position:relative;cursor:pointer;box-shadow:0 8px 18px #0000004d;transition:all .3s ease}@media(max-width:768px){.gallery .pengalaman-kerja-container .pengalaman-kerja{width:180px;height:130px;margin:0}}.gallery .pengalaman-kerja-container .pengalaman-kerja .foto-kegiatan{width:100%;height:100%;background-size:cover;background-position:center}.gallery .pengalaman-kerja-container .pengalaman-kerja .info-hover{position:absolute;bottom:0;left:0;right:0;background:#000000bf;color:#fff;padding:10px;text-align:center;font-size:.85rem}.gallery .pengalaman-kerja-container .pengalaman-kerja .info-hover .perusahaan{font-weight:600;font-size:.9rem}.gallery .pengalaman-kerja-container .pengalaman-kerja .info-hover .posisi{font-size:.8rem;opacity:.9}.gallery .pengalaman-kerja-container .pengalaman-kerja .info-hover .tahun{font-size:.75rem;opacity:.8}.gallery .pengalaman-kerja-container .pengalaman-kerja:hover{transform:translateY(-5px);box-shadow:0 10px 25px #00000073}.gallery .proyek-container{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}.gallery .proyek-container .proyek-card{width:250px;height:180px;border-radius:10px;overflow:hidden;background-color:#e2b430;position:relative;cursor:pointer;box-shadow:0 8px 18px #0000004d;transition:all .3s ease}@media(max-width:768px){.gallery .proyek-container .proyek-card{width:180px;height:130px;margin:0}}.gallery .proyek-container .proyek-card .foto-proyek{width:100%;height:100%;background-size:cover;background-position:center}.gallery .proyek-container .proyek-card .info-proyek{position:absolute;bottom:0;left:0;right:0;background:#000000bf;color:#fff;padding:10px;text-align:center;font-size:.85rem}.gallery .proyek-container .proyek-card .info-proyek .judul{font-weight:600}.gallery .proyek-container .proyek-card .info-proyek .tahun{font-size:.8rem;opacity:.8}.gallery .proyek-container .proyek-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px #00000073}.gallery .prestasi-container{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}.gallery .prestasi-container .prestasi-card{width:230px;height:230px;border-radius:10px;background-color:#e2b430;box-shadow:0 8px 18px #0000004d;overflow:hidden;cursor:pointer;transition:all .3s ease;position:relative}@media(max-width:768px){.gallery .prestasi-container .prestasi-card{width:45vw;height:45vw}}.gallery .prestasi-container .prestasi-card .foto-prestasi{width:100%;height:100%;background-size:cover;background-position:center}.gallery .prestasi-container .prestasi-card .info-prestasi{position:absolute;bottom:0;left:0;right:0;background:#000000bf;color:#fff;text-align:center;padding:8px}.gallery .prestasi-container .prestasi-card .info-prestasi .nama{font-weight:600;font-size:.9rem}.gallery .prestasi-container .prestasi-card .info-prestasi .tahun{font-size:.75rem;opacity:.8}.gallery .prestasi-container .prestasi-card:hover{transform:translateY(-5px);box-shadow:0 12px 30px #00000073}.gallery .sertifikasi-container{display:flex;flex-direction:column;align-items:center;gap:15px}.gallery .sertifikasi-container .sertifikasi-card{width:90%;max-width:600px;background-color:#e2b430;border-radius:10px;padding:15px;box-shadow:0 8px 18px #0000004d;display:flex;align-items:center;gap:15px;cursor:pointer;transition:all .3s ease;box-sizing:border-box}@media(max-width:768px){.gallery .sertifikasi-container .sertifikasi-card{width:80%}}.gallery .sertifikasi-container .sertifikasi-card img{height:45px;width:45px}.gallery .sertifikasi-container .sertifikasi-card .info{display:flex;flex-direction:column;color:#272727}.gallery .sertifikasi-container .sertifikasi-card .info .nama{font-weight:700}.gallery .sertifikasi-container .sertifikasi-card .info .tanggal{font-size:.8rem;opacity:.9}.gallery .sertifikasi-container .sertifikasi-card:hover{transform:translateY(-4px);box-shadow:0 10px 25px #00000073}.gallery .popup-overlay{position:fixed;inset:0;background-color:#000000b3;display:flex;justify-content:center;align-items:center;z-index:9999}@media(max-width:768px){.gallery .popup-overlay{height:100vh;box-sizing:border-box}}.gallery .popup-overlay .popup-content,.gallery .popup-overlay .popup-pdf{background:#fff;border-radius:12px;width:80%;max-width:800px;padding:25px;text-align:center;box-shadow:0 10px 30px #0006;display:flex;flex-direction:column;gap:15px}@media(max-width:768px){.gallery .popup-overlay .popup-content p,.gallery .popup-overlay .popup-pdf p{margin:0}}.gallery .popup-overlay .popup-content .foto-proyek,.gallery .popup-overlay .popup-content .foto-kegiatan,.gallery .popup-overlay .popup-content .foto-prestasi,.gallery .popup-overlay .popup-pdf .foto-proyek,.gallery .popup-overlay .popup-pdf .foto-kegiatan,.gallery .popup-overlay .popup-pdf .foto-prestasi{width:100%;height:300px;background-size:cover;background-position:center;border-radius:8px;margin-bottom:10px}.gallery .popup-overlay .popup-content h2,.gallery .popup-overlay .popup-pdf h2{font-size:1.5rem;color:#272727}@media(max-width:768px){.gallery .popup-overlay .popup-content h2,.gallery .popup-overlay .popup-pdf h2{margin:0}}.gallery .popup-overlay .popup-content .tahun,.gallery .popup-overlay .popup-pdf .tahun{color:#555;font-weight:500}@media(max-width:768px){.gallery .popup-overlay .popup-content .tahun,.gallery .popup-overlay .popup-pdf .tahun{margin:0}}.gallery .popup-overlay .popup-content .deskripsi,.gallery .popup-overlay .popup-content .desc,.gallery .popup-overlay .popup-pdf .deskripsi,.gallery .popup-overlay .popup-pdf .desc{color:#333;font-size:1rem;line-height:1.4}@media(max-width:768px){.gallery .popup-overlay .popup-content .deskripsi,.gallery .popup-overlay .popup-content .desc,.gallery .popup-overlay .popup-pdf .deskripsi,.gallery .popup-overlay .popup-pdf .desc{margin:0;font-size:.8rem}}.gallery .popup-overlay .popup-content .pdf-viewer,.gallery .popup-overlay .popup-pdf .pdf-viewer{width:100%;height:500px;border-radius:8px}.gallery .popup-overlay .popup-content .close-btn,.gallery .popup-overlay .popup-pdf .close-btn{margin-top:10px;align-self:center;background-color:#e2b430;border:none;padding:10px 25px;border-radius:6px;font-weight:700;cursor:pointer;transition:background .3s}.gallery .popup-overlay .popup-content .close-btn:hover,.gallery .popup-overlay .popup-pdf .close-btn:hover{background-color:#272727;color:#fff}.gallery .fade-enter-active,.gallery .fade-leave-active{transition:opacity .3s ease}.gallery .fade-enter-from,.gallery .fade-leave-to{opacity:0}.gallery .popup-enter-active,.gallery .popup-leave-active{transition:all .35s ease}.gallery .popup-enter-from,.gallery .popup-leave-to{transform:scale(.9);opacity:0}.contact{display:flex;flex-direction:column;max-width:1000px;margin:0 auto;box-sizing:border-box;padding:10vh 0px;justify-content:flex-start;min-height:100vh;gap:25px;align-items:center}.contact h1{font-size:2.5rem;margin:0;text-align:center}.contact p{font-size:1rem;margin:0;text-align:center}.contact form{display:flex;flex-direction:column;gap:10px;width:100%}.contact form input,.contact form textarea{background-color:#272727;color:#e2b430;padding:10px;border-radius:10px;border:none;outline:none;transition:all .25s ease;font-family:Montserrat,sans-serif;width:100%;text-wrap:balance;box-sizing:border-box;font-size:1.2rem}.contact form input:hover,.contact form textarea:hover{transform:scale(1.025);box-shadow:0 0 12px 2px #e2b430}.contact form input:focus,.contact form textarea:focus{box-shadow:0 0 12px 2px #e2b430}.contact form input:active,.contact form textarea:active{box-shadow:0 0 12px 2px #e2b430}.contact form textarea{height:100%;min-height:50vh;resize:vertical}.contact form input[type=submit]{cursor:pointer;font-weight:600;padding:15px 10px;transition:all .25s ease}.contact form input[type=submit]:hover{transform:scale(1.05);box-shadow:0 0 15px 3px #e2b430;background-color:#e2b430;color:#272727}.contact form input[type=submit]:active{box-shadow:0 0 10px 2px #e2b430 inset}@media(max-width:768px){.contact{width:100vw}.contact h1,.contact p,.contact form{width:90vw}}h1{font-family:Montserrat,sans-serif;width:100%;text-wrap:balance;box-sizing:border-box}h2{font-family:Poppins,sans-serif;width:100%;text-wrap:balance;box-sizing:border-box}p,li{font-family:Montserrat,sans-serif;width:100%;text-wrap:balance;box-sizing:border-box}html{padding:0;margin:0;overflow-x:hidden;scroll-behavior:smooth;width:100vw}html body{margin:0;padding:0}html,body{background-color:#eff1f3}#bodyapp{width:100vw;height:100%;min-height:100vh;overflow-x:hidden;display:flex;justify-content:space-between}@media(max-width:768px){#bodyapp{flex-direction:column;justify-content:flex-start;align-items:center}}@media(max-width:300px){#bodyapp{flex-direction:column;justify-content:flex-start;align-items:center;padding:10px}}.isi-konten{flex:7;display:flex;flex-direction:column;gap:100px;justify-content:center;align-items:center;margin-left:20vw;margin-right:10vw;padding:50px;box-sizing:border-box}@media(max-width:768px){.isi-konten{flex:1;margin:0}}@media(max-width:300px){.isi-konten{flex:1;margin:0}}
