/* GDI-Reviews: the "Patient stories" slider. Ported from site.css sections 3 (.head, .head-row,
   .eyebrow), 4 (slider nav), 8 and 20 (.card) and 12 (.review). Swiper's own stylesheet is Elementor's
   bundled copy (style handle "swiper"); this file only adds the project's look on top of it. */
.gdi-reviews { position: relative; }

/* ---- Head row: heading on the left, prev / dots / next on the right ---- */
.gdi-reviews .head-row {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap;
  margin-bottom: clamp(1.75rem, 1.2rem + 1.6vw, 2.5rem);
}
.gdi-reviews .head-row--nav-only { justify-content: flex-end; }
.gdi-reviews .head { max-width: 62rem; margin: 0; }
.gdi-reviews .eyebrow {
  display: inline-block; font-family: var(--gdi-font-display); font-stretch: 95%;
  font-size: .74rem; font-weight: 600; letter-spacing: .14em; line-height: 1.6;
  text-transform: uppercase; color: var(--gdi-navy); margin-bottom: 1.1rem;
}
.gdi-reviews .gdi-reviews__heading {
  font-family: var(--gdi-font-display); font-stretch: 90%; text-transform: uppercase; font-weight: 600;
  letter-spacing: -0.03em; line-height: .9; color: var(--gdi-ink); margin: 0 0 .4em; overflow-wrap: anywhere;
  font-size: clamp(2.1rem, 1.2rem + 3.4vw, 4rem);
}
.gdi-reviews .head p {
  font-size: clamp(1.06rem, 1rem + 0.4vw, 1.25rem); line-height: 1.6; color: var(--gdi-mute);
  margin: .25rem 0 0; max-width: 68ch;
}

/* ---- Prev / pagination / next ---- */
.gdi-reviews .sw-nav { display: flex; align-items: center; gap: .6rem; }
.gdi-reviews .sw-btn {
  width: 46px; height: 46px; padding: 0; border-radius: 50%; border: 1.5px solid var(--gdi-line-2);
  background: var(--gdi-white); color: var(--gdi-ink); display: grid; place-items: center; cursor: pointer;
  box-shadow: none; line-height: 1; font-size: 1rem; text-transform: none;
  transition: background-color .16s var(--gdi-ease), border-color .16s var(--gdi-ease), color .16s var(--gdi-ease), opacity .16s;
}
.gdi-reviews .sw-btn:focus { background: var(--gdi-white); border-color: var(--gdi-line-2); color: var(--gdi-ink); }
.gdi-reviews .sw-btn:hover, .gdi-reviews .sw-btn:focus-visible { background: var(--gdi-ink); border-color: var(--gdi-ink); color: #fff; }
.gdi-reviews .sw-btn:focus-visible { outline: 3px solid var(--gdi-navy); outline-offset: 3px; }
.gdi-reviews .sw-btn.swiper-button-disabled { opacity: .35; cursor: default; }
.gdi-reviews .sw-btn.swiper-button-disabled:hover { background: var(--gdi-white); color: var(--gdi-ink); border-color: var(--gdi-line-2); }
.gdi-reviews .sw-btn svg { display: block; }
.gdi-reviews .swiper-pagination { position: static !important; display: flex; gap: .4rem; width: auto !important; transform: none !important; }
.gdi-reviews .swiper-pagination-bullet {
  width: 8px; height: 8px; border-radius: 50%; background: var(--gdi-line-2); opacity: 1; margin: 0 !important;
  transition: background-color .16s, transform .16s;
}
.gdi-reviews .swiper-pagination-bullet-active { background: var(--gdi-navy); transform: scale(1.25); }
.gdi-reviews .swiper-pagination-lock { display: none; }
/* The controls only do anything once Swiper runs, so until then they keep their space but stay hidden. */
.gdi-reviews:not(.is-ready) .sw-nav { visibility: hidden; }

/* ---- Cards ---- */
.gdi-reviews .swiper { width: 100%; overflow: hidden; }
.gdi-reviews .swiper-slide { height: auto; }
.gdi-reviews .review {
  position: relative; overflow: hidden; display: flex; flex-direction: column;
  margin: 0; min-height: 100%; padding: var(--gdi-card-pad);
  background: rgba(79,200,233,.06); border: 1.5px solid rgba(24,43,61,.09); border-radius: var(--gdi-r-card);
  box-shadow: 0 1px 2px rgba(24,43,61,.04), 0 14px 36px -14px rgba(24,43,61,.14);
  transition: transform .18s var(--gdi-ease), box-shadow .18s var(--gdi-ease), border-color .18s var(--gdi-ease);
}
.gdi-reviews .review > * { position: relative; z-index: 1; }
/* Cursor spotlight (--mx / --my set by gdi-reviews.js) and the gradient top edge on hover */
.gdi-reviews .review::before {
  content: ""; position: absolute; inset: 0; z-index: 0; opacity: 0; pointer-events: none; transition: opacity .25s var(--gdi-ease);
  background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), rgba(0,171,238,.13), transparent 62%);
}
.gdi-reviews .review::after {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; z-index: 1; opacity: 0; transition: opacity .25s var(--gdi-ease);
  background: linear-gradient(90deg, var(--gdi-blue), var(--gdi-sky));
}
.gdi-reviews .review:hover::before, .gdi-reviews .review:hover::after { opacity: 1; }
.gdi-reviews .review__stars { color: #a15f00; letter-spacing: .16em; font-size: .9rem; line-height: 1.6; margin-bottom: .85rem; }
.gdi-reviews .review blockquote {
  margin: 0 0 1.1rem; padding: 0; border: 0; quotes: none;
  font-family: var(--gdi-font-serif); font-style: normal; font-size: 1.28rem; line-height: 1.35; color: var(--gdi-ink);
}
.gdi-reviews .review blockquote::before, .gdi-reviews .review blockquote::after { content: none; }
.gdi-reviews .review figcaption { margin-top: auto; font-size: .85rem; line-height: 1.6; font-weight: 700; color: var(--gdi-mute); }

/* ---- Before Swiper starts: the cards sit in a row at the size Swiper will give them, so nothing
   jumps when it takes over (1 card, 2 from 640px, 3 from 1000px, as in the project). ---- */
.gdi-reviews .swiper:not(.swiper-initialized) .swiper-wrapper { display: flex; gap: 16px; }
.gdi-reviews .swiper:not(.swiper-initialized) .swiper-slide { flex: 0 0 100%; width: auto; }
@media (min-width: 640px) {
  .gdi-reviews .swiper:not(.swiper-initialized) .swiper-wrapper { gap: 18px; }
  .gdi-reviews .swiper:not(.swiper-initialized) .swiper-slide { flex-basis: calc((100% - 18px) / 2); }
}
@media (min-width: 1000px) {
  .gdi-reviews .swiper:not(.swiper-initialized) .swiper-wrapper { gap: 20px; }
  .gdi-reviews .swiper:not(.swiper-initialized) .swiper-slide { flex-basis: calc((100% - 40px) / 3); }
}

/* ---- No JavaScript, or Swiper could not load: a plain grid with every quote readable ---- */
.gdi-reviews.is-static .swiper-wrapper {
  display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 20px; transform: none !important;
}
.gdi-reviews.is-static .swiper-slide { width: auto !important; margin: 0 !important; }
.gdi-reviews.is-static .sw-nav { display: none; }
@media (scripting: none) {
  .gdi-reviews .swiper-wrapper {
    display: grid !important; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); gap: 20px; transform: none !important;
  }
  .gdi-reviews .swiper-slide { width: auto !important; margin: 0 !important; }
  .gdi-reviews .sw-nav { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  .gdi-reviews .review, .gdi-reviews .sw-btn, .gdi-reviews .swiper-pagination-bullet { transition: none; }
}
