/* nemesis.css - the NEMESIS product page (/nemesis). Loads after home.css and case.css and reuses their tokens, fonts,
   header, contact and footer. NEMESIS is the counterweight to Entropy in the brand: where Entropy keeps disorder out,
   NEMESIS lets it in on purpose, under control, to show you where you would break. Its accent is the brand's fail-red,
   used sparingly for the "break / weak spot" meaning; the gold stays the HiveMind brand colour. */

/* red-accented eyebrow + kickers for the "attack" meaning */
.nem .eyebrow { color: var(--fail); }
.nem .eyebrow svg { color: var(--honey-ink); } /* the mark keeps the brand gold */
.nem .k-break { color: var(--fail); }

/* the safety promise: a red-bordered callout, same shape as .cs-label */
.nem-safe { border-left-color: var(--fail); background: var(--fail-soft); }

/* Find -> Rank -> Fix, as three pills with arrows between them */
.flow { margin-top: 26px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.flow-step { display: inline-flex; align-items: center; gap: 9px; padding: 9px 15px; border-radius: 999px;
  background: var(--bg-2); box-shadow: 0 0 0 1px var(--line); font-weight: 650; font-size: 15px; }
.flow-step b { font: 500 12px/1 var(--mono); color: var(--fail); }
.flow-arrow { color: var(--text-3); flex: none; }
.flow-arrow svg { width: 18px; height: 18px; display: block; }

/* an illustrative ranked repair plan - clearly marked as an example, no real figures */
.plan { margin-top: 26px; border-radius: 16px; background: var(--bg-2); box-shadow: var(--shadow); overflow: hidden; }
.plan-bar { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--line); }
.plan-tag { display: inline-flex; align-items: center; gap: 7px; flex: none; padding: 4px 9px; border-radius: 6px;
  background: var(--fail-soft); color: var(--fail); font: 500 11px/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.plan-tag .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--fail); }
.plan-ttl { font: 500 13px var(--mono); color: var(--text-3); }
.plan-note { margin-left: auto; font: 400 12px var(--mono); color: var(--text-3); }
.plan ol { display: grid; }
.plan li { display: grid; grid-template-columns: 40px 1fr auto; gap: 16px; align-items: center; padding: 16px; border-top: 1px solid var(--line); }
.plan li:first-child { border-top: 0; }
.rank { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center;
  font: 700 16px var(--mono); background: var(--fail-soft); color: var(--fail); font-variant-numeric: tabular-nums; }
.plan li:nth-child(2) .rank { background: var(--honey-soft); color: var(--honey-ink); }
.plan li:nth-child(3) .rank { background: var(--bg-4); color: var(--text-3); }
.plan-b h3 { font-size: 1.02rem; font-weight: 700; letter-spacing: -.01em; }
.plan-b p { margin-top: 3px; color: var(--text-2); font-size: 15px; }
.sev { display: inline-flex; align-items: center; gap: 8px; font: 500 12.5px var(--mono); color: var(--text-3); white-space: nowrap; }
.sev i { width: 10px; height: 10px; border-radius: 50%; flex: none; }
.sev-hi i { background: var(--fail); } .sev-hi { color: var(--fail); }
.sev-md i { background: var(--honey); } .sev-md { color: var(--honey-ink); }
.sev-lo i { background: var(--chaos); }
@media (max-width: 559px) {
  .plan li { grid-template-columns: 34px 1fr; }
  .rank { width: 34px; height: 34px; font-size: 14px; }
  .sev { grid-column: 2; }
}

/* the two forces, side by side: Entropy keeps order / NEMESIS finds the cracks */
.pair { margin-top: 24px; display: grid; gap: 12px; }
.pair li { padding: 20px; border-radius: 14px; background: var(--bg-2); box-shadow: 0 0 0 1px var(--line); }
.pair svg { width: 26px; height: 26px; margin-bottom: 8px; }
.pair h3 { font-size: 1.1rem; font-weight: 700; }
.pair p { margin-top: 6px; color: var(--text-2); }
.pair-ent svg { color: var(--honey-ink); } .pair-ent { border-top: 3px solid var(--honey); }
.pair-nem svg { color: var(--fail); } .pair-nem { border-top: 3px solid var(--fail); }
@media (min-width: 640px) { .pair { grid-template-columns: 1fr 1fr; } }

/* hard-limits icons on this page lean red (the "will not" guardrails around breaking) */
.nem .wont svg { color: var(--fail); }
