/**
 * About: intro copy and headline figures.
 *
 * Values from the page it replaces (Elementor #44): columns 70/30, left column
 * min-height 200px, 48px between figures, 8px between a figure and its label,
 * numbers TBCCaps 56px/300 (50px small), labels TBCCaps 16px/400 at 20px
 * leading.
 */

.deka-about-intro {
  display: grid;
  grid-template-columns: 70% 30%;
  align-items: start;
  width: min(100% - 2.5rem, var(--deka-container-wide));
  margin-inline: auto;
  padding-block: var(--deka-space-2xl);
}

.deka-about-intro__copy {
  min-height: 12.5rem; /* 200 */
  padding-right: var(--deka-space-2xl);
  padding-bottom: var(--deka-space-xl); /* 30-ish, as on the live site */
}

/* No max-width: the measure is set by the 70% column and its right padding,
   which is how the live site frames it. */
.deka-about-intro__text {
  margin: 0;
  font-family: var(--deka-font-display);
  font-size: 1.75rem; /* 28 */
  font-weight: var(--deka-weight-regular);
  line-height: var(--deka-leading-normal);
  color: var(--deka-text);
}

/* ==========================================================================
   Figures
   ========================================================================== */

.deka-about-intro__stats {
  display: flex;
  flex-direction: column;
  gap: var(--deka-space-xl); /* 48 */
}

.deka-stat {
  display: flex;
  flex-direction: column;
  gap: var(--deka-space-2xs); /* 8 */
}

.deka-stat__value {
  font-family: var(--deka-font-display);
  font-size: 3.5rem; /* 56 */
  font-weight: var(--deka-weight-light);
  line-height: 1.05;
  color: var(--deka-text);

  /* Digits change width as the counter runs; tabular figures stop the number
     jittering sideways while it counts. */
  font-variant-numeric: tabular-nums;
}

.deka-stat__label {
  font-family: var(--deka-font-display);
  font-size: 1rem; /* 16 */
  font-weight: var(--deka-weight-regular);
  line-height: 1.25; /* 20/16 */
  color: var(--deka-text);
}

/* ==========================================================================
   Responsive
   ========================================================================== */

@media (max-width: 64rem) { /* 1024 */
  .deka-about-intro {
    grid-template-columns: 1fr;
    gap: var(--deka-space-2xl);
  }

  .deka-about-intro__copy {
    min-height: 0;
    padding-right: 0;
    padding-bottom: 0;
  }

  .deka-about-intro__stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
    gap: var(--deka-space-lg);
  }
}

@media (max-width: 48rem) { /* 768 */
  .deka-stat__value { font-size: 3.125rem; /* 50, as on the live site */ }
}

@media (max-width: 47.9375rem) { /* 767 — phones */
  .deka-about-intro__text { font-size: 1.25rem; /* 20 */ }

  /* The partner logos below bring their own 20px, the live gap on phones. */
  .deka-about-intro { padding-bottom: 0; }
}