:root{--bg-dark:#0a0a0c;--bg-darker:#070708;--bg-card:#121216;--primary:#c6f24d;--primary-light:#d9ff5e;--accent:#ffb24d;--accent-light:#ff7a3d;--purple:#a78bff;--cyan:#5ce08a;--green:#5ce08a;--text:#f4f4ef;--text-muted:#b6b6b0;--text-dim:#76767e;--border:#ffffff14;--border-light:#ffffff24;--gradient:linear-gradient(135deg, #c6f24d 0%, #a78bff 50%, #ffb24d 100%);--gradient-blue:linear-gradient(135deg, #c6f24d 0%, #5ce08a 100%);--gradient-orange:linear-gradient(135deg, #ffb24d 0%, #ff7a3d 100%);--gradient-purple:linear-gradient(135deg, #b79bff 0%, #7c5cff 100%);--gradient-text:linear-gradient(135deg, #c6f24d 0%, #ffb24d 100%);--shadow-orange:0 14px 40px #ff8a3d47;--bg-card-light:#17171d;--bg-card2:#1d1d25;--primary-dark:#a6d62c;--accent2:#a78bff;--accent3:#5ce08a;--red:#ff6b6b;--muted:#76767e;--glow:#c6f24d4d;--lime-ink:#0c1004;--shadow:0 18px 50px #0000008c}.hero{text-align:center;padding:5rem 1.5rem 3.5rem;position:relative;overflow:hidden}.hero:before{content:"";pointer-events:none;background:radial-gradient(80% 60% at 50% 0,#c6f24d1f 0%,#0000 70%);position:absolute;inset:0}.hero-inner{max-width:860px;margin:0 auto;position:relative}.eyebrow{color:var(--primary-light);letter-spacing:.08em;text-transform:uppercase;background:#c6f24d1f;border:1px solid #c6f24d40;border-radius:50px;align-items:center;gap:.5rem;margin-bottom:1.5rem;padding:.35rem 1rem;font-size:.8rem;font-weight:700;display:inline-flex}.eyebrow:before{content:"";background:var(--primary-light);border-radius:50%;width:6px;height:6px;animation:2s infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}h1{letter-spacing:-.02em;margin-bottom:1.25rem;font-size:clamp(2rem,5vw,3.2rem);font-weight:800;line-height:1.2}.gradient{background:var(--gradient-text);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero-lead{color:var(--text-muted);max-width:560px;margin:0 auto 2.5rem;font-size:1.05rem}.filter-tabs{flex-wrap:wrap;justify-content:center;gap:.5rem;margin-bottom:3rem;display:flex}.tab-btn{border:1px solid var(--border-light);color:var(--text-muted);cursor:pointer;background:0 0;border-radius:50px;padding:.5rem 1.25rem;font-family:Plus Jakarta Sans,sans-serif;font-size:.85rem;font-weight:600;transition:all .25s}.tab-btn:hover{border-color:var(--primary);color:var(--primary-light)}.tab-btn.active{background:var(--primary);border-color:var(--primary);color:#fff}.grid-section{max-width:1200px;margin:0 auto;padding:0 1.5rem 5rem}.portfolio-grid{grid-template-columns:repeat(3,1fr);gap:1.5rem;display:grid}@media (max-width:900px){.portfolio-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:580px){.portfolio-grid{grid-template-columns:1fr}}.card{background:var(--bg-card);border:1px solid var(--border);opacity:0;border-radius:16px;flex-direction:column;transition:transform .3s,box-shadow .3s,opacity .4s;display:flex;overflow:hidden;transform:translateY(20px)}.card.visible{opacity:1;transform:translateY(0)}.card.hidden{display:none}.card:hover{transform:translateY(-6px);box-shadow:0 20px 50px #0006}.card-top{width:100%;height:5px}.card-body{flex-direction:column;flex:1;padding:1.5rem;display:flex}.card-badge{letter-spacing:.07em;text-transform:uppercase;border-radius:50px;margin-bottom:1rem;padding:.25rem .75rem;font-size:.7rem;font-weight:700;display:inline-block}.card-title{margin-bottom:.6rem;font-size:1.15rem;font-weight:800;line-height:1.3}.card-desc{color:var(--text-muted);flex:1;margin-bottom:1.25rem;font-size:.88rem;line-height:1.6}.card-live{color:var(--green);background:#5ce08a1a;border-radius:4px;align-items:center;gap:.3rem;width:fit-content;margin-bottom:.75rem;padding:.2rem .6rem;font-size:.78rem;font-weight:700;display:inline-flex}.card-live:before{content:"";background:var(--green);border-radius:50%;width:6px;height:6px}.tech-stack{flex-wrap:wrap;gap:.4rem;margin-top:auto;display:flex}.tech-tag{border:1px solid var(--border);color:var(--text-muted);background:#ffffff0d;border-radius:4px;padding:.2rem .6rem;font-size:.72rem;font-weight:600}.grad-blue .card-top{background:var(--gradient-blue)}.grad-blue .card-badge{color:#d9ff5e;background:#c6f24d26}.grad-orange .card-top{background:var(--gradient-orange)}.grad-orange .card-badge{color:#ff7a3d;background:#ffb24d26}.grad-purple .card-top{background:var(--gradient-purple)}.grad-purple .card-badge{color:#a78bfa;background:#a78bff26}.grad-green .card-top{background:linear-gradient(135deg,#5ce08a 0%,#059669 100%)}.grad-green .card-badge{color:#34d399;background:#5ce08a26}.grad-cyan .card-top{background:linear-gradient(135deg,#5ce08a 0%,#0891b2 100%)}.grad-cyan .card-badge{color:#22d3ee;background:#06b6d426}.grad-purple2 .card-top{background:linear-gradient(135deg,#a78bff 0%,#7c3aed 100%)}.grad-purple2 .card-badge{color:#c4b5fd;background:#a78bff26}.stats-bar{background:var(--bg-darker);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:2.5rem 1.5rem}.stats-inner{text-align:center;grid-template-columns:repeat(4,1fr);gap:1.5rem;max-width:900px;margin:0 auto;display:grid}@media (max-width:580px){.stats-inner{grid-template-columns:repeat(2,1fr)}}.stat-num{background:var(--gradient-text);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:2rem;font-weight:800;line-height:1}.stat-label{color:var(--text-muted);margin-top:.35rem;font-size:.82rem;font-weight:600}.cta-section{text-align:center;padding:5rem 1.5rem;position:relative;overflow:hidden}.cta-section:before{content:"";pointer-events:none;background:radial-gradient(70% 60%,#ffb24d14 0%,#0000 70%);position:absolute;inset:0}.cta-inner{max-width:640px;margin:0 auto;position:relative}.cta-inner h2{letter-spacing:-.02em;margin-bottom:1rem;font-size:clamp(1.6rem,4vw,2.4rem);font-weight:800;line-height:1.25}.cta-inner p{color:var(--text-muted);margin-bottom:2rem;font-size:1rem}.cta-buttons{flex-wrap:wrap;justify-content:center;gap:1rem;display:flex}.btn-primary{background:var(--gradient-orange);color:#fff;box-shadow:var(--shadow-orange);border-radius:10px;align-items:center;gap:.5rem;padding:.8rem 1.75rem;font-size:.95rem;font-weight:700;transition:opacity .2s,transform .2s;display:inline-flex}.btn-primary:hover{opacity:.9;transform:translateY(-2px)}.btn-outline{color:var(--text-muted);border:1px solid var(--border-light);background:0 0;border-radius:10px;align-items:center;gap:.5rem;padding:.8rem 1.75rem;font-size:.95rem;font-weight:700;transition:all .2s;display:inline-flex}.btn-outline:hover{border-color:var(--primary);color:var(--primary-light)}.btn-primary,.tab-btn.active{color:var(--lime-ink)!important;-webkit-text-fill-color:var(--lime-ink)!important}