/* Portfolio Archive Dedicated Styles */

/* Hero inherits global .hero-section.small-hero styles (gradient primary) */
.portfolio-hero { text-align:center; }
.portfolio-hero .container { max-width:100%; width:100%; padding-left:20px; padding-right:20px; }
.portfolio-hero .hero-text { max-width:none; width:100%; }
.portfolio-hero .hero-title { font-size:2.8rem; margin-bottom:.75rem; }
.portfolio-hero .hero-subtitle { font-size:1.05rem; max-width:1200px; margin:0 auto; opacity:.9; }
.site-main.portfolio-archive { padding-top:0 !important; }
.portfolio-filters-wrapper { position:sticky; top:70px; z-index:5; background:var(--background-light); border-bottom:1px solid var(--background-gray-dark,#eceff1); }
.filters-bar { display:flex; flex-wrap:wrap; gap:1.25rem; padding:18px 0; }
.filter-group { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.filter-label { font-size:.7rem; text-transform:uppercase; letter-spacing:.08em; color:var(--text-light); font-weight:600; }
.filter-chip { display:inline-block; padding:6px 14px; background:#f3f4f6; border-radius:999px; font-size:.75rem; font-weight:500; color:#374151; transition:.25s; }
.filter-chip:hover { background:#e5e7eb; color:var(--primary-color); }
.filter-chip.active { background:var(--primary-color); color:#fff; }
.portfolio-masonry { column-count:4; column-gap:14px; }
/* JS Masonry override */
.portfolio-masonry.masonry-managed { column-count:initial; column-gap:0; position:relative; }
.portfolio-masonry.masonry-managed .portfolio-item { position:absolute; margin:0; width:100%; }
.portfolio-masonry.masonry-managed .portfolio-item.pending { opacity:0; }
.portfolio-masonry.masonry-managed .portfolio-item:not(.pending) { transition:opacity .4s ease; opacity:1; }
@media (max-width:1200px){ .portfolio-masonry { column-count:3; } }
@media (max-width:900px){ .portfolio-masonry { column-count:2; } }
@media (max-width:560px){ .portfolio-masonry { column-count:1; } }
.portfolio-item { break-inside:avoid; margin:0 0 14px; position:relative; overflow:hidden; border-radius:12px; box-shadow:var(--shadow-light); background:var(--background-light); }
.portfolio-item .media-wrapper { position:relative; }
.portfolio-item img.portfolio-thumb { width:100%; height:auto; display:block; object-fit:cover; transition:transform .6s ease; }
.portfolio-item:hover img.portfolio-thumb { transform:scale(1.05); }
.portfolio-caption { position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.0) 35%, rgba(0,0,0,.65) 100%); color:#fff; display:flex; flex-direction:column; justify-content:flex-end; padding:18px 16px 14px; opacity:0; transition:opacity .4s; }
.portfolio-item:hover .portfolio-caption { opacity:1; }
.portfolio-item-title { font-size:1rem; margin:0 0 4px; }
.portfolio-item-meta { font-size:.65rem; opacity:.85; margin:0; letter-spacing:.05em; }
.portfolio-pagination { text-align:center; margin:50px 0 60px; }
.portfolio-pagination .page-numbers { display:inline-block; margin:0 4px; padding:8px 12px; background:#f3f4f6; border-radius:6px; font-size:.75rem; }
.portfolio-pagination .current { background:var(--primary-color); color:#fff; }

/* Load More */
.portfolio-load-more-wrap { text-align:center; margin:40px 0 80px; }
.portfolio-load-more { display:inline-block; padding:12px 26px; background:var(--primary-color); color:#fff; border-radius:50px; font-size:.85rem; letter-spacing:.05em; font-weight:500; transition:.3s; border:none; cursor:pointer; }
.portfolio-load-more:hover { background:var(--primary-dark); }
.portfolio-load-more[disabled] { background:#b7bbc1; cursor:default; }

/* Extra bottom spacer to separate last images from footer */
.portfolio-archive .portfolio-masonry { margin-bottom:90px; }

/* Lightbox */
.portfolio-lightbox { position:fixed; inset:0; background:rgba(0,0,0,.85); display:none; align-items:center; justify-content:center; z-index:5000; }
.portfolio-lightbox.open { display:flex; }
.portfolio-lightbox .lightbox-inner { position:relative; max-width:90vw; max-height:90vh; display:flex; align-items:center; justify-content:center; }
.portfolio-lightbox img { max-width:100%; max-height:90vh; width:auto; height:auto; display:block; margin:0 auto; object-fit:contain; background:rgba(255,255,255,0.04); border-radius:4px; }
/* Controles fijados al viewport para mantener posición estable */
.lightbox-close, .lightbox-prev, .lightbox-next { position:fixed; background:rgba(0,0,0,.55); color:#fff; border:none; padding:10px 16px; cursor:pointer; font-size:1.2rem; line-height:1; border-radius:6px; backdrop-filter: blur(4px); z-index:5100; transition:.25s; }
.lightbox-close { top:18px; right:22px; font-size:1.6rem; transform:none; }
.lightbox-prev, .lightbox-next { top:50%; transform:translateY(-50%); }
.lightbox-prev { left:28px; }
.lightbox-next { right:28px; }
.lightbox-close:hover, .lightbox-prev:hover, .lightbox-next:hover { background:rgba(0,0,0,.75); }
@media (max-width:900px){
	.lightbox-prev { left:10px; }
	.lightbox-next { right:10px; }
	.lightbox-close { right:14px; }
}

/* Scroll lock utility when lightbox is open */
html.lightbox-open, body.lightbox-open { overflow:hidden; height:100%; }
body.lightbox-open { width:100%; }