/* final-cta */
.tcc-final {
  position: relative;
  overflow: hidden;
  text-align: center;
  background: var(--tcc-band-bg);
  color: var(--tcc-band-ink);
}
.tcc-final > .tcc-wrap {
  position: relative;
  z-index: 1;
}

/* the two brand rings, bottom left */
.tcc-final::before,
.tcc-final::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  box-sizing: border-box;
  pointer-events: none;
}
.tcc-final::before {
  width: 360px;
  height: 360px;
  left: -190px;
  bottom: -130px;
  border: 52px solid var(--tcc-blue);
}
.tcc-final::after {
  width: 260px;
  height: 260px;
  left: -205px;
  bottom: -70px;
  border: 40px solid var(--tcc-teal-bright);
}

.tcc-final h2 {
  color: var(--tcc-band-ink);
  margin-inline: auto;
  max-width: 18em;
}
/* first date only, or the "soon" text when there are no dates */
.tcc-final__when > span + span {
  display: none;
}
.tcc-final p {
  color: var(--tcc-band-muted);
  margin: 12px auto 0;
  max-width: 34em;
}

.tcc-final__ctas {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  justify-content: center;
  margin-top: 28px;
}
.tcc-final__ctas wa-button::part(base) {
  min-height: 48px;
  padding-inline: 22px;
  border-radius: 8px;
  font-weight: 700;
  font-size: 1rem;
}
.tcc-final__primary::part(base) {
  background: var(--tcc-mint);
  color: var(--tcc-navy);
  border: 0;
}
.tcc-final__primary::part(base):hover {
  background: var(--tcc-mint-hover);
}
.tcc-final__secondary::part(base) {
  background: transparent;
  color: var(--tcc-band-ink);
  border: 2px solid currentColor;
}
.tcc-final__secondary::part(base):hover {
  background: rgba(255, 255, 255, .1);
}

@media (max-width: 640px) {
  .tcc-final__ctas wa-button {
    flex: 1 1 100%;
  }
}