.portfolio-page-content {
    position: relative; z-index: 20; padding: 130px 8% 80px 8%;
    display: flex; flex-direction: column; align-items: flex-start; text-align: left;
}

.portfolio-header-title { margin-bottom: 35px; max-width: 800px; }
.portfolio-header-title h1 {
    font-size: 2.8rem; font-weight: 900; margin-bottom: 12px;
    background: linear-gradient(45deg, var(--text-color), var(--luxury-gold));
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}
.portfolio-header-title p { font-size: 1.1rem; color: var(--desc-color); line-height: 1.6; }

.portfolio-grid-box {
    width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-bottom: 50px;
}

.portfolio-card-item {
    background: var(--card-bg); border: 2px solid var(--border-color); border-radius: 18px;
    overflow: hidden; text-decoration: none; color: var(--text-color); display: flex; flex-direction: column;
    transition: all 0.4s ease; position: relative; backdrop-filter: blur(16px);
}
.portfolio-card-item:hover { border-color: var(--luxury-gold); transform: translateY(-8px); background: var(--card-hover); }

.portfolio-img-box { width: 100%; height: 220px; overflow: hidden; position: relative; }
.portfolio-img-box img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.portfolio-card-item:hover .portfolio-img-box img { transform: scale(1.1); }

.portfolio-content-box { padding: 20px; display: flex; flex-direction: column; gap: 8px; flex-grow: 1; justify-content: center; }
.portfolio-content-box h3 { font-size: 18px; color: var(--luxury-gold); font-weight: 900; }
.portfolio-content-box span { font-size: 13.5px; color: var(--desc-color); opacity: 0.9; }

.visit-badge-tag {
    position: absolute; top: 12px; right: 12px; background: rgba(5, 5, 8, 0.85); border: 1px solid var(--luxury-gold);
    color: var(--luxury-gold); font-size: 11px; padding: 4px 10px; border-radius: 12px; opacity: 0; transition: 0.3s ease;
}
.portfolio-card-item:hover .visit-badge-tag { opacity: 1; }

@media (max-width: 1024px) {
    .portfolio-grid-box { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .portfolio-grid-box { grid-template-columns: 1fr; }
}