.photo-page { min-height: 100vh; background: #000; }
.photo-header { height: 64px; border-bottom: 1px solid var(--line-soft); }
.photo-header__inner { height: 100%; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.photo-back { color: var(--paper); font-size: 16px; }
.photo-back:hover { color: var(--accent); }
.photo-main { padding-top: clamp(24px, 3vw, 40px); padding-bottom: 56px; }
.photo-intro { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 20px; }

.photo-subtitle { color: var(--muted); font-size: 16px; margin-top: 10px; }
.photo-credit { color: var(--muted); white-space: nowrap; font-size: 16px; }
.photo-frame { background: #000; }
.js .photo-frame { aspect-ratio: 1480 / 962; width: min(100%, max(240px, (100svh - 310px) * 1.53846)); margin-inline: auto; }
.js .photo-slide { height: 100%; min-height: 0; display: flex; align-items: center; justify-content: center; }
.photo-slide { margin: 0; display: grid; place-items: center; min-height: 250px; }
html:not(.js) .photo-slide + .photo-slide { margin-top: 12px; }
.photo-slide img { width: auto; height: auto; max-width: 100%; max-height: min(66vh, 850px); object-fit: contain; }
.js .photo-slide img { width: 100%; height: 100%; max-height: 100%; }
.photo-controls { display: none; }
.js .photo-slide[hidden] { display: none; }
.js .photo-controls { display: flex; align-items: center; justify-content: space-between; margin-top: 16px; }
.photo-count { color: var(--muted); font-size: 16px; font-variant-numeric: tabular-nums; }
.photo-buttons { display: flex; gap: 8px; }
.photo-button { width: 48px; height: 48px; border: 1px solid var(--line); font-size: 24px; line-height: 1; display: grid; place-items: center; }
.photo-button:hover { border-color: var(--paper); }
.photo-footer { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-top: 56px; padding-top: 20px; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 16px; }
.photo-footer__info { display: flex; flex-direction: column; gap: 8px; }
.photo-contacts { display: flex; align-items: center; gap: 12px; }
.photo-contacts a { color: var(--paper); }
.photo-legal { color: var(--muted); font-size: 14px; }
.photo-legal:hover { color: var(--paper); }
.photo-footer a:hover { color: var(--accent); }
.photo-telegram { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; }
.photo-telegram svg { width: 23px; height: 23px; fill: currentColor; }
@media (max-width: 700px) { .photo-intro { display: block; } .photo-slide { min-height: 200px; } .js .photo-frame { width: min(100%, max(240px, (100svh - 290px) * 1.53846)); } .photo-footer { flex-direction: column; align-items: flex-start; gap: 8px; margin-top: 32px; padding-top: 16px; } .photo-contacts { margin-left: -10px; } }