.lio-title-subtitle {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  inline-size: 100%;
  max-inline-size: 874px;
  min-inline-size: var(--space-zero);
  gap: var(--space-xs2);
  color: var(--text);
  font-family: var(--font-geist);
}

.lio-title-subtitle[data-size="m"] {
  gap: var(--space-xs3);
}

.lio-title-subtitle[data-size="l"] {
  gap: var(--space-xs2);
}

.lio-title-subtitle__title,
.lio-title-subtitle__subtitle {
  margin: var(--space-zero);
  min-inline-size: var(--space-zero);
}

.lio-title-subtitle__title {
  color: var(--text);
  font: 500 16px/24px var(--font-geist);
  letter-spacing: 0;
  white-space: nowrap;
}

.lio-title-subtitle[data-size="m"] .lio-title-subtitle__title {
  font: 600 18px/1 var(--font-geist);
  letter-spacing: 0;
  text-align: center;
}

.lio-title-subtitle[data-size="l"] .lio-title-subtitle__title {
  display: inline-block;
  background: linear-gradient(90deg, var(--text), var(--text-brand-secondary));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font: 600 24px/1 var(--font-geist);
  letter-spacing: 0;
  text-align: center;
}

.lio-title-subtitle__subtitle {
  inline-size: 100%;
  color: var(--text-tertiary);
  font: 400 14px/22px var(--font-geist);
  letter-spacing: 0;
}

.lio-title-subtitle[data-size="m"] .lio-title-subtitle__subtitle {
  color: var(--text-secondary);
}

.lio-title-subtitle[data-size="l"] .lio-title-subtitle__subtitle {
  color: var(--text-tertiary);
  font: 400 16px/24px var(--font-geist);
  letter-spacing: 0;
}