/* Optimal Access — Testimonials (bb-oa-modules "testimonial" Beaver Builder module)
   Scoped to .oa-section wrappers and to our themed body so it can never leak
   into the Beaver Builder editor or an unrelated theme area. */

body.oa-styles-site .fl-module-testimonial,
.oa-section .fl-module-testimonial {
  --ground:      #11151b;
  --ground-2:    #171d25;
  --ground-3:    #1e2630;
  --rule:        rgba(255, 255, 255, .10);
  --text:        #e8ecf1;
  --text-dim:    #9aa6b4;
  --human:       #4fd1c5;
  --display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
  --body:    "Newsreader", Georgia, serif;
  --mono:    "IBM Plex Mono", ui-monospace, SFMono-Regular, monospace;
}

/* ---------- section shell ---------- */
.oa-section-testimonials { padding-block: clamp(56px, 8vw, 104px); }

.oa-section-testimonials .section-head { max-width: 760px; margin-bottom: clamp(28px, 4vw, 48px); }

/* ---------- track ---------- */
body.oa-styles-site .testimonial_wrap { position: relative; }

body.oa-styles-site .testimonial_list {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

body.oa-styles-site .testimonial_list > li {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 10px !important;
  height: auto;
}

/* equal-height cards when several slides show at once */
body.oa-styles-site .testimonial_list.slick-initialized .slick-track {
  display: flex !important;
  align-items: stretch;
}
body.oa-styles-site .testimonial_list.slick-initialized .slick-slide {
  height: auto !important;
  float: none !important;
}
body.oa-styles-site .testimonial_list.slick-initialized .slick-slide > div,
body.oa-styles-site .testimonial_list.slick-initialized li {
  height: 100%;
}

/* ---------- card ---------- */
body.oa-styles-site .testimonial_list > li {
  display: flex !important;
  flex-direction: column;
}

body.oa-styles-site .testimonial_list > li > .wrap_user_image,
body.oa-styles-site .testimonial_list > li > .wrap_user_misc,
body.oa-styles-site .testimonial_list > li > .wrap_content {
  background: var(--ground-2);
  border-inline: 1px solid var(--rule);
  padding-inline: clamp(20px, 3vw, 28px);
}

body.oa-styles-site .testimonial_list > li > .wrap_user_image {
  border-top: 1px solid var(--rule);
  border-radius: 14px 14px 0 0;
  padding-top: 26px;
}

body.oa-styles-site .testimonial_list > li > .wrap_content {
  border-bottom: 1px solid var(--rule);
  border-radius: 0 0 14px 14px;
  padding-bottom: 28px;
  flex: 1 1 auto;
}

/* avatar */
body.oa-styles-site .testimonial_list .user_img {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background-size: cover;
  background-position: center;
  box-shadow: 0 0 0 2px var(--ground-2), 0 0 0 3px var(--human);
}

/* name / company */
body.oa-styles-site .testimonial_list .wrap_user_misc {
  padding-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
body.oa-styles-site .testimonial_list .wrap_user_misc strong {
  font-family: var(--display);
  font-size: 15px;
  font-weight: 600;
  color: var(--text);
}
body.oa-styles-site .testimonial_list .wrap_user_misc span {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--human);
}

/* quote body */
body.oa-styles-site .testimonial_list .wrap_content { padding-top: 16px; position: relative; }
body.oa-styles-site .testimonial_list .content_inner,
body.oa-styles-site .testimonial_list .content_inner p {
  font-family: var(--body);
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.62;
  color: var(--text-dim);
}
body.oa-styles-site .testimonial_list .content_inner p { margin: 0 0 .8em; }
body.oa-styles-site .testimonial_list .content_inner p:last-child { margin-bottom: 0; }

body.oa-styles-site .testimonial_list .content_inner::before {
  content: "\201C";
  display: block;
  font-family: var(--display);
  font-size: 44px;
  line-height: .6;
  color: var(--human);
  opacity: .45;
  margin-bottom: 10px;
}

/* ---------- arrows / dots ---------- */
body.oa-styles-site .testimonial_wrap .slick-prev,
body.oa-styles-site .testimonial_wrap .slick-next {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--ground-3);
  border: 1px solid var(--rule);
  color: var(--text);
  z-index: 3;
  transition: background .18s ease, border-color .18s ease;
}
body.oa-styles-site .testimonial_wrap .slick-prev:hover,
body.oa-styles-site .testimonial_wrap .slick-next:hover {
  background: var(--human);
  border-color: var(--human);
  color: #061a18;
}
body.oa-styles-site .testimonial_wrap .slick-prev::before,
body.oa-styles-site .testimonial_wrap .slick-next::before { display: none; }
body.oa-styles-site .testimonial_wrap .slick-prev i,
body.oa-styles-site .testimonial_wrap .slick-next i { color: inherit; font-size: 18px; line-height: 1; }
body.oa-styles-site .testimonial_wrap .slick-prev { left: -8px; }
body.oa-styles-site .testimonial_wrap .slick-next { right: -8px; }
body.oa-styles-site .testimonial_wrap .slick-disabled { opacity: .35; cursor: default; }

body.oa-styles-site .testimonial_wrap .slick-dots { margin-top: 22px; padding: 0; text-align: center; }
body.oa-styles-site .testimonial_wrap .slick-dots li { display: inline-block; margin: 0 5px; }
body.oa-styles-site .testimonial_wrap .slick-dots li button {
  width: 8px; height: 8px; padding: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .22);
  border: 0;
  text-indent: -9999px;
}
body.oa-styles-site .testimonial_wrap .slick-dots li button::before { display: none; }
body.oa-styles-site .testimonial_wrap .slick-dots li.slick-active button { background: var(--human); }

@media (max-width: 900px) {
  body.oa-styles-site .testimonial_wrap .slick-prev { left: 0; }
  body.oa-styles-site .testimonial_wrap .slick-next { right: 0; }
}

/* ============================================================
 * Plain-HTML testimonials row (no Beaver Builder module needed)
 * Markup: .oa-quotes > .oa-quote (figure) with blockquote + figcaption
 * ============================================================ */
.oa-section-testimonials .oa-quotes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 1.6vw, 22px);
  margin-top: clamp(24px, 3vw, 38px);
}

.oa-section-testimonials .oa-quote {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: var(--ground-2, #171d25);
  border: 1px solid var(--rule, rgba(255,255,255,.10));
  border-radius: 14px;
  padding: clamp(20px, 2.4vw, 28px);
}

.oa-section-testimonials .oa-quote blockquote {
  margin: 0;
  border: 0;
  padding: 0;
  font-family: var(--body, Georgia, serif);
  font-size: clamp(15px, 1.15vw, 17px);
  line-height: 1.62;
  color: var(--text-dim, #9aa6b4);
  flex: 1 1 auto;
}
.oa-section-testimonials .oa-quote blockquote::before {
  content: "\201C";
  display: block;
  font-family: var(--display, sans-serif);
  font-size: 44px;
  line-height: .6;
  color: var(--human, #4fd1c5);
  opacity: .45;
  margin-bottom: 10px;
}

.oa-section-testimonials .oa-quote figcaption {
  display: flex;
  align-items: center;
  gap: 12px;
}
.oa-section-testimonials .oa-quote img,
.oa-section-testimonials .oa-quote .oa-quote-initial {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  flex: 0 0 auto;
  box-shadow: 0 0 0 2px var(--ground-2, #171d25), 0 0 0 3px var(--human, #4fd1c5);
}
.oa-section-testimonials .oa-quote .oa-quote-initial {
  display: grid;
  place-items: center;
  background: var(--ground-3, #1e2630);
  font-family: var(--display, sans-serif);
  font-weight: 600;
  color: var(--human, #4fd1c5);
}
.oa-section-testimonials .oa-quote b {
  display: block;
  font-family: var(--display, sans-serif);
  font-size: 15px;
  font-weight: 600;
  color: var(--text, #e8ecf1);
}
.oa-section-testimonials .oa-quote small {
  display: block;
  font-family: var(--mono, monospace);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--human, #4fd1c5);
}

@media (max-width: 1080px) {
  .oa-section-testimonials .oa-quotes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  .oa-section-testimonials .oa-quotes { grid-template-columns: 1fr; }
}

/* ============================================================
 * Safety net — a Beaver Builder testimonial module dropped into ANY row.
 * testimonials.js tags that row with .oa-auto-testimonials; these rules make
 * sure the text is readable even before/without that tagging.
 * ============================================================ */
body.oa-styles-site .fl-row:has(.fl-module-testimonial) > .fl-row-content-wrap,
body.oa-styles-site .oa-auto-testimonials > .fl-row-content-wrap {
  background: var(--ground, #11151b) !important;
  padding-block: clamp(48px, 6vw, 88px);
}

body.oa-styles-site .fl-row:has(.fl-module-testimonial) .fl-heading,
body.oa-styles-site .fl-row:has(.fl-module-testimonial) .fl-heading-text {
  font-family: var(--display, sans-serif) !important;
  color: var(--text, #e8ecf1) !important;
  text-align: center;
  font-size: clamp(24px, 3vw, 38px);
  margin-bottom: clamp(20px, 3vw, 34px);
}

body.oa-styles-site .fl-module-testimonial .content_inner,
body.oa-styles-site .fl-module-testimonial .content_inner *,
body.oa-styles-site .fl-module-testimonial .wrap_content,
body.oa-styles-site .fl-module-testimonial .wrap_content * {
  color: var(--text-dim, #9aa6b4) !important;
  background: transparent !important;
}

body.oa-styles-site .fl-module-testimonial .wrap_user_misc strong,
body.oa-styles-site .fl-module-testimonial .wrap_user_misc strong * {
  color: var(--text, #e8ecf1) !important;
}
body.oa-styles-site .fl-module-testimonial .wrap_user_misc span,
body.oa-styles-site .fl-module-testimonial .wrap_user_misc span * {
  color: var(--human, #4fd1c5) !important;
}
body.oa-styles-site .fl-module-testimonial a { color: var(--human, #4fd1c5) !important; }

/* card panels, in case the module sits outside an .oa-section wrapper */
body.oa-styles-site .fl-module-testimonial .testimonial_list > li > .wrap_user_image,
body.oa-styles-site .fl-module-testimonial .testimonial_list > li > .wrap_user_misc,
body.oa-styles-site .fl-module-testimonial .testimonial_list > li > .wrap_content {
  background: var(--ground-2, #171d25) !important;
}

/* ============================================================
 * v5.6 — native bb-oa-modules carousel: readable text + capped height
 * Extra `html` prefix raises specificity above the module's own stylesheet
 * regardless of enqueue order.
 * ============================================================ */
html body.oa-styles-site .fl-module-testimonial .testimonial_wrap,
html body.oa-styles-site .fl-module-testimonial .testimonial_list,
html body.oa-styles-site .fl-module-testimonial .testimonial_list * {
  color: var(--text-dim, #9aa6b4) !important;
}
html body.oa-styles-site .fl-module-testimonial .wrap_user_misc strong,
html body.oa-styles-site .fl-module-testimonial .wrap_user_misc strong * {
  color: var(--text, #e8ecf1) !important;
}
html body.oa-styles-site .fl-module-testimonial .wrap_user_misc span,
html body.oa-styles-site .fl-module-testimonial .wrap_user_misc span *,
html body.oa-styles-site .fl-module-testimonial a {
  color: var(--human, #4fd1c5) !important;
}

/* uniform card height — long reviews scroll inside the card */
html body.oa-styles-site .fl-module-testimonial .testimonial_list > li > .wrap_content {
  max-height: 260px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: var(--human, #4fd1c5) transparent;
}
html body.oa-styles-site .fl-module-testimonial .wrap_content::-webkit-scrollbar { width: 6px; }
html body.oa-styles-site .fl-module-testimonial .wrap_content::-webkit-scrollbar-thumb {
  background: rgba(79, 209, 197, .5);
  border-radius: 3px;
}

/* cap the whole track so one long quote cannot blow up the section */
html body.oa-styles-site .fl-module-testimonial .testimonial_list.slick-initialized .slick-slide > div,
html body.oa-styles-site .fl-module-testimonial .testimonial_list.slick-initialized li {
  display: flex !important;
  flex-direction: column;
  height: 100%;
}
html body.oa-styles-site .fl-module-testimonial .testimonial_list .content_inner,
html body.oa-styles-site .fl-module-testimonial .testimonial_list .content_inner p {
  font-family: var(--body, Georgia, serif);
  font-size: clamp(14px, 1.05vw, 16px);
  line-height: 1.6;
}

@media (max-width: 720px) {
  html body.oa-styles-site .fl-module-testimonial .testimonial_list > li > .wrap_content { max-height: 220px; }
}

/* ============================================================
 * v5.7 — plugin carousel converted to the OA card grid by testimonials.js
 * The module keeps supplying content; we render it as equal-height cards.
 * ============================================================ */
html body.oa-styles-site .fl-module-testimonial[data-oa-grid] .oa-quotes,
html body.oa-styles-site .oa-quotes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 1.6vw, 22px);
  margin: 0;
  padding: 0;
  list-style: none;
}

html body.oa-styles-site .fl-module-testimonial[data-oa-grid] .oa-quote {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  background: var(--ground-2, #171d25) !important;
  border: 1px solid var(--rule, rgba(255,255,255,.10));
  border-radius: 14px;
  padding: clamp(20px, 2.4vw, 28px);
}

html body.oa-styles-site .oa-quote-body {
  margin: 0;
  border: 0;
  padding: 0;
  flex: 1 1 auto;
  font-family: var(--body, Georgia, serif);
  font-size: clamp(14px, 1.05vw, 16px);
  line-height: 1.6;
  color: var(--text-dim, #9aa6b4) !important;
  display: -webkit-box;
  -webkit-line-clamp: 8;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
html body.oa-styles-site .oa-quote-body.open {
  display: block;
  -webkit-line-clamp: unset;
  overflow: visible;
}
html body.oa-styles-site .oa-quote-body p { margin: 0 0 .7em; color: inherit !important; }
html body.oa-styles-site .oa-quote-body p:last-child { margin-bottom: 0; }

html body.oa-styles-site .oa-quote-more {
  align-self: flex-start;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  font-family: var(--mono, monospace);
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--human, #4fd1c5) !important;
}
html body.oa-styles-site .oa-quote-more:hover { text-decoration: underline; }

html body.oa-styles-site .fl-module-testimonial[data-oa-grid] figcaption {
  display: flex;
  align-items: center;
  gap: 12px;
  border-top: 1px solid var(--rule, rgba(255,255,255,.10));
  padding-top: 14px;
}
html body.oa-styles-site .fl-module-testimonial[data-oa-grid] figcaption img,
html body.oa-styles-site .fl-module-testimonial[data-oa-grid] .oa-quote-initial {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  flex: 0 0 auto;
  box-shadow: 0 0 0 2px var(--ground-2, #171d25), 0 0 0 3px var(--human, #4fd1c5);
}
html body.oa-styles-site .fl-module-testimonial[data-oa-grid] .oa-quote-initial {
  display: grid;
  place-items: center;
  background: var(--ground-3, #1e2630);
  font-family: var(--display, sans-serif);
  font-weight: 600;
  color: var(--human, #4fd1c5);
}
html body.oa-styles-site .fl-module-testimonial[data-oa-grid] figcaption b {
  display: block;
  font-family: var(--display, sans-serif);
  font-size: 15px;
  font-weight: 600;
  color: var(--text, #e8ecf1) !important;
}
html body.oa-styles-site .fl-module-testimonial[data-oa-grid] figcaption small {
  display: block;
  font-family: var(--mono, monospace);
  font-size: 11px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--human, #4fd1c5) !important;
}

@media (max-width: 1080px) {
  html body.oa-styles-site .fl-module-testimonial[data-oa-grid] .oa-quotes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 720px) {
  html body.oa-styles-site .fl-module-testimonial[data-oa-grid] .oa-quotes { grid-template-columns: 1fr; }
}


/* ============================================================
 * v5.8 — carousel shell around the OA testimonial cards
 * The JS wraps the card track in .oa-carousel; cards scroll
 * horizontally with snap, arrows page by one viewport.
 * ============================================================ */
html body.oa-styles-site .oa-carousel {
  position: relative;
  padding-inline: 0;
}

html body.oa-styles-site .oa-carousel-viewport { overflow: hidden; }

html body.oa-styles-site .oa-carousel .oa-quotes {
  display: flex !important;
  grid-template-columns: none !important;
  flex-wrap: nowrap;
  gap: clamp(14px, 1.6vw, 22px);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-bottom: 2px;
}
html body.oa-styles-site .oa-carousel .oa-quotes::-webkit-scrollbar { display: none; }

html body.oa-styles-site .oa-carousel .oa-quote {
  flex: 0 0 calc((100% - 2 * clamp(14px, 1.6vw, 22px)) / 3);
  scroll-snap-align: start;
  min-width: 0;
}

/* arrows */
html body.oa-styles-site .oa-carousel-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--ground-3, #1e2630);
  border: 1px solid var(--rule, rgba(255,255,255,.10));
  color: var(--text, #e8ecf1) !important;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  z-index: 3;
  transition: background .18s ease, border-color .18s ease, opacity .18s ease;
}
html body.oa-styles-site .oa-carousel-nav:hover:not(:disabled) {
  background: var(--human, #4fd1c5);
  border-color: var(--human, #4fd1c5);
  color: #061a18 !important;
}
html body.oa-styles-site .oa-carousel-nav:disabled { opacity: .3; cursor: default; }
html body.oa-styles-site .oa-carousel-prev { left: -14px; }
html body.oa-styles-site .oa-carousel-next { right: -14px; }

/* dots */
html body.oa-styles-site .oa-carousel-dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 20px;
}
html body.oa-styles-site .oa-carousel-dots button {
  width: 8px;
  height: 8px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, .22);
  cursor: pointer;
}
html body.oa-styles-site .oa-carousel-dots button.is-active { background: var(--human, #4fd1c5); }

@media (max-width: 1080px) {
  html body.oa-styles-site .oa-carousel .oa-quote {
    flex-basis: calc((100% - clamp(14px, 1.6vw, 22px)) / 2);
  }
  html body.oa-styles-site .oa-carousel-prev { left: -6px; }
  html body.oa-styles-site .oa-carousel-next { right: -6px; }
}
@media (max-width: 720px) {
  html body.oa-styles-site .oa-carousel .oa-quote { flex-basis: 100%; }
  html body.oa-styles-site .oa-carousel-nav { display: none !important; }
}

/* ============================================================
 * Placeholder slot: lets the plugin carousel appear mid-page
 * inside a single big HTML module.
 * ============================================================ */
html body.oa-styles-site .oa-testimonials-slot,
html body.oa-styles-site #oa-testimonials {
  display: block;
  width: 100%;
  position: relative;
}
/* the original testimonial row is emptied once its carousel moved */
html body.oa-styles-site .fl-row.oa-testimonials-moved,
html body.oa-styles-site .oa-testimonials-moved {
  display: none !important;
}
