.portfolio-page{width:100%;overflow-x:hidden}.portfolio-hero{text-align:center;opacity:0;background:linear-gradient(135deg,#f0f4f8 0%,#fff 100%);padding:120px 24px 80px;transition:opacity .8s,transform .8s;transform:translateY(30px)}.portfolio-hero.visible{opacity:1;transform:translateY(0)}.portfolio-hero-container{max-width:900px;margin:0 auto}.portfolio-hero-title{color:#1a1a1a;margin-bottom:24px;font-size:60px;font-weight:700;line-height:1.2}.portfolio-hero-subtitle{color:#666;font-size:20px;line-height:1.75}.portfolio-stats{opacity:0;background:#fff;padding:60px 24px;transition:opacity .8s,transform .8s;transform:translateY(30px)}.portfolio-stats.visible{opacity:1;transform:translateY(0)}.portfolio-stats-container{grid-template-columns:repeat(4,1fr);gap:32px;max-width:1280px;margin:0 auto;display:grid}.portfolio-stat-card{text-align:center;opacity:0;background:linear-gradient(135deg,#f8f9fa 0%,#fff 100%);border:1px solid #e5e7eb;border-radius:16px;padding:32px 24px;animation:.6s forwards fadeInUp;box-shadow:0 4px 12px #0000000f}.stat-number{color:#2563eb;margin-bottom:12px;font-size:48px;font-weight:700;line-height:1}.stat-label{color:#666;font-size:14px;font-weight:500}.portfolio-projects-section{background:#f0f4f8;padding:80px 24px}.portfolio-projects-container{max-width:1280px;margin:0 auto}.portfolio-filters{flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:60px;display:flex}.portfolio-filter-btn{color:#666;cursor:pointer;background:#fff;border:2px solid #e5e7eb;border-radius:100px;align-items:center;gap:8px;padding:12px 28px;font-size:15px;font-weight:600;transition:all .3s;display:inline-flex}.portfolio-filter-btn:hover{color:#2563eb;border-color:#2563eb;transform:translateY(-2px);box-shadow:0 4px 12px #2563eb26}.portfolio-filter-btn.active{color:#fff;background:#2563eb;border-color:#2563eb;box-shadow:0 4px 16px #2563eb4d}.filter-count{background:#ffffff40;border-radius:10px;padding:2px 8px;font-size:13px;font-weight:700}.portfolio-filter-btn.active .filter-count{background:#ffffff4d}.portfolio-filter-btn:not(.active) .filter-count{color:#2563eb;background:#f0f4f8}.portfolio-projects-grid{grid-template-columns:repeat(3,1fr);gap:32px;display:grid}.portfolio-project-card{opacity:0;backface-visibility:hidden;background:#fff;border-radius:20px;transition:all .3s;animation:.6s forwards fadeInUp;overflow:hidden;transform:translateZ(0);box-shadow:0 4px 12px #00000014}.portfolio-project-card:hover{transform:translateY(-8px)translateZ(0);box-shadow:0 12px 32px #00000026}.portfolio-project-image-wrapper{background:#f0f4f8;width:100%;height:240px;position:relative;overflow:hidden}.portfolio-project-image{object-fit:cover;width:100%;height:100%;transition:transform .4s}.portfolio-project-card:hover .portfolio-project-image{transform:scale(1.05)}.portfolio-project-overlay{opacity:0;background:linear-gradient(#0000 0%,#000000b3 100%);justify-content:center;align-items:flex-end;padding:24px;transition:opacity .3s;display:flex;position:absolute;inset:0}.portfolio-project-card:hover .portfolio-project-overlay{opacity:1}.portfolio-view-details{color:#fff;align-items:center;gap:8px;font-size:16px;font-weight:600;display:inline-flex}.portfolio-view-details:after{content:"→";font-size:18px}.portfolio-project-body{padding:24px}.portfolio-project-meta{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.portfolio-project-badge{text-transform:uppercase;letter-spacing:.5px;border-radius:100px;padding:6px 14px;font-size:12px;font-weight:700}.portfolio-project-year{color:#666;font-size:14px;font-weight:600}.portfolio-project-title{color:#1a1a1a;margin-bottom:12px;font-size:20px;font-weight:700;line-height:1.3}.portfolio-project-description{color:#666;margin-bottom:16px;font-size:14px;line-height:1.6}.portfolio-project-details{border-bottom:1px solid #e5e7eb;flex-direction:column;gap:8px;margin-bottom:12px;padding-bottom:12px;display:flex}.portfolio-detail-item{color:#666;align-items:center;gap:8px;font-size:13px;display:flex}.portfolio-detail-item svg{color:#2563eb;flex-shrink:0}.portfolio-project-scope{color:#444;font-size:13px;line-height:1.5}.portfolio-project-scope strong{color:#1a1a1a;font-weight:700}.portfolio-empty-state{text-align:center;padding:80px 24px}.portfolio-empty-state p{color:#666;font-size:18px}.portfolio-cta{text-align:center;background:linear-gradient(135deg,#2563eb 0%,#1d4ed8 100%);padding:80px 24px}.portfolio-cta-container{max-width:800px;margin:0 auto}.portfolio-cta-title{color:#fff;margin-bottom:20px;font-size:42px;font-weight:700;line-height:1.2}.portfolio-cta-text{color:#fffffff2;margin-bottom:40px;font-size:18px;line-height:1.6}.portfolio-cta-buttons{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.portfolio-cta-btn-primary,.portfolio-cta-btn-secondary{cursor:pointer;border-radius:100px;justify-content:center;align-items:center;height:48px;padding:14px 32px;font-size:16px;font-weight:600;text-decoration:none;transition:all .3s;display:inline-flex}.portfolio-cta-btn-primary{color:#fff;background:#ff8c42;border:2px solid #0000}.portfolio-cta-btn-primary:hover{background:#e67a32;transform:translateY(-2px);box-shadow:0 8px 20px #ff8c4266}.portfolio-cta-btn-secondary{color:#fff;background:0 0;border:2px solid #fff}.portfolio-cta-btn-secondary:hover{color:#2563eb;background:#fff;transform:translateY(-2px);box-shadow:0 8px 20px #ffffff4d}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@media (max-width:1024px){.portfolio-hero-title{font-size:48px}.portfolio-hero-subtitle{font-size:18px}.portfolio-stats-container{grid-template-columns:repeat(2,1fr)}.portfolio-projects-grid{grid-template-columns:repeat(2,1fr);gap:24px}.portfolio-cta-title{font-size:36px}}@media (max-width:768px){.portfolio-hero{padding:100px 20px 60px}.portfolio-hero-title{font-size:36px}.portfolio-hero-subtitle{font-size:16px}.portfolio-stats{padding:40px 20px}.portfolio-stats-container{grid-template-columns:1fr;gap:16px}.portfolio-stat-card{padding:24px 16px}.stat-number{font-size:36px}.portfolio-projects-section{padding:60px 20px}.portfolio-filters{gap:8px;margin-bottom:40px}.portfolio-filter-btn{padding:10px 20px;font-size:14px}.portfolio-projects-grid{grid-template-columns:1fr;gap:24px}.portfolio-project-image-wrapper{height:200px}.portfolio-project-body{padding:20px}.portfolio-project-title{font-size:18px}.portfolio-cta{padding:60px 20px}.portfolio-cta-title{font-size:28px}.portfolio-cta-text{font-size:16px}.portfolio-cta-buttons{flex-direction:column;width:100%}.portfolio-cta-btn-primary,.portfolio-cta-btn-secondary{width:100%}}
