.page-intro { padding:calc(var(--nav-h) + 65px) var(--pad) 50px; }
.portfolio-heading h1 { font:400 clamp(5rem,17vw,20rem)/1 var(--serif); letter-spacing:-.06em; margin:28px 0 35px; }
.title-dot { color:var(--accent); }
.portfolio-heading__bottom { display:flex; justify-content:space-between; align-items:end; gap:20px; }
.portfolio-heading__bottom p { color:var(--muted); font-size:.9rem; }
.portfolio-controls { position:sticky; top:var(--nav-h); z-index:30; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px var(--pad); background:var(--bg); border-top:1px solid var(--line); border-bottom:1px solid var(--line); transition:background-color .65s,color .65s; }
.filters { display:flex; gap:24px; align-items:center; }
.filter-btn { border:0; background:none; min-height:44px; padding:10px 0; font-size:.62rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }
.filter-btn.is-active { color:var(--fg); box-shadow:inset 0 -1px currentColor; }
.portfolio-count { font-size:.62rem; color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums; }
.portfolio-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:3vw; row-gap:8vw; padding:5vw var(--pad) 10vw; align-items:start; }
.portfolio-item { margin:0; min-width:0; }
.portfolio-item[data-slot='0'] { grid-column:1/span 6; }
.portfolio-item[data-slot='1'] { grid-column:9/span 4; margin-top:12vw; }
.portfolio-item[data-slot='2'] { grid-column:2/span 4; }
.portfolio-item[data-slot='3'] { grid-column:7/span 6; margin-top:8vw; }
.portfolio-item[data-slot='4'] { grid-column:1/span 5; }
.portfolio-item[data-slot='5'] { grid-column:8/span 5; margin-top:10vw; }
.portfolio-image { display:block; position:relative; overflow:hidden; background:#242424; }
.portfolio-image img { height:auto; transition:transform .85s var(--ease); }
.portfolio-image:hover img { transform:scale(1.025); }
.image-open { position:absolute; right:12px; bottom:12px; display:grid; place-items:center; width:38px; height:38px; background:#0a0a0abb; color:#fafaf7; opacity:0; transform:translateY(5px); transition:opacity .3s,transform .3s; }
.image-open svg { width:18px; }
.portfolio-image:hover .image-open,.portfolio-image:focus-visible .image-open { opacity:1; transform:none; }
.portfolio-item__meta { display:flex; justify-content:space-between; gap:12px; padding-top:14px; font-size:.57rem; letter-spacing:.11em; text-transform:uppercase; }
.portfolio-item__meta span:last-child { color:var(--muted); }
.archive-end { display:flex; flex-direction:column; gap:35px; }
.archive-end > a { font:400 clamp(3.5rem,9vw,10rem)/1 var(--serif); letter-spacing:-.045em; display:flex; align-items:center; gap:2vw; }
.archive-end > a svg { width:6vw; height:6vw; margin-left:auto; }
.image-viewer { position:fixed; inset:0; margin:0; width:100%; max-width:none; height:100%; max-height:none; padding:0 var(--pad); background:#0a0a0a; color:#f1eee8; border:0; }
.image-viewer[open] { display:grid; grid-template-rows:70px minmax(0,1fr) 70px; }
.image-viewer::backdrop { background:#0a0a0a; }
.viewer-toolbar,.viewer-navigation { display:flex; justify-content:space-between; align-items:center; gap:16px; }
.viewer-toolbar button,.viewer-navigation button { background:none; border:0; display:flex; align-items:center; gap:14px; font-size:.63rem; text-transform:uppercase; letter-spacing:.12em; padding:12px 0; min-width:44px; min-height:44px; }
.viewer-toolbar svg,.viewer-navigation svg { width:20px; height:20px; }
.viewer-prev svg { transform:rotate(180deg); }
.viewer-figure { min-height:0; display:grid; grid-template-rows:minmax(0,1fr) auto; gap:18px; }
.viewer-image { object-fit:contain; min-height:0; max-width:100%; }
.viewer-figure figcaption { text-align:center; font-size:.62rem; letter-spacing:.08em; min-height:20px; }
.viewer-counter { font-size:.62rem; font-variant-numeric:tabular-nums; }