/* ==========================================================
   TygerLabs.ai · About
   ========================================================== */

.about-story { margin: 0; font-size: var(--text-xl); line-height: 1.55; color: var(--ink-2); }

/* Three plain figures: the value large in tiger, the label under it */
.about-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--s-6);
  margin: var(--s-8) 0 0;
}
.about-stats dt {
  font-family: var(--ff-display);
  font-size: var(--text-3xl);
  font-weight: var(--fw-ultra);
  letter-spacing: -0.04em;
  line-height: 1;
  color: var(--tiger);
}
.about-stats dd { margin: var(--s-2) 0 0; font-size: var(--text-lg); color: var(--ink-2); }

.about-values { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-5); margin-top: var(--s-5); }
.about-value { padding: var(--s-6); border-radius: var(--r-lg); background: var(--surface-1); }
.about-value h3 { margin: 0 0 var(--s-2); font-size: var(--text-xl); }
.about-value p { margin: 0; color: var(--ink-2); }

.page-cta { margin-top: var(--section-y); }

@media (max-width: 991.98px) {
  .about-values { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 575.98px) {
  .about-stats { grid-template-columns: minmax(0, 1fr); gap: var(--s-5); }
  .about-values { grid-template-columns: minmax(0, 1fr); }
  .about-story { font-size: var(--text-lg); }
}

/* Stacked columns: a label and its text belong together, so the desktop
   3rem row gap closes up once the columns stack. */
@media (max-width: 991.98px) { main .row.g-5 { --bs-gutter-y: var(--s-3); } }
