/* Focused workflow polish for the hero proof band and selected-output module. */
.trust-line {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  padding-top: 18px;
  border-top-color: #355b60;
  font-family: "IBM Plex Mono", monospace;
}

.trust-line article {
  min-height: 104px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 13px 14px 12px;
  border: 1px solid #2d565b;
  border-top: 2px solid var(--fresh-mint);
  background: #183d43;
}

.trust-line article:nth-child(2) { border-top-color: #5bc6bd; }
.trust-line article:nth-child(3) { border-top-color: #7895e7; }
.trust-line b {
  margin: 0;
  color: var(--fresh-mint);
  font-size: 10px;
  font-weight: 500;
}
.trust-line article:nth-child(2) b { color: #5bc6bd; }
.trust-line article:nth-child(3) b { color: #9aaeff; }
.trust-line strong {
  display: block;
  margin: 10px 0 4px;
  color: #f2faf7;
  font: 700 13px/1.2 Manrope, sans-serif;
}
.trust-line small {
  display: block;
  color: #a9c4c1;
  font-size: 10px;
  line-height: 1.45;
}

.system-output {
  grid-template-columns: minmax(210px, .72fr) minmax(0, 1.28fr);
  gap: 26px;
  align-items: stretch;
  padding: 22px;
  border-color: #3c696a !important;
  background: #102b31 !important;
}

.output-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-right: 24px;
  border-right: 1px solid #315c60;
}
.output-copy small {
  color: var(--fresh-mint) !important;
  letter-spacing: .1em;
}
.output-copy strong {
  margin: 9px 0 8px;
  color: #f2faf7;
  font-size: clamp(22px, 2.7vw, 32px);
  line-height: 1.08;
}
.output-copy p { max-width: 360px; color: #aec8c5; }
.output-caption {
  display: inline-flex;
  width: max-content;
  margin-top: 18px;
  padding-top: 9px;
  border-top: 1px solid #315c60;
  color: #77d8c7;
  font: 500 9px "IBM Plex Mono", monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.output-flow-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
}
.output-flow {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 6px;
  align-items: stretch;
  justify-content: initial;
  counter-reset: output-step;
}
.flow-node {
  position: relative;
  min-height: 92px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 12px;
  border: 1px solid #3d7072;
  border-top: 2px solid var(--fresh-mint);
  background: #173b40;
  color: #e8f4f0;
  text-align: left;
  font: 600 11px/1.35 Manrope, sans-serif;
  counter-increment: output-step;
}
.flow-node::before {
  content: "0" counter(output-step);
  position: absolute;
  top: 10px;
  left: 12px;
  color: #71d9c9;
  font: 500 9px "IBM Plex Mono", monospace;
}
.flow-node:nth-child(5n) { border-top-color: #7895e7; }
.flow-arrow {
  align-self: center;
  color: #72d9c9;
  font-size: 16px;
}
.output-flow-label {
  margin-top: 12px;
  color: #739492;
  font: 500 9px "IBM Plex Mono", monospace;
  letter-spacing: .12em;
  text-align: right;
}
.output-flow-label i { color: #a4ebc9; font-style: normal; }

@media (max-width: 980px) {
  .trust-line article { min-height: 116px; }
  .system-output { grid-template-columns: 1fr; }
  .output-copy {
    padding: 0 0 20px;
    border-right: 0;
    border-bottom: 1px solid #315c60;
  }
}

@media (max-width: 640px) {
  .trust-line { grid-template-columns: 1fr; }
  .trust-line article { min-height: 0; gap: 4px; }
  .output-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .flow-arrow { display: none; }
  .flow-node { min-height: 78px; }
  .output-flow-label { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  .trust-line article,
  .flow-node { transition: none; }
}