/* Shared carousel — gallery, text-&-image and testimonial blocks.
   A scroll-snap track: usable by swipe with JS off, arrows/dots layered on. */

/* min-width:0 is load-bearing. A grid/flex item defaults to min-width:auto,
   which refuses to shrink below its content — so the track's full slide row
   would push its column (and the page) wider than the viewport. That is what
   causes sideways scroll on a phone. */
.olivetreeimprovements-carousel { position: relative; min-width: 0; }

.olivetreeimprovements-carousel__track {
  display: flex;
  min-width: 0;
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.olivetreeimprovements-carousel__track::-webkit-scrollbar { display: none; }

.olivetreeimprovements-carousel__slide {
  flex: 0 0 100%;
  scroll-snap-align: start;
  min-width: 0;
}
/* Two-up on wide tracks — matches the image carousel on the Landscaping page. */
.olivetreeimprovements-carousel--pair .olivetreeimprovements-carousel__slide { flex-basis: calc(50% - 8px); }

.olivetreeimprovements-carousel__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: var(--olivetreeimprovements-radius);
}

.olivetreeimprovements-carousel__btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  display: grid;
  place-items: center;
  width: 40px; height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgb(255 255 255 / 85%);
  color: var(--olivetreeimprovements-brand);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 2px 8px rgb(0 0 0 / 18%);
  transition: opacity .2s var(--olivetreeimprovements-ease);
}
.olivetreeimprovements-carousel__btn--prev { left: 6px; }
.olivetreeimprovements-carousel__btn--next { right: 6px; }
.olivetreeimprovements-carousel__btn:hover { background: #fff; }
.olivetreeimprovements-carousel__btn:disabled { opacity: .35; cursor: default; }
.olivetreeimprovements-carousel__btn:focus-visible { outline: 3px solid var(--olivetreeimprovements-accent); outline-offset: 2px; }

.olivetreeimprovements-carousel__dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
}
.olivetreeimprovements-carousel__dot {
  width: 10px; height: 10px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #cbd5e0;
  cursor: pointer;
  transition: background .2s var(--olivetreeimprovements-ease);
}
.olivetreeimprovements-carousel__dot.is-active { background: var(--olivetreeimprovements-brand); }
.olivetreeimprovements-carousel__dot:focus-visible { outline: 2px solid var(--olivetreeimprovements-accent); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  .olivetreeimprovements-carousel__track { scroll-behavior: auto; }
}
@media (max-width: 640px) {
  .olivetreeimprovements-carousel--pair .olivetreeimprovements-carousel__slide { flex-basis: 100%; }
}