.portfolio-hero{text-align:center;background:#f8f9fa;padding:120px 0 80px}.portfolio-hero .hero-title{color:#2a2a2a;margin-bottom:10px;font-family:Montserrat,sans-serif;font-size:42px;font-weight:700;animation:.8s forwards portfolioFadeInUp}.portfolio-hero .hero-subtitle{color:#666;opacity:0;margin-bottom:30px;font-size:18px;font-weight:600;animation:.8s .2s forwards portfolioFadeInUp}@keyframes portfolioFadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.portfolio-hero .hero-contact{color:#666;opacity:0;justify-content:center;align-items:center;gap:10px;font-size:15px;animation:.8s .4s forwards portfolioFadeInUp;display:flex}.portfolio-hero .hero-contact i{color:#f05a21;font-size:16px}.portfolio-hero .hero-contact a{color:#f05a21;font-weight:600;text-decoration:none;transition:all .3s}.portfolio-hero .hero-contact a:hover{text-decoration:underline}.portfolio{background:#fff;padding:60px 0 80px}.portfolio-search{max-width:600px;margin:0 auto 40px}.search-wrapper{align-items:center;display:flex;position:relative}.search-wrapper i{color:#999;font-size:16px;position:absolute;left:20px}.search-input{color:#2a2a2a;background:#fff;border:1px solid #e9ecef;border-radius:30px;outline:none;width:100%;padding:15px 20px 15px 50px;font-size:15px;transition:all .3s}.search-input:focus{border-color:#f05a21;box-shadow:0 0 0 3px #f05a211a}.search-input::placeholder{color:#999}.portfolio-filter{flex-wrap:wrap;justify-content:center;gap:12px;margin-bottom:50px;display:flex}.filter-btn{color:#666;cursor:pointer;background:#fff;border:1px solid #e9ecef;border-radius:30px;padding:12px 24px;font-size:15px;font-weight:500;transition:all .3s}.filter-btn:hover{color:#f05a21;border-color:#f05a21}.filter-btn.active{color:#fff;background:#f05a21;border-color:#f05a21}.portfolio-grid{grid-template-columns:repeat(3,1fr);gap:30px;max-width:1200px;margin:0 auto;display:grid}.portfolio-item{cursor:pointer;background:#fff;transition:all .3s;overflow:hidden}.portfolio-item a{color:inherit;flex-direction:column;text-decoration:none;display:flex}.portfolio-item:hover{opacity:.9}.portfolio-image{background:#f8f9fa;border-radius:16px;width:100%;height:250px;position:relative;overflow:hidden}.portfolio-image img{object-fit:cover;width:100%;height:100%;transition:transform .3s}.portfolio-item:hover .portfolio-image img{transform:scale(1.05)}.tag-category{color:#fff;vertical-align:top;white-space:nowrap;background:#f05a21d9;border-radius:4px;flex-shrink:0;margin-top:3px;margin-right:8px;padding:4px 8px;font-size:11px;font-weight:600;display:inline-block}.image-placeholder{color:#fff;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);justify-content:center;align-items:center;width:100%;height:100%;font-size:48px;display:flex}.image-placeholder.dark{background:linear-gradient(135deg,#434343 0%,#000 100%)}.portfolio-info{background:#fff;align-items:flex-start;padding:16px 0 10px;display:flex;position:relative}.portfolio-title{color:#2a2a2a;-webkit-line-clamp:2;-webkit-box-orient:vertical;flex:1;font-size:15px;font-weight:600;line-height:1.5;display:-webkit-box;overflow:hidden}.project-proposal{border-top:1px solid #e9ecef;margin-top:80px;padding-top:40px}.proposal-content{color:#666;justify-content:center;align-items:center;gap:12px;font-size:16px;display:flex}.proposal-content i{color:#f05a21;font-size:20px}.proposal-content a{color:#f05a21;font-weight:600;text-decoration:none;transition:all .3s}.proposal-content a:hover{text-decoration:underline}@media (max-width:991px){.portfolio-hero .hero-title{font-size:36px}.portfolio-grid{grid-template-columns:repeat(2,1fr);gap:25px}.portfolio-image{height:220px}}@media (max-width:576px){.portfolio-hero{padding:100px 0 60px}.portfolio-hero .hero-title{font-size:28px}.portfolio-hero .hero-subtitle{margin-bottom:25px;font-size:16px}.portfolio-hero .hero-contact{flex-wrap:wrap;font-size:14px}.portfolio-search{margin-bottom:30px}.search-input{padding:12px 15px 12px 45px;font-size:14px}.search-wrapper i{font-size:14px;left:15px}.portfolio-filter{gap:8px;margin-bottom:40px}.filter-btn{padding:10px 18px;font-size:14px}.portfolio-grid{grid-template-columns:1fr;gap:20px}.portfolio-image{height:200px}.portfolio-info{padding:15px 5px 10px}.portfolio-title{font-size:15px}.tag-category{margin-right:6px;padding:3px 6px;font-size:10px}.project-proposal{margin-top:60px;padding-top:30px}.proposal-content{flex-direction:column;gap:8px;font-size:14px}}
