.mouse-follower{position:fixed;width:40px;height:40px;border:2px solid #00bcd4;border-radius:50%;pointer-events:none;z-index:9999;transition:all 0.15s ease-out;mix-blend-mode:difference;opacity:0}.hero-interactive{position:relative;width:100%;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center}.hero-bg-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}.hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgb(15 15 15 / .8) 0%,rgb(26 26 26 / .7) 50%,rgb(15 15 15 / .9) 100%);z-index:2}.bg-particles{position:absolute;width:100%;height:100%;top:0;left:0;z-index:3}.particle{position:absolute;width:2px;height:2px;background:rgb(0 188 212 / .3);border-radius:50%;animation:float 20s infinite ease-in-out}@keyframes float{0%,100%{transform:translateY(0) translateX(0);opacity:0}10%{opacity:1}90%{opacity:1}100%{transform:translateY(-100vh) translateX(50px);opacity:0}}.hero-decoration{position:absolute;width:600px;height:600px;border:1px solid rgb(0 188 212 / .1);border-radius:50%;pointer-events:none;z-index:4}.decoration-1{top:-200px;right:-200px;animation:rotate 40s linear infinite}.decoration-2{bottom:-200px;left:-200px;animation:rotate 50s linear infinite reverse}@keyframes rotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.hero-content-wrapper{position:relative;z-index:10;text-align:left;padding:0 40px;max-width:1400px;width:100%}.hero-text-container{perspective:1000px;max-width:900px}.hero-line{width:60px;height:2px;background:#00bcd4;margin-bottom:30px;will-change:transform;transition:transform 0.3s cubic-bezier(.25,.46,.45,.94)}.hero-main-title{font-size:clamp(24px, 4.5vw, 48px);font-weight:300;color:#fff;line-height:1.2;margin-bottom:5px;letter-spacing:5px;text-transform:uppercase;will-change:transform;transition:transform 0.3s cubic-bezier(.25,.46,.45,.94)}.hero-thegem{display:inline-block;font-weight:300;color:#fff;will-change:transform}.hero-sub-title{font-size:clamp(28px, 5vw, 56px);font-weight:700;color:#fff;margin-bottom:2px;letter-spacing:5px;text-transform:uppercase;will-change:transform;transition:transform 0.3s cubic-bezier(.25,.46,.45,.94);line-height:1.2}.hero-agency-text{font-size:clamp(28px, 5vw, 56px);font-weight:700;color:#00bcd4;font-style:italic;margin-bottom:25px;letter-spacing:5px;text-transform:uppercase;text-shadow:0 0 30px rgb(0 188 212 / .5),0 0 60px rgb(0 188 212 / .3);will-change:transform;transition:transform 0.3s cubic-bezier(.25,.46,.45,.94);font-family:'Brush Script MT',cursive;line-height:1.2}.hero-desc-text{font-size:clamp(14px, 1.8vw, 18px);font-weight:400;color:#ccc;max-width:650px;margin:0 0 35px;line-height:1.7;will-change:transform;transition:transform 0.3s cubic-bezier(.25,.46,.45,.94)}.hero-cta-button{display:inline-block;padding:18px 45px;font-size:16px;font-weight:700;color:#fff;background:#1a1a1a;border:2px solid #fff;text-decoration:none;text-transform:uppercase;letter-spacing:3px;cursor:pointer;position:relative;overflow:hidden;transition:all 0.4s cubic-bezier(.25,.46,.45,.94);border-radius:50px;will-change:transform;margin-top:20px}.hero-cta-button::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:#00bcd4;transition:left 0.4s;z-index:-1}.hero-cta-button:hover{border-color:#00bcd4;transform:translateY(-2px);box-shadow:0 10px 30px rgb(0 188 212 / .4)}.hero-cta-button:hover::before{left:0}.scroll-indicator{position:absolute;bottom:40px;left:50%;transform:translateX(-50%);z-index:10;animation:bounce 2s infinite}.scroll-indicator span{display:block;width:30px;height:50px;border:2px solid rgb(255 255 255 / .5);border-radius:20px;position:relative}.scroll-indicator span::before{content:'';position:absolute;top:10px;left:50%;transform:translateX(-50%);width:6px;height:6px;background:#00bcd4;border-radius:50%;animation:scroll 2s infinite}@keyframes bounce{0%,20%,50%,80%,100%{transform:translateX(-50%) translateY(0)}40%{transform:translateX(-50%) translateY(-10px)}60%{transform:translateX(-50%) translateY(-5px)}}@keyframes scroll{0%{opacity:1;top:10px}100%{opacity:0;top:30px}}@media (max-width:768px){.hero-content-wrapper{padding:0 20px}.hero-line{width:50px;height:2px;margin-bottom:20px}.hero-main-title{letter-spacing:2px;margin-bottom:5px}.hero-sub-title{letter-spacing:2px;margin-bottom:2px}.hero-agency-text{letter-spacing:2px;margin-bottom:20px}.hero-desc-text{margin-bottom:25px;line-height:1.6}.hero-desc-text br{display:none}.hero-cta-button{padding:14px 35px;font-size:14px;letter-spacing:2px}.decoration-1,.decoration-2{display:none}.mouse-follower{display:none}}@media (max-width:480px){.hero-content-wrapper{padding:0 16px}.hero-line{width:40px;margin-bottom:15px}.hero-main-title{letter-spacing:1px}.hero-sub-title{letter-spacing:1px}.hero-agency-text{letter-spacing:1px}.hero-cta-button{padding:12px 30px;font-size:13px;letter-spacing:1px}}.portfolio-slider-container{position:relative}.portfolioSwiper{padding-bottom:0;position:relative}.portfolio-controls-wrapper{position:relative;width:100%;height:60px;margin-top:40px;display:flex;align-items:center;justify-content:center;gap:20px}.portfolio-swiper-button-next,.portfolio-swiper-button-prev{width:44px;height:44px;min-width:44px;min-height:44px;background:#fff;border:2px solid #e2e8f0;border-radius:50%;color:#64748b;transition:all 0.3s ease;position:relative;top:auto;left:auto;right:auto;transform:none;margin:0;padding:0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 1px 3px rgb(0 0 0 / .1);flex-shrink:0;outline:none}.portfolio-swiper-button-next svg,.portfolio-swiper-button-prev svg{width:16px;height:16px;transition:all 0.3s ease}.portfolio-swiper-button-prev{order:1}.portfolio-swiper-pagination{order:2}.portfolio-swiper-button-next{order:3}.portfolio-swiper-button-next:hover,.portfolio-swiper-button-prev:hover{background:#00bcd4;border-color:#00bcd4;color:#fff;transform:scale(1.05);box-shadow:0 4px 12px rgb(0 188 212 / .25)}.portfolio-swiper-button-next.swiper-button-disabled,.portfolio-swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:not-allowed}.portfolio-swiper-pagination{position:relative!important;bottom:auto!important;top:auto!important;left:auto!important;transform:none!important;width:auto!important;display:flex;gap:8px}.portfolio-swiper-pagination .swiper-pagination-bullet{width:10px;height:10px;background:#cbd5e1;opacity:1;transition:all 0.3s ease;margin:0!important;border-radius:50%}.portfolio-swiper-pagination .swiper-pagination-bullet-active{background:#00bcd4;width:32px;border-radius:5px}.skills-section{background:radial-gradient(circle at top,rgb(14 165 233 / .15),rgb(3 7 18 / .98)),#050914}.skills-section::before,.skills-section::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgb(6 182 212 / .15),transparent 55%);pointer-events:none;opacity:.6}.skills-section::after{background:radial-gradient(circle at 80% 30%,rgb(244 114 182 / .2),transparent 60%);filter:blur(40px)}.skills-section__gradient{position:absolute;inset:0;background:linear-gradient(120deg,rgb(0 212 255 / .05),rgb(59 130 246 / .08));mix-blend-mode:screen}.skills-grid{position:relative;z-index:5}.skill-card{position:relative;padding:28px;background:rgb(15 23 42 / .85);border:1px solid rgb(255 255 255 / .06);border-radius:24px;backdrop-filter:blur(10px);box-shadow:0 20px 35px rgb(2 6 23 / .6);transition:transform 0.4s ease,border-color 0.4s ease;overflow:hidden;min-height:180px}.skill-card:hover{transform:translateY(-6px);border-color:rgb(255 255 255 / .2)}.skill-card__label{font-size:1.125rem;font-weight:700;letter-spacing:.02em;color:#fff;margin-bottom:10px}.skill-card__copy{color:rgb(226 232 240 / .9);font-size:.95rem;line-height:1.6}.skill-card__accent{position:absolute;top:0;left:0;width:100%;height:4px}.skill-card__accent--yellow{background:linear-gradient(90deg,#facc15,#fef08a)}.skill-card__accent--cyan{background:linear-gradient(90deg,#22d3ee,#0ea5e9)}.skill-card__accent--orange{background:linear-gradient(90deg,#fb923c,#f97316)}.skill-card__accent--purple{background:linear-gradient(90deg,#c084fc,#8b5cf6)}.bg-biru{background:linear-gradient(135deg,#0a192f 0%,#102a43 50%,#0b1120 100%)}.border-biru{border-top:1px solid rgb(59 130 246 / .2);border-bottom:1px solid rgb(14 165 233 / .2)}.marquee,.marquee-reverse{position:relative;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#fff 10%,#fff 90%,transparent)}.marquee__inner,.marquee__inner_reverse{display:flex;width:fit-content;gap:3rem;animation:marquee-left 25s linear infinite}.marquee-reverse .marquee__inner_reverse{animation-name:marquee-right}.marquee__group,.marquee__group_reverse{display:flex;gap:3rem;align-items:center}.marquee span,.marquee-reverse span{display:inline-flex;align-items:center;justify-content:center;min-width:120px}.marquee img,.marquee-reverse img{filter:drop-shadow(0 6px 12px rgb(0 0 0 / .35));opacity:.9;transition:opacity 0.3s ease}.marquee img:hover,.marquee-reverse img:hover{opacity:1}@keyframes marquee-left{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}@keyframes marquee-right{0%{transform:translateX(-50%)}100%{transform:translateX(0)}}@media (max-width:768px){.portfolio-controls-wrapper{height:50px;margin-top:30px;gap:16px}.portfolio-swiper-button-next,.portfolio-swiper-button-prev{width:40px;height:40px;min-width:40px;min-height:40px}.portfolio-swiper-button-next svg,.portfolio-swiper-button-prev svg{width:14px;height:14px}.portfolio-swiper-pagination .swiper-pagination-bullet{width:8px;height:8px}.portfolio-swiper-pagination .swiper-pagination-bullet-active{width:24px}}@media (max-width:480px){.portfolio-controls-wrapper{gap:12px}.portfolio-swiper-button-next,.portfolio-swiper-button-prev{width:36px;height:36px;min-width:36px;min-height:36px}.portfolio-swiper-button-next svg,.portfolio-swiper-button-prev svg{width:12px;height:12px}.portfolio-swiper-pagination .swiper-pagination-bullet{width:7px;height:7px}.portfolio-swiper-pagination .swiper-pagination-bullet-active{width:20px}}.portfolio-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:9999;display:none;align-items:center;justify-content:center;opacity:0;transition:opacity 0.3s ease}.portfolio-modal.active{display:flex;opacity:1}.portfolio-modal-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:rgb(0 0 0 / .478);backdrop-filter:blur(8px)}.portfolio-modal-content{position:relative;max-width:90%;max-height:90vh;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 25px 50px -12px rgb(0 0 0 / .5);transform:scale(.9);transition:transform 0.3s ease;z-index:10000}.portfolio-modal.active .portfolio-modal-content{transform:scale(1)}.portfolio-modal-close{position:absolute;top:15px;right:15px;width:40px;height:40px;background:rgb(0 0 0 / .7);border:none;border-radius:50%;color:#fff;font-size:24px;cursor:pointer;z-index:10001;display:flex;align-items:center;justify-content:center;transition:all 0.3s ease}.portfolio-modal-close:hover{background:#00bcd4;transform:rotate(90deg)}.portfolio-modal-body{display:flex;flex-direction:column;max-height:90vh}.portfolio-modal-image-wrapper{position:relative;width:100%;max-height:60vh;background:#000;display:flex;align-items:center;justify-content:center;overflow:hidden}.portfolio-modal-image{width:100%;height:100%;object-fit:contain;max-height:60vh}.portfolio-modal-info{padding:30px;background:#fff}.portfolio-modal-title{font-size:28px;font-weight:700;color:#111827;margin-bottom:10px}.portfolio-modal-subtitle{font-size:16px;color:#6b7280;margin-bottom:25px}.portfolio-modal-actions{display:flex;gap:12px}.portfolio-modal-cta{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;background:#00bcd4;color:#fff;font-weight:700;border-radius:6px;text-decoration:none;transition:all 0.3s ease}.portfolio-modal-cta:hover{background:#0891b2;box-shadow:0 10px 30px rgb(0 188 212 / .4);transform:translateY(-2px)}@media (max-width:768px){.portfolio-modal-content{max-width:95%;max-height:95vh}.portfolio-modal-body{flex-direction:column}.portfolio-modal-image-wrapper{max-height:50vh}.portfolio-modal-info{padding:20px}.portfolio-modal-title{font-size:22px}.portfolio-modal-subtitle{font-size:14px}.portfolio-modal-close{width:35px;height:35px;font-size:20px}}@media (min-width:1024px){.portfolio-modal-content{max-width:1200px}.portfolio-modal-body{flex-direction:row}.portfolio-modal-image-wrapper{flex:1.5;max-height:90vh}.portfolio-modal-info{flex:1;display:flex;flex-direction:column;justify-content:center}}