/*-- ============================================= --*/
/*-- ================= PAGE HERO ================= --*/
/*-- ============================================= --*/




/*-- ===================================================== --*/
/*-- ================= FEATURES PROJECTS ================= --*/
/*-- ===================================================== --*/
.portfolio-wrapper {max-width: 1200px; margin: 0 auto; padding: 36px; background: rgba(17,17,24,0.65); border: 1px solid rgba(212,175,55,0.18); border-radius: 28px; backdrop-filter: blur(14px); box-shadow: 0 25px 60px rgba(0,0,0,0.4);}
.portfolio-card {background: linear-gradient(145deg,#111114,#1b1b24); border: 1px solid rgba(212,175,55,0.15); border-radius: 20px; overflow: hidden; transition: 0.4s ease; height: 100%;}
.portfolio-card:hover {transform: translateY(-10px); border-color: var(--gold); box-shadow: 0 25px 50px rgba(212,175,55,0.15);}
.portfolio-img { height: 200px; overflow: hidden; }
.portfolio-img img { width:100%; height:100%; object-fit:cover; transition:0.5s ease; }
.portfolio-card:hover img { transform: scale(1.08); }
.portfolio-content { padding: 24px; }
.portfolio-category { color:var(--gold); font-size:11px; text-transform:uppercase; letter-spacing:1.5px; margin-bottom:8px; font-weight:600; }
.portfolio-content h4 { color:#fff; font-size:20px; margin-bottom:10px; }
.portfolio-content p  { color:#aaa; font-size:13.5px; line-height:1.8; }
.portfolio-tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.portfolio-tags span { background:rgba(212,175,55,0.07); border:1px solid rgba(212,175,55,0.15); color:#ddd; padding:5px 12px; border-radius:30px; font-size:11.5px; }
.carousel-control-prev,
.carousel-control-next { width:52px; height:52px; top:50%; transform:translateY(-50%); background:#111114; border:1px solid rgba(212,175,55,0.3); border-radius:50%; opacity:1; transition:all 0.3s; }
.carousel-control-prev:hover,
.carousel-control-next:hover { background:var(--gold); border-color:var(--gold); }
.carousel-control-prev { left:-26px; }
.carousel-control-next { right:-26px; }
.carousel-indicators { bottom:-55px; }
.carousel-indicators button { width:8px !important; height:8px !important; border-radius:50%; background:var(--gold) !important; opacity:0.4; }
.carousel-indicators button.active { opacity:1; }
.custom-portfolio-wrapper {overflow: hidden; width: 100%; padding: 20px 0; position: relative;}
.custom-portfolio-row {display: flex; gap: 20px; width: max-content; animation: scroll-it 20s linear infinite; }
.custom-portfolio-row:hover {animation-play-state: paused;}
.portfolio-item-col {width: 285px; flex-shrink: 0;}
@keyframes scroll-it {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(calc(-285px * 5 - 20px * 5)); 
    }
}
