/* Baubeschreibungen (v3.5) — nur Seiteneigenes. Grundlage: /lese-seite.css und circuit-site.min.css v1.7.
   Reihenfolge im head: styles.css → lese-seite.css → diese Datei → circuit-site.min.css.
   Keine Regel für alle Links, keine eigenen Abschnittsabstände (Tokens aus circuit-site). */

/* Lange Wörter in Überschriften (z. B. „Dokumenterstellung“) sprengen sonst bei 320 px den Rahmen */
.bau-page :is(.uc-doc h2,.uc-doc h3,.uc-next h2){hyphens:auto;overflow-wrap:anywhere}

/* Datum und Feldnamen nicht trennen */
.uc-meta time,.uc-table code{white-space:nowrap}

/* Projektstand: Hinweisbox mit eigenem Reiter-Text */
.uc-doc .x-note.bau-stand::before{content:"Projektstand"}
.uc-doc .x-note.bau-stand p:last-child{margin-bottom:0}

/* Geplanter Ablauf: sechs Stufen als Kette, Reihenfolge zeilenweise */
.bau-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:6px 0 20px;padding:0;list-style:none}
.uc-doc .bau-flow li{margin:0;padding:12px 14px;border:1px solid var(--x-line-quiet);border-radius:var(--x-radius-sm,6px);background:var(--x-bg-raised);font-size:var(--x-fs-body-sm);line-height:1.4;color:var(--x-ink-bright)}
.bau-flow span{display:block;margin:0 0 4px;font:20px/1 var(--x-font-display,monospace);letter-spacing:.06em;color:var(--x-blue-light)}

/* How-to: Schrittnummer wie .uc-steps */
.uc-doc h3.bau-step{display:flex;align-items:baseline;gap:12px}
.bau-step-n{flex:none;display:inline-grid;place-items:center;width:28px;height:28px;border:1px solid var(--x-cyan-doc);border-radius:50%;font:18px/1 var(--x-font-display,monospace);color:var(--x-cyan-doc);transform:translateY(-2px)}

/* Kontaktformular im Kasten „Nächster Schritt“: ein Feld, ein Knopf */
#kontakt{scroll-margin-top:90px}
.bau-form{margin:0}
.bau-form label{display:block;margin:0 0 6px;font-size:var(--x-fs-ui);color:var(--x-ink-soft)}
.bau-form-row{display:flex;flex-wrap:wrap;gap:12px;align-items:stretch}
.bau-form input[type=email]{box-sizing:border-box;flex:1 1 260px;min-width:0;min-height:46px;padding:10px 12px;border:1px solid var(--x-line-strong);border-radius:var(--x-radius-sm,6px);background:var(--x-bg-sunken);color:var(--x-ink-bright);font:var(--x-fs-body)/1.4 var(--x-font-ui)}
.bau-form input[type=email][aria-invalid=true]{border-color:var(--x-sig-stop)}
.bau-form input[type=email]:read-only{opacity:.75}
.bau-form .x-btn{min-height:46px;margin:0;cursor:pointer}
.bau-form .x-btn:disabled{cursor:default;opacity:.65}
.bau-form :is(input,button):focus-visible{outline:2px solid var(--x-blue-light);outline-offset:2px}
.bau-form .bau-honey{display:none!important}
.uc-next .bau-small{margin:12px 0 0;font-size:var(--x-fs-ui);color:var(--x-ink-muted)}
.uc-next .bau-small a{color:var(--x-cyan-doc)}
.uc-next .bau-status{margin:14px 0 0;padding:10px 14px;border:1px solid var(--x-line-quiet);border-left:3px solid var(--x-cyan-doc);border-radius:var(--x-radius-sm,6px);background:var(--x-bg-raised);font-size:var(--x-fs-body-sm);color:var(--x-ink-bright)}
.uc-next .bau-status:empty{display:none}
.bau-form[data-state=success] .bau-status{border-left-color:var(--x-sig-go)}
.bau-form[data-state=error] .bau-status{border-left-color:var(--x-sig-stop)}

@media (max-width:700px){.bau-flow{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:600px){
  .bau-form-row{flex-direction:column}
  .bau-form input[type=email],.bau-form .x-btn{flex:none;width:100%}
}
@media (max-width:520px){
  .bau-flow{grid-template-columns:minmax(0,1fr);gap:8px}
  .uc-doc .bau-flow li{display:flex;align-items:baseline;gap:12px;padding:10px 14px}
  .bau-flow span{margin:0}
}
@media print{
  .bau-flow li{background:#fff!important;border-color:#bbb!important}
}
