/* T-1170 slice 2 — 44 Signals roadmap Form paint (signals-open).
   Reuses roadmap compose geometry; measured tokens from 44signals_roadmap_briefing_deck.html. */
.abcs-specimen--signals {
  --roadmap-bg: #0A1628;
  --roadmap-card: #1E3A5F;
  --roadmap-card-2: #16304f;
  --roadmap-ink: #fff;
  --roadmap-muted: #94A3B8;
  --roadmap-line: rgba(255, 255, 255, 0.1);
  --roadmap-accent: #06B6D4;
  --crawl: #3B82F6;
  --walk: #06B6D4;
  --run: #10B981;
  --warn: #F59E0B;
  --err: #EF4444;
  --roadmap-display: var(--font-family-display, "Syne", system-ui, sans-serif);
  --roadmap-body: var(--font-family-body, "Syne", system-ui, sans-serif);
  --roadmap-mono: var(--font-family-mono, "JetBrains Mono", ui-monospace, monospace);
}

.abcs-specimen--signals .abcs-roadmap-form-root,
.abcs-specimen--signals .abcs-roadmap-form-frame,
.abcs-specimen--signals .abcs-roadmap-form-slide {
  background: radial-gradient(120% 120% at 12% 0%, #12213C 0%, var(--roadmap-bg) 55%);
}

.abcs-specimen--signals .wordmark {
  font-weight: 800;
  letter-spacing: -0.02em;
}

.abcs-specimen--signals .wordmark .sig {
  background: linear-gradient(90deg, #3B82F6, #D4A574);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.abcs-specimen--signals .wordmark em {
  font-style: normal;
  color: var(--phase, var(--walk));
  font-weight: 700;
}

.abcs-specimen--signals .callout {
  background: linear-gradient(180deg, #16304f, #12253f);
  border-radius: 0 12px 12px 0;
  align-self: flex-start;
  width: auto;
  max-width: min(76ch, 100%);
}

.abcs-specimen--signals .callout .q {
  font-size: 25px;
  font-weight: 700;
  line-height: 1.35;
  text-wrap: wrap;
  max-width: 76ch;
}

.abcs-specimen--signals .callout .q em {
  font-style: normal;
  color: var(--phase, var(--walk));
}

.abcs-specimen--signals .h1 {
  font-weight: 800;
  font-size: 50px;
  line-height: 1.05;
  letter-spacing: -0.02em;
}

.abcs-specimen--signals .h2 {
  font-weight: 800;
  font-size: 36px;
}

.abcs-specimen--signals .display {
  font-weight: 800;
  font-size: 62px;
  letter-spacing: -0.02em;
  line-height: 1.05;
}

.abcs-specimen--signals .chip {
  font-family: var(--roadmap-mono);
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.abcs-specimen--signals .sub,
.abcs-specimen--signals .body-text {
  font-family: var(--roadmap-body);
}

.abcs-specimen--signals .kicker,
.abcs-specimen--signals .list-label,
.abcs-specimen--signals .by {
  font-family: var(--roadmap-mono);
}

.abcs-specimen--signals .display em,
.abcs-specimen--signals .h1 em,
.abcs-specimen--signals .h2 em {
  font-style: normal;
  color: var(--phase, var(--walk));
}

.abcs-specimen--signals .big-index {
  font-family: var(--roadmap-mono);
  font-weight: 500;
  font-size: 180px;
  color: rgba(255, 255, 255, 0.05);
  letter-spacing: -0.04em;
}

.abcs-specimen--signals ul.clean li {
  font-size: 18px;
  line-height: 1.42;
  color: #dbe4ee;
  max-width: 70ch;
}

.abcs-specimen--signals ul.clean li::before {
  top: 8px;
  width: 8px;
  height: 8px;
}

.abcs-specimen--signals ul.clean li b {
  color: #fff;
  font-weight: 700;
}

.abcs-specimen--signals ul.clean li .note,
.abcs-specimen--signals .small-note {
  color: var(--roadmap-muted);
}

.abcs-specimen--signals .small-note {
  font-size: 14px;
  font-style: italic;
}