/* WBR Testimonial Wall
   Defaults follow the Wisdom by Rawan design system; every value below
   can be overridden from the widget's Style tab. */

.wbr-tw {
  --wbr-tw-cherry: #670626;
  --wbr-tw-cherry-blush: #E8B7C2;
  --wbr-tw-sacred-coral: #D96248;
  --wbr-tw-lemon-meringue: #FBF0C0;
  --wbr-tw-lemonade: #F8E79E;
  --wbr-tw-deep-brown: #6F5344;
  --wbr-tw-warm-white: #FFFDFA;
  --wbr-tw-charcoal: #4A3A38;
  --wbr-tw-serif: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --wbr-tw-sans: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

/* Filter pills */
.wbr-tw__filters {
  display: flex;
  flex-wrap: wrap;
  gap: .6rem;
  margin-bottom: 2rem;
}

.wbr-tw .wbr-tw__filter {
  border: 1px solid var(--wbr-tw-cherry-blush);
  background: var(--wbr-tw-warm-white);
  color: var(--wbr-tw-deep-brown);
  padding: .5em 1.1em;
  border-radius: 999px;
  font-family: var(--wbr-tw-sans);
  font-size: .74rem;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .1em;
  text-transform: uppercase;
  cursor: pointer;
  box-shadow: none;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.wbr-tw .wbr-tw__filter:hover,
.wbr-tw .wbr-tw__filter:focus-visible {
  background: var(--wbr-tw-warm-white);
  color: var(--wbr-tw-cherry);
  border-color: var(--wbr-tw-cherry);
}

.wbr-tw .wbr-tw__filter:focus-visible {
  outline: 2px solid var(--wbr-tw-cherry);
  outline-offset: 2px;
}

.wbr-tw .wbr-tw__filter[aria-pressed="true"] {
  background: var(--wbr-tw-cherry);
  color: var(--wbr-tw-lemon-meringue);
  border-color: var(--wbr-tw-cherry);
}

/* Wall (masonry via CSS columns; the column count comes from the widget) */
.wbr-tw__wall {
  columns: 3;
  column-gap: 24px;
}

.wbr-tw__card {
  position: relative;
  display: block;
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  margin: 0 0 24px;
  padding: 1.5rem 1.6rem;
  background: var(--wbr-tw-warm-white);
  border: 1px solid var(--wbr-tw-lemonade);
  border-radius: 14px;
}

.wbr-tw__card[hidden] {
  display: none;
}

/* Corner icon */
.wbr-tw__icon {
  position: absolute;
  top: 1rem;
  right: 1.2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--wbr-tw-sacred-coral);
  font-size: .8rem;
  line-height: 1;
  pointer-events: none;
}

.wbr-tw--icon-left .wbr-tw__icon {
  right: auto;
  left: 1.2rem;
}

.wbr-tw__icon i {
  font-size: 1em;
  color: inherit;
}

.wbr-tw__icon svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
}

/* Top-left icon sits above the first line instead of beside it */
.wbr-tw--icon-left .wbr-tw__card {
  padding-top: 2.4rem;
}

/* Title, text, subtitle */
.wbr-tw .wbr-tw__title {
  margin: 0 0 .6rem;
  font-family: var(--wbr-tw-serif);
  font-size: 1.2rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--wbr-tw-cherry);
}

.wbr-tw__text {
  font-family: var(--wbr-tw-serif);
  font-size: 1.02rem;
  line-height: 1.6;
  color: var(--wbr-tw-charcoal);
}

.wbr-tw__subtitle {
  margin-top: 1rem;
  font-family: var(--wbr-tw-sans);
  font-size: .68rem;
  font-style: normal;
  line-height: 1.6;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--wbr-tw-cherry);
}

/* Fallbacks if the responsive column control has no value saved */
@media (max-width: 1024px) {
  .wbr-tw__wall { columns: 2; }
}

@media (max-width: 767px) {
  .wbr-tw__wall { columns: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .wbr-tw .wbr-tw__filter { transition: none; }
}
