@use "@naomi-2025/ui-core/site-config";
@use "@naomi-2025/ui-core/text-styles";
@use "s360-scss-toolkit";

.statistic {
  display: inline-block;
  border-top: s360-scss-toolkit.rem(1) solid var(--highlight-color);
  padding-top: site-config.spacer(1);

  > * + * {
    margin-top: site-config.spacer(-3);
  }

  &__title {
    @extend %text-style-label;

    max-width: 25ch;
  }

  &__number-group {
    --heading--color: var(--highlight-color);
    @extend %text-style-h1;

    display: flex;
  }

  &__qualifier {
    max-width: 25ch;
  }
}
