/* ========================
   REVIEWS
   ======================== */
.section-reviews {
  position: relative;
  height: 929px;
  background-color: var(--color-black);
  overflow: hidden;
}

/* --- Background --- */
.section-reviews__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-reviews__overlay {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.5);
  pointer-events: none;
}

/* --- Header --- */
.section-reviews__title {
  position: absolute;
  left: 809px;
  top: 100px;
  font-family: var(--font-serif);
  font-size: var(--text-9xl);
  line-height: var(--leading-9xl);
  color: var(--color-cream);
  letter-spacing: var(--tracking-tightest);
  font-weight: 400;
  font-style: normal;
  white-space: nowrap;
}

.section-reviews__sep {
  position: absolute;
  height: 1px;
  background-color: var(--color-cream);
}

.section-reviews__sep--left {
  left: 120px;
  top: 152px;
  width: 586px;
}

.section-reviews__sep--right {
  left: 1214px;
  top: 153px;
  width: 586px;
}

/* --- Carousel viewport --- */
.section-reviews__viewport {
  position: absolute;
  left: 120px;
  top: 297px;
  width: 1681px;
  height: 419px;
  overflow: hidden;
}

/* --- Carousel track --- */
.section-reviews__track {
  display: flex;
  gap: 27px;
  transition: transform 0.5s ease;
}

/* --- Cards --- */
.section-reviews__card {
  position: relative;
  flex-shrink: 0;
  width: 400px;
  height: 419px;
  background-color: var(--color-dark-maroon);
}

/* --- Card internals (positioned relative to card) --- */
.section-reviews__card-avatar {
  position: absolute;
  left: 21px;
  top: 23px;
  width: 103px;
  height: 116px;
  overflow: hidden;
}

.section-reviews__card-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-reviews__card-name {
  position: absolute;
  left: 144.5px;
  top: 25px;
  font-family: var(--font-sans);
  font-size: 24px;
  line-height: var(--leading-2xl);
  color: var(--color-cream);
}

.section-reviews__card-line {
  position: absolute;
  left: 144.5px;
  top: 66.48px;
  width: 242.529px;
  height: 0.723px;
  background-color: var(--color-cream);
}

.section-reviews__card-date {
  position: absolute;
  left: 144.5px;
  top: 118px;
  font-family: var(--font-sans);
  font-size: 24px;
  line-height: var(--leading-xl);
  color: var(--color-cream);
  white-space: nowrap;
}

.section-reviews__card-text {
  position: absolute;
  left: 20.5px;
  top: 199px;
  width: 358.853px;
  font-family: var(--font-geist);
  font-size: var(--text-md-alt);
  line-height: normal;
  color: var(--color-cream);
  font-weight: 200;
  text-align: justify;
}

/* --- Navigation arrows --- */
.section-reviews__arrow {
  position: absolute;
  top: 482px;
  width: 26px;
  height: 49.5px;
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  transition: opacity 0.3s;
}

.section-reviews__arrow img {
  width: 100%;
  height: 100%;
}

.section-reviews__arrow--left {
  left: 45px;
  transform: rotate(180deg);
}

.section-reviews__arrow--right {
  left: 1839px;
}

.section-reviews__arrow.is-disabled {
  opacity: 0.2;
  cursor: default;
  pointer-events: none;
}