.capability-grid .capability-card {
  display: flex;
  flex-direction: column;
}

.capability-grid .feature-visual {
  flex: none;
  height: 430px;
}

.capability-grid .capability-card:nth-child(n + 3) .feature-visual {
  height: 300px;
}

.trade-chat {
  gap: 6px;
  margin-top: 25px;
}

.trade-chat .demo-bubble {
  min-height: 38px;
  padding-block: 6px;
}

.trade-chat .demo-bubble.customer {
  width: 72%;
}

.trade-chat .demo-bubble.agent {
  width: 92%;
}

.trade-chat .demo-bubble p {
  font-size: 7.5px;
}

.trade-chat .demo-bubble small {
  font-size: 5.5px;
}

.renewal-visual > .risk-meter,
.renewal-visual > .risk-tags,
.renewal-visual > .rescue-action {
  display: none;
}

.renewal-chat .demo-bubble.agent {
  width: 94%;
}

.renewal-chat .demo-bubble.customer {
  min-height: 40px;
  width: 58%;
}

.renewal-chat {
  margin-top: 74px;
}

.retention-chat {
  gap: 6px;
}

.retention-chat .demo-bubble {
  min-height: 38px;
  padding-block: 6px;
}

.retention-chat .demo-bubble.agent {
  width: 93%;
}

.retention-chat .demo-bubble.customer {
  width: 78%;
}

.retention-chat .demo-bubble p {
  font-size: 7.5px;
}

.backend-human-request {
  color: #dce4dd;
  background: #252b2a;
  border: 1px dashed #6f7a75;
  border-radius: 8px;
  grid-template-columns: auto 1fr;
  align-items: center;
  gap: 3px 8px;
  min-height: 38px;
  padding: 7px 10px;
  display: grid;
}

.backend-human-request span {
  color: #26310d;
  background: #c9ff42;
  border-radius: 999px;
  grid-row: 1 / 3;
  padding: 4px 7px;
  font-size: 5.5px;
  font-weight: 850;
  white-space: nowrap;
}

.backend-human-request b {
  font-size: 7px;
}

.backend-human-request small {
  color: #9fa9a4;
  font-size: 5.5px;
}

.dialog-divider {
  border-top: 1px solid rgba(116, 86, 255, .2);
  color: #7357d8;
  align-items: center;
  gap: 8px;
  margin: 2px 0;
  padding-top: 7px;
  font-size: 6px;
  font-weight: 800;
  display: flex;
}

.dialog-divider span {
  color: #8f879f;
  font-weight: 650;
}

.human-guidance-done {
  color: #496300;
  background: rgba(201, 255, 66, .2);
  border: 1px solid rgba(147, 197, 28, .35);
  border-radius: 7px;
  align-items: center;
  gap: 6px;
  min-height: 25px;
  padding: 5px 9px;
  font-size: 6px;
  font-weight: 800;
  display: flex;
}

.human-guidance-done::before {
  content: "✓";
  color: #273700;
  background: #c9ff42;
  border-radius: 50%;
  place-items: center;
  width: 14px;
  height: 14px;
  display: grid;
}

.marketing-visual {
  background: linear-gradient(145deg, #f7f8f5 0%, #eef8df 58%, #f2edff 100%);
  height: 226px;
}

.marketing-visual::after {
  background: radial-gradient(circle, rgba(116, 86, 255, .2), rgba(116, 86, 255, 0) 68%);
}

.campaign-chat {
  gap: 7px;
  margin-top: 58px;
}

.marketing-visual > .intent-tags,
.marketing-visual > .intent-return,
.marketing-visual > .signal-status {
  display: none;
}

.campaign-chat .demo-bubble.agent {
  grid-template-rows: auto auto auto;
  width: 92%;
}

.campaign-chat .demo-bubble.agent > i {
  grid-row: 1 / 4;
}

.campaign-creative {
  color: #172015;
  background: linear-gradient(120deg, #d8ff73, #c8ff42 48%, #adf016);
  border: 1px solid rgba(255, 255, 255, .45);
  border-radius: 7px;
  grid-column: 2;
  margin: 4px 0 2px;
  min-height: 42px;
  padding: 7px 9px;
  position: relative;
  overflow: hidden;
}

.campaign-creative::after {
  content: "";
  position: absolute;
  width: 64px;
  height: 64px;
  border: 12px solid rgba(255, 255, 255, .28);
  border-radius: 50%;
  right: -22px;
  top: -24px;
}

.campaign-creative b,
.campaign-creative span {
  display: block;
  position: relative;
  z-index: 1;
}

.campaign-creative span {
  font-size: 6px;
  font-weight: 760;
  letter-spacing: .08em;
  opacity: .72;
  text-transform: uppercase;
}

.campaign-creative b {
  font-size: 8px;
  line-height: 1.35;
  margin-top: 3px;
}

.campaign-chat .demo-bubble.customer {
  min-height: 40px;
  width: 62%;
}

@media (width <= 600px) {
  .capability-grid .feature-visual {
    height: 510px;
  }

  .capability-grid .capability-card:first-child .feature-visual,
  .capability-grid .capability-card:nth-child(n + 3) .feature-visual {
    height: 300px;
  }

  .marketing-visual {
    height: 300px;
  }

  .campaign-chat .demo-bubble.agent {
    width: 96%;
  }
}