.replacement-example { margin-top: 0; }
.replacement-example .section-head { margin-bottom: 36px; }
.replacement-example-figure { margin: 0; }
.replacement-process { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; list-style: none; margin: 0; padding: 0; }
.replacement-process-card { position: relative; min-width: 0; padding: 26px; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); }
.replacement-process-card:not(:last-child)::after { content: ''; position: absolute; left: 100%; top: 50%; width: 29px; height: 1px; background: #4d9fe8; }
.replacement-process-heading { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 14px; }
.replacement-process-number { flex: 0 0 28px; height: 28px; display: grid; place-items: center; color: var(--accent); font-size: 14px; font-weight: 500; }
.replacement-process-heading h3 { margin: 3px 0 7px; color: var(--text); font: 600 12px/1.5 var(--font-body); text-transform: uppercase; letter-spacing: .06em; }
.replacement-process-heading p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.replacement-process-explanation { margin: 0 0 24px; color: var(--muted); font-size: 14px; line-height: 1.75; }
.replacement-machine-body { display: grid; grid-template-columns: 80px minmax(0, 1fr); align-items: center; gap: 20px; }
.replacement-asic { width: 80px; height: auto; }
.replacement-hashrate-source { width: 72px; height: auto; stroke: var(--accent); stroke-width: 1.2; }
.replacement-hashrate-source rect { fill: var(--accent-soft); }
.replacement-example-values { margin: 0; min-width: 0; }
.replacement-example-values > div + div { margin-top: 20px; }
.replacement-example-values dt { margin-bottom: 5px; color: var(--muted); font-size: 12px; line-height: 1.5; }
.replacement-example-values dd { margin: 0; color: var(--text); font-size: 19px; font-weight: 500; line-height: 1.4; white-space: nowrap; font-variant-numeric: tabular-nums; }
.replacement-example-values dd span, .replacement-host-margin > span { font-size: 12px; font-weight: 400; }
.replacement-example-values .replacement-result { padding-top: 16px; border-top: 1px solid var(--line); }
.replacement-loss dd { color: var(--red); }
.replacement-removed dd { color: var(--accent); font-size: 17px; }
.replacement-client-result, .replacement-host-result { display: flex; align-items: center; gap: 14px; }
.replacement-client-result > svg, .replacement-host-result > svg { width: 22px; height: 24px; flex: 0 0 22px; stroke: var(--accent); stroke-width: 1.2; }
.replacement-client-result p, .replacement-host-result p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.replacement-client-result .replacement-client-rate { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; color: var(--text); font: 500 27px/1.3 var(--font-display); letter-spacing: -.03em; white-space: nowrap; }
.replacement-client-rate > span { font-size: 14px; letter-spacing: 0; }
.replacement-client-rate svg { width: 18px; height: 18px; margin-left: 5px; stroke: var(--green); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.replacement-host-result { margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--line); }
.replacement-host-result > svg { stroke: var(--green); }
.replacement-host-result .replacement-host-margin { margin-bottom: 8px; color: var(--green); font: 500 27px/1.3 var(--font-display); letter-spacing: -.03em; white-space: nowrap; }
.replacement-client-result > .replacement-performance-check { stroke: var(--green); stroke-linecap: round; stroke-linejoin: round; }
.replacement-capacity-result { display: flex; align-items: center; gap: 14px; margin-top: 24px; padding-top: 24px; border-top: 1px solid var(--line); }
.replacement-capacity-result > svg { width: 22px; height: 24px; flex: 0 0 22px; stroke: var(--accent); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.replacement-capacity-result p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.replacement-capacity-result .replacement-capacity-title { margin-bottom: 8px; color: var(--text); font-size: 15px; font-weight: 500; line-height: 1.5; }
.replacement-example-figure figcaption { margin-top: 18px; color: var(--muted); font-size: 12px; line-height: 1.6; }
.replacement-example-closing { display: flex; justify-content: center; align-items: center; gap: 12px; margin: 36px auto 0; max-width: 1000px; text-align: center; color: var(--text); font: 500 clamp(18px, 1.8vw, 22px)/1.6 var(--font-display); letter-spacing: -.02em; }
@media (max-width: 640px) {
  .replacement-example-closing { align-items: flex-start; }
  .replacement-example-closing > .solution-closing-icon { margin-top: 3px; }
}
@media (min-width: 901px) and (max-width: 1150px) {
  .replacement-process { gap: 20px; }
  .replacement-process-card { padding: 22px 18px; }
  .replacement-process-card:not(:last-child)::after { width: 21px; }
  .replacement-machine-body { grid-template-columns: 60px minmax(0, 1fr); gap: 14px; }
  .replacement-asic, .replacement-hashrate-source { width: 60px; }
  .replacement-client-result, .replacement-host-result, .replacement-capacity-result { gap: 10px; }
  .replacement-host-result .replacement-host-margin { font-size: 24px; }
}
@media (max-width: 900px) {
  .replacement-process { grid-template-columns: 1fr; max-width: 580px; margin-inline: auto; }
  .replacement-process-card:not(:last-child)::after { left: 50%; top: 100%; width: 1px; height: 29px; }
  .replacement-process-heading { margin-bottom: 14px; }
  .replacement-machine-body { grid-template-columns: minmax(72px, .65fr) minmax(0, 1fr); }
  .replacement-asic, .replacement-hashrate-source { justify-self: center; }
  .replacement-client-result, .replacement-host-result, .replacement-capacity-result { gap: 18px; }
}
@media (max-width: 380px) {
  .replacement-process-card { padding: 22px 20px; }
  .replacement-machine-body { grid-template-columns: 64px minmax(0, 1fr); gap: 18px; }
  .replacement-asic, .replacement-hashrate-source { width: 64px; }
}
