/*
 * /gateway — RAXE Gateway page styles
 * Depends on: tokens.css, base.css, components/*
 */

/* ── Responsive card grids ── */
.gw-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--space-6);
}
.gw-grid-2 {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-6);
}
@media (max-width: 760px) {
  .gw-grid-2 { grid-template-columns: 1fr; }
}

/* ── Cross-source lineage strip ── */
.gw-lineage {
  display: flex; align-items: center; justify-content: center;
  gap: var(--space-3); flex-wrap: wrap;
  margin-top: var(--space-8);
}
.gw-lineage-pill {
  font-family: var(--font-mono); font-size: 11px; font-weight: var(--weight-bold);
  letter-spacing: var(--tracking-wider); text-transform: uppercase;
  padding: 8px 16px; border-radius: var(--radius-pill);
  border: 1px solid var(--border-default);
  background: var(--surface-overlay); color: var(--text-muted);
}
.gw-lineage-pill.claim   { color: var(--cyan);    border-color: rgba(56,189,248,0.3); }
.gw-lineage-pill.reality { color: var(--magenta); border-color: rgba(232,121,249,0.3); }
.gw-lineage-pill.verify  { color: #34d399;        border-color: rgba(52,211,153,0.3); }
.gw-lineage-arrow { color: var(--text-dim); font-family: var(--font-mono); }

/* ── Signal number chip on detection cards ── */
.gw-signal-num {
  display: inline-block;
  font-family: var(--font-mono); font-size: 10px; font-weight: var(--weight-bold);
  letter-spacing: var(--tracking-wider); color: var(--cyan);
  border: 1px solid rgba(56,189,248,0.22); background: rgba(56,189,248,0.07);
  padding: 2px 8px; border-radius: var(--radius-sm);
  margin-bottom: var(--space-3);
}

/* ── "Illustrative sample" tag ── */
.sample-tag {
  display: inline-block;
  font-family: var(--font-mono); font-size: 9px; font-weight: var(--weight-bold);
  letter-spacing: var(--tracking-widest); text-transform: uppercase;
  color: var(--amber); border: 1px solid var(--border-amber);
  background: rgba(245,158,11,0.07);
  padding: 3px 10px; border-radius: var(--radius-sm);
  margin-bottom: var(--space-3);
}

/* ── Roadmap badge (amber, distinct from validated green) ── */
.badge-roadmap {
  background: rgba(245,158,11,0.10);
  color: var(--amber);
  border-color: var(--border-amber);
}

/* ── Footnote line for absolute claims ── */
.gw-footnote {
  font-size: var(--fs-label); color: var(--text-dim);
  margin-top: var(--space-4);
}
.gw-footnote a { color: var(--text-muted); text-decoration: underline; }
.gw-footnote a:hover { color: var(--text-brand); }

/* ── Stage pill in the final CTA ── */
.gw-stage {
  margin-bottom: var(--space-6);
  display: inline-flex;
}