/* SC Content Slider - pagination (dots) layout in normal flow */
/* Ensure the slider can grow to include dots and is not clipped */
.scs-slider {
  position: relative;
  height: auto !important;
  overflow: visible !important;
  padding-bottom: 16px; /* space for dots */
}

body.home .hero .post-inner {
    align-items: center !important;
}

.scs-slider .slideshow-container {
  overflow: visible !important;
}

.scs-slider .dot-ruler {
  position: relative !important; /* keep in normal flow but allow z-index */
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  top: auto !important;
  width: 100%;
  margin: 12px 0 0;
  z-index: 5;
  display: block !important;
  background: #2D3748;
  max-width: 100% !important;
}

.scs-slider .dot-container {
  display: flex !important;
  justify-content: center;
  align-items: center;
  gap: 8px;
  padding: 8px 0;
  visibility: visible !important;
  position: relative !important;
  bottom: auto !important;
  width: auto !important;
}

.scs-slider .dot {
  display: inline-block !important;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #c8c8c8;
  transition: background-color 0.2s ease;
  opacity: 1 !important;
}

.scs-slider .dot.active {
  background: #333;
}

.scs-slider .dot:focus { outline: 2px solid #666; outline-offset: 2px; }