.gallery-page {
  --gallery-background: #121517;
  --gallery-text: #f3f4f5;
  --gallery-muted: #b4b8be;
  --portrait-height: clamp(24rem, calc(100svh - 17.5rem), 54rem);
  background: var(--gallery-background);
  color: var(--gallery-text);
  font-family: 'Manrope', 'SUIT', 'Helvetica Neue', sans-serif;
}
.gallery-page .site-header {
  background: var(--gallery-background);
  color: var(--gallery-text);
  border: 0;
}
.gallery-page .site-header .wordmark { font-size: 1rem; letter-spacing: .21em; }
.gallery-page .site-header nav a:hover,
.gallery-page .menu-toggle { color: #fff; }
.gallery-page .language-switch>a { color: var(--gallery-muted); }
.gallery-page .language-switch>a[aria-current=page] { color: #fff; }
.gallery-page :is(a,button):focus-visible { outline: 2px solid #fff; outline-offset: 5px; }
.gallery-page .skip { color: #121517; }
.gallery { max-width: 1760px; margin: 0 auto; padding: 10px 4% 0; }
.gallery-stage { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2.1fr) minmax(0,1fr); gap: 24px; align-items: center; }
.gallery-left,.gallery-details { position: relative; align-self: stretch; display: flex; align-items: center; min-width: 0; }
.gallery-counter { margin-left: auto; margin-right: 22px; font-size: 1rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.counter-slash { color: #929aa3; margin: 0 12px; }
.gallery-arrow { position: absolute; display: flex; align-items: center; justify-content: center; top: 60%; width: 48px; height: 56px; padding: 0; border: 0; color: #e5e7e9; background: transparent; transition: color .15s, transform .15s; }
.gallery-arrow[hidden] { display: none; }
.gallery-arrow:hover { color: #fff; transform: scale(1.1); }
.gallery-previous { left: -9px; }
.gallery-next { right: -9px; }
.gallery-next svg { transform: rotate(180deg); }
.gallery-figure { margin: 0; min-width: 0; height: var(--portrait-height); display: flex; justify-content: center; align-items: center; touch-action: pan-y pinch-zoom; }
#gallery-photo { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; }
.gallery-details { padding-right: 46px; }
.gallery-credit { color: var(--gallery-muted); font-size: 1rem; }
.gallery-download { display: inline-flex; align-items: center; gap: 14px; margin-top: 19px; padding: 8px 0; font-size: .875rem; border-bottom: 1px solid #737980; min-height: 44px; }
.gallery-download:hover { border-color: #fff; }
.gallery-thumbnails { display: grid; grid-template-columns: repeat(8,minmax(0,1fr)); gap: 14px; margin-top: 24px; }
.gallery-thumb { display: flex; height: clamp(80px,13svh,144px); align-items: center; justify-content: center; position: relative; padding-bottom: 9px; opacity: .6; transition: opacity .18s; }
.gallery-thumb img { width: 100%; height: 100%; object-fit: contain; }
.gallery-thumb:hover,.gallery-thumb[aria-current=true] { opacity: 1; }
.gallery-thumb[aria-current=true]::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: #fff; }
.gallery-heading,.gallery-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.gallery-error { margin-top: 14px; font-size: .875rem; }
.gallery-error button { background: transparent; border: 0; color: #fff; text-decoration: underline; padding: 10px; }
.gallery-footer { max-width: 1760px; margin: 0 auto; padding: 17px 4% 20px; color: var(--gallery-muted); font-size: .75rem; gap: 12px; flex-wrap: wrap; }
.gallery-footer>span:first-child>span { margin: 0 8px; }
@media (min-width: 1001px) and (max-width: 1240px) {
  .gallery-page .site-header { gap: 18px; }
  .gallery-page .site-header .wordmark { font-size: .875rem; letter-spacing: .14em; }
  .gallery-page .site-header>nav { gap: 13px; font-size: .875rem; }
  .gallery-page .header-tools { gap: 14px; }
}
@media (max-width: 1000px) {
  .gallery-page { --portrait-height: clamp(24rem, calc(100svh - 18rem), 46rem); }
  .gallery-stage { grid-template-columns: minmax(0,1fr) minmax(0,2.4fr) minmax(0,1fr); gap: 16px; }
  .gallery-counter { margin-right: 0; }
  .gallery-details { padding-right: 0; }
  .gallery-arrow { top: 75%; }
  .gallery-thumbnails { gap: 10px; }
}
@media (max-width: 700px) {
  .gallery-page { --portrait-height: clamp(19rem, calc(100svh - 21rem), 42rem); }
  .gallery-page .site-header,.gallery-page .inner-page .site-header { background: var(--gallery-background); }
  .gallery-page .site-header .wordmark { font-size: .875rem; letter-spacing: .13em; }
  .gallery { padding: 12px 5% 0; }
  .gallery-stage { grid-template-columns: 1fr; gap: 14px; position: relative; }
  .gallery-left { position: static; justify-content: flex-end; min-height: 38px; }
  .gallery-counter { margin: 0; font-size: .875rem; }
  .gallery-figure { margin: 0 27px; }
  .gallery-details { position: static; display: block; }
  .gallery-details>div { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 0 12px; align-items: center; }
  .gallery-credit { font-size: .875rem; grid-column: 1; }
  .gallery-download { margin: 0; grid-column: 2; grid-row: 1; gap: 8px; font-size: .875rem; }
  .gallery-arrow { top: calc(52px + var(--portrait-height)/2 - 24px); width: 36px; height: 48px; }
  .gallery-arrow svg { width: 13px; height: 27px; }
  .gallery-previous { left: -9px; }
  .gallery-next { right: -9px; }
  .gallery-thumbnails { display: flex; gap: 10px; overflow-x: auto; margin-top: 20px; padding: 5px 3px 7px; scroll-snap-type: x proximity; scrollbar-width: thin; scrollbar-color: #60656c transparent; }
  .gallery-thumb { flex: 0 0 66px; height: 103px; scroll-snap-align: center; opacity: .7; }
  .gallery-footer { padding: 14px 5% 20px; }
}
@media (max-width: 380px) {
  .gallery-page .site-header .wordmark { font-size: .75rem; letter-spacing: .1em; }
  .gallery-page .header-tools { gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .gallery-page * { scroll-behavior: auto; transition: none; }
}
