/* V5.8 — Editorial colour hierarchy.
   Blue identifies short uppercase research labels; warm white carries the
   explanatory copy; Outcome Red is reserved for the small leading rule. */

/* The compact labels now form a consistent editorial layer. */
.eyebrow,
.kicker,
.card-title,
.activity-card-kicker,
.dc-kicker,
.signal-label,
.matrix-k {
  color: var(--blue);
}

/* Red remains a restrained accent: a short rule, never a text field. */
.eyebrow,
.kicker {
  display: flex;
  align-items: center;
  gap: 12px;
}

.eyebrow::before,
.kicker::before {
  content: '';
  display: block;
  flex: 0 0 22px;
  width: 22px;
  height: 2px;
  background: var(--red);
}

/* Supporting sentences use warm white instead of a blue-grey layer. */
.hero-copy > p,
.lead,
.feature p,
.step p,
.compliance-copy,
.telegram-wrap p,
.faq p,
.account-card p,
.activity-card-copy,
.signal-copy,
.card-note,
.check {
  color: var(--white-80);
}

/* Keep the least important operational annotations visually quiet. */
.trustline,
.activity-meta,
.dc-status,
.dc-ohlc,
.dc-footer,
.market-label {
  color: var(--white-45);
}

/* Research counts are the primary live operational evidence on this page. */
.activity-card-value {
  color: var(--blue);
}

/* Only the second sentence of a headline carries the blue signal. */
.sentence-accent {
  color: var(--blue);
}

/* The live quote turns colour only after its own price has moved. */
.quote-price.up,
.quote-change.up {
  color: var(--blue);
}

.quote-price.down,
.quote-change.down {
  color: var(--red);
}

@media (max-width: 720px) {
  .eyebrow,
  .kicker {
    gap: 10px;
  }

  .eyebrow::before,
  .kicker::before {
    flex-basis: 18px;
    width: 18px;
  }
}