/* Fact — statistic tiles. Grid when a wrapper has .fact children
   (no extra class needed). `.facts-grid` still matches old markup.

   Selectors stay nested so they beat Salient:
   `.wpb_wrapper > div { margin-bottom: 24px }` and
   `.row .col img:not([srcset]) { width: auto }`. */

.wpb_wrapper:has(> .fact),
.facts-grid .wpb_wrapper {
  --tile-width: 21.875rem; /* 350px */

  display: grid;
  grid-template-columns: repeat(
    auto-fill,
    minmax(min(var(--tile-width), 100%), 1fr)
  );
  gap: 1.5rem;
}

.wpb_wrapper:has(> .fact) > :not(.fact) {
  grid-column: 1 / -1;
}

.wpb_wrapper:has(> .fact) > .fact,
.facts-grid .wpb_wrapper .fact {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--gap-m);
  padding: 5.625rem 1rem;
  margin-block-end: 0;
  background-color: #ffffff;
  text-align: center;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.25;
}

.wpb_wrapper:has(> .fact) > .fact:nth-child(1 of .fact),
.facts-grid .wpb_wrapper .fact:first-child {
  border-start-start-radius: var(--radius-lg);
}

.wpb_wrapper:has(> .fact) > .fact:nth-last-child(1 of .fact),
.facts-grid .wpb_wrapper .fact:last-child {
  border-end-end-radius: var(--radius-lg);
}

.row .col img.fact-icon {
  width: 120px;
  max-width: 120px;
  height: auto;
  margin-block-end: 0;
}

.fact-prefix {
  margin-inline-end: var(--gap-s);
}

@media (max-width: 768px) {
  .wpb_wrapper:has(> .fact) > .fact,
  .facts-grid .wpb_wrapper .fact {
    padding: 2.5rem;
  }
}
