/* HallowixStudios V20 — animated portfolio categories + DB-backed galleries */
.hx-portfolio-v20{--portfolio-cream:#f4eddf;--portfolio-ink:#47777b;--portfolio-edge:#e7d4a3;background:var(--bg,#231c18);min-height:100vh}
.portfolio-categories{padding:190px 0 110px;min-height:100vh;overflow:hidden}
.portfolio-stack{width:min(1240px,calc(100% - 44px));margin:auto;display:grid;gap:20px}
.portfolio-category{position:relative;display:block;width:min(1080px,86%);height:clamp(190px,15vw,235px);border:4px solid var(--portfolio-edge);border-radius:44px;background:var(--portfolio-cream);box-shadow:0 18px 52px rgba(0,0,0,.19),inset 0 0 0 1px rgba(46,36,30,.12);overflow:hidden;isolation:isolate;transform:translateZ(0);transition:transform .45s cubic-bezier(.16,1,.3,1),box-shadow .45s ease}
.portfolio-category:nth-child(odd){justify-self:end}.portfolio-category:nth-child(even){justify-self:start}
.portfolio-category:hover,.portfolio-category:focus-visible{transform:translateY(-3px);box-shadow:0 26px 72px rgba(0,0,0,.28),0 0 0 1px color-mix(in srgb,var(--lantern) 32%,transparent)}
.portfolio-category-label{position:absolute;inset-block:0;width:26%;display:grid;place-items:center;padding:30px;text-align:center;color:var(--portfolio-ink);font-family:Sora,system-ui,sans-serif;font-size:clamp(1.65rem,3vw,3.15rem);font-weight:800;letter-spacing:-.045em;z-index:1;text-shadow:0 2px 0 rgba(255,255,255,.4)}
.portfolio-category:nth-child(odd) .portfolio-category-label{left:0}.portfolio-category:nth-child(even) .portfolio-category-label{right:0}
.portfolio-category-media{position:absolute;inset:0;z-index:2;border-radius:38px;overflow:hidden;transition:transform .72s cubic-bezier(.16,1,.3,1);will-change:transform;background:#1e1814}
.portfolio-category-media::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.15),inset 0 -50px 80px rgba(20,14,10,.08)}
.portfolio-category-media img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.01);transition:transform .78s cubic-bezier(.16,1,.3,1),filter .45s ease}
.portfolio-category:nth-child(odd):hover .portfolio-category-media,.portfolio-category:nth-child(odd):focus-visible .portfolio-category-media{transform:translateX(26%)}
.portfolio-category:nth-child(even):hover .portfolio-category-media,.portfolio-category:nth-child(even):focus-visible .portfolio-category-media{transform:translateX(-26%)}
.portfolio-category:hover img,.portfolio-category:focus-visible img{transform:scale(1.045);filter:saturate(1.05) contrast(1.02)}

/* Gallery pages intentionally keep content image-first. */
.hx-portfolio-gallery{padding:148px 0 90px;min-height:78vh}
.portfolio-gallery-grid{width:min(1420px,calc(100% - 38px));margin:auto;columns:3 330px;column-gap:16px}
.portfolio-gallery-item{display:block;width:100%;margin:0 0 16px;border:0;padding:0;background:transparent;border-radius:20px;overflow:hidden;cursor:zoom-in;break-inside:avoid;box-shadow:0 15px 42px rgba(0,0,0,.18);transform:translateZ(0);transition:transform .28s cubic-bezier(.16,1,.3,1),box-shadow .28s ease}
.portfolio-gallery-item:hover{transform:translateY(-4px);box-shadow:0 23px 58px rgba(0,0,0,.28)}
.portfolio-gallery-item img{display:block;width:100%;height:auto;min-height:170px;object-fit:cover}
.portfolio-gallery-empty{width:min(860px,calc(100% - 36px));margin:15vh auto 0;text-align:center;padding:28px;border:1px solid var(--line);border-radius:20px;color:var(--muted);background:color-mix(in srgb,var(--surface) 82%,transparent);font-weight:800}
.portfolio-lightbox{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:34px;background:rgba(14,11,9,.88);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);opacity:0;visibility:hidden;pointer-events:none;transition:.24s}
.portfolio-lightbox.open{opacity:1;visibility:visible;pointer-events:auto}.portfolio-lightbox img{display:block;max-width:min(1500px,94vw);max-height:90vh;object-fit:contain;border-radius:18px;box-shadow:0 26px 90px rgba(0,0,0,.5)}
.portfolio-lightbox-close{position:absolute;right:20px;top:20px;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(46,36,30,.78);color:#fff;font-size:1.6rem;display:grid;place-items:center;cursor:pointer}
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:900px){.portfolio-categories{padding-top:140px}.portfolio-stack{gap:18px}.portfolio-category{width:100%;height:clamp(180px,29vw,240px);border-radius:34px}.portfolio-category-media{border-radius:28px}.portfolio-category-label{font-size:clamp(1.45rem,5vw,2.4rem)}}
@media(max-width:650px){.portfolio-categories{padding:112px 0 76px}.portfolio-stack{width:calc(100% - 22px);gap:14px}.portfolio-category{height:170px;border-width:3px;border-radius:26px}.portfolio-category-media{width:66%;border-radius:21px;transition:none!important}.portfolio-category:nth-child(odd) .portfolio-category-media{left:auto;right:0;transform:none!important}.portfolio-category:nth-child(even) .portfolio-category-media{right:auto;left:0;transform:none!important}.portfolio-category-label{width:34%;padding:10px;font-size:clamp(1.05rem,5.1vw,1.42rem);line-height:1.04}.portfolio-category:nth-child(odd) .portfolio-category-label{left:0}.portfolio-category:nth-child(even) .portfolio-category-label{right:0}.portfolio-category:hover,.portfolio-category:focus-visible{transform:none}.portfolio-gallery-grid{width:calc(100% - 22px);columns:1}.hx-portfolio-gallery{padding-top:105px}.portfolio-lightbox{padding:14px}.portfolio-lightbox-close{right:12px;top:78px}}
@media(prefers-reduced-motion:reduce){.portfolio-category,.portfolio-category-media,.portfolio-category-media img,.portfolio-gallery-item{transition:none!important}.portfolio-category:nth-child(odd):hover .portfolio-category-media,.portfolio-category:nth-child(even):hover .portfolio-category-media{transform:none!important}}