/* Portfolio page styles (page-specific, complements base.css) */

/* Hero */
.portfolio-hero .hero-cta { display: inline-flex; gap: var(--space-12); flex-wrap: wrap; }

/* Filter bar */
.filter-bar { margin-top: var(--space-24); }
.filter-list { display: inline-flex; gap: 8px; flex-wrap: wrap; }
.filter-list .btn { padding: 10px 14px; }
.filter-list .btn.is-active { outline: 2px solid color-mix(in oklab, var(--color-primary) 60%, transparent); background: rgba(30,167,255,0.12); color: var(--color-primary); }

/* Gallery */
.gallery { display: grid; gap: var(--space-24); grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1100px) { .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .gallery { grid-template-columns: 1fr; } }

.gallery-figure { position: relative; overflow: hidden; border-radius: var(--radius-lg); }
.gallery-media { width: 100%; height: 100%; aspect-ratio: 16/9; object-fit: cover; border-radius: var(--radius-lg); }
.gallery-item { padding: 0; overflow: hidden; }
.gallery-item .gallery-meta { padding: clamp(var(--space-16), 2.5vw, var(--space-24)); }
.gallery-title { margin-bottom: var(--space-8); }
.gallery-desc { color: var(--color-text-muted); margin-bottom: var(--space-12); }
.gallery-tags { display: inline-flex; gap: 8px; margin-bottom: var(--space-12); flex-wrap: wrap; }

/* Subtle hover lift */
.gallery-item { transition: transform var(--duration-base) var(--easing-standard), box-shadow var(--duration-base) var(--easing-standard); }
.gallery-item:hover { transform: translateY(-2px); box-shadow: var(--shadow-lg); }

/* Process */
.process-list {list-style: none; counter-reset: step; display: grid; gap: var(--space-24); grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 900px) { .process-list { grid-template-columns: 1fr; } }
.process-step { background: linear-gradient(180deg, color-mix(in oklab, var(--color-surface) 92%, transparent), var(--color-surface)); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: clamp(var(--space-20), 3vw, var(--space-32)); box-shadow: var(--shadow-md); }
.process-step h3 { position: relative; padding-left: 64px; margin-bottom: var(--space-8); }
.process-step h3::before { counter-increment: step; content: counter(step); position: absolute; left: 0; top: 0; width: 52px; height: 52px; display: grid; place-items: center; border-radius: var(--radius-round); background: rgba(30,167,255,0.15); color: var(--color-primary); border: 1px solid color-mix(in oklab, var(--color-primary) 45%, transparent); font-weight: 700; }

/* Awards */
.awards-grid .card p { margin: 0; }

/* Contact */
.cta-box { display: grid; align-items: center; }
.inline-actions { display: inline-flex; gap: var(--space-12); flex-wrap: wrap; }
.contact-list { display: grid; gap: 4px; color: var(--color-text-muted); }