/* binds.co — home dark
   Reusa seções/animações da home atual com skin escura completa.
*/

.binds-homeDarkPage {
  --bdh-bg: #0b0614;
  --bdh-bg-2: #12081f;
  --bdh-surface: rgba(255, 255, 255, 0.055);
  --bdh-surface-2: rgba(103, 58, 183, 0.18);
  --bdh-border: rgba(175, 154, 214, 0.22);
  --bdh-primary: #9871dd;
  --bdh-primary-soft: #af9ad6;
  --bdh-primary-deep: #673ab7;
  --bdh-text: rgba(255, 255, 255, 0.94);
  --bdh-text-2: rgba(255, 255, 255, 0.68);
  --bdh-text-3: rgba(175, 154, 214, 0.88);
  --binds-bg: #0b0614;
  --binds-surface: #160c24;
  --binds-text: rgba(255, 255, 255, 0.94);
  --binds-text-2: rgba(255, 255, 255, 0.68);
  --binds-text-3: rgba(175, 154, 214, 0.82);
  --binds-border: rgba(175, 154, 214, 0.22);

  background: #0b0614 !important;
  color: var(--bdh-text);
}

.binds-homeDarkPage main#content {
  background: #0b0614;
  position: relative;
  /* O tema põe padding-top: 72px no main para compensar navbar fixed,
     mas aqui a nav fica no fluxo — sem isso sobra um vão no topo. */
  padding-top: 0;
}

.binds-homeDarkPage main#content > * {
  position: relative;
  z-index: 1;
}

/* A regra acima rebaixaria a nav (bootstrap .fixed-top usa 1030) e o
   popup do menu ficaria escondido atrás do hero. */
.binds-homeDarkPage main#content > .navigation {
  z-index: 1030;
}

/* ============================================================
   NAV
============================================================ */
.binds-homeDarkPage .navigation.main-nav,
.binds-homeDarkPage .navigation.navbar-sticky {
  background: rgba(11, 6, 20, 0.88) !important;
  border-bottom: 1px solid rgba(175, 154, 214, 0.14) !important;
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.28) !important;
  backdrop-filter: blur(16px);
}

.binds-homeDarkPage .navigation .logo {
  filter: brightness(0) invert(1);
  opacity: 0.96;
}

.binds-homeDarkPage .navigation .st-root-link,
.binds-homeDarkPage .navigation .nav-link {
  color: rgba(255, 255, 255, 0.86) !important;
}

.binds-homeDarkPage .navigation .st-root-link:hover,
.binds-homeDarkPage .navigation .nav-link:hover,
.binds-homeDarkPage .navigation .nav-link.active {
  color: #fff !important;
  background: transparent !important;
}

/* Especificidade .binds-rebrand.binds-homeDarkPage (body tem as duas classes):
   vence .binds-rebrand .btn.btn-primary / .btn.btn-rounded do components. */
.binds-rebrand.binds-homeDarkPage .btn {
  font-weight: 600;
  letter-spacing: -0.025em;
  padding: 11px 18px;
  box-shadow: none !important;
  transition: transform 180ms ease, background 180ms ease, border-color 180ms ease, color 180ms ease;
}

.binds-rebrand.binds-homeDarkPage .btn.btn-rounded,
.binds-rebrand.binds-homeDarkPage .btn.btn-lg {
  border-radius: 6px !important;
}

.binds-rebrand.binds-homeDarkPage .btn-lg {
  padding: 13px 20px;
  font-size: 15px;
}

.binds-homeDarkPage .btn i,
.binds-homeDarkPage .btn .fas {
  font-size: 0.72em;
  margin-left: 8px !important;
  transition: transform 180ms ease;
}

.binds-homeDarkPage .btn-primary:hover i,
.binds-homeDarkPage .btn-primary:hover .fas {
  transform: translateX(3px);
}

.binds-rebrand.binds-homeDarkPage .btn.btn-primary {
  background: #fff !important;
  border: 1px solid #fff !important;
  color: #0b0614 !important;
}

.binds-rebrand.binds-homeDarkPage .btn.btn-primary:hover {
  background: #f3edff !important;
  border-color: #f3edff !important;
  color: #0b0614 !important;
  transform: translateY(-1px);
  filter: none;
}

.binds-rebrand.binds-homeDarkPage .btn.btn-outline {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
  backdrop-filter: blur(10px);
}

.binds-rebrand.binds-homeDarkPage .btn.btn-outline:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.32) !important;
  color: #fff !important;
}

/* Nav: regras do components para .st-nav-secondary têm especificidade maior;
   replica aqui com a skin dark. */
.binds-homeDarkPage .st-nav .st-nav-section.st-nav-secondary .btn {
  white-space: nowrap;
}

.binds-homeDarkPage .st-nav .st-nav-section.st-nav-secondary .btn-outline {
  color: #fff !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
  background: rgba(255, 255, 255, 0.03) !important;
}

.binds-homeDarkPage .st-nav .st-nav-section.st-nav-secondary .btn-primary {
  background: #fff !important;
  color: #0b0614 !important;
  box-shadow: none !important;
}

.binds-homeDarkPage .navigation .navbar-toggler .icon-bar {
  background: #fff !important;
}

/* Entre 992 e 1160px a nav desktop não comporta menu + botões:
   compacta paddings para não cortar o "Criar conta". */
@media (min-width: 992px) and (max-width: 1160px) {
  .binds-homeDarkPage .st-nav a.st-root-link.nav-link,
  .binds-homeDarkPage .st-nav button.st-root-link.nav-link {
    padding: 0.55rem 0.5rem;
    font-size: 0.88rem;
  }

  .binds-homeDarkPage .st-nav .st-nav-menu {
    gap: 8px;
  }

  .binds-homeDarkPage .st-nav .st-nav-section.st-nav-secondary {
    gap: 6px;
  }

  .binds-homeDarkPage .st-nav .st-nav-section.st-nav-secondary .btn {
    /* !important para vencer o utilitário px-3 dos botões da nav */
    padding: 0.5rem 0.65rem !important;
    font-size: 0.85rem;
  }

  .binds-homeDarkPage .st-nav .st-nav-section.st-nav-secondary .btn i {
    /* utilitário d-md-inline usa !important */
    display: none !important;
  }
}

/* Menu mobile (st-popup) fica com o visual claro padrão do site.
   Não pintar .st-popup: ele fica renderizado mesmo fechado e cobriria o logo.
   Apenas restaura os botões do painel claro. */
.binds-rebrand.binds-homeDarkPage .binds-mobileMenu .btn.btn-primary {
  background: linear-gradient(135deg, var(--binds-primary) 0%, var(--binds-primary-700) 100%) !important;
  border-color: transparent !important;
  color: #fff !important;
}

.binds-rebrand.binds-homeDarkPage .binds-mobileMenu .btn.btn-outline {
  background: transparent !important;
  border-color: rgba(15, 23, 42, 0.22) !important;
  color: rgba(11, 18, 32, 0.92) !important;
  backdrop-filter: none;
}

/* ============================================================
   HERO
============================================================ */
.binds-homeDarkPage .binds-hero {
  background: #0b0614;
  padding-top: 128px;
  padding-bottom: 72px;
}

.binds-homeDarkPage .binds-hero__bg {
  background:
    radial-gradient(ellipse 70% 55% at 78% 16%, rgba(103, 58, 183, 0.46), transparent 55%),
    radial-gradient(ellipse 48% 42% at 10% 80%, rgba(152, 113, 221, 0.2), transparent 52%),
    linear-gradient(165deg, #0e041b 0%, #12081f 48%, #0b0614 100%) !important;
}

.binds-homeDarkPage .binds-hero__bg::before {
  display: none;
}

.binds-homeDarkPage .binds-hero__bg::after {
  background:
    radial-gradient(600px 400px at 18% 22%, rgba(103, 58, 183, 0.28), transparent 70%),
    radial-gradient(640px 420px at 86% 34%, rgba(152, 113, 221, 0.2), transparent 72%);
}

/* O tema base usa padding-top de 124px no hero para compensar navbar fixa;
   aqui a navegação é relativa, então o vão fica sobrando. */
.binds-rebrand.binds-homeDarkPage .binds-hero {
  padding-top: 56px;
}

/* Modo estático para prints (?static=1 na URL): mata toda animação e
   transição; o JS em charts.html aplica os estados finais na carga. */
.binds-homeDarkPage.bdh-static *,
.binds-homeDarkPage.bdh-static *::before,
.binds-homeDarkPage.bdh-static *::after {
  animation: none !important;
  transition: none !important;
}

/* Troca de slides do hero SEM animação CSS contínua.
   Capturadores de tela (Fireshot etc.) re-rasterizam a página ignorando
   o estado de animações — os dois slides apareciam sobrepostos no print.
   Aqui o slide oculto tem opacity/visibility ESTÁTICOS via classe
   (alternada por JS em charts.html), que qualquer captura respeita. */
.binds-homeDarkPage .binds-heroDeck__slide--a,
.binds-homeDarkPage .binds-heroDeck__slide--b {
  animation: none !important;
}

.binds-homeDarkPage .binds-heroDeck__slide--a {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.4s ease 0.45s, visibility 0s linear 0.45s;
}

.binds-homeDarkPage .binds-heroDeck.bdh-showB .binds-heroDeck__slide--a {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0s linear 0.4s;
}

.binds-homeDarkPage .binds-heroDeck__slide--b {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.4s ease, visibility 0s linear 0.4s;
}

.binds-homeDarkPage .binds-heroDeck.bdh-showB .binds-heroDeck__slide--b {
  opacity: 1;
  visibility: visible;
  transition: opacity 0.4s ease 0.45s, visibility 0s linear 0.45s;
}

/* Silhueta gigante do "b." esmaecida atrás do conteúdo do hero */
.binds-homeDarkPage .bdh-heroMark {
  position: absolute;
  left: 0;
  bottom: 5%;
  height: 90%;
  aspect-ratio: 25.5 / 25;
  display: block;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(160deg, #000 55%, rgba(0, 0, 0, 0.3) 100%);
  mask-image: linear-gradient(160deg, #000 55%, rgba(0, 0, 0, 0.3) 100%);
}

@media (max-width: 960px) {
  .binds-homeDarkPage .bdh-heroMark {
    height: 88%;
    left: -18%;
    bottom: -10%;
  }
}

.binds-homeDarkPage .binds-hero__title {
  color: #fff !important;
  font-size: clamp(2.6rem, 5.2vw, 4.4rem);
  letter-spacing: -0.045em;
  font-weight: 750;
}

.binds-homeDarkPage .bdh-heroBrand {
  margin: 0 0 18px;
  font-size: 1.05rem;
  line-height: 1.4;
  font-weight: 600;
  letter-spacing: -0.02em;
  color: var(--bdh-primary-soft);
}

.binds-homeDarkPage .binds-hero__titleAccent {
  background: linear-gradient(135deg, #af9ad6 0%, #9871dd 55%, #ed4d7f 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent;
}

.binds-homeDarkPage .binds-hero__subtitle,
.binds-homeDarkPage .binds-hero__note {
  color: var(--bdh-text-2) !important;
}

.binds-homeDarkPage .binds-hero__cta {
  gap: 10px;
}

/* Slot fixo do components (176px) corta a base dos survey cards (~185px). */
.binds-homeDarkPage .binds-heroSlot {
  height: clamp(190px, 13.5vw, 198px);
}

.binds-homeDarkPage .binds-hero__visual::before {
  background:
    radial-gradient(420px 320px at 60% 30%, rgba(103, 58, 183, 0.38), transparent 70%),
    radial-gradient(420px 320px at 52% 76%, rgba(152, 113, 221, 0.18), transparent 72%);
}

/* Sem backdrop-filter no hero: camadas com blur dentro dos slides
   animados vazam manchas em capturas de tela (Fireshot etc.). */
.binds-homeDarkPage .binds-heroMosaic__tile {
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.1), rgba(103, 58, 183, 0.16)) !important;
  border-color: var(--bdh-border) !important;
  box-shadow:
    0 22px 55px rgba(0, 0, 0, 0.45),
    0 0 0 1px rgba(175, 154, 214, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  color: var(--bdh-text);
}

.binds-homeDarkPage .binds-heroFloat {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.binds-homeDarkPage .binds-heroMosaic__tile::after {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

.binds-homeDarkPage .binds-surveyCard__title,
.binds-homeDarkPage .binds-surveyCard__q,
.binds-homeDarkPage .binds-surveyCard__q b,
.binds-homeDarkPage .binds-infoCard__value,
.binds-homeDarkPage .binds-infoCard__sub,
.binds-homeDarkPage .binds-infoCard__title,
.binds-homeDarkPage .binds-heroMosaic__text,
.binds-homeDarkPage .binds-benchMini,
.binds-homeDarkPage .binds-benchMini__sector,
.binds-homeDarkPage .binds-benchMini__nps {
  color: #fff !important;
}

.binds-homeDarkPage .binds-surveyCard__ends,
.binds-homeDarkPage .binds-infoCard__kicker,
.binds-homeDarkPage .binds-benchMini__head {
  color: var(--bdh-text-3) !important;
}

.binds-homeDarkPage .binds-surveyCard__badge,
.binds-homeDarkPage .binds-heroMosaic__pill,
.binds-homeDarkPage .binds-infoCard__pill,
.binds-homeDarkPage .binds-benchMini__pill {
  background: rgba(103, 58, 183, 0.4) !important;
  color: #fff !important;
  border-color: rgba(175, 154, 214, 0.3) !important;
}

.binds-homeDarkPage .binds-surveyScale span {
  background: rgba(255, 255, 255, 0.07) !important;
  color: var(--bdh-text-2) !important;
  border-color: rgba(175, 154, 214, 0.22) !important;
}

/* Benchmark (slide B) em dark: as linhas herdavam fundo branco do tema
   claro com texto branco por cima — ilegível. */
.binds-homeDarkPage .binds-benchMini__head {
  background: rgba(103, 58, 183, 0.22) !important;
  border-bottom-color: rgba(175, 154, 214, 0.2) !important;
}

.binds-homeDarkPage .binds-benchMini__row {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(175, 154, 214, 0.14) !important;
}

.binds-homeDarkPage .binds-benchMini__row--focus {
  background: rgba(245, 158, 11, 0.12) !important;
}

.binds-homeDarkPage .binds-benchMini__delta--pos {
  background: rgba(34, 197, 94, 0.16) !important;
  border-color: rgba(34, 197, 94, 0.3) !important;
  color: #4ade80 !important;
}

.binds-homeDarkPage .binds-benchMini__delta--neg {
  background: rgba(239, 68, 68, 0.16) !important;
  border-color: rgba(239, 68, 68, 0.3) !important;
  color: #f87171 !important;
}

/* Tiles do slide B: centraliza o conteúdo no slot de altura fixa
   (sem isso sobra um vão morto na base de cada card). */
.binds-homeDarkPage .binds-heroDeck__slide--b .binds-heroMosaic__tile {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.binds-homeDarkPage .binds-heroDeck__slide--b .binds-heroMosaic__tile > * {
  width: 100%;
}

/* ============================================================
   MEGA MENU (bdnav) — painel full-width estilo Medallia
   Markup próprio em _partial/nav-dark.ejs (só na home dark)
============================================================ */
/* Trigger com chevron */
.binds-rebrand.binds-homeDarkPage .st-nav button.bdnav__trigger {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.binds-homeDarkPage .bdnav__chev {
  flex: none;
  opacity: 0.65;
  transition: transform 0.18s ease;
}

.binds-homeDarkPage .bdnav__trigger--on .bdnav__chev {
  transform: rotate(180deg);
}

/* Mantém o sublinhado gradiente enquanto o painel está aberto */
.binds-rebrand.binds-homeDarkPage .st-nav button.bdnav__trigger--on::after {
  transform: scaleX(1);
}

.binds-rebrand.binds-homeDarkPage .st-nav button.bdnav__trigger--on {
  color: #fff !important;
  opacity: 1;
}

/* Painéis full-width colados na navbar */
.binds-homeDarkPage .bdnav__panels {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
}

.binds-homeDarkPage .bdnav__panel {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  background: #0e0817;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  border-bottom: 1px solid rgba(175, 154, 214, 0.2);
  box-shadow: 0 60px 100px rgba(0, 0, 0, 0.6);
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  pointer-events: none;
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0s linear 0.18s;
}

.binds-homeDarkPage .bdnav__panel--open {
  opacity: 1;
  visibility: visible;
  transform: none;
  pointer-events: auto;
  transition: opacity 0.22s ease, transform 0.22s ease;
}

/* A regra da navbar (.st-nav.navbar .container { height: 72px; align-items: center })
   atinge também o container dos painéis — reset obrigatório */
.binds-rebrand.binds-homeDarkPage .st-nav.navbar .bdnav__panel .container.bdnav__inner {
  height: auto;
  display: flex;
  gap: 56px;
  align-items: flex-start;
  padding-top: 30px;
  padding-bottom: 38px;
}

.binds-homeDarkPage .bdnav__main {
  flex: 1 1 auto;
  min-width: 0;
}

/* Cabeçalho de seção (painéis em grid) */
.binds-homeDarkPage .bdnav__head h3 {
  margin: 0;
  color: #fff;
  font-size: 1.04rem;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.binds-homeDarkPage .bdnav__head p {
  margin: 6px 0 0;
  color: rgba(233, 227, 244, 0.6);
  font-size: 0.87rem;
  font-weight: 550;
  line-height: 1.45;
}

.binds-homeDarkPage .bdnav__rule {
  height: 1px;
  background: rgba(255, 255, 255, 0.08);
  margin: 16px 0 22px;
}

/* Grid de células (Soluções / Pesquisas) */
.binds-homeDarkPage .bdnav__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 24px 32px;
}

.binds-homeDarkPage a.bdnav__cell {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  text-decoration: none;
}

.binds-homeDarkPage a.bdnav__cell > i {
  width: 20px;
  flex: none;
  text-align: center;
  color: #c9b8ec;
  font-size: 0.95rem;
  margin-top: 3px;
}

.binds-homeDarkPage .bdnav__cellTitle {
  display: block;
  color: #fff;
  font-weight: 750;
  font-size: 0.92rem;
  line-height: 1.25;
}

.binds-homeDarkPage .bdnav__cellDesc {
  display: block;
  color: rgba(233, 227, 244, 0.55);
  font-size: 0.8rem;
  font-weight: 550;
  line-height: 1.4;
  margin-top: 3px;
}

.binds-homeDarkPage a.bdnav__cell:hover .bdnav__cellTitle {
  color: #c9b8ec;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(175, 154, 214, 0.5);
}

/* Colunas com cabeçalho (Plataforma / Conteúdos) */
.binds-homeDarkPage .bdnav__cols {
  flex: 1 1 auto;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 48px;
  align-items: start;
}

.binds-homeDarkPage .bdnav__cols--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  max-width: 560px;
}

.binds-homeDarkPage .bdnav__colHead {
  display: flex;
  gap: 10px;
  align-items: center;
  color: #fff;
  font-weight: 800;
  font-size: 0.98rem;
}

.binds-homeDarkPage .bdnav__colHead i {
  width: 18px;
  flex: none;
  text-align: center;
  color: #c9b8ec;
  font-size: 0.88rem;
}

.binds-homeDarkPage .bdnav__colDesc {
  margin: 8px 0 0;
  color: rgba(233, 227, 244, 0.6);
  font-size: 0.84rem;
  font-weight: 550;
  line-height: 1.45;
  min-height: 2.9em;
}

.binds-homeDarkPage .bdnav__colRule {
  height: 1px;
  background: rgba(255, 255, 255, 0.08);
  margin: 14px 0 8px;
}

.binds-homeDarkPage a.bdnav__link {
  display: block;
  padding: 8px 0;
  color: rgba(233, 227, 244, 0.78);
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 650;
  line-height: 1.3;
}

.binds-homeDarkPage a.bdnav__link:hover {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(175, 154, 214, 0.5);
}

/* Card de destaque à direita */
.binds-homeDarkPage a.bdnav__feature {
  flex: 0 0 300px;
  margin-left: auto;
  display: block;
  background: #191026;
  border: 1px solid rgba(175, 154, 214, 0.18);
  border-radius: 14px;
  padding: 16px;
  text-decoration: none;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.binds-homeDarkPage a.bdnav__feature:hover {
  border-color: rgba(175, 154, 214, 0.42);
  background: #1d1330;
}

.binds-homeDarkPage .bdnav__featureMedia {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 120px;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 14px;
  background: #0b0614;
}

.binds-homeDarkPage .bdnav__featureMedia img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.binds-homeDarkPage .bdnav__featureMedia--logo img {
  width: auto;
  max-width: 68%;
  max-height: 64px;
  object-fit: contain;
}

.binds-homeDarkPage .bdnav__featureKicker {
  display: block;
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  font-weight: 850;
  color: #af9ad6;
}

.binds-homeDarkPage .bdnav__featureTitle {
  display: block;
  color: #fff;
  font-weight: 850;
  font-size: 1rem;
  letter-spacing: -0.01em;
  margin-top: 6px;
}

.binds-homeDarkPage .bdnav__featureDesc {
  display: block;
  color: rgba(233, 227, 244, 0.6);
  font-size: 0.84rem;
  font-weight: 550;
  line-height: 1.45;
  margin-top: 6px;
}

.binds-homeDarkPage .bdnav__featureCta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px;
  color: #fff;
  font-weight: 750;
  font-size: 0.88rem;
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-color: rgba(175, 154, 214, 0.6);
}

/* Painéis são desktop-only (mobile usa o popup padrão) */
@media (max-width: 991px) {
  .binds-homeDarkPage .bdnav__panels {
    display: none;
  }
}

/* ============================================================
   SEÇÕES — base
============================================================ */
.binds-homeDarkPage .u-section,
.binds-homeDarkPage .binds-home-section {
  background: transparent;
  color: var(--bdh-text);
}

.binds-homeDarkPage .binds-home-section--how,
.binds-homeDarkPage .binds-home-section--channels,
.binds-homeDarkPage .binds-home-section--dash,
.binds-homeDarkPage .binds-home-section--why,
.binds-homeDarkPage .binds-home-section--integrations {
  background: var(--bdh-bg) !important;
}

.binds-homeDarkPage .binds-home-section--channels::before,
.binds-homeDarkPage .binds-home-section--dash::before,
.binds-homeDarkPage .binds-home-section--why::before,
.binds-homeDarkPage #features::before {
  background:
    radial-gradient(ellipse 60% 50% at 20% 0%, rgba(103, 58, 183, 0.22), transparent 62%),
    radial-gradient(ellipse 50% 40% at 90% 80%, rgba(152, 113, 221, 0.12), transparent 60%) !important;
}

.binds-homeDarkPage .binds-kicker,
.binds-homeDarkPage .binds-kicker--contrast,
.binds-homeDarkPage .binds-how__kicker {
  color: var(--bdh-primary-soft) !important;
}

.binds-homeDarkPage .binds-h2,
.binds-homeDarkPage .binds-h2--contrast,
.binds-homeDarkPage .binds-sectionHead .binds-h2,
.binds-homeDarkPage .binds-howStep__title {
  color: #fff !important;
}

.binds-homeDarkPage .binds-lead,
.binds-homeDarkPage .binds-lead--contrast,
.binds-homeDarkPage .binds-sectionHead .binds-lead,
.binds-homeDarkPage .text-primary {
  color: var(--bdh-primary-soft) !important;
}

.binds-homeDarkPage .binds-lead,
.binds-homeDarkPage .binds-lead--contrast,
.binds-homeDarkPage .binds-sectionHead .binds-lead {
  color: var(--bdh-text-2) !important;
}

.binds-homeDarkPage .binds-lead .text-primary,
.binds-homeDarkPage .binds-h2 .text-primary {
  color: var(--bdh-primary-soft) !important;
}

.binds-rebrand.binds-homeDarkPage .binds-home-cta .btn.btn-primary {
  background: #fff !important;
  color: #3f3356 !important;
  border-color: #fff !important;
}

.binds-rebrand.binds-homeDarkPage .binds-home-cta .btn.btn-outline {
  background: transparent !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
  color: #fff !important;
}

/* ============================================================
   TICKER
============================================================ */
.binds-homeDarkPage .binds-home-section--ticker {
  padding-top: 88px;
  padding-bottom: 96px;
  background: #f6f3fb !important;
}

.binds-homeDarkPage .binds-home-section--ticker .binds-sectionHead {
  max-width: 760px;
  margin-bottom: 48px;
  text-align: left;
}

.binds-homeDarkPage .binds-home-section--ticker .binds-h2 {
  font-size: clamp(2.2rem, 4.6vw, 3.4rem);
  font-weight: 750;
  letter-spacing: -0.045em;
  color: #160c24 !important;
}

.binds-homeDarkPage .binds-home-section--ticker .binds-lead {
  color: #5a4d6b !important;
}

.binds-homeDarkPage .binds-ticker__fade--left {
  background: linear-gradient(90deg, #f6f3fb, rgba(246, 243, 251, 0)) !important;
}

.binds-homeDarkPage .binds-ticker__fade--right {
  background: linear-gradient(270deg, #f6f3fb, rgba(246, 243, 251, 0)) !important;
}

.binds-homeDarkPage .binds-tickerCard {
  border-color: rgba(175, 154, 214, 0.22) !important;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.4) !important;
}

.binds-homeDarkPage .binds-tickerCard--back {
  background: linear-gradient(165deg, #1a1030, #12081f) !important;
}

.binds-homeDarkPage .binds-tickerCard__backHead,
.binds-homeDarkPage .binds-tickerCard__footer {
  border-color: rgba(175, 154, 214, 0.16) !important;
}

.binds-homeDarkPage .binds-tickerCard__backTitle,
.binds-homeDarkPage .binds-tickerCard__kvRow > b {
  color: #fff !important;
}

.binds-homeDarkPage .binds-tickerCard__backSub,
.binds-homeDarkPage .binds-tickerCard__kvRow > span,
.binds-homeDarkPage .binds-tickerCard__type {
  color: var(--bdh-text-2) !important;
}

.binds-homeDarkPage .binds-tickerCard__score {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(175, 154, 214, 0.2) !important;
  color: #fff !important;
}

.binds-homeDarkPage .binds-tickerCard__score--green {
  background: rgba(0, 170, 167, 0.18) !important;
  border-color: rgba(0, 170, 167, 0.35) !important;
  color: #7ee8e5 !important;
}

.binds-homeDarkPage .binds-tickerCard__score--yellow {
  background: rgba(255, 181, 0, 0.16) !important;
  border-color: rgba(255, 181, 0, 0.32) !important;
  color: #ffd36a !important;
}

.binds-homeDarkPage .binds-tickerCard__score--red {
  background: rgba(237, 77, 127, 0.16) !important;
  border-color: rgba(237, 77, 127, 0.32) !important;
  color: #ff9bb8 !important;
}

/* ============================================================
   HOW IT WORKS
============================================================ */
.binds-homeDarkPage .binds-how__rule {
  background: linear-gradient(90deg, rgba(152, 113, 221, 0.55), transparent) !important;
}

.binds-homeDarkPage .binds-how__mock {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid var(--bdh-border) !important;
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.5) !important;
}

.binds-homeDarkPage .binds-how__mockOverlay {
  background: linear-gradient(180deg, transparent, rgba(11, 6, 20, 0.62)) !important;
}

.binds-homeDarkPage .binds-howCard {
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.1), rgba(103, 58, 183, 0.16)) !important;
  border-color: var(--bdh-border) !important;
  color: var(--bdh-text) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.42) !important;
}

.binds-homeDarkPage .binds-howCard__title,
.binds-homeDarkPage .binds-howCard__panelText {
  color: #fff !important;
}

.binds-homeDarkPage .binds-howCard__sub,
.binds-homeDarkPage .binds-howCard__panelKicker {
  color: var(--bdh-text-2) !important;
}

.binds-homeDarkPage .binds-howCard__chip,
.binds-homeDarkPage .binds-howCard__chip--soft {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(175, 154, 214, 0.22) !important;
  color: var(--bdh-text-2) !important;
}

.binds-homeDarkPage .binds-howCard__btn {
  background: rgba(255, 255, 255, 0.07) !important;
  color: #fff !important;
  border-color: rgba(175, 154, 214, 0.25) !important;
}

.binds-homeDarkPage .binds-howCard__btn--primary {
  background: var(--bdh-primary-deep) !important;
  border-color: transparent !important;
}

.binds-homeDarkPage .binds-howStep__icon {
  background: rgba(103, 58, 183, 0.28) !important;
  border-color: rgba(175, 154, 214, 0.28) !important;
  color: var(--bdh-primary-soft) !important;
}

.binds-homeDarkPage .binds-howStep__text {
  color: var(--bdh-text-2) !important;
}

.binds-homeDarkPage .binds-how__link {
  color: var(--bdh-primary-soft) !important;
}

/* ============================================================
   CHANNELS
============================================================ */
.binds-homeDarkPage .binds-channelCatalog__card,
.binds-homeDarkPage .binds-channelCatalog__benefit {
  background: var(--bdh-surface) !important;
  border-color: var(--bdh-border) !important;
  color: var(--bdh-text) !important;
  box-shadow: none !important;
}

.binds-homeDarkPage .binds-channelCatalog__card b,
.binds-homeDarkPage .binds-channelCatalog__benefitBody b {
  color: #fff !important;
}

.binds-homeDarkPage .binds-channelCatalog__card span,
.binds-homeDarkPage .binds-channelCatalog__benefitBody span {
  color: var(--bdh-text-2) !important;
}

.binds-homeDarkPage .binds-channelCatalog__icon,
.binds-homeDarkPage .binds-channelCatalog__benefitIcon {
  background: rgba(103, 58, 183, 0.3) !important;
  color: var(--bdh-primary-soft) !important;
}

.binds-homeDarkPage .binds-channelCatalog__card.is-primary {
  background: linear-gradient(145deg, rgba(103, 58, 183, 0.38), rgba(152, 113, 221, 0.12)) !important;
  border-color: rgba(175, 154, 214, 0.38) !important;
}

/* ============================================================
   AI (já era escura — só alinha)
============================================================ */
.binds-homeDarkPage .binds-home-section--ai {
  background:
    radial-gradient(900px 520px at 18% 20%, rgba(103, 58, 183, 0.32), transparent 60%),
    radial-gradient(900px 520px at 86% 28%, rgba(152, 113, 221, 0.16), transparent 62%),
    #0b0614 !important;
}

.binds-homeDarkPage .binds-aiCard {
  background:
    radial-gradient(520px 220px at 18% 22%, rgba(103, 58, 183, 0.22), transparent 60%),
    rgba(255, 255, 255, 0.05) !important;
  border-color: var(--bdh-border) !important;
}

.binds-homeDarkPage .binds-aiNote {
  color: var(--bdh-text-3) !important;
}

/* ============================================================
   DASH / WHY / INTEGRATIONS
============================================================ */
.binds-homeDarkPage .binds-dashCard,
.binds-homeDarkPage .binds-dashCaption,
.binds-homeDarkPage .binds-whyCard,
.binds-homeDarkPage .binds-whyCaption,
.binds-homeDarkPage .binds-home-section:not(.binds-home-section--ai) .binds-browser {
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.07), rgba(103, 58, 183, 0.12)) !important;
  border-color: var(--bdh-border) !important;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.32) !important;
}

.binds-homeDarkPage .binds-dashCard b,
.binds-homeDarkPage .binds-dashCaption b,
.binds-homeDarkPage .binds-whyCard b,
.binds-homeDarkPage .binds-whyCaption b {
  color: #fff !important;
}

.binds-homeDarkPage .binds-dashCard p,
.binds-homeDarkPage .binds-dashCaption span,
.binds-homeDarkPage .binds-whyCard p,
.binds-homeDarkPage .binds-whyCaption span {
  color: var(--bdh-text-2) !important;
}

.binds-homeDarkPage .binds-dashIcon,
.binds-homeDarkPage .binds-whyIcon {
  background: rgba(103, 58, 183, 0.28) !important;
  border-color: rgba(175, 154, 214, 0.26) !important;
  color: var(--bdh-primary-soft) !important;
}

.binds-homeDarkPage .binds-whyChips span,
.binds-homeDarkPage .binds-aiCard__chips span {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--bdh-text-3) !important;
  border-color: rgba(175, 154, 214, 0.18) !important;
}

.binds-homeDarkPage .binds-integrationsCloud .icon,
.binds-homeDarkPage .binds-integrationsCloud .floating {
  background: #1a1030 !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35) !important;
}

/* ============================================================
   CTA — fechamento da página (centrado, glow subindo do rodapé)
============================================================ */
.binds-homeDarkPage .binds-home-cta {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(ellipse 80% 95% at 50% 118%, rgba(103, 58, 183, 0.55), transparent 64%),
    radial-gradient(ellipse 42% 48% at 50% 110%, rgba(152, 113, 221, 0.38), transparent 62%),
    #0b0614 !important;
  padding-top: 120px;
  padding-bottom: 136px;
  text-align: center;
}

.binds-homeDarkPage .bdh-cta__inner {
  max-width: 800px;
  margin: 0 auto;
}

.binds-homeDarkPage .bdh-cta__kicker {
  color: var(--bdh-primary-soft) !important;
  margin-bottom: 18px;
}

.binds-homeDarkPage .binds-home-cta .bdh-display {
  margin-bottom: 20px;
}

.binds-homeDarkPage .bdh-cta__lead {
  max-width: 54ch;
  margin: 0 auto 40px;
  font-size: 1.15rem;
  line-height: 1.6;
  color: var(--bdh-text-2);
}

.binds-homeDarkPage .bdh-cta__actions {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 32px;
}

.binds-homeDarkPage .bdh-cta__contacts {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 0.9rem;
  color: rgba(255, 255, 255, 0.4);
}

.binds-homeDarkPage .bdh-cta__contacts a {
  color: rgba(255, 255, 255, 0.72) !important;
  text-decoration: none;
  transition: color 0.2s ease;
}

.binds-homeDarkPage .bdh-cta__contacts a:hover {
  color: #fff !important;
}

@media (max-width: 640px) {
  .binds-homeDarkPage .binds-home-cta {
    padding-top: 84px;
    padding-bottom: 96px;
  }

  .binds-homeDarkPage .bdh-cta__actions {
    flex-direction: column;
  }

  .binds-homeDarkPage .bdh-cta__actions .btn {
    width: 100%;
    max-width: 340px;
  }

  .binds-homeDarkPage .bdh-cta__contacts {
    flex-direction: column;
    gap: 8px;
  }

  .binds-homeDarkPage .bdh-cta__contacts span {
    display: none;
  }
}

/* ============================================================
   FOOTER
============================================================ */
.binds-homeDarkPage .binds-footer {
  background: #090411 !important;
  border-top: 1px solid rgba(175, 154, 214, 0.14);
}

/* ============================================================
   TRUST STRIP
============================================================ */
.binds-homeDarkPage .bdh-trust {
  padding: 28px 0 36px;
  border-top: 1px solid rgba(175, 154, 214, 0.1);
  border-bottom: 1px solid rgba(175, 154, 214, 0.1);
}

.binds-homeDarkPage .bdh-trust__label {
  margin: 0 0 18px;
  text-align: center;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--bdh-text-3);
}

.binds-homeDarkPage .bdh-trust__trackWrap {
  position: relative;
  overflow: hidden;
}

.binds-homeDarkPage .bdh-trust__fade {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 80px;
  z-index: 2;
  pointer-events: none;
}

.binds-homeDarkPage .bdh-trust__fade--l {
  left: 0;
  background: linear-gradient(90deg, #0b0614, transparent);
}

.binds-homeDarkPage .bdh-trust__fade--r {
  right: 0;
  background: linear-gradient(270deg, #0b0614, transparent);
}

.binds-homeDarkPage .bdh-trust__track {
  display: flex;
  align-items: center;
  gap: 48px;
  width: max-content;
  animation: bdhTrust 32s linear infinite;
}

.binds-homeDarkPage .bdh-trust__trackWrap:hover .bdh-trust__track {
  animation-play-state: paused;
}

.binds-homeDarkPage .bdh-trust__track img {
  height: 26px;
  width: auto;
  max-width: 110px;
  object-fit: contain;
  filter: grayscale(1) brightness(1.6);
  opacity: 0.55;
}

@keyframes bdhTrust {
  to { transform: translateX(-50%); }
}

/* ============================================================
   CAPÍTULOS (ritmo Qualtrics / Medallia)
============================================================ */
.binds-homeDarkPage .binds-home-section--outcomes,
.binds-homeDarkPage .binds-home-section--lua,
.binds-homeDarkPage .binds-home-section--aiDark,
.binds-homeDarkPage .binds-home-section--proof {
  padding-top: 112px;
  padding-bottom: 112px;
}

.binds-homeDarkPage .bdh-band--light,
.binds-homeDarkPage .binds-home-section--ticker {
  color: #160c24;
}

.binds-homeDarkPage .binds-home-section--outcomes.bdh-band--light {
  background: #f6f3fb !important;
}

.binds-homeDarkPage .binds-home-section--proof.bdh-band--light {
  background: #fff !important;
}

.binds-homeDarkPage .bdh-band--light .bdh-display,
.binds-homeDarkPage .bdh-band--light .binds-h2,
.binds-homeDarkPage .bdh-band--light .binds-h2--contrast {
  color: #160c24 !important;
}

.binds-homeDarkPage .bdh-band--light .binds-kicker,
.binds-homeDarkPage .bdh-band--light .binds-kicker--contrast {
  color: #673ab7 !important;
}

.binds-homeDarkPage .bdh-band--light .bdh-chapter__lead,
.binds-homeDarkPage .bdh-band--light .binds-lead,
.binds-homeDarkPage .bdh-band--light .binds-lead--contrast {
  color: #5a4d6b !important;
}

.binds-homeDarkPage .bdh-band--light .bdh-pillars {
  border-top-color: rgba(22, 12, 36, 0.1);
}

.binds-homeDarkPage .bdh-band--light .bdh-pillars__row {
  border-bottom-color: rgba(22, 12, 36, 0.1);
}

.binds-homeDarkPage .bdh-band--light .bdh-pillars__row h3 {
  color: #160c24;
}

.binds-homeDarkPage .bdh-band--light .bdh-pillars__row p {
  color: #5a4d6b;
}

.binds-rebrand.binds-homeDarkPage .bdh-band--light .btn.btn-primary {
  background: #160c24 !important;
  border-color: #160c24 !important;
  color: #fff !important;
}

.binds-rebrand.binds-homeDarkPage .bdh-band--light .btn.btn-primary:hover {
  background: #2a1844 !important;
  border-color: #2a1844 !important;
  color: #fff !important;
}

.binds-homeDarkPage .bdh-band--light .binds-askDark__em {
  color: #673ab7;
  border-bottom-color: #9871dd;
}

.binds-homeDarkPage .bdh-band--light .binds-askDark__list li {
  border-color: rgba(103, 58, 183, 0.14);
  background: #f6f3fb;
  color: #160c24;
}

.binds-homeDarkPage .bdh-band--light .binds-askDark__list li:hover {
  border-color: rgba(103, 58, 183, 0.32);
  background: #efe8f8;
}

.binds-homeDarkPage .bdh-band--light .binds-askDark__icon {
  background: rgba(103, 58, 183, 0.12);
  color: #673ab7;
  box-shadow: none;
}

/* Cards visuais da seção "Perguntar aos dados" na banda clara:
   sem estas regras ficam texto branco sobre card branco. */
.binds-homeDarkPage .bdh-band--light .binds-askDark__card {
  background: #fff;
  border-color: rgba(103, 58, 183, 0.16);
  box-shadow: 0 18px 40px rgba(22, 12, 36, 0.10);
  backdrop-filter: none;
}

.binds-homeDarkPage .bdh-band--light .binds-askDark__label {
  color: #673ab7;
}

.binds-homeDarkPage .bdh-band--light .binds-askDark__bar {
  color: #5a4d6b;
}

.binds-homeDarkPage .bdh-band--light .binds-askDark__bar i {
  background: rgba(103, 58, 183, 0.10);
}

.binds-homeDarkPage .bdh-band--light .binds-askDark__bar i::after {
  box-shadow: none;
}

.binds-homeDarkPage .bdh-band--light .binds-askDark__bar b,
.binds-homeDarkPage .bdh-band--light .binds-askDark__scoreVal {
  color: #160c24;
}

.binds-homeDarkPage .bdh-band--light .binds-askDark__scoreSub {
  color: #5a4d6b;
}

.binds-homeDarkPage .binds-home-section--lua,
.binds-homeDarkPage .binds-home-section--aiDark {
  background:
    radial-gradient(ellipse 70% 55% at 0% 0%, rgba(103, 58, 183, 0.22), transparent 58%),
    #10071c !important;
}

.binds-homeDarkPage .bdh-chapter {
  max-width: 760px;
  margin-bottom: 56px;
}

.binds-homeDarkPage .bdh-chapter--split {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 40px;
  align-items: end;
  max-width: none;
}

.binds-homeDarkPage .bdh-display,
.binds-homeDarkPage .binds-home-section--ask .bdh-display {
  margin: 0 0 18px;
  font-size: clamp(2.2rem, 4.6vw, 3.8rem);
  line-height: 1.05;
  font-weight: 750;
  letter-spacing: -0.045em;
  color: #fff;
}

.binds-homeDarkPage .bdh-chapter__lead {
  margin: 0;
  max-width: 46ch;
  font-size: 1.15rem;
  line-height: 1.6;
  color: var(--bdh-text-2);
}

.binds-homeDarkPage .bdh-pillars {
  display: grid;
  gap: 0;
  border-top: 1px solid rgba(175, 154, 214, 0.16);
}

.binds-homeDarkPage .bdh-pillars__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  padding: 36px 0;
  border-bottom: 1px solid rgba(175, 154, 214, 0.16);
}

.binds-homeDarkPage .bdh-pillars__row h3 {
  margin: 0;
  font-size: clamp(1.35rem, 2vw, 1.75rem);
  font-weight: 650;
  letter-spacing: -0.03em;
  color: #fff;
}

.binds-homeDarkPage .bdh-pillars__row p {
  margin: 0;
  font-size: 1.05rem;
  line-height: 1.6;
  color: var(--bdh-text-2);
}

.binds-homeDarkPage .bdh-lua {
  position: relative;
}

.binds-homeDarkPage .bdh-lua__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.binds-homeDarkPage .bdh-lua__nav {
  display: flex;
  gap: 8px;
  margin-bottom: 36px;
  border-bottom: 1px solid rgba(175, 154, 214, 0.16);
}

.binds-homeDarkPage .bdh-lua__tab {
  position: relative;
  padding: 14px 4px 18px;
  margin-right: 28px;
  cursor: pointer;
  font-size: 1.15rem;
  font-weight: 650;
  letter-spacing: -0.02em;
  color: rgba(255, 255, 255, 0.42);
  transition: color 180ms ease;
}

.binds-homeDarkPage .bdh-lua__tab span {
  margin-right: 8px;
  font-size: 0.75rem;
  letter-spacing: 0.08em;
  color: inherit;
}

.binds-homeDarkPage .bdh-lua__tab::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 2px;
  background: transparent;
}

.binds-homeDarkPage #bdh-lua-listen:checked ~ .bdh-lua__nav label[for="bdh-lua-listen"],
.binds-homeDarkPage #bdh-lua-understand:checked ~ .bdh-lua__nav label[for="bdh-lua-understand"],
.binds-homeDarkPage #bdh-lua-act:checked ~ .bdh-lua__nav label[for="bdh-lua-act"] {
  color: #fff;
}

.binds-homeDarkPage #bdh-lua-listen:checked ~ .bdh-lua__nav label[for="bdh-lua-listen"]::after,
.binds-homeDarkPage #bdh-lua-understand:checked ~ .bdh-lua__nav label[for="bdh-lua-understand"]::after,
.binds-homeDarkPage #bdh-lua-act:checked ~ .bdh-lua__nav label[for="bdh-lua-act"]::after {
  background: #af9ad6;
}

.binds-homeDarkPage .bdh-lua__panel {
  display: none;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 64px;
  align-items: center;
}

.binds-homeDarkPage #bdh-lua-listen:checked ~ .bdh-lua__stage .bdh-lua__panel--listen,
.binds-homeDarkPage #bdh-lua-understand:checked ~ .bdh-lua__stage .bdh-lua__panel--understand,
.binds-homeDarkPage #bdh-lua-act:checked ~ .bdh-lua__stage .bdh-lua__panel--act {
  display: grid;
}

.binds-homeDarkPage .bdh-lua__copy h3 {
  margin: 0 0 16px;
  font-size: clamp(1.6rem, 2.6vw, 2.2rem);
  font-weight: 700;
  letter-spacing: -0.035em;
  color: #fff;
}

.binds-homeDarkPage .bdh-lua__copy p {
  margin: 0 0 20px;
  font-size: 1.08rem;
  line-height: 1.6;
  color: var(--bdh-text-2);
}

.binds-homeDarkPage .bdh-lua__copy ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}

.binds-homeDarkPage .bdh-lua__copy li {
  position: relative;
  padding-left: 16px;
  color: var(--bdh-text);
  font-size: 0.98rem;
}

.binds-homeDarkPage .bdh-lua__copy li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--bdh-primary);
}

.binds-homeDarkPage .bdh-stageCard {
  padding: 28px 26px;
  border-radius: 18px;
  border: 1px solid rgba(175, 154, 214, 0.2);
  background:
    radial-gradient(ellipse 80% 60% at 100% 100%, rgba(103, 58, 183, 0.28), transparent 55%),
    linear-gradient(165deg, rgba(255, 255, 255, 0.07), rgba(103, 58, 183, 0.14));
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.4);
}

.binds-homeDarkPage .bdh-stageCard--lg {
  min-height: 360px;
}

.binds-homeDarkPage .bdh-stageCard__kicker {
  margin-bottom: 18px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--bdh-primary-soft);
}

.binds-homeDarkPage .bdh-stageCard__metric {
  display: block;
  margin-bottom: 10px;
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.03em;
  color: #fff;
}

.binds-homeDarkPage .bdh-stageCard p {
  margin: 0;
  color: var(--bdh-text-2);
  line-height: 1.55;
}

.binds-homeDarkPage .bdh-stageCard__row {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  border-bottom: 1px solid rgba(175, 154, 214, 0.12);
  color: var(--bdh-text-2);
  font-size: 0.95rem;
}

.binds-homeDarkPage .bdh-stageCard__row b {
  color: #fff;
  font-weight: 600;
}

.binds-homeDarkPage .bdh-stageCard__row i {
  font-style: normal;
  color: var(--bdh-text-3);
  font-size: 0.82rem;
}

.binds-homeDarkPage .bdh-stageCard__row.is-hot b {
  color: #af9ad6;
}

.binds-homeDarkPage .bdh-askMini {
  display: grid;
  gap: 12px;
}

.binds-homeDarkPage .bdh-aiSplit {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 72px;
  align-items: center;
}

.binds-homeDarkPage .bdh-aiList {
  list-style: none;
  margin: 32px 0 28px;
  padding: 0;
  display: grid;
  gap: 0;
}

.binds-homeDarkPage .bdh-aiList li {
  display: grid;
  grid-template-columns: 36px 1fr;
  gap: 16px;
  padding: 16px 0;
  border-top: 1px solid rgba(175, 154, 214, 0.14);
}

.binds-homeDarkPage .bdh-aiList li:last-child {
  border-bottom: 1px solid rgba(175, 154, 214, 0.14);
}

.binds-homeDarkPage .bdh-aiList span {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--bdh-primary-soft);
  padding-top: 4px;
}

.binds-homeDarkPage .bdh-aiList h3 {
  margin: 0 0 4px;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  color: #fff;
}

.binds-homeDarkPage .bdh-aiList p {
  margin: 0;
  color: var(--bdh-text-2);
}

.binds-homeDarkPage .bdh-miniViz {
  display: flex;
  align-items: flex-end;
  gap: 8px;
  height: 88px;
  margin-top: 28px;
}

.binds-homeDarkPage .bdh-miniViz span {
  flex: 1;
  height: var(--h);
  border-radius: 4px 4px 0 0;
  background: linear-gradient(180deg, #af9ad6, #673ab7);
  opacity: 0.85;
  transform-origin: bottom;
  animation: bdhRise 0.9s ease both;
}

.binds-homeDarkPage .bdh-miniViz span:nth-child(2) { animation-delay: 0.08s; }
.binds-homeDarkPage .bdh-miniViz span:nth-child(3) { animation-delay: 0.16s; }
.binds-homeDarkPage .bdh-miniViz span:nth-child(4) { animation-delay: 0.24s; }
.binds-homeDarkPage .bdh-miniViz span:nth-child(5) { animation-delay: 0.32s; }
.binds-homeDarkPage .bdh-miniViz span:nth-child(6) { animation-delay: 0.4s; }

.binds-homeDarkPage .bdh-stories {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.binds-homeDarkPage .bdh-story {
  display: block;
  padding: 32px 28px;
  border-radius: 16px;
  border: 1px solid rgba(103, 58, 183, 0.12);
  background: #fff;
  box-shadow: 0 18px 40px rgba(22, 12, 36, 0.06);
  text-decoration: none !important;
  color: inherit;
  transition: border-color 200ms ease, transform 200ms ease, box-shadow 200ms ease;
}

.binds-homeDarkPage .bdh-story:hover {
  border-color: rgba(103, 58, 183, 0.28);
  box-shadow: 0 22px 50px rgba(22, 12, 36, 0.1);
  transform: translateY(-3px);
}

.binds-homeDarkPage .bdh-story__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 22px;
}

.binds-homeDarkPage .bdh-story__logo {
  height: 28px;
  width: auto;
  max-width: 120px;
  object-fit: contain;
}

.binds-homeDarkPage .bdh-story__ind {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #673ab7;
}

.binds-homeDarkPage .bdh-story__metric {
  display: block;
  margin-bottom: 10px;
  font-size: clamp(2rem, 3vw, 2.6rem);
  font-weight: 750;
  letter-spacing: -0.04em;
  color: #160c24;
}

.binds-homeDarkPage .bdh-story h3 {
  margin: 0 0 10px;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  color: #160c24;
}

.binds-homeDarkPage .bdh-story p {
  margin: 0 0 18px;
  color: #5a4d6b;
  line-height: 1.5;
}

.binds-homeDarkPage .bdh-story__more {
  font-size: 0.92rem;
  font-weight: 600;
  color: #673ab7;
}

@media (max-width: 960px) {
  .binds-homeDarkPage .bdh-chapter--split,
  .binds-homeDarkPage .bdh-pillars__row,
  .binds-homeDarkPage .bdh-lua__panel,
  .binds-homeDarkPage .bdh-aiSplit,
  .binds-homeDarkPage .bdh-stories {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .binds-homeDarkPage .bdh-lua__nav {
    overflow-x: auto;
  }

  .binds-homeDarkPage .bdh-lua__tab {
    margin-right: 18px;
    white-space: nowrap;
  }
}

/* ============================================================
   ASK THE DATA
============================================================ */
.binds-homeDarkPage .binds-home-section--ask {
  position: relative;
  overflow: hidden;
  padding-top: 96px;
  padding-bottom: 96px;
  background: #fff !important;
}

.binds-homeDarkPage .binds-askDark {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 56px;
  align-items: center;
}

.binds-homeDarkPage .binds-askDark__em {
  font-style: normal;
  color: var(--bdh-primary-soft);
  font-weight: 700;
  border-bottom: 2px solid var(--bdh-primary);
}

.binds-homeDarkPage .binds-askDark__list {
  list-style: none;
  margin: 24px 0 28px;
  padding: 0;
  display: grid;
  gap: 12px;
}

.binds-homeDarkPage .binds-askDark__list li {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border-radius: 14px;
  border: 1px solid var(--bdh-border);
  background: rgba(255, 255, 255, 0.035);
  font-weight: 600;
  color: var(--bdh-text);
  transition: border-color 200ms ease, background 200ms ease, transform 200ms ease;
}

.binds-homeDarkPage .binds-askDark__list li:hover {
  border-color: rgba(175, 154, 214, 0.4);
  background: rgba(103, 58, 183, 0.16);
  transform: translateX(4px);
}

.binds-homeDarkPage .binds-askDark__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  border-radius: 50%;
  background: rgba(103, 58, 183, 0.38);
  color: var(--bdh-primary-soft);
  box-shadow: 0 0 16px rgba(152, 113, 221, 0.28);
}

.binds-homeDarkPage .binds-askDark__stack {
  display: grid;
  gap: 14px;
}

.binds-homeDarkPage .binds-askDark__card {
  padding: 18px 20px;
  border-radius: 18px;
  border: 1px solid var(--bdh-border);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.08), rgba(103, 58, 183, 0.16));
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.38);
  backdrop-filter: blur(10px);
}

.binds-homeDarkPage .binds-askDark__label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--bdh-text-3);
  margin-bottom: 10px;
}

.binds-homeDarkPage .binds-askDark__chart {
  width: 100%;
  height: 110px;
  display: block;
}

.binds-homeDarkPage .binds-askDark__line {
  stroke-dasharray: 420;
  stroke-dashoffset: 420;
  animation: bdhDraw 1.6s ease forwards 0.2s;
}

.binds-homeDarkPage .binds-askDark__dot {
  opacity: 0;
  animation: bdhFade 0.35s ease forwards 1.5s;
}

.binds-homeDarkPage .binds-askDark__bars {
  display: grid;
  gap: 10px;
}

.binds-homeDarkPage .binds-askDark__bar {
  display: grid;
  grid-template-columns: 92px 1fr 36px;
  gap: 8px;
  align-items: center;
  font-size: 12px;
  color: var(--bdh-text-2);
}

.binds-homeDarkPage .binds-askDark__bar i {
  display: block;
  height: 8px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  position: relative;
  overflow: hidden;
}

.binds-homeDarkPage .binds-askDark__bar i::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--w, 50%);
  border-radius: inherit;
  background: linear-gradient(90deg, #673ab7, #af9ad6);
  box-shadow: 0 0 12px rgba(152, 113, 221, 0.55);
  animation: bdhBar 1s ease forwards;
}

.binds-homeDarkPage .binds-askDark__bar b {
  text-align: right;
  color: #fff;
  font-weight: 700;
}

.binds-homeDarkPage .binds-askDark__scoreVal {
  font-size: 2rem;
  font-weight: 850;
  color: #fff;
  line-height: 1.1;
}

.binds-homeDarkPage .binds-askDark__scoreSub {
  margin-top: 6px;
  font-size: 13px;
  color: var(--bdh-text-3);
}

@keyframes bdhDraw {
  to { stroke-dashoffset: 0; }
}

@keyframes bdhFade {
  to { opacity: 1; }
}

@keyframes bdhBar {
  from { width: 0; }
}

@keyframes bdhRise {
  from { transform: scaleY(0); }
}

@media (max-width: 960px) {
  .binds-homeDarkPage .binds-askDark {
    grid-template-columns: 1fr;
    gap: 32px;
  }
}

/* ============================================================
   WIDGETS ESTILO PRODUTO (réplica das telas /paineis e
   /tempo-real do projeto pocs)
============================================================ */

/* Card de widget (Painéis) */
.binds-homeDarkPage .bdh-widget {
  text-align: left;
}

.binds-homeDarkPage .bdh-band--light .binds-askDark__card.bdh-widget {
  border-color: #e5e7eb;
  border-radius: 14px;
  box-shadow: 0 14px 36px rgba(22, 12, 36, 0.08);
}

.binds-homeDarkPage .bdh-widget__head {
  margin-bottom: 14px;
}

.binds-homeDarkPage .bdh-widget__badge {
  display: inline-block;
  margin-bottom: 8px;
  padding: 3px 8px;
  border-radius: 6px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.binds-homeDarkPage .bdh-widget__badge--nps {
  background: #dbeafe;
  color: #2563eb;
}

.binds-homeDarkPage .bdh-widget__badge--csat {
  background: #dcfce7;
  color: #16a34a;
}

.binds-homeDarkPage .bdh-widget__title {
  font-size: 14px;
  font-weight: 700;
  color: #111827;
  letter-spacing: -0.01em;
}

.binds-homeDarkPage .bdh-widget__sub {
  margin-top: 2px;
  font-size: 11.5px;
  color: #9ca3af;
}

.binds-homeDarkPage .bdh-widget__row {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 18px;
  margin-bottom: 14px;
}

.binds-homeDarkPage .bdh-widget__row:last-child {
  margin-bottom: 0;
}

.binds-homeDarkPage .bdh-scorebox {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  min-width: 92px;
  padding: 14px 16px;
  border-radius: 12px;
  background: #f9fafb;
}

.binds-homeDarkPage .bdh-scorebox__label {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6b7280;
}

.binds-homeDarkPage .bdh-scorebox__value {
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.1;
}

.binds-homeDarkPage .bdh-scorebox__value--good { color: #16a34a; }
.binds-homeDarkPage .bdh-scorebox__value--info { color: #2563eb; }

.binds-homeDarkPage .bdh-scorebox__sub {
  font-size: 10.5px;
  color: #9ca3af;
}

/* Breakdown Promotores / Passivos / Detratores */
.binds-homeDarkPage .bdh-break {
  display: grid;
  gap: 9px;
}

.binds-homeDarkPage .bdh-break__row {
  display: grid;
  grid-template-columns: 76px 1fr 36px;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
}

.binds-homeDarkPage .bdh-break__row span {
  font-weight: 500;
  color: #4b5563;
}

.binds-homeDarkPage .bdh-break__row em {
  font-style: normal;
  font-weight: 700;
  color: #374151;
  text-align: right;
}

.binds-homeDarkPage .bdh-break__row i {
  display: block;
  height: 12px;
  border-radius: 999px;
  background: #f3f4f6;
  overflow: hidden;
}

.binds-homeDarkPage .bdh-break__row b {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  background: var(--c, #22c55e);
  transition: width 0.9s cubic-bezier(0.22, 0.61, 0.36, 1) 0.15s;
}

.binds-homeDarkPage .bdh-widget.is-in .bdh-break__row b {
  width: var(--w, 50%);
}

/* ============================================================
   SEÇÃO — Customer Voice (VoC) — capítulo dark em destaque
============================================================ */
.binds-homeDarkPage .binds-home-section--voc {
  position: relative;
  overflow: hidden;
  padding-top: 110px;
  padding-bottom: 118px;
  background:
    radial-gradient(ellipse 70% 55% at 100% 0%, rgba(103, 58, 183, 0.26), transparent 58%),
    radial-gradient(ellipse 50% 40% at 0% 100%, rgba(152, 113, 221, 0.12), transparent 60%),
    #10071c !important;
}

.binds-homeDarkPage .bdh-voc {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 72px;
  align-items: center;
}

.binds-homeDarkPage .bdh-voc__visual,
.binds-homeDarkPage .bdh-voc__copy {
  min-width: 0;
}

/* Widget VoC em dark mode, com glow para destaque */
.binds-homeDarkPage .bdh-vocCard {
  max-width: 520px;
  padding: 24px 24px 20px;
  border-radius: 18px;
  border: 1px solid rgba(175, 154, 214, 0.24);
  background: linear-gradient(180deg, #191026 0%, #140b20 100%);
  box-shadow:
    0 34px 80px rgba(0, 0, 0, 0.5),
    0 0 120px rgba(103, 58, 183, 0.28);
}

.binds-homeDarkPage .bdh-vocCard .bdh-widget__title {
  color: #fff;
  font-size: 15px;
}

.binds-homeDarkPage .bdh-vocCard .bdh-widget__sub {
  color: rgba(233, 227, 244, 0.5);
}

.binds-homeDarkPage .bdh-widget__badge--voc {
  background: rgba(152, 113, 221, 0.2);
  color: #c9b8ec;
}

/* Chips de canais */
.binds-homeDarkPage .bdh-vocChips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0 0 16px;
}

.binds-homeDarkPage .bdh-vocChips span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 650;
  color: rgba(233, 227, 244, 0.7);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  white-space: nowrap;
}

.binds-homeDarkPage .bdh-vocChips span i {
  font-size: 10px;
  line-height: 1;
  color: #c9b8ec;
}

.binds-homeDarkPage .bdh-vocChips span.is-on {
  background: #673ab7;
  border-color: #8b5cf6;
  color: #fff;
}

/* Scorebox e barras no dark */
.binds-homeDarkPage .bdh-vocCard .bdh-scorebox {
  background: rgba(255, 255, 255, 0.05);
}

.binds-homeDarkPage .bdh-vocCard .bdh-scorebox__label {
  color: rgba(233, 227, 244, 0.55);
}

.binds-homeDarkPage .bdh-vocCard .bdh-scorebox__value--good {
  color: #4ade80;
}

.binds-homeDarkPage .bdh-vocCard .bdh-scorebox__sub {
  color: rgba(233, 227, 244, 0.45);
}

.binds-homeDarkPage .bdh-vocCard .bdh-break__row span {
  color: rgba(233, 227, 244, 0.72);
}

.binds-homeDarkPage .bdh-vocCard .bdh-break__row em {
  color: #fff;
}

.binds-homeDarkPage .bdh-vocCard .bdh-break__row i {
  background: rgba(255, 255, 255, 0.08);
}

/* Bloco de temas */
.binds-homeDarkPage .bdh-voc__themesBlock {
  margin-top: 4px;
}

.binds-homeDarkPage .bdh-voc__themesBlock .bdh-break {
  margin-top: 10px;
}

.binds-homeDarkPage .bdh-break--themes .bdh-break__row {
  grid-template-columns: 100px 1fr 30px;
}

.binds-homeDarkPage .bdh-vocCard .bdh-evo__head span:first-child {
  color: rgba(233, 227, 244, 0.6);
}

.binds-homeDarkPage .bdh-vocCard .bdh-evo__pill {
  border-color: rgba(74, 222, 128, 0.28);
  background: rgba(34, 197, 94, 0.12);
  color: #4ade80;
}

/* Feed de menções */
.binds-homeDarkPage .bdh-vocFeed {
  margin-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 4px;
}

.binds-homeDarkPage .bdh-vocFeed__item {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 9px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.binds-homeDarkPage .bdh-vocFeed__item:last-child {
  border-bottom: 0;
  padding-bottom: 2px;
}

.binds-homeDarkPage .bdh-vocFeed__item p {
  margin: 0;
  font-size: 12px;
  color: rgba(233, 227, 244, 0.85);
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.binds-homeDarkPage .bdh-vocFeed__item i {
  font-style: normal;
  font-size: 10.5px;
  color: rgba(233, 227, 244, 0.45);
  white-space: nowrap;
}

.binds-homeDarkPage .bdh-vocDot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
}

.binds-homeDarkPage .bdh-vocDot--pos { background: #22c55e; }
.binds-homeDarkPage .bdh-vocDot--neu { background: #f59e0b; }
.binds-homeDarkPage .bdh-vocDot--neg { background: #ef4444; }
.binds-homeDarkPage .bdh-vocDot--churn { background: #8b5cf6; }

/* ============================================================
   SEÇÃO IA — grid de mini-telas de produto (IA embarcada)
============================================================ */
/* Palavra em gradiente no título do capítulo */
.binds-homeDarkPage .bdh-displayGrad {
  background: linear-gradient(100deg, #e9e3f4 0%, #c9b8ec 35%, #8b5cf6 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.binds-homeDarkPage .bdh-aiGrid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 20px;
}

.binds-homeDarkPage .bdh-aiCard {
  --ac: #c9b8ec;
  --ac-soft: rgba(152, 113, 221, 0.12);
  position: relative;
  overflow: hidden;
  grid-column: span 5;
  display: flex;
  flex-direction: column;
  padding: 26px 26px 22px;
  border-radius: 20px;
  border: 1px solid rgba(175, 154, 214, 0.16);
  background: linear-gradient(180deg, #170e26 0%, #120a1e 100%);
  transition: transform 0.22s ease, border-color 0.22s ease, box-shadow 0.22s ease;
}

.binds-homeDarkPage .bdh-aiCard:hover {
  transform: translateY(-4px);
  border-color: rgba(175, 154, 214, 0.38);
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
}

/* Fio de luz no topo + glow de canto, na cor de acento do card */
.binds-homeDarkPage .bdh-aiCard::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent 0%, var(--ac) 50%, transparent 100%);
  opacity: 0.5;
}

.binds-homeDarkPage .bdh-aiCard::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 70% 42% at 20% 0%, var(--ac-soft), transparent 70%);
}

.binds-homeDarkPage .bdh-aiCard > * {
  position: relative;
  z-index: 1;
}

.binds-homeDarkPage .bdh-aiCard--wide {
  grid-column: span 7;
}

.binds-homeDarkPage .bdh-aiCard--root { --ac: #4ade80; --ac-soft: rgba(74, 222, 128, 0.09); }
.binds-homeDarkPage .bdh-aiCard--summary { --ac: #818cf8; --ac-soft: rgba(129, 140, 248, 0.11); }
.binds-homeDarkPage .bdh-aiCard--reply { --ac: #c084fc; --ac-soft: rgba(192, 132, 252, 0.11); }
.binds-homeDarkPage .bdh-aiCard--alerts { --ac: #fbbf24; --ac-soft: rgba(251, 191, 36, 0.08); }

.binds-homeDarkPage .bdh-aiCard__head {
  display: flex;
  align-items: center;
  gap: 14px;
}

.binds-homeDarkPage .bdh-aiCard__icon {
  flex: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: var(--ac-soft);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: var(--ac);
  font-size: 15px;
}

.binds-homeDarkPage .bdh-aiCard__step {
  display: block;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ac);
}

.binds-homeDarkPage .bdh-aiCard__head h3 {
  margin: 3px 0 0;
  font-size: 1.1rem;
  font-weight: 750;
  letter-spacing: -0.02em;
  color: #fff;
}

.binds-homeDarkPage .bdh-aiCard__desc {
  margin: 13px 0 16px;
  font-size: 0.86rem;
  line-height: 1.5;
  color: rgba(233, 227, 244, 0.55);
}

/* Badge "Gerado por IA" */
.binds-homeDarkPage .bdh-aiBadge {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(152, 113, 221, 0.2);
  color: #c9b8ec;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  white-space: nowrap;
}

/* Card 1 — Causa raiz */
.binds-homeDarkPage .bdh-aiInsight {
  padding: 11px 13px;
  border-radius: 10px;
  border: 1px solid rgba(74, 222, 128, 0.22);
  background: rgba(34, 197, 94, 0.09);
}

.binds-homeDarkPage .bdh-aiInsight__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.binds-homeDarkPage .bdh-aiInsight__row b {
  font-size: 12.5px;
  font-weight: 800;
  color: #4ade80;
}

.binds-homeDarkPage .bdh-aiInsight p {
  margin: 5px 0 0;
  font-size: 11.5px;
  line-height: 1.45;
  color: rgba(233, 227, 244, 0.75);
}

.binds-homeDarkPage .bdh-aiLabel {
  display: block;
  margin: 14px 0 9px;
  font-size: 11px;
  font-weight: 700;
  color: rgba(233, 227, 244, 0.6);
}

.binds-homeDarkPage .bdh-aiCard .bdh-break {
  margin-bottom: 16px;
}

.binds-homeDarkPage .bdh-aiCard .bdh-break__row {
  grid-template-columns: 118px 1fr 40px;
}

.binds-homeDarkPage .bdh-aiCard .bdh-break__row span {
  color: rgba(233, 227, 244, 0.72);
}

.binds-homeDarkPage .bdh-aiCard .bdh-break__row em {
  color: #fff;
}

.binds-homeDarkPage .bdh-aiCard .bdh-break__row i {
  background: rgba(255, 255, 255, 0.08);
}

.binds-homeDarkPage .bdh-aiCard.is-in .bdh-break__row b {
  width: var(--w, 50%);
}

.binds-homeDarkPage .bdh-aiReco {
  margin-top: auto;
  padding: 10px 13px;
  border-radius: 10px;
  border: 1px solid rgba(245, 158, 11, 0.24);
  background: rgba(245, 158, 11, 0.09);
  font-size: 11.5px;
  line-height: 1.5;
  color: rgba(233, 227, 244, 0.8);
}

.binds-homeDarkPage .bdh-aiReco b {
  color: #fbbf24;
  font-weight: 750;
}

.binds-homeDarkPage .bdh-aiReco--purple {
  border-color: rgba(175, 154, 214, 0.26);
  background: rgba(152, 113, 221, 0.1);
}

.binds-homeDarkPage .bdh-aiReco--purple b {
  color: #4ade80;
}

/* Card 2 — Resposta assistida */
.binds-homeDarkPage .bdh-aiComposer {
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 12px;
  overflow: hidden;
  background: rgba(0, 0, 0, 0.18);
}

.binds-homeDarkPage .bdh-aiComposer__bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.binds-homeDarkPage .bdh-aiComposer__cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 11px;
  border-radius: 8px;
  background: linear-gradient(135deg, #7c3aed, #a855f7);
  color: #fff;
  font-size: 11px;
  font-weight: 750;
  white-space: nowrap;
}

.binds-homeDarkPage .bdh-aiComposer__tone {
  padding: 5px 10px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.05);
  color: rgba(233, 227, 244, 0.7);
  font-size: 11px;
  font-weight: 650;
  white-space: nowrap;
}

.binds-homeDarkPage .bdh-aiComposer__notice {
  padding: 9px 12px;
  background: rgba(152, 113, 221, 0.12);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.binds-homeDarkPage .bdh-aiComposer__notice b {
  display: block;
  font-size: 11px;
  font-weight: 750;
  color: #c9b8ec;
}

.binds-homeDarkPage .bdh-aiComposer__notice span {
  display: block;
  margin-top: 2px;
  font-size: 10.5px;
  color: rgba(233, 227, 244, 0.55);
}

.binds-homeDarkPage .bdh-aiComposer__body {
  padding: 12px 13px 13px;
}

.binds-homeDarkPage .bdh-aiComposer__body p {
  margin: 0 0 8px;
  font-size: 12px;
  line-height: 1.5;
  color: rgba(233, 227, 244, 0.82);
}

.binds-homeDarkPage .bdh-aiComposer__body p:last-child {
  margin-bottom: 0;
}

/* Card 3 — Resumo automático */
.binds-homeDarkPage .bdh-aiSummary__who {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
}

.binds-homeDarkPage .bdh-aiSummary__who b {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #fff;
}

.binds-homeDarkPage .bdh-aiPill {
  padding: 2px 9px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 700;
}

.binds-homeDarkPage .bdh-aiPill--neg {
  background: rgba(239, 68, 68, 0.16);
  color: #f87171;
}

.binds-homeDarkPage .bdh-aiSummary__cols {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}

.binds-homeDarkPage .bdh-aiSummary__cols span {
  display: block;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #af9ad6;
}

.binds-homeDarkPage .bdh-aiSummary__cols p {
  margin: 5px 0 0;
  font-size: 11px;
  line-height: 1.5;
  color: rgba(233, 227, 244, 0.72);
}

.binds-homeDarkPage .bdh-aiSummary__next {
  margin-top: 14px;
  padding: 9px 12px;
  border-radius: 10px;
  background: rgba(152, 113, 221, 0.12);
  border: 1px solid rgba(175, 154, 214, 0.2);
  font-size: 11.5px;
  line-height: 1.5;
  color: rgba(233, 227, 244, 0.8);
}

.binds-homeDarkPage .bdh-aiSummary__next b {
  color: #c9b8ec;
  font-weight: 750;
}

/* Card 4 — Alertas */
.binds-homeDarkPage .bdh-aiAlerts {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  margin-bottom: 16px;
}

.binds-homeDarkPage .bdh-aiAlerts__item {
  display: grid;
  grid-template-columns: 10px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 11px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.binds-homeDarkPage .bdh-aiAlerts__item:first-child {
  padding-top: 2px;
}

.binds-homeDarkPage .bdh-aiAlerts__item:last-child {
  border-bottom: 0;
}

.binds-homeDarkPage .bdh-aiAlerts__item p {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
  color: rgba(233, 227, 244, 0.78);
}

.binds-homeDarkPage .bdh-aiAlerts__item p b {
  color: #fff;
  font-weight: 700;
}

.binds-homeDarkPage .bdh-aiAlerts__item i {
  font-style: normal;
  font-size: 10.5px;
  color: rgba(233, 227, 244, 0.45);
  white-space: nowrap;
}

/* Faixa "E a IA não para por aí" */
.binds-homeDarkPage .bdh-aiMore {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px 24px;
  padding: 18px 24px;
  border-radius: 16px;
  border: 1px dashed rgba(175, 154, 214, 0.28);
  background: rgba(255, 255, 255, 0.02);
}

.binds-homeDarkPage .bdh-aiMore__label {
  flex: none;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font-size: 0.82rem;
  font-weight: 800;
  color: #c9b8ec;
  white-space: nowrap;
}

.binds-homeDarkPage .bdh-aiMore__label i {
  font-size: 11px;
}

/* Tamanhos do ícone padrão de IA por contexto */
.binds-homeDarkPage .bdh-aiBadge .bdh-iconAI {
  width: 11px;
  height: 11px;
}

.binds-homeDarkPage .bdh-aiComposer__cta .bdh-iconAI {
  width: 12px;
  height: 12px;
}

.binds-homeDarkPage .bdh-aiMore__label .bdh-iconAI {
  width: 13px;
  height: 13px;
}

.binds-homeDarkPage .bdh-aiCard__icon .bdh-iconAI {
  width: 18px;
  height: 18px;
}

.binds-homeDarkPage .binds-askDark__icon .bdh-iconAI {
  width: 18px;
  height: 18px;
}

.binds-homeDarkPage .bdh-aiMore__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.binds-homeDarkPage .bdh-aiMore__chips span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 11.5px;
  font-weight: 650;
  color: rgba(233, 227, 244, 0.75);
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.1);
  white-space: nowrap;
}

.binds-homeDarkPage .bdh-aiMore__chips span i {
  font-size: 10px;
  color: #c9b8ec;
}

.binds-homeDarkPage .bdh-aiGrid__cta {
  margin-top: 36px;
}

@media (max-width: 991px) {
  .binds-homeDarkPage .bdh-aiGrid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .binds-homeDarkPage .bdh-aiCard,
  .binds-homeDarkPage .bdh-aiCard--wide,
  .binds-homeDarkPage .bdh-aiMore {
    grid-column: 1 / -1;
  }
}

@media (max-width: 991px) {
  .binds-homeDarkPage .bdh-voc {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .binds-homeDarkPage .bdh-voc__copy { order: 1; }
  .binds-homeDarkPage .bdh-voc__visual { order: 2; }

  .binds-homeDarkPage .bdh-vocCard {
    margin: 0 auto;
  }
}

/* Evolução do Score (linha com eixos, estilo Recharts) */
.binds-homeDarkPage .bdh-evo__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}

.binds-homeDarkPage .bdh-evo__head span:first-child {
  font-size: 11px;
  font-weight: 600;
  color: #6b7280;
}

.binds-homeDarkPage .bdh-evo__pill {
  padding: 3px 9px;
  border-radius: 999px;
  border: 1px solid #bbf7d0;
  background: #f0fdf4;
  font-size: 10.5px;
  font-weight: 700;
  color: #16a34a;
}

.binds-homeDarkPage .bdh-evo__chart {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.binds-homeDarkPage .bdh-evo__grid line {
  stroke: #e5e7eb;
  stroke-width: 1;
  stroke-dasharray: 3 3;
}

.binds-homeDarkPage .bdh-evo__ax text {
  fill: #9ca3af;
  font-size: 9px;
}

.binds-homeDarkPage .bdh-evo__line {
  fill: none;
  stroke: #3b82f6;
  stroke-width: 2;
  stroke-linejoin: round;
  stroke-dasharray: 320;
  stroke-dashoffset: 320;
  transition: stroke-dashoffset 1.4s ease 0.2s;
}

.binds-homeDarkPage .bdh-widget.is-in .bdh-evo__line {
  stroke-dashoffset: 0;
}

.binds-homeDarkPage .bdh-evo__pt {
  fill: #3b82f6;
  opacity: 0;
  transition: opacity 0.3s ease 1.2s;
}

.binds-homeDarkPage .bdh-widget.is-in .bdh-evo__pt {
  opacity: 1;
}

/* CSAT — barras por estrela */
.binds-homeDarkPage .bdh-csat__bars {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  height: 96px;
}

.binds-homeDarkPage .bdh-csat__col {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  gap: 6px;
  height: 100%;
}

.binds-homeDarkPage .bdh-csat__col span {
  width: 100%;
  height: var(--h, 40%);
  border-radius: 5px 5px 0 0;
  background: var(--c, #22c55e);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.6s cubic-bezier(0.22, 0.61, 0.36, 1) calc(var(--i, 0) * 90ms);
}

.binds-homeDarkPage .bdh-widget.is-in .bdh-csat__col span {
  transform: scaleY(1);
}

.binds-homeDarkPage .bdh-csat__col em {
  font-style: normal;
  font-size: 10px;
  color: #9ca3af;
}

/* Card Tempo Real em dark mode (vidro escuro, como os demais da seção) */
.binds-homeDarkPage .bdh-stageCard--product {
  background:
    radial-gradient(ellipse 80% 60% at 100% 0%, rgba(103, 58, 183, 0.22), transparent 55%),
    linear-gradient(165deg, rgba(255, 255, 255, 0.07), rgba(16, 7, 28, 0.6));
  border-color: rgba(175, 154, 214, 0.22);
  box-shadow: 0 32px 80px rgba(0, 0, 0, 0.5);
}

.binds-homeDarkPage .bdh-tr__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.binds-homeDarkPage .bdh-tr__title {
  font-size: 13px;
  font-weight: 800;
  color: #fff;
  letter-spacing: -0.01em;
}

.binds-homeDarkPage .bdh-tr__live {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #4ade80;
}

.binds-homeDarkPage .bdh-tr__live i {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.6);
  animation: bdhPulse 1.6s infinite;
}

@keyframes bdhPulse {
  70% { box-shadow: 0 0 0 8px rgba(34, 197, 94, 0); }
  100% { box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}

.binds-homeDarkPage .bdh-tr__metrics {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 16px;
}

.binds-homeDarkPage .bdh-tr__metrics > div {
  padding: 10px 12px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(255, 255, 255, 0.05);
}

.binds-homeDarkPage .bdh-tr__metrics span {
  display: block;
  margin-bottom: 2px;
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--bdh-text-3);
}

.binds-homeDarkPage .bdh-tr__metrics b {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #fff;
}

.binds-homeDarkPage .bdh-tr .bdh-rpm {
  margin-top: 0;
  margin-bottom: 14px;
}

.binds-homeDarkPage .bdh-tr__feed {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.binds-homeDarkPage .bdh-tr__item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.binds-homeDarkPage .bdh-tr__item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.binds-homeDarkPage .bdh-tr__item b {
  flex: 1;
  font-size: 11.5px;
  font-weight: 700;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #e6e0f0;
}

.binds-homeDarkPage .bdh-tr__item i {
  font-style: normal;
  font-size: 10.5px;
  color: var(--bdh-text-3);
}

.binds-homeDarkPage .bdh-tag {
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 9.5px;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.binds-homeDarkPage .bdh-tag--det {
  background: rgba(239, 68, 68, 0.16);
  border: 1px solid rgba(239, 68, 68, 0.3);
  color: #f87171;
}

.binds-homeDarkPage .bdh-tag--pro {
  background: rgba(34, 197, 94, 0.16);
  border: 1px solid rgba(34, 197, 94, 0.3);
  color: #4ade80;
}

.binds-homeDarkPage .bdh-tag--rec {
  background: rgba(245, 158, 11, 0.16);
  border: 1px solid rgba(245, 158, 11, 0.3);
  color: #fbbf24;
}

/* Distribuição Promotores / Neutros / Detratores */
.binds-homeDarkPage .bdh-dist {
  display: grid;
  gap: 10px;
  align-content: start;
}

.binds-homeDarkPage .bdh-dist__row {
  display: grid;
  grid-template-columns: 78px 1fr 38px;
  align-items: center;
  gap: 10px;
  font-size: 12px;
}

.binds-homeDarkPage .bdh-dist__row span {
  font-weight: 600;
}

.binds-homeDarkPage .bdh-dist__row em {
  font-style: normal;
  font-weight: 700;
  color: #fff;
  text-align: right;
}

.binds-homeDarkPage .bdh-dist__row i {
  display: block;
  height: 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
}

.binds-homeDarkPage .bdh-dist__row b {
  display: block;
  height: 100%;
  width: 0;
  border-radius: inherit;
  transition: width 0.9s cubic-bezier(0.22, 0.61, 0.36, 1) 0.1s;
}

.binds-homeDarkPage .bdh-dist.is-in .bdh-dist__row b {
  width: var(--w, 50%);
}

.binds-homeDarkPage .bdh-dist__row--pro span { color: #4ade80; }
.binds-homeDarkPage .bdh-dist__row--neu span { color: #fbbf24; }
.binds-homeDarkPage .bdh-dist__row--det span { color: #f87171; }

.binds-homeDarkPage .bdh-dist__row--pro b {
  background: #22c55e;
  box-shadow: 0 0 12px rgba(34, 197, 94, 0.45);
}

.binds-homeDarkPage .bdh-dist__row--neu b {
  background: #f59e0b;
  box-shadow: 0 0 12px rgba(245, 158, 11, 0.35);
}

.binds-homeDarkPage .bdh-dist__row--det b {
  background: #ef4444;
  box-shadow: 0 0 12px rgba(239, 68, 68, 0.35);
}

/* Respostas por minuto */
.binds-homeDarkPage .bdh-rpm {
  margin-top: 18px;
}

.binds-homeDarkPage .bdh-rpm__label {
  margin-bottom: 8px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--bdh-text-3);
}

.binds-homeDarkPage .bdh-rpm__bars {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 52px;
}

.binds-homeDarkPage .bdh-rpm__bars span {
  flex: 1;
  height: var(--h, 40%);
  min-height: 4px;
  border-radius: 3px 3px 0 0;
  background: rgba(152, 113, 221, 0.32);
  transform: scaleY(0);
  transform-origin: bottom;
  transition: transform 0.5s ease calc(var(--i, 0) * 28ms);
}

.binds-homeDarkPage .bdh-rpm.is-in .bdh-rpm__bars span,
.binds-homeDarkPage .bdh-tr.is-in .bdh-rpm__bars span {
  transform: scaleY(1);
}

.binds-homeDarkPage .bdh-rpm__bars span.is-now {
  background: linear-gradient(180deg, #af9ad6, #9871dd);
  box-shadow: 0 0 14px rgba(152, 113, 221, 0.6);
}

.binds-homeDarkPage .bdh-rpm__axis {
  display: flex;
  justify-content: space-between;
  margin-top: 6px;
  font-size: 10px;
  color: var(--bdh-text-3);
  opacity: 0.8;
}

@media (prefers-reduced-motion: reduce) {
  .binds-homeDarkPage .binds-askDark__line,
  .binds-homeDarkPage .binds-askDark__dot,
  .binds-homeDarkPage .binds-askDark__bar i::after,
  .binds-homeDarkPage .binds-askDark__list li,
  .binds-homeDarkPage .bdh-trust__track,
  .binds-homeDarkPage .bdh-miniViz span,
  .binds-homeDarkPage .bdh-bento__cell,
  .binds-homeDarkPage .bdh-dist__row b,
  .binds-homeDarkPage .bdh-rpm__bars span,
  .binds-homeDarkPage .bdh-break__row b,
  .binds-homeDarkPage .bdh-evo__line,
  .binds-homeDarkPage .bdh-evo__pt,
  .binds-homeDarkPage .bdh-csat__col span,
  .binds-homeDarkPage .bdh-tr__live i {
    animation: none !important;
    transition: none !important;
  }

  .binds-homeDarkPage .binds-askDark__line { stroke-dashoffset: 0; }
  .binds-homeDarkPage .binds-askDark__dot { opacity: 1; }
  .binds-homeDarkPage .bdh-evo__line { stroke-dashoffset: 0; }
  .binds-homeDarkPage .bdh-evo__pt { opacity: 1; }
  .binds-homeDarkPage .bdh-break__row b { width: var(--w, 50%); }
  .binds-homeDarkPage .bdh-csat__col span { transform: scaleY(1); }
}