.photography-entry { max-width: 1440px; margin: auto; padding: 24px var(--gutter) 80px; }
.photography-link { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 32px 0; border-block: 1px solid var(--line); }
.photography-link h2 { font-size: clamp(32px, 7vw, 100px); text-transform: uppercase; }
.photography-link h2 small { display: block; margin-top: 12px; }
.photography-link > span { font-size: clamp(32px, 5vw, 72px); transition: transform .24s ease; }
.photography-link:hover { color: var(--ink); }
.photography-link:hover > span { transform: translate(5px,-5px); }
body::before { content: ''; position: fixed; inset: 0; z-index: 999; background: #171717; pointer-events: none; transform: translateY(-101%); }
body.shutter-exit::before { transform: translateY(0); transition: transform .24s cubic-bezier(.7,0,.3,1); }
.photo-page { margin: 0; background: #f5f4f0; }
.photo-page::before { animation: shutter-open .5s cubic-bezier(.7,0,.3,1) both; }
.photo-page.shutter-exit::before { animation: none; }
.photo-gallery { box-sizing: border-box; max-width: 1600px; margin: auto; padding: 12px; columns: 3; column-gap: 12px; }
.photo-gallery img { display: block; width: 100%; height: auto; margin-bottom: 12px; break-inside: avoid; }
.photo-back { position: fixed; left: 36px; top: 36px; z-index: 10; display: grid; place-items: center; width: 48px; height: 48px; background: #f5f4f0; color: #171717; border-radius: 50%; text-decoration: none; box-shadow: 0 2px 12px #0002; }
.photo-back:hover { background: #c4a4ee; }
.photo-back:focus-visible { outline: 3px solid #171717; outline-offset: 4px; }
@keyframes shutter-open { from { transform: translateY(0); } to { transform: translateY(101%); } }
@media(max-width:767px) {
  .photography-entry { padding-bottom: 48px; }

  .photo-back { top: 24px; left: 24px; }
}
@media(prefers-reduced-motion:reduce) {
  body::before { display: none; }
  .photography-link > span { transition: none; }
}

@media(max-width:1000px) { .photo-gallery { columns: 2; } }
@media(max-width:600px) { .photo-gallery { columns: 1; } }