/* About page extras */

/* Stack story grid tighter on smaller desktop */
@media (max-width: 1100px) {
  .about-story {
    gap: 3rem;
  }
}

/* Stat items — base styling (numbers/labels had no rules at all before) */
.stat-item__num {
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1;
  color: var(--text);
}

.stat-item__label {
  font-size: 0.82rem;
  color: var(--text-3);
  line-height: 1.3;
  margin-top: 0.35rem;
}

.stat-item__num--stars {
  font-size: clamp(18px, 2.4vw, 24px);
  letter-spacing: 0.08em;
  color: #F5A623;
}

#about-stats .stat-item__num--stars { color: #F5A623; }

/* Stat items: accent color on number */
.about-stats .stat-item:hover .stat-item__num {
  color: var(--accent-h);
}

/* Stats section: same dark photo used across the rest of the site */
#about-stats {
  position: relative;
  background:
    linear-gradient(rgba(17,24,39,0.80), rgba(17,24,39,0.88)),
    var(--wr-img-cta) center / cover no-repeat;
  background-attachment: fixed;
}

#about-stats .about-stats { border-top-color: rgba(255,255,255,0.18); border-bottom-color: rgba(255,255,255,0.18); }
#about-stats .stat-item__num { color: #fff; }
#about-stats .stat-item__label { color: rgba(255,255,255,0.62); }
#about-stats .stat-item:hover .stat-item__num { color: var(--blue-500); }

@media (max-width: 900px) {
  #about-stats { background-attachment: scroll; }
}

/* Value cards grid adjustment */
@media (min-width: 769px) and (max-width: 900px) {
  .values-grid {
    grid-template-columns: 1fr 1fr;
  }
}