.centre-gallery { scroll-margin-top: 110px; }
.centre-gallery__heading { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.centre-gallery__heading h2 { margin: 0 0 10px; }
.centre-gallery__heading p { margin: 0; }
.centre-gallery__controls { display: flex; gap: 10px; flex-shrink: 0; }
.centre-gallery__controls button { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #ded8e1; border-radius: 50%; background: #fff; color: #19151e; font: inherit; font-size: 24px; cursor: pointer; }
.centre-gallery__controls button:hover { background: #c71570; border-color: #c71570; color: #fff; }
.centre-gallery__controls button:disabled { opacity: .35; cursor: default; background: #fff; color: #19151e; border-color: #ded8e1; }
.centre-gallery__controls [hidden] { display: none; }
.centre-gallery__rail { display: flex; gap: 20px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; padding: 4px 0 18px; margin: 0; list-style: none; scrollbar-width: thin; scrollbar-color: #c71570 #f3edf2; }
.centre-gallery__rail:focus-visible, .centre-gallery__controls button:focus-visible { outline: 3px solid #0085a8; outline-offset: 4px; }
.centre-gallery__rail li { flex: 0 0 auto; scroll-snap-align: start; margin: 0; }
.centre-gallery__rail img { display: block; width: auto; height: 320px; max-width: none; border-radius: 20px; }
@media (max-width: 640px) {
  .centre-gallery__heading { align-items: center; gap: 12px; }
  .centre-gallery__controls { gap: 6px; }
  .centre-gallery__controls button { width: 38px; height: 38px; font-size: 20px; }
  .centre-gallery__rail { gap: 12px; }
  .centre-gallery__rail img { height: 240px; border-radius: 16px; }
}