.portfolio-main {
    padding: 2rem 1rem;
}

.sticky-top {
    position: sticky;
    top: var(--wp-admin--admin-bar--height, 0px);
    z-index: 100;
    background-color: var(--bg-color, #ffffff);
    padding: 1rem 0;
    border-bottom: 1px solid var(--border-light, #eaeaea);
    backdrop-filter: blur(5px);
    max-width: 900px;
    margin: 0 auto;
}

.filter-list {
    display: flex;
    justify-content: center;
    gap: 1rem;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
}

.filter-btn {
    background: none;
    border: none;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    cursor: pointer;
    color: var(--text-muted, #666);
    padding: 0.5rem 1rem;
    transition: color 0.2s ease-in-out;
}

.filter-btn.active, .filter-btn:hover {
    color: var(--text-main, #000);
    font-weight: 700;
}

.portfolio-feed {
    max-width: 900px;
    margin: 3rem auto;
    display: flex;
    flex-direction: column;
    gap: 5rem;
    transition: opacity 0.3s ease;
}

.obra-item { width: 100%; }
.obra-img { width: 100%; height: auto; display: block; }
.obra-metadata { margin-top: 1rem; text-align: left; }
.obra-title { font-size: 1.25rem; margin: 0 0 0.25rem 0; font-weight: 600; color: var(--text-main, #1A1A1A); }
.obra-specs { font-size: 0.85rem; color: var(--text-muted, #666); margin: 0; }
.scroll-trigger { height: 1px; width: 100%; }
.no-results { text-align: center; color: var(--text-muted, #666); font-style: italic; }