/* v3-agentic-facturatie-debiteuren.css
   Page-only additions on top of css/v3-pages.css.
   Everything else (bento, worksheet, steps, prompt-block, governance-panel,
   boundary-note, links-row) comes from the shared v3 layer. */

/* B2 — the calculation cell reads as a framed sum, not as body copy.
   Class name converged with the sister agentic pages: .calc-callout. */
.v3 #probleem .cell.calc-callout {
  border-left: 3px solid var(--petrol, #1f6f78);
}
.v3 #probleem .cell.calc-callout .figure {
  display: block;
  margin-bottom: .35em;
}
.v3 #probleem .cell.calc-callout p + p { margin-top: .9rem; }

/* Imagery — cell-img inside the stacked bentos, plus one full-measure band.
   Decoration and pacing only; nothing here carries an argument. */
.v3 .bento figure.cell-img {
  margin: 0;
  border: var(--hairline);
  border-radius: var(--radius);
  height: clamp(190px, 26vw, 340px);
}
.v3 .bento figure.cell-img img { width: 100%; height: 100%; object-fit: cover; display: block; }
.v3 figure.page-band {
  margin: clamp(2.5rem, 6vh, 4rem) auto 0;
  width: min(1180px, 92vw);
  border-radius: var(--radius);
  overflow: hidden;
  height: clamp(200px, 28vw, 360px);
}
.v3 figure.page-band img { width: 100%; height: 100%; object-fit: cover; display: block; }

@media (max-width: 767px) {
  .v3 .bento figure.cell-img { height: clamp(170px, 44vw, 230px); }
  .v3 figure.page-band { height: clamp(170px, 46vw, 240px); }
}

/* B5 — the eenheid/klok/instrument line sits above the numbered steps. */
.v3 .sector-cascade .unit-line {
  font-style: italic;
  opacity: .82;
  margin-bottom: 1em;
}

/* B4 — the autonomy cell carries the Request-Approval / Mandatory Halt limits. */
.v3 #aanpak .cell.autonomy {
  border-left: 3px solid var(--petrol, #1f6f78);
}

/* CRO: the hero repeats the shape of the promise, subordinate to the button. */
.v3 .hero-inner .micro { margin-top: .75rem; opacity: .72; }