/* ===========================================================================
   Aufbau: WERKBANK
   Breites dunkles Kopfband mit Reitern, riesige Kennzahlen, Positionen als
   reine Zeilen ohne Kartenrahmen. Wirkt gedruckt statt gebaut.
   Wofür: Ein Hauptbereich mit wenigen Ansichten – Auftragslisten, Tagesplan.
   Nach basis.css einbinden.  HTML-Gerüst: references/aufbauten.md
   ========================================================================= */
:root { --luft: 16px; }

body.a-werkbank { background: var(--flaeche2); }

.werkbank__band { background: var(--dunkel); color: var(--dunkel-text); padding: 24px 30px 0; }
.werkbank__band .zeile {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 20px; flex-wrap: wrap;
}
.werkbank__band h1 {
  margin: 0 0 4px; font-size: 1.9rem; font-weight: 800; letter-spacing: -.03em;
}
.werkbank__band p { margin: 0 0 18px; color: var(--dunkel-schwach); font-size: .87rem; }

.werkbank__reiter { display: flex; gap: 22px; overflow-x: auto; }
.werkbank__reiter a {
  color: var(--dunkel-schwach); text-decoration: none; font-size: .9rem;
  padding-bottom: 11px; border-bottom: 3px solid transparent; white-space: nowrap;
}
.werkbank__reiter a[aria-current="page"] {
  color: var(--dunkel-text); border-bottom-color: var(--akzent); font-weight: 650;
}

.werkbank__zahlen {
  display: grid; grid-template-columns: repeat(3, 1fr);
  background: var(--flaeche); border-bottom: 2px solid var(--dunkel);
}
.werkbank__zahlen > div { padding: 22px 30px; border-right: 1px solid var(--rand); }
.werkbank__zahlen > div:last-child { border-right: 0; }
.werkbank__zahlen small {
  display: block; font-size: .68rem; text-transform: uppercase;
  letter-spacing: .1em; color: var(--schwach); margin-bottom: 6px;
}
.werkbank__zahlen b {
  font-size: 2.6rem; font-weight: 800; line-height: 1; letter-spacing: -.035em;
  font-family: var(--schrift-titel); font-variant-numeric: tabular-nums;
}
.werkbank__zahlen b.akzent { color: var(--akzent); }

.werkbank__block { padding: 22px 30px; }
.werkbank__block h2 {
  margin: 0 0 12px; font-size: .78rem; text-transform: uppercase;
  letter-spacing: .1em; color: var(--schwach); font-weight: 600;
}

/* Positionen statt Karten */
.posten {
  display: grid; grid-template-columns: 66px 1fr auto auto;
  gap: 16px; align-items: center;
  padding: 13px 0; border-top: 1px solid var(--rand);
}
.posten:last-child { border-bottom: 1px solid var(--rand); }
.posten__nr     { color: var(--schwach); font-size: .87rem; font-variant-numeric: tabular-nums; }
.posten__was    { font-weight: 600; min-width: 0; }
.posten__was span { display: block; font-weight: 400; color: var(--schwach); font-size: .85rem; }
.posten__betrag { font-weight: 650; font-variant-numeric: tabular-nums; }
.posten__status { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--schwach); }
.posten__status--offen { color: var(--akzent); font-weight: 700; }

@media (max-width: 640px) {
  .werkbank__band { padding: 18px 16px 0; }
  .werkbank__band h1 { font-size: 1.5rem; }
  .werkbank__zahlen { grid-template-columns: 1fr; }
  .werkbank__zahlen > div { border-right: 0; border-bottom: 1px solid var(--rand); padding: 15px 16px; }
  .werkbank__zahlen b { font-size: 2rem; }
  .werkbank__block { padding: 16px; padding-bottom: 70px; }
  .posten { grid-template-columns: 1fr auto; gap: 4px 12px; }
  .posten__nr { grid-column: 1 / -1; }
  .posten__status { grid-column: 1 / -1; }
}