/* =====================================================================
   D - FAQ Facts "OneGold by the Numbers" (Figma 10159:19461).
   Full-bleed light-background band; inner content locked to the 1240
   container. Centred heading + a 4-up row of stat cards (icon over a
   two-line value/label). Tokens only.
   ===================================================================== */

.faq-facts {
  /* Dark navy band (black -> #071f39), white text — Figma 10202:7807. */
  background: linear-gradient(to top, var(--gray-8) 0%, var(--breakout-grad-dark) 100%);
  padding-block: var(--faq-facts-pad-y);
}

.faq-facts__inner {
  display: flex;
  flex-direction: column;
  gap: var(--faq-facts-gap);
}

/* ---- Heading (OG Desktop H2 32/45, white, centred) ---- */
.faq-facts__heading {
  margin: 0;
  font-size: var(--fs-32);
  font-weight: var(--fw-medium);
  line-height: var(--lh-45);
  color: var(--gray-0);
  text-align: center;
  word-break: break-word;
}

/* ---- Row of 4 equal cards ---- */
.faq-facts__row {
  display: flex;
  gap: var(--faq-facts-row-gap);
  align-items: flex-start;
  width: 100%;
}

.faq-facts__card {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--faq-card-gap);
  padding-inline: var(--faq-card-pad-x);
}

/* ---- Icon: fixed 40px tall, natural width per card (inline style) ---- */
.faq-facts__icon {
  flex: none;
  height: var(--faq-icon-h);
  display: flex;
  align-items: center;
  justify-content: center;
}
.faq-facts__icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* ---- Stat: bold value (24 Axiforma Medium) + label (18/25 regular) ---- */
.faq-facts__stat {
  margin: 0;
  text-align: center;
  color: var(--gray-0);
  word-break: break-word;
}
.faq-facts__value {
  display: block;
  font-size: var(--fs-24);
  font-weight: var(--fw-medium);
  line-height: 1.2;
}
.faq-facts__label {
  display: block;
  font-size: var(--fs-18);
  font-weight: var(--fw-regular);
  line-height: var(--lh-25);
}

/* ---- Tablet (768–1023px): 4-across → 2×2 grid ---- */
@media (max-width: 1023.98px) {
  .faq-facts__row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: var(--faq-facts-row-gap);
    row-gap: 40px;
  }
  .faq-facts__card {
    padding-inline: 0;
  }
}

/* =====================================================================
   M - EU FAQ Facts "OneGold by the Numbers" (Figma 10159:19584) @ 390.
   Heading drops to 36/45 and reads left-aligned over the band; the 4-up
   row becomes a 2x2 grid (two equal columns, 10px gutters) with each
   stat card still centring its icon over the value/label.
   ===================================================================== */
@media (max-width: 767.98px) {
  .faq-facts {
    padding-block: var(--faq-facts-pad-y);
  }
  .faq-facts__inner {
    gap: var(--faq-facts-row-gap);
  }
  .faq-facts__heading {
    font-size: var(--fs-26);
    line-height: var(--lh-36);
    text-align: left;
  }
  /* 4-across -> 2x2 grid. */
  .faq-facts__row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 10px;
    row-gap: 40px;
  }
  .faq-facts__card {
    padding-inline: 0;
  }
}