.portfolio-hero{background:linear-gradient(135deg,#0d1b2e 0%,var(--primary) 50%,#2d4a7a 100%)}.portfolio-filter{padding:32px 0;background:var(--white);border-bottom:1px solid var(--neutral-100);position:sticky;top:56px;z-index:50}.filter-bar{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap}.filter-btn{padding:8px 20px;border:1px solid var(--neutral-200);border-radius:24px;background:var(--white);font-family:var(--font);font-size:14px;font-weight:500;color:var(--neutral-600);cursor:pointer;transition:all 0.2s}.filter-btn:hover{border-color:var(--primary);color:var(--primary)}.filter-btn.active{background:var(--primary);border-color:var(--primary);color:#ffffff}.portfolio-grid-section{padding:56px 0 80px;background:var(--neutral-50)}.portfolio-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.portfolio-item{animation:fadeInUp 0.4s ease forwards}@keyframes fadeInUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.portfolio-card{background:var(--white);border-radius:var(--radius);overflow:hidden;border:1px solid var(--neutral-200);transition:all 0.3s}.portfolio-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-xl);border-color:transparent}.portfolio-img{position:relative;height:240px;overflow:hidden;background:var(--neutral-100)}.portfolio-img img{width:100%;height:100%;object-fit:cover;transition:transform 0.4s}.portfolio-card:hover .portfolio-img img{transform:scale(1.06)}.portfolio-overlay{position:absolute;top:12px;left:12px}.portfolio-category{display:inline-block;padding:4px 12px;background:rgba(15,23,42,0.75);backdrop-filter:blur(4px);color:#ffffff;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:0.5px;border-radius:4px}.portfolio-info{padding:24px}.portfolio-info h3{font-size:18px;font-weight:700;color:var(--neutral-900);margin-bottom:8px}.portfolio-info p{font-size:14px;color:var(--neutral-600);line-height:1.6;margin-bottom:16px}.portfolio-tags{display:flex;flex-wrap:wrap;gap:6px}.portfolio-tags span{display:inline-block;padding:3px 10px;background:var(--neutral-50);border:1px solid var(--neutral-200);border-radius:4px;font-size:11px;font-weight:500;color:var(--neutral-600);text-transform:uppercase;letter-spacing:0.3px}@media (max-width:1024px){.portfolio-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.portfolio-grid{grid-template-columns:1fr;max-width:480px;margin:0 auto}.portfolio-filter{top:52px}.filter-bar{gap:6px}.filter-btn{padding:6px 14px;font-size:13px}}