/* ---------- نمونه‌کارها ---------- */

.portfolio-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 1.4rem; }

.portfolio-card {
    border-radius: var(--radius); overflow: hidden; position: relative;
    border: 1px solid var(--line); background: #fff;
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
}
.portfolio-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); border-color: rgba(200,162,103,.55); }
.portfolio-card img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .5s ease; }
.portfolio-card:hover img { transform: scale(1.06); }

.portfolio-card figcaption {
    position: absolute; inset-inline: 0; bottom: 0;
    background: linear-gradient(to top, rgba(20,32,47,.9), transparent);
    color: #fff; padding: 2.2rem 1.1rem .9rem;
}
.portfolio-card figcaption strong { display: block; font-size: 1rem; }
.portfolio-card figcaption span { font-size: .82rem; color: rgba(255,255,255,.78); }

/* ریسپانسیو */
@media (max-width: 576px) {
    .portfolio-grid { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: .8rem; }
    .portfolio-card figcaption { padding: 1.6rem .7rem .6rem; }
    .portfolio-card figcaption strong { font-size: .85rem; }
    .portfolio-card figcaption span { display: none; }
}