.portfolio-page{background:var(--paper);color:var(--ink)}
.portfolio-intro{padding:clamp(145px,16vw,215px) 6vw 64px;max-width:1500px;margin:auto}
.portfolio-intro .eyebrow{color:#795023}.portfolio-intro h1{font-family:var(--font-display,Georgia,serif);font-size:clamp(44px,6.5vw,94px);line-height:1.02;letter-spacing:-.045em;font-weight:400;margin:22px 0}.portfolio-intro>p:last-child{max-width:550px;font-size:18px;line-height:1.6;color:#55584f}
.portfolio{padding:0 6vw 80px;max-width:1500px;margin:auto}.portfolio-toolbar{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #ccc8bc;padding:22px 0 30px;gap:20px}.portfolio-toolbar>p{font-size:13px;color:#62645b;white-space:nowrap}.portfolio-filters{display:flex;gap:8px;flex-wrap:wrap}.portfolio-filters[hidden]{display:none}.portfolio-filters button{font:inherit;font-size:14px;padding:10px 18px;border:1px solid transparent;background:transparent;color:inherit;cursor:pointer;border-radius:2px}.portfolio-filters button[aria-pressed=true]{background:var(--ink);color:var(--linen)}.portfolio-filters button:hover{border-color:var(--ink)}
.portfolio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 28px}.portfolio-item{margin:0;min-width:0}.portfolio-item[hidden]{display:none}.portfolio-item a{display:block;position:relative;overflow:hidden;background:#d8d4c8}.portfolio-item img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform .35s ease}.portfolio-item a:hover img{transform:scale(1.025)}.portfolio-enlarge{position:absolute;bottom:14px;right:14px;width:38px;height:38px;background:var(--linen);color:var(--ink);display:grid;place-items:center;font-size:24px}.portfolio-item figcaption{padding-top:15px}.portfolio-item figcaption span{font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:#6b6254}.portfolio-item h2{font-family:Georgia,serif;font-weight:400;font-size:25px;margin:7px 0 0;line-height:1.25}
.portfolio-cta{background:var(--ink);color:var(--linen);padding:80px 6vw;text-align:center}.portfolio-cta h2{font:400 clamp(36px,5vw,62px)/1.1 Georgia,serif;margin:18px 0}.portfolio-cta>p:not(.eyebrow){max-width:490px;margin:0 auto 30px;line-height:1.7;color:#d6d4c8}.portfolio-footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:35px 6vw 90px;font-size:13px}
.photo-viewer{border:0;padding:22px;background:#171917;color:var(--linen);width:min(1200px,96vw);max-width:96vw;max-height:94dvh;overflow:auto}.photo-viewer::backdrop{background:rgb(0 0 0 / .88)}.viewer-close{display:block;margin:0 0 16px auto}.photo-viewer button{background:transparent;color:inherit;border:1px solid #72746b;min-width:44px;min-height:44px;padding:8px 12px;cursor:pointer;font:inherit}.viewer-stage{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:12px}.viewer-stage img{width:100%;height:65dvh;object-fit:contain}.viewer-caption{display:flex;justify-content:space-between;gap:16px;align-items:center;padding-top:16px;font-size:14px}.viewer-caption p{margin:0}.viewer-caption span{white-space:nowrap;color:#babdb2}body:has(.photo-viewer[open]){overflow:hidden}
@media(max-width:600px){.portfolio-intro{padding:135px 6vw 35px}.portfolio-intro>p:last-child{font-size:16px}.portfolio-toolbar{align-items:flex-start;flex-direction:column;gap:10px}.portfolio-toolbar>p{margin:0}.portfolio-filters{gap:2px}.portfolio-filters button{padding:10px 12px}.portfolio-grid{grid-template-columns:1fr;gap:30px}.portfolio-item h2{font-size:24px}.photo-viewer{padding:12px}.viewer-stage{grid-template-columns:44px 1fr 44px;gap:6px}.viewer-stage img{grid-column:1/-1;grid-row:1;height:55dvh}.viewer-prev{grid-column:1;grid-row:2}.viewer-next{grid-column:3;grid-row:2}.portfolio-footer{flex-direction:column}}
@media(prefers-reduced-motion:reduce){.portfolio-item img{transition:none}.portfolio-item a:hover img{transform:none}}
/* This page has a paper introduction rather than a photo behind the header. */
.portfolio-page .site-header{background:var(--ink);color:var(--linen)}
.portfolio-page .portfolio-intro{padding-top:160px;padding-bottom:42px}
@media(min-width:821px){.portfolio-page .portfolio-intro h1{font-size:clamp(44px,5.5vw,78px)}}
@media(max-width:820px){.portfolio-page .portfolio-intro{padding-top:140px}}
