/* BNT Who Bought It Frontend */
.bnt-who-section,
.bnt-who-section * { box-sizing: border-box; }

.bnt-who-section {
  --bnt-main: #111569;
  --bnt-blue-soft: #EBF4FF;
  --bnt-line: #E3EAF4;
  --bnt-text-soft: #71839B;
  --bnt-radius-xl: 34px;
  --bnt-radius-lg: 24px;
  font-family: 'Sarabun', sans-serif;
  width: 100%;
  padding: var(--bnt-section-pt, 40px) 20px var(--bnt-section-pb, 40px);
  background: var(--bnt-section-bg, #ffffff);
  color: var(--bnt-main);
}

.bnt-who-wrap {
  width: min(1580px, 100%);
  margin: 0 auto;
  background: var(--bnt-wrap-bg, #fff);
  border: 1px solid var(--bnt-wrap-border, var(--bnt-line));
  border-radius: var(--bnt-radius-xl);
  padding: calc(var(--bnt-wrap-pt, 36px) + var(--bnt-top-space, 0px)) var(--bnt-wrap-pr, 60px) var(--bnt-wrap-pb, 38px) var(--bnt-wrap-pl, 60px);
  box-shadow: 0 20px 60px rgba(var(--bnt-wrap-shadow-rgb, 17,21,105), var(--bnt-wrap-shadow-opacity, 0));
  overflow: hidden;
}

.bnt-who-head {
  display: flex;
  justify-content: space-between;
  gap: 28px;
  align-items: flex-start;
  margin-bottom: var(--bnt-head-mb, 34px);
}

.bnt-who-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--bnt-main);
  background: var(--bnt-pill-bg, var(--bnt-blue-soft));
  border: 1px solid var(--bnt-pill-border, #CBDDF6);
  padding: 7px 14px;
  border-radius: 999px;
  margin-bottom: 14px;
}

.bnt-who-title {
  font-size: clamp(var(--bnt-title-mobile-size, 30px), 4vw, var(--bnt-title-size, 54px));
  line-height: 1.05;
  font-weight: 800;
  letter-spacing: -0.04em;
  margin: 0 0 12px;
  color: var(--bnt-main);
}

.bnt-who-subtitle {
  font-size: var(--bnt-subtitle-size, 17px);
  line-height: 1.7;
  color: var(--bnt-text-soft);
  margin: 0;
  max-width: 860px;
}

.bnt-who-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
  max-width: 720px;
  padding-top: 14px;
}

.bnt-who-filter button {
  font-family: inherit;
  border: 1px solid var(--bnt-cat-border, var(--bnt-filter-border, #D8E6F7));
  background: var(--bnt-cat-bg, var(--bnt-filter-bg, #F0F6FF));
  color: var(--bnt-cat-text, var(--bnt-filter-text, var(--bnt-main)));
  border-radius: 999px;
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: .2s ease;
  white-space: nowrap;
}

.bnt-who-filter button:hover {
  transform: translateY(-1px);
  border-color: var(--bnt-main);
}

.bnt-who-filter button.active {
  background: var(--bnt-footer-bg, var(--bnt-main));
  color: var(--bnt-footer-text, #fff);
  border-color: var(--bnt-main);
  box-shadow: 0 8px 20px rgba(17,21,105,0.18);
}

.bnt-who-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: var(--bnt-stats-mb, 34px);
}

.bnt-who-stat {
  background: var(--bnt-stat-bg, #F7FAFF);
  border: 1.5px solid var(--bnt-stat-border, #DCE6F5);
  border-radius: 22px;
  padding: 20px 22px;
  min-height: 96px;
  box-shadow: 0 6px 18px rgba(17,21,105,0.04);
}

.bnt-who-stat strong {
  display: block;
  font-size: var(--bnt-stat-number-size, 34px);
  line-height: 1.1;
  color: var(--bnt-main);
  font-weight: 800;
  margin-bottom: 5px;
}

.bnt-who-stat span {
  color: var(--bnt-text-soft);
  font-size: 14px;
  font-weight: 600;
}

.bnt-carousel-shell {
  position: relative;
  padding: 0 70px;
}

.bnt-carousel-viewport {
  overflow: hidden;
  width: 100%;
  border-radius: 26px;
  padding: 8px 4px 14px;
}

.bnt-carousel-track {
  display: flex;
  gap: 28px;
  transition: transform .42s cubic-bezier(.4,0,.2,1);
  will-change: transform;
}

.bnt-who-card {
  position: relative;
  flex: 0 0 calc((100% - 56px) / 3);
  background: var(--bnt-card-bg, #fff);
  border: 1.8px solid var(--bnt-card-border, #D3DDF0);
  border-radius: var(--bnt-radius-lg);
  padding: 24px;
  min-height: 306px;
  overflow: hidden;
  transition: .24s ease;
  box-shadow: 0 10px 26px rgba(var(--bnt-card-shadow-rgb, 17,21,105), var(--bnt-card-shadow-opacity, .08));
}

.bnt-who-card::after {
  content: "";
  position: absolute;
  right: -40px;
  bottom: -55px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: rgba(var(--bnt-circle-rgb, 240,241,247), var(--bnt-circle-opacity, .70));
  transition: .24s ease;
  pointer-events: none;
}

.bnt-who-card:hover {
  transform: translateY(-4px);
  border: 2px solid #111569;
  box-shadow: 0 22px 46px rgba(var(--bnt-card-shadow-rgb, 17,21,105), calc(var(--bnt-card-shadow-opacity, .08) + .08));
}

.bnt-who-card:hover::after {
  transform: scale(1.25);
  background: rgba(var(--bnt-circle-rgb, 240,241,247), var(--bnt-circle-opacity, .70));
}

.bnt-who-card-top {
  display: grid;
  grid-template-columns: var(--bnt-visual-w, 128px) minmax(0, 1fr);
  gap: 16px;
  align-items: start;
  margin-bottom: 18px;
  position: relative;
  z-index: 1;
}

.bnt-visual-stack {
  position: relative;
  width: var(--bnt-visual-w, 128px) !important;
  height: var(--bnt-visual-h, 112px) !important;
  flex: 0 0 var(--bnt-visual-w, 128px) !important;
  max-width: 100%;
}

.bnt-client-logo {
  position: absolute;
  right: var(--bnt-logo-right, 6px) !important;
  top: var(--bnt-logo-top, 0px) !important;
  width: var(--bnt-logo-size, 92px) !important;
  height: var(--bnt-logo-size, 92px) !important;
  border-radius: 22px;
  background: var(--bnt-logo-bg, #F0F6FF);
  border: 1.5px solid var(--bnt-logo-border, #D0DDF0);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.5);
}

.bnt-client-logo img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: var(--bnt-logo-padding, 14px);
}

.bnt-client-logo .logo-fallback {
  font-size: var(--bnt-logo-text-size, 27px);
  font-weight: 800;
  color: var(--bnt-main);
  letter-spacing: -0.04em;
}

.bnt-product-float {
  position: absolute;
  left: var(--bnt-product-left, -4px) !important;
  bottom: var(--bnt-product-bottom, -2px) !important;
  width: var(--bnt-product-size, 88px) !important;
  height: var(--bnt-product-size, 88px) !important;
  z-index: 3;
  pointer-events: none;
  filter: drop-shadow(0 12px 16px rgba(17,21,105,0.20));
  transform: rotate(var(--bnt-product-rotate, -7deg));
  transition: transform .25s ease, filter .25s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bnt-product-float img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.bnt-product-float .product-fallback {
  font-size: var(--bnt-product-icon-size, 43px);
  line-height: 1;
  transform: translateY(-2px);
}

.bnt-who-card:hover .bnt-product-float {
  transform: rotate(calc(var(--bnt-product-rotate, -7deg) + 5deg)) translate(-3px, -5px) scale(1.08);
  filter: drop-shadow(0 16px 24px rgba(17,21,105,0.24));
}

.bnt-who-tag {
  display: inline-flex;
  align-items: center;
  font-size: 11px;
  font-weight: 800;
  color: var(--bnt-cat-text, var(--bnt-main));
  background: var(--bnt-cat-bg, var(--bnt-pill-bg, #EEF5FF));
  border: 1.2px solid var(--bnt-cat-border, var(--bnt-pill-border, #CBDDF6));
  border-radius: 999px;
  padding: 5px 12px;
  text-transform: uppercase;
  letter-spacing: .04em;
  margin-bottom: 8px;
}

.bnt-who-name {
  font-size: var(--bnt-card-title-size, 21px);
  line-height: 1.35;
  font-weight: 800;
  color: var(--bnt-main);
  margin: 0;
}

.bnt-client-company {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 7px;
  font-size: 13px;
  line-height: 1.45;
  color: #71839B;
  font-weight: 700;
}

.bnt-client-company i {
  font-size: 15px;
  color: #111569;
  opacity: .86;
}

.bnt-who-detail {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 8px;
  margin-bottom: 14px;
}

.bnt-who-line {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: var(--bnt-body-size, 14px);
  line-height: 1.55;
  color: #4A5568;
  font-weight: 600;
}

.bnt-who-line i {
  color: var(--bnt-main);
  font-size: 16px;
  margin-top: 2px;
}

.bnt-who-line strong {
  color: var(--bnt-main);
  font-weight: 800;
}

.bnt-who-note {
  position: relative;
  z-index: 1;
  color: var(--bnt-text-soft);
  font-size: var(--bnt-body-size, 14px);
  line-height: 1.7;
  margin: 0;
}

.bnt-carousel-controls {
  position: relative;
  min-height: 54px;
  margin-top: 14px;
}

.bnt-carousel-arrows {
  position: absolute;
  left: -70px;
  right: -70px;
  top: -190px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  pointer-events: none;
  z-index: 10;
}

.bnt-carousel-arrow {
  width: 56px;
  height: 56px;
  border-radius: 999px;
  border: 1px solid var(--bnt-arrow-border, #D8E6F7);
  background: #fff;
  color: var(--bnt-main);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: .2s ease;
  font-size: 24px;
  box-shadow: 0 14px 26px rgba(17,21,105,0.12);
  pointer-events: auto;
}

.bnt-carousel-arrow:hover {
  background: var(--bnt-footer-bg, var(--bnt-main));
  color: var(--bnt-footer-text, #fff);
  border-color: var(--bnt-main);
  transform: translateY(-1px);
}

.bnt-carousel-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 100%;
}

.bnt-carousel-dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  border: 0;
  background: #D7E8FA;
  cursor: pointer;
  transition: .2s ease;
  padding: 0;
}

.bnt-carousel-dot.active {
  width: 26px;
  background: var(--bnt-main);
}

.bnt-who-empty {
  width: 100%;
  text-align: center;
  background: #F8FBFF;
  border: 1px dashed #C9DDF4;
  border-radius: 20px;
  padding: 32px;
  color: var(--bnt-text-soft);
  font-weight: 600;
  display: none;
}

.bnt-who-footer {
  margin-top: 28px;
  background: var(--bnt-footer-bg, var(--bnt-main));
  color: var(--bnt-footer-text, #fff);
  border-radius: 999px;
  padding: 13px 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.bnt-who-footer p {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: var(--bnt-footer-text, rgba(255,255,255,.92));
}

.bnt-who-empty-state {
  font-family: 'Sarabun', sans-serif;
  color: #111569;
  background: #F8FBFF;
  border: 1px dashed #C9DDF4;
  border-radius: 18px;
  padding: 24px;
  text-align: center;
}



/* ===== Version 1.4: การ์ดไม่เบียดเมื่อมีข้อมูลน้อย ===== */
.bnt-carousel-track.bnt-count-1,
.bnt-carousel-track.bnt-count-2 {
  justify-content: center;
}

.bnt-carousel-track.bnt-count-1 .bnt-who-card {
  flex-basis: min(620px, 100%) !important;
}

.bnt-carousel-track.bnt-count-2 .bnt-who-card {
  flex-basis: min(520px, calc((100% - 28px) / 2)) !important;
}

.bnt-who-section .bnt-who-card {
  min-width: 0;
}

@media (max-width: 720px) {
  .bnt-carousel-track.bnt-count-1,
  .bnt-carousel-track.bnt-count-2 {
    justify-content: flex-start;
  }

  .bnt-carousel-track.bnt-count-1 .bnt-who-card,
  .bnt-carousel-track.bnt-count-2 .bnt-who-card {
    flex-basis: 100% !important;
  }
}

/* ===== Version 1.2: ปุ่มเลื่อนขนาบข้าง Card ===== */
.bnt-who-section .bnt-carousel-arrow:first-child {
  background: var(--bnt-section-bg, #ffffff);
  color: var(--bnt-main);
}

.bnt-who-section .bnt-carousel-arrow:last-child {
  background: var(--bnt-arrow-active-bg, var(--bnt-main));
  color: var(--bnt-arrow-active-text, #ffffff);
  border-color: var(--bnt-arrow-active-bg, var(--bnt-main));
}

.bnt-who-section .bnt-carousel-arrow:first-child:hover,
.bnt-who-section .bnt-carousel-arrow:last-child:hover {
  background: var(--bnt-arrow-active-bg, var(--bnt-main));
  color: var(--bnt-arrow-active-text, #ffffff);
  border-color: var(--bnt-arrow-active-bg, var(--bnt-main));
}

.bnt-who-section .bnt-carousel-arrow i {
  line-height: 1;
}


@media (max-width: 1180px) {
  .bnt-who-wrap { padding: 42px 28px 30px; }
  .bnt-who-head { flex-direction: column; }
  .bnt-who-filter { justify-content: flex-start; padding-top: 0; }
  .bnt-who-stats { grid-template-columns: repeat(2, 1fr); }
  .bnt-who-card { flex-basis: calc((100% - 28px) / 2); }
  .bnt-carousel-shell { padding: 0 58px; }
  .bnt-carousel-arrows {
    left: -58px;
    right: -58px;
    top: -190px;
  }
  .bnt-carousel-arrow {
    width: 50px;
    height: 50px;
  }
}

@media (max-width: 720px) {
  .bnt-who-section { padding: 40px 12px; }
  .bnt-who-wrap {
    border-radius: 24px;
    padding: 30px 14px 22px;
  }
  .bnt-who-head {
    gap: 18px;
    margin-bottom: 24px;
  }
  .bnt-who-subtitle { font-size: 15px; }
  .bnt-who-filter {
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 8px;
    width: 100%;
    -webkit-overflow-scrolling: touch;
  }
  .bnt-who-filter::-webkit-scrollbar { display: none; }
  .bnt-who-stats {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 24px;
  }
  .bnt-who-stat {
    padding: 16px 14px;
    min-height: 82px;
  }
  .bnt-who-stat strong { font-size: 25px; }
  .bnt-who-stat span { font-size: 12px; }
  .bnt-carousel-viewport {
    overflow: hidden;
    border-radius: 22px;
  }
  .bnt-carousel-track { gap: 14px; }
  .bnt-who-card {
    flex-basis: 100%;
    min-height: 318px;
    padding: 18px;
    border-radius: 22px;
  }
  .bnt-who-card-top {
    grid-template-columns: minmax(96px, 112px) minmax(0, 1fr);
    gap: 12px;
  }
  .bnt-visual-stack {
    width: min(var(--bnt-visual-w, 112px), 112px);
    height: min(var(--bnt-visual-h, 100px), 110px);
  }
  .bnt-client-logo {
    width: min(var(--bnt-logo-size, 80px), 84px);
    height: min(var(--bnt-logo-size, 80px), 84px);
    border-radius: 18px;
    right: 4px;
  }
  .bnt-product-float {
    width: min(var(--bnt-product-size, 76px), 82px);
    height: min(var(--bnt-product-size, 76px), 82px);
    left: max(var(--bnt-product-left, -4px), -12px);
    bottom: max(var(--bnt-product-bottom, -2px), -12px);
  }
  .bnt-who-name { font-size: min(var(--bnt-card-title-size, 21px), 18px); }
  .bnt-carousel-shell { padding: 0; }
  .bnt-carousel-controls {
    margin-top: 14px;
    min-height: 50px;
  }
  .bnt-carousel-arrows {
    position: static;
    transform: none;
    display: flex;
    justify-content: flex-start;
    gap: 10px;
    pointer-events: auto;
  }
  .bnt-carousel-arrow {
    width: 42px;
    height: 42px;
    font-size: 20px;
  }
  .bnt-carousel-dots {
    position: absolute;
    left: 108px;
    right: 0;
    top: 17px;
    justify-content: center;
  }
  .bnt-who-footer {
    border-radius: 22px;
    padding: 18px;
  }
}


/* ===== Version 1.7: Flexible image sizing safety ===== */
.bnt-who-card-top > div:last-child {
  min-width: 0;
}

.bnt-who-name,
.bnt-client-company,
.bnt-who-line,
.bnt-who-note {
  overflow-wrap: anywhere;
}

.bnt-product-float img,
.bnt-client-logo img {
  display: block;
  max-width: 100%;
  max-height: 100%;
}


/* ===== Version 1.8 image size force ===== */
.bnt-who-section .bnt-who-card-top {
  grid-template-columns: var(--bnt-visual-w, 128px) minmax(0, 1fr) !important;
}

.bnt-who-section .bnt-visual-stack {
  width: var(--bnt-visual-w, 128px) !important;
  height: var(--bnt-visual-h, 112px) !important;
  flex-basis: var(--bnt-visual-w, 128px) !important;
}

.bnt-who-section .bnt-client-logo {
  width: var(--bnt-logo-size, 92px) !important;
  height: var(--bnt-logo-size, 92px) !important;
  right: var(--bnt-logo-right, 6px) !important;
  top: var(--bnt-logo-top, 0px) !important;
}

.bnt-who-section .bnt-client-logo img {
  padding: var(--bnt-logo-padding, 14px) !important;
}

.bnt-who-section .bnt-client-logo .logo-fallback {
  font-size: var(--bnt-logo-text-size, 27px) !important;
}

.bnt-who-section .bnt-product-float {
  width: var(--bnt-product-size, 88px) !important;
  height: var(--bnt-product-size, 88px) !important;
  left: var(--bnt-product-left, -4px) !important;
  bottom: var(--bnt-product-bottom, -2px) !important;
  transform: rotate(var(--bnt-product-rotate, -7deg)) !important;
}

.bnt-who-section .bnt-product-float .product-fallback {
  font-size: var(--bnt-product-icon-size, 43px) !important;
}

.bnt-who-section .bnt-who-card:hover .bnt-product-float {
  transform: rotate(calc(var(--bnt-product-rotate, -7deg) + 5deg)) translate(-3px, -5px) scale(1.08) !important;
}


/* ===== Version 1.9: Full-left visual layout, no inner frame ===== */
.bnt-who-section .bnt-who-card.bnt-card-full-left {
  display: grid !important;
  grid-template-columns: minmax(240px, var(--bnt-visual-w, 305px)) minmax(0, 1fr) !important;
  gap: 34px !important;
  align-items: stretch !important;
  min-height: 270px !important;
  padding: 28px 34px !important;
}

.bnt-who-section .bnt-card-visual-area {
  position: relative;
  min-width: 0;
  min-height: 215px;
  border: 0 !important;
  background:
    radial-gradient(circle at 42% 52%,
      rgba(var(--bnt-visual-glow-rgb, 235,244,255), var(--bnt-visual-glow-opacity, .45)) 0%,
      rgba(var(--bnt-visual-glow-rgb, 235,244,255), calc(var(--bnt-visual-glow-opacity, .45) * .6)) 44%,
      rgba(255,255,255,0) 72%);
  overflow: visible;
}

.bnt-who-section .bnt-card-visual-area::after {
  content: "";
  position: absolute;
  right: -18px;
  top: 20px;
  bottom: 20px;
  width: 1px;
  background: #E4ECF6;
}

.bnt-who-section .bnt-card-visual-area .bnt-visual-stack {
  width: 100% !important;
  height: 100% !important;
  min-height: 215px !important;
  position: relative !important;
}

.bnt-who-section .bnt-card-full-left .bnt-client-logo {
  border: 1.5px solid var(--bnt-logo-frame-border, var(--bnt-logo-border, #D0DDF0)) !important;
  background: var(--bnt-logo-frame-bg, var(--bnt-logo-bg, #F0F6FF)) !important;
  box-shadow: 0 10px 24px rgba(var(--bnt-card-shadow-rgb, 17,21,105), .06) !important;
  border-radius: 24px !important;
  width: var(--bnt-logo-size, 150px) !important;
  height: var(--bnt-logo-size, 150px) !important;
  right: var(--bnt-logo-right, 55px) !important;
  top: var(--bnt-logo-top, 20px) !important;
  z-index: 3;
}

.bnt-who-section .bnt-card-full-left .bnt-client-logo img {
  padding: var(--bnt-logo-padding, 0px) !important;
  object-fit: contain !important;
}

.bnt-who-section .bnt-card-full-left .bnt-client-logo .logo-fallback {
  font-size: var(--bnt-logo-text-size, 42px) !important;
  text-align: center;
}

.bnt-who-section .bnt-card-full-left .bnt-product-float {
  width: var(--bnt-product-size, 210px) !important;
  height: var(--bnt-product-size, 210px) !important;
  left: var(--bnt-product-left, 35px) !important;
  bottom: var(--bnt-product-bottom, 4px) !important;
  z-index: 2;
  filter: drop-shadow(0 18px 28px rgba(17,21,105,.16)) !important;
}

.bnt-who-section .bnt-card-full-left .bnt-product-float .product-fallback {
  font-size: var(--bnt-product-icon-size, 82px) !important;
}

.bnt-who-section .bnt-card-content {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  z-index: 2;
}

.bnt-who-section .bnt-card-content .bnt-who-card-top {
  display: block !important;
  margin-bottom: 18px !important;
}

.bnt-who-section .bnt-card-content .bnt-who-detail {
  margin-bottom: 16px !important;
}

.bnt-who-section .bnt-card-full-left:hover .bnt-product-float {
  transform: rotate(calc(var(--bnt-product-rotate, -7deg) + 4deg)) translate(-4px, -6px) scale(1.04) !important;
}

@media (max-width: 1180px) {
  .bnt-who-section .bnt-who-card.bnt-card-full-left {
    grid-template-columns: minmax(210px, 260px) minmax(0, 1fr) !important;
    gap: 26px !important;
  }

  .bnt-who-section .bnt-card-visual-area {
    min-height: 205px;
  }
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-who-card.bnt-card-full-left {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
    padding: 20px !important;
    min-height: auto !important;
  }

  .bnt-who-section .bnt-card-visual-area {
    min-height: 190px;
  }

  .bnt-who-section .bnt-card-visual-area::after {
    display: none;
  }

  .bnt-who-section .bnt-card-full-left .bnt-client-logo {
    width: min(var(--bnt-logo-size, 130px), 145px) !important;
    height: min(var(--bnt-logo-size, 130px), 145px) !important;
    right: 26px !important;
    top: 8px !important;
  }

  .bnt-who-section .bnt-card-full-left .bnt-product-float {
    width: min(var(--bnt-product-size, 160px), 175px) !important;
    height: min(var(--bnt-product-size, 160px), 175px) !important;
    left: 18px !important;
    bottom: 0 !important;
  }
}


/* ===== Version 2.1 shadow and logo frame controls ===== */
.bnt-who-section .bnt-who-wrap {
  box-shadow: 0 20px 60px rgba(var(--bnt-wrap-shadow-rgb, 17,21,105), var(--bnt-wrap-shadow-opacity, 0)) !important;
}

.bnt-who-section .bnt-who-card {
  box-shadow: 0 10px 26px rgba(var(--bnt-card-shadow-rgb, 17,21,105), var(--bnt-card-shadow-opacity, .08)) !important;
}

.bnt-who-section .bnt-who-card:hover {
  box-shadow: 0 22px 46px rgba(var(--bnt-card-shadow-rgb, 17,21,105), calc(var(--bnt-card-shadow-opacity, .08) + .08)) !important;
}

.bnt-who-section .bnt-who-card::after {
  background: rgba(var(--bnt-circle-rgb, 240,241,247), var(--bnt-circle-opacity, .70)) !important;
}

.bnt-who-section .bnt-card-visual-area {
  background:
    radial-gradient(circle at 42% 52%,
      rgba(var(--bnt-visual-glow-rgb, 235,244,255), var(--bnt-visual-glow-opacity, .45)) 0%,
      rgba(var(--bnt-visual-glow-rgb, 235,244,255), calc(var(--bnt-visual-glow-opacity, .45) * .6)) 44%,
      rgba(255,255,255,0) 72%) !important;
}

.bnt-who-section .bnt-card-full-left .bnt-client-logo {
  border: 1.5px solid var(--bnt-logo-frame-border, var(--bnt-logo-border, #D0DDF0)) !important;
  background: var(--bnt-logo-frame-bg, var(--bnt-logo-bg, #F0F6FF)) !important;
  box-shadow: 0 10px 24px rgba(var(--bnt-card-shadow-rgb, 17,21,105), .06) !important;
  border-radius: 24px !important;
}


/* ===== Version 2.2: Large full-left logo frame, product unchanged ===== */
.bnt-who-section .bnt-card-full-left .bnt-client-logo {
  width: var(--bnt-logo-frame-w, 260px) !important;
  height: var(--bnt-logo-frame-h, 220px) !important;
  left: var(--bnt-logo-frame-left, 18px) !important;
  right: auto !important;
  top: var(--bnt-logo-frame-top, 14px) !important;
  border: 1.5px solid var(--bnt-logo-frame-border, var(--bnt-logo-border, #D0DDF0)) !important;
  background: var(--bnt-logo-frame-bg, var(--bnt-logo-bg, #F0F6FF)) !important;
  border-radius: 28px !important;
  z-index: 1 !important;
}

.bnt-who-section .bnt-card-full-left .bnt-client-logo img {
  padding: var(--bnt-logo-img-padding, 24px) !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.bnt-who-section .bnt-card-full-left .bnt-client-logo .logo-fallback {
  font-size: var(--bnt-logo-text-size, 52px) !important;
}

/* Keep product above the large logo frame */
.bnt-who-section .bnt-card-full-left .bnt-product-float {
  z-index: 3 !important;
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-card-full-left .bnt-client-logo {
    width: min(var(--bnt-logo-frame-w, 230px), 78vw) !important;
    height: min(var(--bnt-logo-frame-h, 180px), 220px) !important;
    left: 12px !important;
    top: 8px !important;
  }

  .bnt-who-section .bnt-card-full-left .bnt-client-logo .logo-fallback {
    font-size: min(var(--bnt-logo-text-size, 46px), 54px) !important;
  }
}


/* ===== Version 2.3: Large logo frame settings visible ===== */
.bnt-who-section .bnt-card-full-left .bnt-client-logo {
  width: var(--bnt-logo-frame-w, 220px) !important;
  height: var(--bnt-logo-frame-h, 190px) !important;
  left: var(--bnt-logo-frame-left, 0px) !important;
  right: auto !important;
  top: var(--bnt-logo-frame-top, 18px) !important;
  border: 1.5px solid var(--bnt-logo-frame-border, var(--bnt-logo-border, #D0DDF0)) !important;
  background: var(--bnt-logo-frame-bg, var(--bnt-logo-bg, #F0F6FF)) !important;
  border-radius: 28px !important;
  z-index: 1 !important;
}

.bnt-who-section .bnt-card-full-left .bnt-client-logo img {
  padding: var(--bnt-logo-img-padding, 24px) !important;
}

.bnt-who-section .bnt-card-full-left .bnt-product-float {
  z-index: 3 !important;
}


/* ===== Version 2.5 spacing controls ===== */
.bnt-who-section {
  padding-top: var(--bnt-section-pt, 40px) !important;
  padding-bottom: var(--bnt-section-pb, 40px) !important;
}

.bnt-who-section .bnt-who-wrap {
  padding-top: calc(var(--bnt-wrap-pt, 36px) + var(--bnt-top-space, 0px)) !important;
  padding-right: var(--bnt-wrap-pr, 60px) !important;
  padding-bottom: var(--bnt-wrap-pb, 38px) !important;
  padding-left: var(--bnt-wrap-pl, 60px) !important;
}

.bnt-who-section .bnt-who-head {
  margin-bottom: var(--bnt-head-mb, 34px) !important;
}

.bnt-who-section .bnt-who-stats {
  margin-bottom: var(--bnt-stats-mb, 34px) !important;
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-who-wrap {
    padding-right: min(var(--bnt-wrap-pr, 16px), 20px) !important;
    padding-left: min(var(--bnt-wrap-pl, 16px), 20px) !important;
  }
}


/* ===== Version 2.6: Center Focus Carousel ===== */
.bnt-who-section .bnt-carousel-shell {
  position: relative !important;
  padding: 0 !important;
}

.bnt-who-section .bnt-carousel-viewport {
  position: relative !important;
  overflow: hidden !important;
  min-height: var(--bnt-carousel-h, 310px) !important;
  height: var(--bnt-carousel-h, 310px) !important;
  padding: 0 !important;
  border-radius: 32px !important;
}

.bnt-who-section .bnt-carousel-track {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  gap: 0 !important;
  transform: none !important;
  transition: none !important;
}

.bnt-who-section .bnt-who-card {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: min(var(--bnt-center-card-w, 840px), calc(100% - 220px)) !important;
  max-width: calc(100% - 220px) !important;
  min-height: 270px !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: transform .42s cubic-bezier(.4,0,.2,1), opacity .42s ease, filter .42s ease, visibility .42s ease !important;
  flex: none !important;
}

.bnt-who-section .bnt-who-card.is-active {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: 4 !important;
  transform: translate(-50%, -50%) scale(1) !important;
  filter: none !important;
}

.bnt-who-section .bnt-who-card.is-prev {
  opacity: var(--bnt-side-opacity, .28) !important;
  visibility: visible !important;
  z-index: 2 !important;
  transform: translate(calc(-50% - (var(--bnt-center-card-w, 840px) / 2) - var(--bnt-side-peek, 95px)), -50%) scale(var(--bnt-side-scale, .92)) !important;
  filter: blur(.2px) saturate(.9) !important;
}

.bnt-who-section .bnt-who-card.is-next {
  opacity: var(--bnt-side-opacity, .28) !important;
  visibility: visible !important;
  z-index: 2 !important;
  transform: translate(calc(-50% + (var(--bnt-center-card-w, 840px) / 2) + var(--bnt-side-peek, 95px)), -50%) scale(var(--bnt-side-scale, .92)) !important;
  filter: blur(.2px) saturate(.9) !important;
}

.bnt-who-section .bnt-who-card.is-hidden-side {
  opacity: 0 !important;
  visibility: hidden !important;
  z-index: 1 !important;
  transform: translate(-50%, -50%) scale(.86) !important;
}

.bnt-who-section .bnt-carousel-controls {
  position: relative !important;
  min-height: 54px !important;
  margin-top: 16px !important;
}

.bnt-who-section .bnt-carousel-arrows {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  top: calc((var(--bnt-carousel-h, 310px) / -2) - 43px) !important;
  width: min(calc(var(--bnt-center-card-w, 840px) + 170px), 100%) !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  justify-content: space-between !important;
  pointer-events: none !important;
  z-index: 9 !important;
}

.bnt-who-section .bnt-carousel-arrow {
  pointer-events: auto !important;
}

.bnt-who-section .bnt-carousel-dots {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
}

/* With only one card, center it and hide side logic safely */
.bnt-who-section .bnt-carousel-track.bnt-count-1 .bnt-who-card {
  width: min(var(--bnt-center-card-w, 840px), 100%) !important;
  max-width: 100% !important;
}

@media (max-width: 1180px) {
  .bnt-who-section .bnt-carousel-viewport {
    height: max(var(--bnt-carousel-h, 310px), 340px) !important;
  }

  .bnt-who-section .bnt-who-card {
    width: min(var(--bnt-center-card-w, 760px), calc(100% - 130px)) !important;
    max-width: calc(100% - 130px) !important;
  }

  .bnt-who-section .bnt-who-card.is-prev {
    transform: translate(calc(-50% - (min(var(--bnt-center-card-w, 760px), calc(100vw - 130px)) / 2) - 55px), -50%) scale(.9) !important;
  }

  .bnt-who-section .bnt-who-card.is-next {
    transform: translate(calc(-50% + (min(var(--bnt-center-card-w, 760px), calc(100vw - 130px)) / 2) + 55px), -50%) scale(.9) !important;
  }

  .bnt-who-section .bnt-carousel-arrows {
    width: min(calc(var(--bnt-center-card-w, 760px) + 110px), 100%) !important;
  }
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-carousel-viewport {
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .bnt-who-section .bnt-carousel-track {
    min-height: 0 !important;
  }

  .bnt-who-section .bnt-who-card {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: auto !important;
    display: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: none !important;
  }

  .bnt-who-section .bnt-who-card.is-active {
    display: grid !important;
    transform: none !important;
  }

  .bnt-who-section .bnt-who-card.is-prev,
  .bnt-who-section .bnt-who-card.is-next,
  .bnt-who-section .bnt-who-card.is-hidden-side {
    display: none !important;
  }

  .bnt-who-section .bnt-carousel-controls {
    margin-top: 14px !important;
    min-height: 50px !important;
  }

  .bnt-who-section .bnt-carousel-arrows {
    position: static !important;
    transform: none !important;
    width: auto !important;
    display: flex !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    pointer-events: auto !important;
  }

  .bnt-who-section .bnt-carousel-dots {
    position: absolute !important;
    left: 108px !important;
    right: 0 !important;
    top: 17px !important;
    justify-content: center !important;
  }
}


/* ===== Version 2.7: Taller card controls ===== */
.bnt-who-section .bnt-who-card {
  min-height: var(--bnt-card-min-h, 320px) !important;
  padding: var(--bnt-card-py, 34px) var(--bnt-card-px, 38px) !important;
}

.bnt-who-section .bnt-who-card.bnt-card-full-left {
  min-height: var(--bnt-card-min-h, 320px) !important;
  padding: var(--bnt-card-py, 34px) var(--bnt-card-px, 38px) !important;
}

.bnt-who-section .bnt-card-visual-area {
  min-height: calc(var(--bnt-card-min-h, 320px) - (var(--bnt-card-py, 34px) * 2)) !important;
}

.bnt-who-section .bnt-card-visual-area .bnt-visual-stack {
  min-height: calc(var(--bnt-card-min-h, 320px) - (var(--bnt-card-py, 34px) * 2)) !important;
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-who-card,
  .bnt-who-section .bnt-who-card.bnt-card-full-left {
    min-height: auto !important;
    padding: 20px !important;
  }
}


/* ===== Version 2.8: Prevent center card clipping ===== */
.bnt-who-section .bnt-carousel-viewport {
  height: max(
    var(--bnt-carousel-h, 360px),
    calc(var(--bnt-card-min-h, 320px) + var(--bnt-carousel-safe, 110px))
  ) !important;
  min-height: max(
    var(--bnt-carousel-h, 360px),
    calc(var(--bnt-card-min-h, 320px) + var(--bnt-carousel-safe, 110px))
  ) !important;
  padding-top: calc(var(--bnt-carousel-safe, 110px) / 2) !important;
  padding-bottom: calc(var(--bnt-carousel-safe, 110px) / 2) !important;
  overflow: hidden !important;
}

.bnt-who-section .bnt-carousel-track {
  height: 100% !important;
}

.bnt-who-section .bnt-who-card.is-active,
.bnt-who-section .bnt-who-card.is-prev,
.bnt-who-section .bnt-who-card.is-next {
  top: 50% !important;
}

/* Keep arrows centered with the taller safe viewport */
.bnt-who-section .bnt-carousel-arrows {
  top: calc(
    (max(var(--bnt-carousel-h, 360px), calc(var(--bnt-card-min-h, 320px) + var(--bnt-carousel-safe, 110px))) / -2)
    - 43px
  ) !important;
}

/* Give dots enough breathing room after the card */
.bnt-who-section .bnt-carousel-controls {
  margin-top: 8px !important;
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-carousel-viewport {
    height: auto !important;
    min-height: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}


/* ===== Version 2.9: Perfect round arrow buttons ===== */
.bnt-who-section .bnt-carousel-arrow {
  width: var(--bnt-arrow-size, 64px) !important;
  min-width: var(--bnt-arrow-size, 64px) !important;
  max-width: var(--bnt-arrow-size, 64px) !important;
  height: var(--bnt-arrow-size, 64px) !important;
  min-height: var(--bnt-arrow-size, 64px) !important;
  max-height: var(--bnt-arrow-size, 64px) !important;
  aspect-ratio: 1 / 1 !important;
  padding: 0 !important;
  border-radius: 9999px !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 var(--bnt-arrow-size, 64px) !important;
  overflow: hidden !important;
}

.bnt-who-section .bnt-carousel-arrow i {
  font-size: var(--bnt-arrow-icon-size, 28px) !important;
  width: var(--bnt-arrow-icon-size, 28px) !important;
  height: var(--bnt-arrow-icon-size, 28px) !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 0 !important;
}

.bnt-who-section .bnt-carousel-arrows {
  width: min(
    calc(var(--bnt-center-card-w, 840px) + (var(--bnt-arrow-side-offset, 90px) * 2) + (var(--bnt-arrow-size, 64px) * 2)),
    100%
  ) !important;
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-carousel-arrow {
    width: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    height: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    flex-basis: 42px !important;
  }

  .bnt-who-section .bnt-carousel-arrow i {
    font-size: 20px !important;
    width: 20px !important;
    height: 20px !important;
  }
}


/* ===== Version 3.0: Single-line filter controls ===== */
.bnt-who-section .bnt-who-filter {
  width: min(var(--bnt-filter-wrap-w, 520px), 100%) !important;
  max-width: 100% !important;
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: var(--bnt-filter-gap, 12px) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 4px 2px 10px !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: thin;
}

.bnt-who-section .bnt-who-filter button {
  flex: 0 0 auto !important;
  min-width: var(--bnt-filter-btn-min-w, 84px) !important;
  white-space: nowrap !important;
  text-align: center !important;
}

.bnt-who-section .bnt-who-filter::-webkit-scrollbar {
  height: 4px;
}

.bnt-who-section .bnt-who-filter::-webkit-scrollbar-thumb {
  background: rgba(17,21,105,.18);
  border-radius: 999px;
}

@media (max-width: 980px) {
  .bnt-who-section .bnt-who-filter {
    justify-content: flex-start !important;
    width: 100% !important;
  }
}

/* If user intentionally disables nowrap in settings, allow wrapping via class fallback using CSS variable not directly possible for flex-wrap.
   Keep default nowrap because the requested behavior is single-line. */


/* ===== Version 3.1: Filter moved below stats row ===== */
.bnt-who-section .bnt-who-head .bnt-who-filter {
  display: none !important;
}

.bnt-who-section .bnt-who-stats {
  margin-bottom: 0 !important;
}

.bnt-who-section .bnt-who-stats-filter-row {
  width: 100% !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  margin-top: var(--bnt-filter-row-mt, 22px) !important;
  margin-bottom: var(--bnt-filter-row-mb, 26px) !important;
  padding-right: var(--bnt-filter-row-pr, 0px) !important;
  box-sizing: border-box !important;
}

.bnt-who-section .bnt-who-stats-filter-row .bnt-who-filter {
  width: auto !important;
  max-width: 100% !important;
  justify-content: flex-end !important;
  padding: 4px 2px 8px !important;
  margin: 0 !important;
}

.bnt-who-section .bnt-who-stats-filter-row .bnt-who-filter button {
  min-width: var(--bnt-filter-btn-min-w, 84px) !important;
  padding-left: 22px !important;
  padding-right: 22px !important;
}

@media (max-width: 980px) {
  .bnt-who-section .bnt-who-stats-filter-row {
    justify-content: flex-start !important;
    padding-right: 0 !important;
  }

  .bnt-who-section .bnt-who-stats-filter-row .bnt-who-filter {
    width: 100% !important;
    justify-content: flex-start !important;
  }
}


/* ===== Version 3.2: Center filter below stats ===== */
.bnt-who-section .bnt-who-stats-filter-row {
  justify-content: center !important;
  padding-right: 0 !important;
}

.bnt-who-section .bnt-who-stats-filter-row .bnt-who-filter {
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Optional alignment helpers via body classes are not required; center is the default requested behavior. */
@media (max-width: 980px) {
  .bnt-who-section .bnt-who-stats-filter-row {
    justify-content: center !important;
  }

  .bnt-who-section .bnt-who-stats-filter-row .bnt-who-filter {
    justify-content: center !important;
    width: 100% !important;
  }
}


/* ===== Version 3.3: Simple showcase, no filter/carousel controls ===== */
.bnt-who-section .bnt-who-stats-filter-row,
.bnt-who-section .bnt-who-filter,
.bnt-who-section .bnt-carousel-controls,
.bnt-who-section .bnt-carousel-arrows,
.bnt-who-section .bnt-carousel-dots {
  display: none !important;
}

.bnt-who-section .bnt-carousel-shell {
  padding: 0 !important;
  margin-top: var(--bnt-stats-mb, 34px) !important;
}

.bnt-who-section .bnt-carousel-viewport {
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
  padding: 0 !important;
}

.bnt-who-section .bnt-carousel-track {
  position: static !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  justify-items: center !important;
  align-items: stretch !important;
  gap: 28px !important;
  width: 100% !important;
  height: auto !important;
  transform: none !important;
}

.bnt-who-section .bnt-who-card,
.bnt-who-section .bnt-who-card.is-active,
.bnt-who-section .bnt-who-card.is-prev,
.bnt-who-section .bnt-who-card.is-next,
.bnt-who-section .bnt-who-card.is-hidden-side {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: min(var(--bnt-center-card-w, 840px), 100%) !important;
  max-width: 100% !important;
  min-height: var(--bnt-card-min-h, 320px) !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  display: grid !important;
  transform: none !important;
  filter: none !important;
  z-index: 1 !important;
}

.bnt-who-section .bnt-who-card:hover {
  transform: translateY(-4px) !important;
}

/* Show all cards even if JS previously assigns classes */
.bnt-who-section .bnt-who-card[style*="display: none"] {
  display: grid !important;
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-carousel-track {
    gap: 18px !important;
  }

  .bnt-who-section .bnt-who-card,
  .bnt-who-section .bnt-who-card.is-active,
  .bnt-who-section .bnt-who-card.is-prev,
  .bnt-who-section .bnt-who-card.is-next,
  .bnt-who-section .bnt-who-card.is-hidden-side {
    width: 100% !important;
    min-height: auto !important;
  }
}


/* ===== Version 3.4: Single-card carousel with arrows and dots ===== */
.bnt-who-section .bnt-who-stats-filter-row,
.bnt-who-section .bnt-who-filter {
  display: none !important;
}

.bnt-who-section .bnt-carousel-shell {
  position: relative !important;
  padding: 0 !important;
  margin-top: var(--bnt-stats-mb, 34px) !important;
}

.bnt-who-section .bnt-carousel-viewport {
  position: relative !important;
  height: var(--bnt-single-carousel-h, 420px) !important;
  min-height: var(--bnt-single-carousel-h, 420px) !important;
  overflow: visible !important;
  padding: 0 !important;
  border-radius: 34px !important;
}

.bnt-who-section .bnt-carousel-track {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  transform: none !important;
  transition: none !important;
}

.bnt-who-section .bnt-who-card,
.bnt-who-section .bnt-who-card.is-active,
.bnt-who-section .bnt-who-card.is-prev,
.bnt-who-section .bnt-who-card.is-next,
.bnt-who-section .bnt-who-card.is-hidden-side {
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  width: min(var(--bnt-single-card-w, 960px), calc(100% - 170px)) !important;
  max-width: calc(100% - 170px) !important;
  min-height: var(--bnt-card-min-h, 320px) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translate(-50%, -50%) scale(.98) !important;
  transition: opacity .28s ease, transform .28s ease, visibility .28s ease !important;
  filter: none !important;
  z-index: 1 !important;
  display: grid !important;
}

.bnt-who-section .bnt-who-card.is-active {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translate(-50%, -50%) scale(1) !important;
  z-index: 3 !important;
}

.bnt-who-section .bnt-who-card:hover {
  transform: translate(-50%, calc(-50% - 4px)) scale(1) !important;
}

.bnt-who-section .bnt-carousel-controls {
  position: relative !important;
  min-height: 54px !important;
  margin-top: var(--bnt-single-card-gap-bottom, 18px) !important;
}

.bnt-who-section .bnt-carousel-arrows {
  position: absolute !important;
  left: 50% !important;
  right: auto !important;
  top: calc((var(--bnt-single-carousel-h, 420px) / -2) - (var(--bnt-arrow-size, 64px) / 2) - var(--bnt-single-card-gap-bottom, 18px)) !important;
  width: min(
    calc(var(--bnt-single-card-w, 960px) + (var(--bnt-arrow-side-offset, 90px) * 2) + (var(--bnt-arrow-size, 64px) * 2)),
    100%
  ) !important;
  transform: translateX(-50%) !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  pointer-events: none !important;
  z-index: 10 !important;
}

.bnt-who-section .bnt-carousel-arrow {
  pointer-events: auto !important;
  width: var(--bnt-arrow-size, 64px) !important;
  min-width: var(--bnt-arrow-size, 64px) !important;
  height: var(--bnt-arrow-size, 64px) !important;
  min-height: var(--bnt-arrow-size, 64px) !important;
  aspect-ratio: 1/1 !important;
  padding: 0 !important;
  border-radius: 9999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bnt-who-section .bnt-carousel-arrow i {
  font-size: var(--bnt-arrow-icon-size, 28px) !important;
  width: var(--bnt-arrow-icon-size, 28px) !important;
  height: var(--bnt-arrow-icon-size, 28px) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.bnt-who-section .bnt-carousel-dots {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 7px !important;
  width: 100% !important;
  margin: 0 auto !important;
}

.bnt-who-section .bnt-carousel-dot {
  cursor: pointer !important;
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-carousel-viewport {
    height: auto !important;
    min-height: 0 !important;
    overflow: hidden !important;
  }

  .bnt-who-section .bnt-carousel-track {
    height: auto !important;
  }

  .bnt-who-section .bnt-who-card,
  .bnt-who-section .bnt-who-card.is-active,
  .bnt-who-section .bnt-who-card.is-hidden-side {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: auto !important;
    transform: none !important;
    display: none !important;
  }

  .bnt-who-section .bnt-who-card.is-active {
    display: grid !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .bnt-who-section .bnt-who-card:hover {
    transform: none !important;
  }

  .bnt-who-section .bnt-carousel-controls {
    margin-top: 14px !important;
    min-height: 50px !important;
  }

  .bnt-who-section .bnt-carousel-arrows {
    position: static !important;
    transform: none !important;
    width: auto !important;
    display: flex !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    pointer-events: auto !important;
  }

  .bnt-who-section .bnt-carousel-dots {
    position: absolute !important;
    left: 108px !important;
    right: 0 !important;
    top: 17px !important;
    justify-content: center !important;
  }
}


/* ===== Version 3.5: Force arrows and dots visible for single-card carousel ===== */
.bnt-who-section .bnt-carousel-controls {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  min-height: 58px !important;
  margin-top: var(--bnt-single-card-gap-bottom, 18px) !important;
  overflow: visible !important;
}

.bnt-who-section .bnt-carousel-arrows {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: none !important;
  z-index: 999 !important;
}

.bnt-who-section .bnt-carousel-arrow,
.bnt-who-section .bnt-carousel-arrow[style] {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  z-index: 1000 !important;
}

.bnt-who-section .bnt-carousel-dots,
.bnt-who-section .bnt-carousel-dots[style] {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  z-index: 999 !important;
}

.bnt-who-section .bnt-carousel-dot {
  display: inline-flex !important;
  cursor: pointer !important;
}

/* Make sure the CTA bar does not cover dots/arrows */
.bnt-who-section .bnt-bottom-note,
.bnt-who-section .bnt-who-footer,
.bnt-who-section .bnt-cta-bar {
  position: relative !important;
  z-index: 1 !important;
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-carousel-controls {
    display: block !important;
    min-height: 54px !important;
  }

  .bnt-who-section .bnt-carousel-arrows {
    display: flex !important;
  }

  .bnt-who-section .bnt-carousel-dots {
    display: flex !important;
  }
}


/* ===== Version 3.6: Smooth left-right slide animation ===== */
.bnt-who-section .bnt-who-card {
  will-change: transform, opacity !important;
}

.bnt-who-section .bnt-who-card.is-active {
  animation: none !important;
}

.bnt-who-section .bnt-who-card.is-enter-next {
  animation: bntSlideInFromRight var(--bnt-slide-duration, 420ms) cubic-bezier(.22,.9,.26,1) both !important;
}

.bnt-who-section .bnt-who-card.is-enter-prev {
  animation: bntSlideInFromLeft var(--bnt-slide-duration, 420ms) cubic-bezier(.22,.9,.26,1) both !important;
}

.bnt-who-section .bnt-who-card.is-exit-next {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
  animation: bntSlideOutToLeft var(--bnt-slide-duration, 420ms) cubic-bezier(.22,.9,.26,1) both !important;
}

.bnt-who-section .bnt-who-card.is-exit-prev {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
  animation: bntSlideOutToRight var(--bnt-slide-duration, 420ms) cubic-bezier(.22,.9,.26,1) both !important;
}

@keyframes bntSlideInFromRight {
  from {
    opacity: 0;
    transform: translate(calc(-50% + var(--bnt-slide-distance, 70px)), -50%) scale(.985);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes bntSlideInFromLeft {
  from {
    opacity: 0;
    transform: translate(calc(-50% - var(--bnt-slide-distance, 70px)), -50%) scale(.985);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes bntSlideOutToLeft {
  from {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
  to {
    opacity: 0;
    transform: translate(calc(-50% - var(--bnt-slide-distance, 70px)), -50%) scale(.985);
  }
}

@keyframes bntSlideOutToRight {
  from {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
  to {
    opacity: 0;
    transform: translate(calc(-50% + var(--bnt-slide-distance, 70px)), -50%) scale(.985);
  }
}

.bnt-who-section .bnt-carousel-dot {
  transition: width .25s ease, background-color .25s ease, opacity .25s ease, transform .25s ease !important;
}

.bnt-who-section .bnt-carousel-dot.active {
  transform: scaleX(1.08) !important;
}

@media (prefers-reduced-motion: reduce) {
  .bnt-who-section .bnt-who-card.is-enter-next,
  .bnt-who-section .bnt-who-card.is-enter-prev,
  .bnt-who-section .bnt-who-card.is-exit-next,
  .bnt-who-section .bnt-who-card.is-exit-prev {
    animation: none !important;
  }
}


/* ===== Version 3.7: JS-powered slide animation fix ===== */
.bnt-who-section .bnt-who-card {
  backface-visibility: hidden !important;
  transform-style: preserve-3d !important;
  will-change: transform, opacity !important;
}

.bnt-who-section .bnt-who-card.is-active {
  animation: none !important;
}

.bnt-who-section .bnt-who-card.is-hidden-side {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}


/* ===== Version 3.8: Unlock single-card width ===== */
/* เดิม card ถูกล็อกด้วย calc(100% - 170px) เพื่อเผื่อพื้นที่ลูกศร ทำให้ปรับกว้างแล้วไม่ขยายจริง
   เวอร์ชันนี้ให้ Card ใช้พื้นที่เต็มของ container ได้ และให้ลูกศรลอยด้านข้างแทน */
.bnt-who-section .bnt-who-wrap {
  overflow: visible !important;
}

.bnt-who-section .bnt-carousel-shell,
.bnt-who-section .bnt-carousel-viewport,
.bnt-who-section .bnt-carousel-track {
  width: 100% !important;
  max-width: none !important;
  overflow: visible !important;
}

.bnt-who-section .bnt-carousel-viewport .bnt-who-card,
.bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-active,
.bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-prev,
.bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-next,
.bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-hidden-side {
  width: min(var(--bnt-single-card-w, 960px), 100%) !important;
  max-width: 100% !important;
}

/* ลูกศรใช้ความกว้างตาม card + offset แต่ไม่ไปบีบความกว้าง card */
.bnt-who-section .bnt-carousel-arrows {
  width: min(
    calc(var(--bnt-single-card-w, 960px) + (var(--bnt-arrow-side-offset, 90px) * 2) + (var(--bnt-arrow-size, 64px) * 2)),
    calc(100% + (var(--bnt-arrow-size, 64px) * 2))
  ) !important;
  max-width: none !important;
}

@media (max-width: 1180px) {
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-active,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-prev,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-next,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-hidden-side {
    width: min(var(--bnt-single-card-w, 960px), 100%) !important;
    max-width: 100% !important;
  }
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-active,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-prev,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-next,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-hidden-side {
    width: 100% !important;
    max-width: 100% !important;
  }
}


/* ===== Version 3.9: Unlock single-card height ===== */
/* เดิมความสูง Card ถูกกำหนดด้วย content/padding ภายใน ทำให้เพิ่มความสูง Carousel แล้วพื้นที่ข้างนอกสูงขึ้น
   แต่ตัว Card ไม่สูงตามจริง เวอร์ชันนี้ผูกความสูง Card กับพื้นที่ Carousel โดยตรง */
.bnt-who-section .bnt-carousel-viewport {
  height: var(--bnt-single-carousel-h, 420px) !important;
  min-height: var(--bnt-single-carousel-h, 420px) !important;
  overflow: visible !important;
}

.bnt-who-section .bnt-carousel-track {
  height: 100% !important;
  min-height: 100% !important;
}

.bnt-who-section .bnt-carousel-viewport .bnt-who-card,
.bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-active,
.bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-prev,
.bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-next,
.bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-hidden-side {
  height: min(
    var(--bnt-card-min-h, 340px),
    calc(var(--bnt-single-carousel-h, 420px) - 36px)
  ) !important;
  min-height: min(
    var(--bnt-card-min-h, 340px),
    calc(var(--bnt-single-carousel-h, 420px) - 36px)
  ) !important;
}

/* ถ้าตั้งความสูง Carousel มากกว่า Card ให้ Card ยังอยู่กลางแนวตั้ง */
.bnt-who-section .bnt-who-card.is-active {
  top: 50% !important;
}

/* ให้ฝั่งรูป/โลโก้และฝั่งข้อความยืดตามความสูง Card */
.bnt-who-section .bnt-card-inner,
.bnt-who-section .bnt-who-card-inner,
.bnt-who-section .bnt-card-content,
.bnt-who-section .bnt-who-card-content {
  min-height: 100% !important;
}

/* เพิ่มพื้นที่หายใจบน/ล่างใน Card เมื่อความสูงเพิ่ม */
.bnt-who-section .bnt-who-card {
  padding-top: var(--bnt-card-pad-y, 34px) !important;
  padding-bottom: var(--bnt-card-pad-y, 34px) !important;
}

@media (max-width: 720px) {
  .bnt-who-section .bnt-carousel-viewport {
    height: auto !important;
    min-height: var(--bnt-single-carousel-h, 420px) !important;
  }

  .bnt-who-section .bnt-carousel-viewport .bnt-who-card,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-active,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-prev,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-next,
  .bnt-who-section .bnt-carousel-viewport .bnt-who-card.is-hidden-side {
    height: auto !important;
    min-height: var(--bnt-card-min-h, 340px) !important;
  }
}


/* ===== Version 4.0: Logo / installation image gallery inside card ===== */
.bnt-client-logo.has-gallery {
  position: absolute;
}

.bnt-logo-slides {
  width: 100%;
  height: 100%;
  position: relative;
}

.bnt-logo-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .28s ease, visibility .28s ease;
  display: flex;
  align-items: center;
  justify-content: center;
}

.bnt-logo-slide.active {
  opacity: 1;
  visibility: visible;
}

.bnt-logo-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: var(--bnt-logo-padding, 14px);
}

.bnt-logo-nav {
  position: absolute;
  top: 50%;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  border: 1px solid rgba(216,230,247,.95);
  background: rgba(255,255,255,.88);
  color: var(--bnt-main);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  padding: 0;
  cursor: pointer;
  z-index: 5;
  box-shadow: 0 6px 14px rgba(17,21,105,.10);
}

.bnt-logo-nav:hover {
  background: var(--bnt-main);
  color: #fff;
  border-color: var(--bnt-main);
}

.bnt-logo-prev { left: 6px; }
.bnt-logo-next { right: 6px; }

.bnt-logo-dots {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 7px;
  display: flex;
  justify-content: center;
  gap: 4px;
  z-index: 6;
  pointer-events: auto;
}

.bnt-logo-dots button {
  width: 5px;
  height: 5px;
  border-radius: 999px;
  border: 0;
  background: rgba(17,21,105,.18);
  padding: 0;
  cursor: pointer;
}

.bnt-logo-dots button.active {
  width: 14px;
  background: var(--bnt-main);
}

/* Version 4.0: ใช้สถานที่ใช้งานแทนจำนวนสินค้า */
.bnt-who-line .bnt-usage-place {
  color: var(--bnt-main);
  font-weight: 800;
}


/* ===== Version 4.1: Full-bleed logo / installation gallery image ===== */
/* ให้ภาพโลโก้/ภาพติดตั้งในกรอบซ้ายเต็มกรอบแบบ fit in ไม่มีขอบขาว */
.bnt-client-logo.has-gallery {
  overflow: hidden !important;
  background: #f2f6fc !important;
}

.bnt-client-logo.has-gallery .bnt-logo-slide {
  overflow: hidden !important;
}

.bnt-client-logo.has-gallery .bnt-logo-slide img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  padding: 0 !important;
  border-radius: inherit !important;
}

/* ปรับปุ่มเลื่อนให้อยู่ในกรอบและไม่เบียดภาพ */
.bnt-client-logo.has-gallery .bnt-logo-nav {
  width: 30px !important;
  height: 30px !important;
  background: rgba(255,255,255,.88) !important;
  backdrop-filter: blur(6px);
}

.bnt-client-logo.has-gallery .bnt-logo-prev {
  left: 8px !important;
}

.bnt-client-logo.has-gallery .bnt-logo-next {
  right: 8px !important;
}

.bnt-client-logo.has-gallery .bnt-logo-dots {
  bottom: 8px !important;
}

/* ถ้าเป็นโลโก้ที่ไม่อยากโดนตัด ให้ใช้ช่องโลโก้หลักอย่างเดียว หรืออัปโหลดภาพขนาด 1:1 */


/* ===== Version 4.2: Fix gallery arrow hover disappearing ===== */
/* กันธีม/Elementor ทับสีปุ่มลูกศรตอน hover จนไอคอนหาย */
.bnt-client-logo.has-gallery .bnt-logo-nav,
.bnt-client-logo.has-gallery .bnt-logo-nav:visited,
.bnt-client-logo.has-gallery .bnt-logo-nav:focus {
  background: rgba(255,255,255,.92) !important;
  color: var(--bnt-main, #111569) !important;
  border: 1.5px solid rgba(17,21,105,.28) !important;
  opacity: 1 !important;
  visibility: visible !important;
  text-decoration: none !important;
  outline: none !important;
}

.bnt-client-logo.has-gallery .bnt-logo-nav:hover,
.bnt-client-logo.has-gallery .bnt-logo-nav:active {
  background: var(--bnt-main, #111569) !important;
  color: #ffffff !important;
  border-color: var(--bnt-main, #111569) !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-shadow: 0 8px 18px rgba(17,21,105,.22) !important;
}

.bnt-client-logo.has-gallery .bnt-logo-nav i,
.bnt-client-logo.has-gallery .bnt-logo-nav svg,
.bnt-client-logo.has-gallery .bnt-logo-nav:hover i,
.bnt-client-logo.has-gallery .bnt-logo-nav:hover svg,
.bnt-client-logo.has-gallery .bnt-logo-nav:focus i,
.bnt-client-logo.has-gallery .bnt-logo-nav:focus svg,
.bnt-client-logo.has-gallery .bnt-logo-nav:active i,
.bnt-client-logo.has-gallery .bnt-logo-nav:active svg {
  color: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
  display: inline-flex !important;
  line-height: 1 !important;
}

/* กันปุ่มวงกลมถูกบีบ/โดน style ปุ่มของธีม */
.bnt-client-logo.has-gallery button.bnt-logo-nav {
  min-width: 30px !important;
  max-width: 30px !important;
  min-height: 30px !important;
  max-height: 30px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

/* dots ตอน hover ต้องไม่หาย */
.bnt-client-logo.has-gallery .bnt-logo-dots button,
.bnt-client-logo.has-gallery .bnt-logo-dots button:hover,
.bnt-client-logo.has-gallery .bnt-logo-dots button:focus {
  opacity: 1 !important;
  visibility: visible !important;
}