*{box-sizing:border-box;scroll-behavior:smooth}html{scroll-behavior:smooth}body{margin:0;overflow-x:hidden}::-webkit-scrollbar{width:.5vw;height:5px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#577fba1f;border-radius:30px}::-webkit-scrollbar-thumb:hover{background:#000}.portofolio{position:relative;z-index:1;max-width:1040px;margin:0 auto;padding:2rem 1.25rem 4rem;display:grid;gap:1rem}.porto-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap}.view-all-btn{text-decoration:none;padding:.5rem 1rem;border-radius:999px;font-size:.85rem;border:1px solid rgba(157,214,255,.5);background:#0f203cb3;color:#e8eeff;transition:transform .25s ease,background .25s ease,box-shadow .25s ease,border-color .25s ease}.view-all-btn:hover{transform:translateY(-3px) scale(1.05);background:linear-gradient(135deg,#4f46e5,#0891b2);border-color:#9dd6ffe6;box-shadow:0 6px 18px #4f46e580}.view-all-btn:active{transform:scale(.95);background:#24f109;border-color:#000;color:#fff}.card{background:var(--card-bg);border:1px solid var(--border-color);backdrop-filter:blur(14px);border-radius:20px;padding:1.4rem;box-shadow:0 24px 45px #040c2573}.menu{position:sticky;top:0;width:100%;z-index:1000;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.3rem;padding:.8rem 1rem;margin:0;border:1px solid var(--border-color)}.menu a{position:relative;text-decoration:none;color:var(--text-primary);padding:.55rem .9rem;border-radius:999px;border:1px solid var(--border-color);font-size:.92rem;transition:transform .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease}.menu a:hover{transform:translateY(-3px) scale(1.05);background:linear-gradient(135deg,#4f46e5,#0891b2);border-color:#9dd6ffe6;box-shadow:0 6px 18px #4f46e580}.menu a:hover:after{width:100%}.hero{display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:1.5rem}.label{letter-spacing:.24em;font-size:.75rem;opacity:.8;margin-bottom:.5rem}.hero h1{font-size:clamp(1.9rem,4.8vw,3.2rem);margin:0}.description,section p{line-height:1.75;opacity:.92}section{height:100%}.profile-photo{width:100%;justify-self:end;border-radius:18px;border:1px solid rgba(255,255,255,.25);box-shadow:0 16px 28px #010a1e66;mask-image:linear-gradient(to left,black 40%,transparent 100%)}.chips{display:flex;gap:.65rem;flex-wrap:wrap}.chip{padding:.45rem .78rem;border-radius:999px;border:1px solid rgba(157,214,255,.45);background:#0a1b386b;font-size:.9rem;cursor:pointer;transition:transform .25s ease,background .25s ease,box-shadow .25s ease,border-color .25s ease;animation:chip-float 5s ease-in-out infinite}.chip:hover{transform:translateY(-4px) scale(1.07);background:linear-gradient(135deg,#4f46e5,#0891b2);border-color:#9dd6ffe6;box-shadow:0 6px 18px #4f46e566}.chip:active{transform:scale(.95);background:#62f102;border-color:#62f102;color:#fff}@keyframes chip-float{0%,to{transform:translateY(0)}50%{transform:translateY(-3px)}}.chip:nth-child(2n){animation-delay:.5s}.chip:nth-child(3n){animation-delay:1s}.lightbox-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;z-index:9999;justify-content:center;align-items:center;backdrop-filter:blur(10px)}.lightbox-modal.active{display:flex}.lightbox-close{position:absolute;top:20px;right:30px;font-size:40px;color:#fff;background:none;border:none;cursor:pointer;transition:transform .3s ease,color .3s ease;z-index:10001}.lightbox-close:hover{transform:scale(1.2);color:#4f46e5}.lightbox-content{display:flex;flex-direction:column;align-items:center;max-width:90%;max-height:90%}.lightbox-content img{max-width:100%;max-height:80vh;border-radius:12px;box-shadow:0 20px 60px #00000080}.lightbox-content p{color:#fff;font-size:1.2rem;margin-top:1rem;text-align:center;opacity:.9}.projects{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}.project-item{padding:1rem;border:1px solid var(--border-color);border-radius:14px;background:var(--card-bg);transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;animation:card-float 4.2s ease-in-out infinite}.project-image-wrapper{cursor:pointer;overflow:hidden;border-radius:10px}.project-image{width:100%;height:160px;object-fit:cover;border-radius:10px;margin-bottom:.8rem;border:1px solid rgba(255,255,255,.1)}.project-image-wrapper:hover .project-image{transform:scale(1.05);transition:transform .3s ease}.project-item:hover{transform:translateY(-8px) scale(1.01);border-color:#9dd6ffb3;box-shadow:0 14px 26px #0a1a3f66}.project-item:nth-child(2){animation-delay:.4s}.project-item:nth-child(3){animation-delay:.8s}.bg-blur{position:fixed;z-index:0;width:24rem;height:24rem;border-radius:100%;filter:blur(70px);opacity:.5;pointer-events:none;animation:float 9s ease-in-out infinite}.bg-blur-one{top:-5rem;left:-4rem;background:#46e573}.bg-blur-two{bottom:-4rem;right:-5rem;background:#08b2a4;animation-delay:1.8s}.reveal{opacity:0;transform:translateY(18px);animation:reveal-up .78s cubic-bezier(.25,1,.5,1) forwards}.delay-1{animation-delay:.12s}.delay-2{animation-delay:.22s}.delay-3{animation-delay:.32s}.delay-4{animation-delay:.42s}@keyframes reveal-up{to{opacity:1;transform:translateY(0)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(18px)}}@keyframes card-float{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}.project-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.8rem;align-items:center}.project-actions a{text-decoration:none;display:inline-flex;border:none!important;padding:0;border-radius:0;background:none}.porto-btn{display:inline-flex;align-items:center;gap:.4rem}.live-btn{background:linear-gradient(135deg,#10b98126,#06b6d426);border-color:#10b98180;color:#6ee7b7;position:relative;overflow:hidden}.live-btn:before{content:"";position:absolute;top:50%;left:.75rem;width:6px;height:6px;background:#10b981;border-radius:50%;transform:translateY(-50%);box-shadow:0 0 6px #10b981,0 0 12px #10b981;animation:pulse-dot 1.8s ease-in-out infinite}.live-btn svg{margin-left:.6rem}.live-btn:hover{background:linear-gradient(135deg,#10b981,#0891b2);border-color:#6ee7b7e6;box-shadow:0 8px 20px #10b98173;color:#fff}.live-btn:active{background:#10b981;border-color:#10b981;box-shadow:0 0 14px #10b981b3}@keyframes pulse-dot{0%,to{opacity:1;transform:translateY(-50%) scale(1)}50%{opacity:.5;transform:translateY(-50%) scale(1.4)}}@media(max-width:480px){.social-buttons{margin-top:2.5rem;display:flex;gap:1rem;align-items:center;justify-content:center}.navbar__links{display:none!important}.navbar__hamburger{display:flex!important;flex-direction:column;gap:6px;background:transparent;border:none;cursor:pointer;padding:.5rem;border-radius:8px;transition:background .3s ease}.navbar__hamburger:hover{background:var(--bg-secondary)}.navbar__hamburger span{width:24px;height:3px;background:var(--text-primary);border-radius:3px;transition:all .3s ease}.theme-select-container{margin-right:.5rem!important}.portofolio{padding:1rem .5rem 2rem}.card{padding:.8rem;border-radius:12px}.menu{padding:.6rem .8rem;gap:.2rem}.menu a{font-size:.75rem;padding:.4rem .6rem}.hero h1{font-size:1.5rem}.description,section p{font-size:.9rem}.profile-photo{max-width:180px;border-radius:12px}.social-buttons{gap:.8rem}.social-icon-btn{width:45px;height:45px}.chip{font-size:.8rem;padding:.35rem .6rem}.projects{grid-template-columns:1fr;gap:.8rem}.project-item{padding:.8rem}.timeline{padding-left:1.5rem}.timeline-item{padding-left:.8rem;margin-bottom:1.5rem}.timeline-content{padding:.8rem}.view-all-btn{font-size:.75rem;padding:.4rem .8rem}.porto-btn{font-size:.8rem;padding:.5rem .9rem}}@media(max-width:1024px){.hero{grid-template-columns:1fr 1fr}}@media(max-width:769px){.social-buttons{margin-top:2.5rem;display:flex;gap:1rem;align-items:center;justify-content:center}.navbar__links{display:none}.navbar__hamburger{display:flex}.hero{grid-template-columns:1fr;text-align:center}.hero img{justify-self:center}}@media(min-width:1600px){.portofolio{max-width:1200px}}@media(min-width:320px){.contact-icon-btn{justify-self:start}}@media(max-width:900px){.hero,.projects{grid-template-columns:1fr}.profile-photo{mask-image:linear-gradient(to bottom,black 10%,transparent 100%);justify-self:center;max-width:220px}}.certificate-item img{width:100%;height:auto;margin-bottom:1rem;border-radius:12px}img{max-width:100%;height:auto}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 1rem}.porto-btn{margin-top:.8rem;padding:.6rem 1.1rem;border-radius:999px;border:1px solid rgba(157,214,255,.5);background:#0f203cb3;color:#e8eeff;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease,background .25s ease,border-color .25s ease}.porto-btn:hover{transform:translateY(-4px) scale(1.05);background:linear-gradient(135deg,#4f46e5,#0891b2);border-color:#9dd6ffe6;box-shadow:0 8px 20px #4f46e580}.porto-btn:active{transform:scale(.95);background:#22c55e;border-color:#22c55e;box-shadow:0 0 12px #22c55eb3}.certificate-item{display:flex;flex-direction:column;align-items:start;text-align:start}.cert-image-wrapper{cursor:pointer;overflow:hidden;border-radius:12px;width:100%;margin-bottom:1rem}.cert-image-wrapper img{width:100%;height:auto;transition:transform .3s ease}.cert-image-wrapper:hover img{transform:scale(1.03)}.experience-list{display:grid;gap:1.5rem}.experience-item{padding:1.2rem;border:1px solid var(--border-color);border-radius:14px;background:var(--card-bg);transition:transform .3s ease,box-shadow .3s ease}.experience-item:hover{transform:translateY(-5px);box-shadow:0 12px 24px #0a1a3f66}.exp-header{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem}.exp-period{font-size:.85rem;opacity:.8}.experience-item h4{margin-top:.3rem;opacity:.9;font-weight:500}.experience-item ul{margin-top:.8rem;padding-left:1.2rem;line-height:1.6}@media(min-width:770px){.social-buttons{margin-top:2.5rem;display:flex;gap:1rem;align-items:center;justify-content:center}.navbar__links{display:flex!important;list-style:none;gap:.3rem;margin:0;padding:0}.navbar__hamburger,.navbar__mobile{display:none!important}.theme-select-container{margin-right:1rem!important}}.timeline{position:relative;margin-top:2rem;padding-left:2rem}.timeline:before{content:"";position:absolute;left:10px;top:0;width:3px;height:100%;background:linear-gradient(to bottom,#4f46e5,#0891b2)}.timeline-item{position:relative;margin-bottom:2rem;padding-left:1rem}.timeline-item:before{content:"";position:absolute;left:-2px;top:6px;width:14px;height:14px;border-radius:50%;background:#4f46e5;box-shadow:0 0 12px #4f46e599}.timeline-content{background:var(--card-bg);padding:1.2rem;border-radius:14px;border:1px solid var(--border-color);transition:.3s ease}.timeline-content:hover{transform:translateY(-5px);box-shadow:0 12px 28px #0a1a3f80}.reveal{opacity:0;transform:translateY(40px);transition:all .8s ease}.reveal.active{opacity:1;transform:translateY(0)}.reveal{opacity:0;transform:translateY(40px) scale(.95);transition:opacity .8s ease,transform .8s ease}.reveal.active{opacity:1;transform:translateY(0) scale(1)}.social-buttons{margin-top:2.5rem;display:flex;gap:1rem}.social-icon-btn{width:54px;height:54px;display:flex;align-items:center;justify-content:center;border-radius:9999px;background:#ffffff14;border:1px solid rgba(255,255,255,.2);color:#fff0;transition:all .3s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(12px)}.social-icon-btn:hover{background:linear-gradient(to bottom,#4f46e5,#0891b2);color:#0f172a;transform:translateY(-4px) scale(1.08);box-shadow:0 10px 25px -5px #00000026}.contact-buttons{margin-top:2.5rem;display:flex;gap:1rem;justify-content:flex-start;align-items:center}.contact-icon-btn{width:54px;height:54px;display:flex;align-items:center;justify-content:center;border-radius:9999px;background:#ffffff14;border:1px solid rgba(255,255,255,.2);color:#fff0;transition:all .3s cubic-bezier(.4,0,.2,1);backdrop-filter:blur(12px)}.contact-icon-btn img{filter:brightness(0) invert(1);transition:filter .3s ease}[data-theme=light] .contact-icon-btn img{filter:brightness(0) invert(0)}[data-theme=dark] .contact-icon-btn img{filter:brightness(0) invert(1)}.social-icon-btn img{filter:brightness(0) invert(1);transition:filter .3s ease}[data-theme=light] .social-icon-btn img{filter:brightness(0) invert(0)}[data-theme=dark] .social-icon-btn img{filter:brightness(0) invert(1)}.contact-icon-btn:hover{background:linear-gradient(to bottom,#4f46e5,#0891b2);color:#0f172a;transform:translateY(-4px) scale(1.08);box-shadow:0 10px 25px -5px #00000026}.delay-1{transition-delay:.1s}.delay-2{transition-delay:.2s}.delay-3{transition-delay:.3s}.delay-4{transition-delay:.4s}.navbar{position:sticky;top:0;left:0;width:100%;z-index:1000;display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:var(--card-bg);backdrop-filter:blur(10px);border-bottom:1px solid var(--border-color);transition:transform .3s ease}.navbar__logo{font-weight:800;font-size:1.3rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text-primary);text-decoration:none;transition:transform .25s ease,background .25s ease;-webkit-background-clip:unset;background-clip:unset}.navbar__logo:hover{transform:translateY(-3px) scale(1.05);background:linear-gradient(135deg,#4f46e5,#0891b2);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}.navbar__logo:active{transform:scale(.95);background:#07ff00;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}.navbar__right{display:flex;align-items:center}.navbar__links{display:none;list-style:none;gap:.3rem;margin:0;padding:0}.navbar__links li a{position:relative;text-decoration:none;color:var(--text-primary);padding:.55rem .9rem;border-radius:999px;border:1px solid var(--border-color);font-size:.92rem;transition:transform .25s ease,background .25s ease,border-color .25s ease,box-shadow .25s ease}.navbar__links li a:hover{transform:translateY(-3px) scale(1.05);background:linear-gradient(135deg,#4f46e5,#0891b2);border-color:#9dd6ffe6;box-shadow:0 6px 18px #4f46e580}.navbar__links li a:active{transform:scale(.95);background:#07ff00;border-color:#07ff00;color:#fff;box-shadow:0 4px 12px #0009}.navbar__hamburger{display:flex;flex-direction:column;gap:6px;background:transparent;border:none;cursor:pointer}.navbar__hamburger span{width:24px;height:3px;background:var(--text-primary);border-radius:4px;transition:.3s ease}.navbar__hamburger.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.navbar__hamburger.active span:nth-child(2){opacity:0}.navbar__hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(6px,-6px)}.navbar__mobile{position:fixed;top:70px;left:0;right:0;background:var(--card-bg);backdrop-filter:blur(14px);border-bottom:1px solid var(--border-color);padding:1rem;display:flex;flex-direction:column;gap:.5rem;opacity:0;transform:translateY(-20px);pointer-events:none;transition:all .3s ease;z-index:998}.navbar__mobile a{color:var(--text-primary);text-decoration:none;font-size:1.1rem;padding:1rem 1.5rem;border-bottom:1px solid var(--border-color);transition:all .25s ease;display:block;width:100%;text-align:left}.navbar__mobile a:hover{transform:translateY(-3px) scale(1.05);background:linear-gradient(135deg,#4f46e5,#0891b2);border-color:#9dd6ffe6;box-shadow:0 6px 18px #4f46e580}.navbar__mobile.open{opacity:1;transform:translateY(0);pointer-events:auto}.navbar--hidden{transform:translateY(-100%)}.navbar.dark{background:#0f0f0fcc;color:#fff}.navbar.light{background:#fffc;color:#000}.nav-links{display:flex;gap:2rem;position:relative}.nav-links a{text-decoration:none;color:inherit;position:relative;padding-bottom:5px}.nav-links a.active{transform:scale(.95);background:#62f102;border-color:#62f102;color:#fff;font-weight:700}.indicator{position:absolute;bottom:-5px;height:2px;width:60px;background:#0ff}.hamburger{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:8px}.bar{display:block;width:25px;height:3px;background-color:currentColor;transition:transform .3s,opacity .3s}.mobile-menu{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:#fff;padding:1rem;list-style:none;gap:1rem;.menu a{visibility:hidden}}.footer{margin-top:4rem;padding:2rem 1.5rem;border-top:1px solid var(--border-color);background:var(--card-bg);backdrop-filter:blur(10px);transition:background-color .3s ease,border-color .3s ease}.footer-content{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}.footer-copyright{font-size:.9rem;color:var(--text-secondary);margin:0;transition:color .3s ease}.footer-social{display:flex;gap:.75rem}.footer-social .social-icon-btn{width:42px;height:42px;margin-top:0}@media(max-width:768px){.footer-content{flex-direction:column;text-align:center}}.astro-route-announcer{position:absolute;left:0;top:0;clip:rect(0 0 0 0);clip-path:inset(50%);overflow:hidden;white-space:nowrap;width:1px;height:1px}:root{font-family:Inter,Segoe UI,Roboto,system-ui,-apple-system,sans-serif;color-scheme:dark;--bg-primary: #ffffff;--bg-secondary: #f8fafc;--card-bg: #ffffff;--text-primary: #0f172a;--text-secondary: #475569;--border-color: #e2e8f0;--accent: #3b82f6}[data-astro-cid-sckkx6r4][data-theme=dark]{--bg-primary: #070b16;--bg-secondary: #0f172a;--card-bg: #1e293b;--text-primary: #e8eeff;--text-secondary: #94a3b8;--border-color: #334155;--accent: #60a5fa}[data-astro-cid-sckkx6r4][data-theme=light]{--bg-primary: #ffffff;--bg-secondary: #f8fafc;--card-bg: #ffffff;--text-primary: #0f172a;--text-secondary: #475569;--border-color: #e2e8f0;--accent: #3b82f6}[data-astro-cid-sckkx6r4]{box-sizing:border-box}html,body{margin:0;width:100%;min-height:100%;background:var(--bg-primary);color:var(--text-primary);transition:background-color .3s ease,color .3s ease}.theme-toggle-btn[data-astro-cid-sckkx6r4]:hover{background:var(--bg-secondary)!important;transform:scale(1.05);transition:all .2s ease}.theme-dropdown-option[data-astro-cid-sckkx6r4]:hover{background:var(--bg-secondary)!important;color:var(--text-primary)!important}.theme-dropdown-option[data-astro-cid-sckkx6r4].active{background:var(--accent)!important;color:#fff!important}[data-astro-cid-sckkx6r4]{transition:background-color .3s ease,color .3s ease,border-color .3s ease}