@keyframes pfFadeUp{0%{opacity:0;transform:translateY(26px)}to{opacity:1;transform:translateY(0)}}@keyframes pfGradient{0%,to{background-position:0%}50%{background-position:100%}}@keyframes pfBadgePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(1.6)}}@keyframes pfOrb1{0%,to{transform:translate(0)scale(1)}40%{transform:translate(50px,-40px)scale(1.08)}70%{transform:translate(-25px,28px)scale(.94)}}@keyframes pfOrb2{0%,to{transform:translate(0)scale(1)}40%{transform:translate(-45px,35px)scale(1.06)}70%{transform:translate(35px,-45px)scale(.92)}}@keyframes pfOrb3{0%,to{transform:translate(0)}50%{transform:translate(25px,40px)}}@keyframes pfCtaGlow{0%,to{opacity:.14;transform:translate(-50%,-50%)scale(1)}50%{opacity:.24;transform:translate(-50%,-50%)scale(1.2)}}.portfolio-page{color:#fff;background:linear-gradient(135deg,#020617 0%,#0f172a 100%);min-height:100vh;position:relative;overflow:hidden}.pf-bg{pointer-events:none;z-index:0;position:fixed;inset:0}.pf-orb{filter:blur(100px);opacity:.15;border-radius:50%;position:absolute}.pf-orb-1{background:radial-gradient(circle,#1d4ed8,#0000);width:560px;height:560px;animation:22s ease-in-out infinite pfOrb1;top:-140px;right:-80px}.pf-orb-2{background:radial-gradient(circle,#6d28d9,#0000);width:460px;height:460px;animation:26s ease-in-out infinite pfOrb2;bottom:10%;left:-80px}.pf-orb-3{background:radial-gradient(circle,#0891b2,#0000);width:260px;height:260px;animation:16s ease-in-out infinite pfOrb3;top:50%;left:50%}.pf-grid{background-image:linear-gradient(#3b82f60d 1px,#0000 1px),linear-gradient(90deg,#3b82f60d 1px,#0000 1px);background-size:52px 52px;position:absolute;inset:0;-webkit-mask-image:radial-gradient(80% 50% at 50% 20%,#000,#0000);mask-image:radial-gradient(80% 50% at 50% 20%,#000,#0000)}.pf-badge{color:#93c5fd;background:#3b82f61a;border:1px solid #3b82f647;border-radius:100px;align-items:center;gap:8px;margin-bottom:20px;padding:6px 16px;font-size:13px;font-weight:500;display:inline-flex}.pf-dot{background:#22c55e;border-radius:50%;flex-shrink:0;width:8px;height:8px;animation:2s ease-in-out infinite pfBadgePulse}.pf-gradient{background:linear-gradient(135deg,#60a5fa,#a78bfa,#22d3ee) 0 0/200% 200%;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;animation:4s infinite pfGradient}.portfolio-hero{z-index:2;text-align:center;opacity:0;padding:120px 24px 52px;position:relative}.pf--loaded .portfolio-hero{animation:.7s .1s both pfFadeUp}.portfolio-hero h1{letter-spacing:-1px;color:#fff;margin-bottom:16px;font-size:52px;font-weight:800;line-height:1.15}.portfolio-hero p{color:#94a3b8;max-width:480px;margin:0 auto;font-size:17px;line-height:1.7}.pf-tabs{z-index:2;opacity:0;flex-wrap:wrap;justify-content:center;gap:10px;padding:0 24px 48px;display:flex;position:relative}.pf--loaded .pf-tabs{animation:.6s .25s both pfFadeUp}.pf-tab{color:#94a3b8;cursor:pointer;background:#0f172ab3;border:1px solid #ffffff1a;border-radius:100px;padding:10px 26px;font-family:inherit;font-size:13px;font-weight:500;transition:border-color .2s,color .2s,background .2s,box-shadow .2s}.pf-tab:hover{color:#fff;background:#3b82f614;border-color:#3b82f666}.pf-tab--active{color:#fff;background:linear-gradient(135deg,#3b82f6,#1d4ed8);border-color:#0000;box-shadow:0 4px 14px #2563eb66}.projects-grid{z-index:2;grid-template-columns:repeat(auto-fit,minmax(350px,380px));justify-content:center;gap:30px;padding:20px 60px 80px;display:grid;position:relative}.project-card{cursor:pointer;background:#fff;border-radius:12px;transition:all .3s;overflow:hidden;box-shadow:0 5px 15px #00000014}.card-image{height:260px;overflow:hidden}.card-image img{object-fit:cover;width:100%;height:100%;transition:all .3s}.card-content{flex-direction:column;padding:20px;display:flex}.card-content h3{color:#111;margin-bottom:12px;font-size:18px}.tech-stack{flex-wrap:wrap;gap:8px;transition:all .3s;display:flex}.tech-stack span{color:#333;background:#eee;border-radius:10px;padding:5px 10px;font-size:12px}.buttons{opacity:0;margin-top:10px;transition:all .3s;transform:translateY(15px)}.buttons a{color:#fff;background:linear-gradient(135deg,#00bcd4,#4cafef);border-radius:6px;margin-right:10px;padding:8px 18px;font-size:13px;text-decoration:none;transition:all .2s}.buttons a:hover{transform:scale(1.05)}.project-card:hover .tech-stack{opacity:0;transform:translateY(-10px)}.project-card:hover .buttons{opacity:1;transform:translateY(0)}.project-card:hover{transform:translateY(-5px);box-shadow:0 10px 25px #0000001f}.pf-cta{z-index:2;text-align:center;padding:100px 24px;position:relative;overflow:hidden}.pf-cta-glow{pointer-events:none;background:radial-gradient(circle,#2563eb29,#0000 65%);border-radius:50%;width:560px;height:560px;animation:6s ease-in-out infinite pfCtaGlow;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.pf-cta-inner{z-index:2;max-width:620px;margin:0 auto;position:relative}.pf-cta-inner h2{letter-spacing:-.8px;margin-bottom:16px;font-size:46px;font-weight:800;line-height:1.15}.pf-cta-inner p{color:#94a3b8;max-width:500px;margin:0 auto 36px;font-size:17px;line-height:1.7}.pf-cta-btn{color:#fff;cursor:pointer;background:linear-gradient(135deg,#3b82f6,#1d4ed8);border:none;border-radius:12px;align-items:center;gap:8px;margin-bottom:24px;padding:15px 38px;font-family:inherit;font-size:15px;font-weight:600;transition:transform .2s,box-shadow .2s;display:inline-flex;box-shadow:0 4px 20px #2563eb73}.pf-cta-btn:hover{transform:translateY(-2px)scale(1.03);box-shadow:0 10px 30px #2563eba6}.pf-cta-phone{color:#64748b;font-size:14px;display:block}.pf-cta-phone a{color:#60a5fa;text-decoration:none;transition:color .2s}.pf-cta-phone a:hover{color:#93c5fd}@media (max-width:768px){.portfolio-hero h1{letter-spacing:-.5px;font-size:34px}.portfolio-hero p{font-size:15px}.projects-grid{padding:20px}.pf-cta-inner h2{font-size:30px}.pf-cta-btn{justify-content:center;width:100%}}
