.project-images-section{background:var(--surface)}
.images-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:50px}
.images-heading h2{font-size:clamp(2.8rem,6vw,6rem);margin-top:15px}
.images-heading>p{max-width:330px;color:var(--muted);margin:0 0 8px}
.project-image-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:44px 20px}
.project-image-card{display:block;width:100%;padding:0;border:0;background:none;color:inherit;text-align:left;cursor:zoom-in}
.image-card-frame{position:relative;display:block;overflow:hidden;aspect-ratio:4/3;background:#eceae6}
.image-card-frame img{width:100%;height:100%;display:block;object-fit:contain;object-position:center top;background:#eceae6;transition:transform .55s cubic-bezier(.22,.75,.2,1)}
.project-image-card:hover .image-card-frame img{transform:scale(1.035)}
.image-zoom{position:absolute;right:18px;bottom:18px;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#111b;color:#fff;font-size:1.2rem;backdrop-filter:blur(8px);transition:.25s}
.project-image-card:hover .image-zoom{background:var(--acid);color:#111;transform:rotate(45deg)}
.image-card-meta{display:flex;justify-content:space-between;align-items:end;padding-top:16px}
.image-card-meta small{display:block;color:var(--muted);text-transform:uppercase;letter-spacing:.12em;font-size:.67rem}
.image-card-meta strong{display:block;font:600 1.15rem Manrope;margin-top:6px}
.image-card-meta>b{font:500 .8rem Manrope;color:var(--muted)}
.viewer-open{overflow:hidden}
.image-viewer{width:100vw;max-width:none;height:100vh;max-height:none;margin:0;padding:0;border:0;background:#090a0bea;color:#fff;overflow:hidden;backdrop-filter:blur(18px)}
.image-viewer::backdrop{background:#000d}
.image-viewer[open]{display:grid;grid-template-columns:90px minmax(0,1fr) 90px;grid-template-rows:minmax(0,1fr) 112px;align-items:center}
.viewer-stage{grid-column:2;grid-row:1;align-self:stretch;min-width:0;margin:0;padding:28px 20px 12px;display:grid;grid-template-rows:minmax(0,1fr) auto}
.viewer-canvas{--viewer-zoom:1;width:100%;height:100%;min-width:0;min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-x pan-y pinch-zoom;scrollbar-color:#ffffff55 transparent;-webkit-overflow-scrolling:touch}
.viewer-canvas img{width:calc(100% * var(--viewer-zoom));height:calc(100% * var(--viewer-zoom));max-width:none;display:block;object-fit:contain;user-select:none;-webkit-user-select:none;-webkit-user-drag:none;transition:width .2s ease,height .2s ease}
.viewer-canvas.is-zoomed{touch-action:pan-x pan-y;cursor:grab}
.viewer-canvas.is-zoomed.is-panning{cursor:grabbing}
.viewer-stage figcaption{display:flex;justify-content:space-between;align-items:end;gap:25px;padding-top:16px}
.viewer-stage figcaption span{display:block;color:#aaa;text-transform:uppercase;letter-spacing:.13em;font-size:.68rem}
.viewer-stage figcaption h2{font-size:1.25rem;margin-top:5px}
.viewer-stage figcaption small{color:#aaa;white-space:nowrap}
.viewer-close{position:fixed;z-index:3;right:24px;top:18px;width:48px;height:48px;border:0;border-radius:50%;background:#ffffff16;color:#fff;font-size:2rem;line-height:1;cursor:pointer;backdrop-filter:blur(8px)}
.viewer-close:hover{background:var(--acid);color:#111}
.viewer-arrow{width:58px;height:58px;justify-self:center;border:1px solid #ffffff44;border-radius:50%;background:#1118;color:#fff;font-size:1.4rem;cursor:pointer;backdrop-filter:blur(8px)}
.viewer-arrow:hover{background:var(--acid);border-color:var(--acid);color:#111}
.viewer-prev{grid-column:1;grid-row:1}.viewer-next{grid-column:3;grid-row:1}
.viewer-zoom-controls{position:fixed;z-index:3;left:50%;top:18px;transform:translateX(-50%);display:flex;align-items:center;gap:4px;padding:5px;border:1px solid #ffffff24;border-radius:999px;background:#111b;backdrop-filter:blur(10px)}
.viewer-zoom-controls button{height:38px;min-width:38px;padding:0 10px;border:0;border-radius:999px;background:transparent;color:#fff;font:600 1.15rem Manrope,Arial,sans-serif;cursor:pointer}
.viewer-zoom-controls button:hover:not(:disabled){background:var(--acid);color:#111}
.viewer-zoom-controls button:disabled{opacity:.35;cursor:not-allowed}
.viewer-zoom-controls .viewer-zoom-level{min-width:72px;font-size:.78rem}
.viewer-filmstrip{grid-column:1/-1;grid-row:2;display:flex;align-items:center;justify-content:center;gap:10px;overflow-x:auto;padding:12px 24px 18px;border-top:1px solid #ffffff18;scrollbar-width:thin}
.viewer-filmstrip button{flex:0 0 94px;height:70px;padding:0;border:2px solid transparent;background:#222;opacity:.48;cursor:pointer;transition:.2s;overflow:hidden}
.viewer-filmstrip button:hover,.viewer-filmstrip button.active{opacity:1;border-color:var(--acid)}
.viewer-filmstrip img{width:100%;height:100%;display:block;object-fit:contain;object-position:center top;background:#eceae6}
@media(max-width:1100px){.project-image-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.images-heading{display:block;margin-bottom:35px}.images-heading>p{margin-top:20px}.project-image-list{grid-template-columns:1fr;gap:38px}.image-card-frame{aspect-ratio:4/3}.image-viewer[open]{grid-template-columns:60px minmax(0,1fr) 60px;grid-template-rows:minmax(0,1fr) 96px}.viewer-stage{padding:66px 4px 8px}.viewer-stage figcaption{padding-inline:8px}.viewer-stage figcaption h2{font-size:1rem}.viewer-arrow{width:44px;height:44px}.viewer-filmstrip{justify-content:flex-start;padding:10px 12px 14px}.viewer-filmstrip button{flex-basis:78px;height:58px}.viewer-close{right:12px;top:12px}.viewer-zoom-controls{top:12px}}
@media(max-width:520px){.image-viewer[open]{grid-template-columns:48px minmax(0,1fr) 48px}.viewer-stage{grid-column:1/-1;padding-inline:8px}.viewer-arrow{position:relative;z-index:2;background:#111c}.viewer-prev{grid-column:1}.viewer-next{grid-column:3}.viewer-stage figcaption{padding-inline:45px 4px}}
@media(prefers-reduced-motion:reduce){.image-card-frame img,.image-zoom,.viewer-canvas img{transition:none}}