.portfolio-section { margin-top: 5rem; }
.portfolio-section > p { max-width: 46rem; color: #52616a; }
.portfolio-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.5rem; margin-top: 2rem; }
.portfolio-grid figure { margin: 0; }
.portfolio-grid a { display: block; color: inherit; text-decoration: none; }
.portfolio-grid img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: center; background: #172128; transition: opacity .2s; }
.portfolio-grid a:hover img { opacity: .85; }
.portfolio-grid a:focus-visible { outline: 3px solid #67b8e5; outline-offset: 5px; }
.portfolio-grid figcaption { padding: .8rem 0; font-size: .85rem; line-height: 1.6; }
.portfolio-viewer { width: min(1400px,96vw); max-width: 96vw; max-height: 95dvh; border: 1px solid #64727c; padding: 1rem; background: #111b22; color: #fff; }
.portfolio-viewer::backdrop { background: #000d; }
.portfolio-viewer > img { display: block; width: 100%; max-height: 73dvh; object-fit: contain; }
.viewer-toolbar { display: flex; align-items: center; gap: .7rem; padding-bottom: .8rem; }
.viewer-toolbar p { flex: 1; margin: 0; font-size: .85rem; }
.viewer-toolbar button { min-width: 44px; min-height: 44px; border: 1px solid #748795; color: white; background: #22343f; cursor: pointer; }
.viewer-original { display: inline-block; padding-top: .8rem; color: #a2d8f5; }
@media(max-width:900px) { .portfolio-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:520px) { .portfolio-grid { grid-template-columns: minmax(0,1fr); } .portfolio-grid img { height: auto; } .viewer-toolbar { flex-wrap: wrap; } }

/* Short editorial captions keep each photograph the focus. */
.photo-title { display: block; font-size: .9rem; font-weight: 600; line-height: 1.45; color: #20282d; }
.photo-description { display: block; margin-top: .35rem; max-width: 36ch; font-size: .82rem; line-height: 1.6; color: #59666c; }