.floor-gallery {
  scroll-margin-top: 9rem;
  color: #163e36;
}
.floor-gallery-track {
  display: flex;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  border-radius: 6px;
  background: #e2e9e3;
  scrollbar-width: none;
}
.floor-gallery-track::-webkit-scrollbar { display: none; }
.floor-gallery-track img {
  display: block;
  flex: 0 0 100%;
  width: 100%;
  min-width: 0;
  height: clamp(260px, 42vw, 460px);
  object-fit: cover;
  scroll-snap-align: start;
}
.floor-gallery-track img:first-child { object-position: 50% 42%; }
.floor-gallery-bar, .floor-gallery-info, .floor-gallery-buttons {
  display: flex;
  align-items: center;
}
.floor-gallery-bar {
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid #c9d9cf;
}
.floor-gallery-info { gap: clamp(10px, 2vw, 24px); }
.floor-count {
  color: #14695a;
  white-space: nowrap;
  font-size: .84rem;
  font-variant-numeric: tabular-nums;
  letter-spacing: .04em;
}
.floor-caption { font-size: clamp(.92rem, 1.4vw, 1.12rem); font-weight: 600; }
.floor-gallery-buttons { flex-shrink: 0; gap: 6px; }
.floor-gallery-buttons[hidden] { display: none; }
.floor-gallery-buttons button {
  display: grid;
  place-items: center;
  padding: 0;
  width: 44px;
  height: 44px;
  border: 1px solid #9ab7ab;
  border-radius: 50%;
  background: transparent;
  color: #12665a;
  cursor: pointer;
}
.floor-gallery-buttons button:is(:hover,:focus-visible) { background: #12665a; color: #fff; }
.floor-gallery :focus-visible { outline: 2px solid #12665a; outline-offset: 3px; }
.floor-gallery-buttons svg { width: 21px; height: 21px; }
@media (max-width: 580px) {
  .floor-gallery-track img { height: auto; aspect-ratio: 1.18; }
  .floor-gallery-bar { gap: 6px; }
  .floor-gallery-info { align-items: flex-start; flex-direction: column; gap: 3px; }
}