/* ===== CROWD POWER: explainer (left) + aggregation flow (right) ===== */
#crowdpower { background: var(--bg-elev); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }

#crowdpower .cp-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: clamp(var(--s5), 5vw, var(--s8));
  align-items: start;
}
#crowdpower h2 { font-family: var(--font-head); font-size: var(--h2); margin: 0 0 var(--s3); }
#crowdpower .lead { margin: 0; color: var(--muted); max-width: 56ch; }

#crowdpower .cp-markets {
  margin-top: var(--s5);
  padding-left: var(--s3);
  border-left: 3px solid var(--green);
}
#crowdpower .cp-markets h3 { margin: 0 0 var(--s1); font-family: var(--font-head); font-size: 20px; }
#crowdpower .cp-markets p { margin: 0; max-width: 52ch; }

#crowdpower .cp-flow { list-style: none; margin: 0; padding: 0; counter-reset: none; }
#crowdpower .cp-flow li {
  display: flex; align-items: center; gap: var(--s3);
  padding: var(--s3) 0;
  border-top: 1px solid var(--line);
  font-weight: 600;
}
#crowdpower .cp-flow li:last-child { border-bottom: 1px solid var(--line); }
#crowdpower .cp-n {
  flex: 0 0 32px; width: 32px; height: 32px;
  display: grid; place-items: center;
  border-radius: 50%;
  background: var(--green); color: #fff;
  font-variant-numeric: tabular-nums; font-weight: 800; font-size: 14px;
}

@media (max-width: 860px) {
  #crowdpower .cp-grid { grid-template-columns: 1fr; }
}