/* root */
.bbcts{
  position: relative;
  padding: 0;
  background: var(--bbcts-bg, #1f1f1f);
  overflow: hidden;
}

.bbcts::before{
  content:"";
  position:absolute;
  inset:-80px;
  background:
    radial-gradient(600px 280px at 18% 20%, rgba(255,255,255,.08), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(255,255,255,.05), transparent 62%),
    linear-gradient(135deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 48%),
    linear-gradient(225deg, rgba(255,255,255,.05) 0%, rgba(255,255,255,0) 58%);
  pointer-events:none;
}

/* slides */
.bbcts__slides{ position: relative; z-index: 1; }
.bbcts__slide{ display:none; }
.bbcts__slide.is-active{ display:block; }

/* connected layout (DESKTOP unchanged) */
.bbcts__inner{
  max-width: var(--bbcts-maxw, 1200px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: var(--bbcts-leftw, 270px) 1fr;
  gap: 0;
  align-items: stretch;
  border: 2px solid rgba(255,255,255,.35);
}

.bbcts__left, .bbcts__right{
  margin:0; padding:0;
  display:flex;
  align-items: stretch;
}

.bbcts__frame{
  width: var(--bbcts-leftw, 270px);
  height: 100%;
  /*padding: 10px;*/
  /*border: 2px solid rgba(255,255,255,.35);*/
  padding: 0px;
  border: none;
  border-right: 0;
  display:flex;
  box-sizing: border-box;
}

/*.bbcts__img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display:block;
}*/

.bbcts__img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center bottom; /* ✅ crop anchored to bottom */
  display: block;
}

/* card */
.bbcts__card{
  width: 100%;
  background: var(--bbcts-card, #7a7a7a);
  border-left: 2px solid rgba(255,255,255,.35);
  border-radius: 0 6px 6px 0;
  padding: 30px 34px;
  display:flex;
  gap: 18px;
  align-items:flex-start;
  box-sizing: border-box;
}

.bbcts__quoteMark{
  font-size: 120px;
  line-height: 1;
  margin-top: -12px;
  color: rgba(0,0,0,.25);
  flex: 0 0 auto;
}

.bbcts__content{
  color: rgba(255,255,255,.85);
  font-style: italic;
  font-size: 16px;
  line-height: 1.6;
}

.bbcts__content p{ margin: 0 0 18px; }
.bbcts__meta{ margin-top: 8px; opacity: .95; }

/* dots */
.bbcts__dots{
  position: relative;
  z-index: 1;
  margin-top: 18px;
  display:flex;
  justify-content:center;
  gap: 18px;
}

.bbcts__dot{
  width: 18px;
  height: 18px;
  border-radius: 999px;
  border: 0;
  background: rgba(255,255,255,.55);
  cursor: pointer;
}

.bbcts__dot.is-active{ background: var(--bbcts-accent, #f59a1a); }

/* responsive (MOBILE improved: full-width image + flush connection) */
@media (max-width: 900px){

  /* stack panels with NO gap so they touch */
  .bbcts__inner{
    grid-template-columns: 1fr;
    gap: 0;
    align-items: stretch;
  }

  .bbcts__left, .bbcts__right{
    width: 100%;
  }

  /* image box becomes same width as testimonial panel */
  .bbcts__frame{
    width: 100%;
    height: 240px; /* adjust if you want taller/shorter */
    margin: 0;
    border-right: 2px solid rgba(255,255,255,.35);
    border-bottom: 0; /* prevent double border where it meets the card */
    box-sizing: border-box;

    /* optional: make the combined unit feel like one card */
    border-radius: 6px 6px 0 0;
    overflow: hidden;
  }

  /* card sits flush under image box */
  .bbcts__card{
    border-radius: 0 0 6px 6px; /* only round bottom corners */
    border-left: 2px solid rgba(255,255,255,.35);
    border-top: 2px solid rgba(255,255,255,.35); /* single seam line */
    padding: 22px;
  }

  .bbcts__quoteMark{ font-size: 96px; }

  /* optional: tighten dots spacing on mobile */
  .bbcts__dots{ margin-top: 16px; }
}