/* ==========================================================================
   THE BROKERAGE BEHIND ME  —  Avanti Way's own figures

   Replaces the clone's stats wall, which quoted Douglas Elliman's global
   numbers under Avantiway's name. Four figures instead of nine, because four
   true ones say more than nine borrowed ones, and because every number here
   has to survive being checked.

   Deliberately quieter than the section it replaces. These are the
   brokerage's numbers, not Yaritza's, and the design should not let them
   read as her production: no full-bleed drama, no 100px display figures.
   ========================================================================== */

.yp-brok {
  background: rgb(var(--yp-shell-rgb));
  padding: clamp(56px, 6.5vw, 92px) 0;
}

.yp-brok-wrap {
  width: 100%;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 clamp(16px, 3vw, 40px);
}

/* ---- lead ---------------------------------------------------------------- */

.yp-brok-lead { max-width: 60ch; }

/* typography.css forces a weight on headings, Divi pads them and zeroes their
   tracking from an inline !important rule. All three taken back. */
.yp-brok-title {
  margin: 12px 0 0;
  padding: 0 !important;
  font-family: var(--yp-serif);
  font-size: clamp(2rem, 1.5rem + 1.6vw, 2.75rem);
  line-height: 1.05;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  color: var(--yp-ink);
}

.yp-brok-deck {
  margin: 16px 0 0;
  padding: 0 !important;
  font-size: clamp(15.5px, 0.3vw + 14px, 17.5px);
  line-height: 1.65;
  letter-spacing: 0 !important;
  color: rgb(var(--yp-ink-rgb) / 0.75);
  text-wrap: pretty;
}

/* ---- the figures --------------------------------------------------------- */

.yp-brok-stats {
  display: grid;
  /* auto-fit so four figures never leave a hole, and so adding or dropping
     one does not need a new breakpoint. */
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: clamp(22px, 3vw, 44px);
  margin: clamp(34px, 4vw, 54px) 0 0;
  padding: clamp(26px, 3vw, 38px) 0 0;
  border-top: 1px solid rgb(var(--yp-ink-rgb) / 0.14);
}

.yp-brok-stat { margin: 0; }

.yp-brok-n {
  margin: 0;
  padding: 0 !important;
  font-family: var(--yp-serif);
  /* Half the size the borrowed version used. A real 2,000 does not need to be
     set like a fake 25,000. */
  font-size: clamp(1.9rem, 1.4rem + 1.5vw, 2.6rem);
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--yp-ink);
  font-variant-numeric: tabular-nums;
}

.yp-brok-l {
  margin: 10px 0 0;
  padding: 0 !important;
  max-width: 22ch;
  font-size: 13px;
  line-height: 1.5;
  letter-spacing: 0.04em !important;
  color: rgb(var(--yp-ink-rgb) / 0.66);
}

/* ---- attribution --------------------------------------------------------- */

/* Not fine print for its own sake. The whole reason this section was rebuilt
   is that the previous one implied someone else's numbers were hers, so the
   line that says whose they are belongs on the page, not in a comment. */
.yp-brok-note {
  margin: clamp(26px, 3vw, 36px) 0 0;
  padding: 0 !important;
  max-width: 56ch;
  font-size: 12.5px;
  line-height: 1.6;
  letter-spacing: 0.02em !important;
  color: rgb(var(--yp-ink-rgb) / 0.55);
}

@media (max-width: 480px) {
  .yp-brok-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 18px; }
  .yp-brok-l { font-size: 12px; max-width: none; }
}