/**
 * pe_success_stories_company_content_lite.css - styles for the
 * pe_success_stories_company_content_lite block (vanilla testimonial carousel).
 * Linked by the block itself, so the module is self-sufficient on any page.
 *
 * Ported from pe_pop_sept2025.css "SECTION 6" with two changes:
 *  - selectors re-scoped from .s6.testi to .pe_ssc (the block's own wrapper class),
 *    so styling follows the module regardless of the section_class arg
 *  - indicator selectors use [data-pe-slide-to] (the vanilla carousel's attribute) -
 *    the originals targeted bootstrap's [data-bs-target], which the module dropped
 * The originals remain in pe_pop_sept2025.css for the original (non-speed) template.
 */

/* ---- functional rules (bootstrap-equivalent carousel + collapse, scoped) ---- */
.pe_ssc .carousel{position:relative}
.pe_ssc .carousel-inner > .carousel-item{display:none}
.pe_ssc .carousel-inner > .carousel-item.active{display:block;animation:peSscFade .5s ease}
@keyframes peSscFade{from{opacity:0}to{opacity:1}}
.pe_ssc .collapse{display:none}
.pe_ssc .collapse.show{display:block}

/* ---- section ---- */
.pe_ssc {
  padding-top: 70px;
  padding-bottom: 40px;
}
.pe_ssc .testi_logo{
  height: 50px;
  margin-bottom: 30px;
}
.pe_ssc .testi_meta:not(:last-child) {
  margin-bottom: 30px;
}
.pe_ssc .testi_meta .label{
  font-weight:700;
  font-size:16px;
  margin:0 0 6px;
  color:var(--pe_old);
  font-family: 'latoblack' !important;
  padding: 0;
  display: inline-block;
}
.pe_ssc .testi_meta p.mb-3 {
  font-size: 18px;
  margin-top:10px;
}

.pe_ssc .impact ul {
  margin:0;
  list-style-position: outside;
  padding-left: 20px;
}

.pe_ssc .testi_right{
  background:#f1f6fc; /* fallback if the token isn't present */
}

.pe_ssc .testi_quote{
  font-size: 25px;
  font-family: 'latobold';
  line-height: 1.4;
  color:var(--pe_mid_blue);
  margin:0;
  padding: 0;
  border: 0;
}

.pe_ssc .name{ font-size:18px; }
.pe_ssc .role{color: var(--pe_old);font-size: 16px;}

/* ---- indicators (vanilla attribute: data-pe-slide-to) ---- */
.pe_ssc .carousel-indicators{
  position: static;        /* dots under the card */
  margin: 0;
  margin-top: 16px;
  display: inline-block;
}
.pe_ssc .carousel-indicators [data-pe-slide-to]{
  box-sizing:border-box;
  width:10px;height:10px;
  padding:0;
  border:0;
  border-radius:50%;
  background-color:var(--pe_placeholder);
  opacity: 1;
}
.pe_ssc .carousel-indicators [data-pe-slide-to].active {
  background-color:var(--pe_blue);
}

/* ---- controls ---- */
.pe_ssc .carousel-control-prev,
.pe_ssc .carousel-control-next {
  color:var(--pe_old);
}
.pe_ssc .testi-control {
  width: auto;                /* don't reserve 15% width */
  opacity: 1;
  color: #1a1a1a;
  text-shadow: none;
  padding: 0 .75rem;
}
.pe_ssc .testi-control i {
  font-family: 'icomoon' !important;
  font-style: normal;
  font-size: 7em;
  line-height: 1;
  color: var(--pe_old);
}
.pe_ssc .testi-control:hover i {
  color: var(--pe_blue)
}
.pe_ssc .testi-control:hover { color: #0b5ed7; }

/* position arrows slightly outside the content block */
.pe_ssc .carousel-control-prev {left: -6em;}
.pe_ssc .carousel-control-next {right: -6em;}

/* ---- view details ---- */
.pe_ssc .view_details {
  display:none;
  text-decoration:none;
  color:var(--pe_old);
  padding: 15px 30px;
  border-top: 2px solid var(--pe_white);
  margin: 30px 0 0 !important;
  font-family: 'latobold';
  font-size: 18px;
  position:relative;
}
.pe_ssc .view_details:after {
  content: '\f0c6';
  margin-left: 8px;
  font-family: var(--icomoon);
  float: right;
  color: var(--pe_old);
}
.pe_ssc .view_details[aria-expanded="true"]:after {
  transform:rotate(180deg);
}
.pe_ssc .view_details:before {
  content:'';
  width:calc(100% - 60px);
  left:0;
  right:0;
  bottom:0;
  border:1px solid var(--pe_border);
  height:1px;
  position: absolute;
  margin:auto;
  display: none;
}
.pe_ssc .view_details[aria-expanded="true"]:before {
  display: block;
}
.pe_ssc .testi_person + a:active,
.pe_ssc .testi_person + a:focus,
.pe_ssc .testi_person + a:focus-visible {
  border:1px solid var(--pe_blue);
  color:var(--pe_blue) !important;
}
.pe_ssc .testi_person + a:hover {
  color:var(--pe_white) !important;
}

/* ---- mobile ---- */
@media (max-width: 992px) {
  .pe_ssc .carousel-control-prev { left: 0; }
  .pe_ssc .carousel-control-next { right: 0; }
  .pe_ssc .testi_left {
    text-align:center;
  }
  .pe_ssc .testi_logo {
    height: 40px;
    margin: 0;
  }
  .pe_ssc .testi_left .testi_meta {
    display:none;
  }
  .pe_ssc .testi_quote {
    font-size: 20px;
    padding: 30px 30px 0;
  }
  .pe_ssc .view_details {
    display:block;
  }
  .pe_ssc .testi_person{
    padding:0 30px;
  }
  .pe_ssc .testi_right a {
    margin: 0 30px;
  }
}
