/* =========================================================
   submetr Bewerbungsformular
   Corporate Design [AA], Version 8
   Alle Regeln sind unter .subm-bw gekapselt, damit sie das
   Theme nicht beeinflussen.
   ========================================================= */

.subm-bw {
  --subm-orange: #f77f00;
  --subm-blue: #003566;
  --subm-orange-light: #ff9500;
  --subm-text: #2c3e50;
  --subm-orange-text: #b75e00;
  --subm-gray-text: #6c797a;
  --subm-blue-50: #eaeef2;
  --subm-border: #d8e0e8;
  --subm-surface-alt: #f6f8fa;

  font-family: "Figtree", "Segoe UI", system-ui, -apple-system, sans-serif;
  color: var(--subm-text);
  line-height: 1.6;
  max-width: 760px;
}

.subm-bw *, .subm-bw *::before, .subm-bw *::after { box-sizing: border-box; }

.subm-bw__title {
  margin: 0 0 18px;
  font-size: 1.6rem;
  font-weight: 800;
  letter-spacing: -.015em;
  color: var(--subm-blue);
}

.subm-bw__accent {
  display: block;
  width: 56px;
  height: 5px;
  border-radius: 3px;
  background: var(--subm-orange);
  margin-bottom: 14px;
}

/* ---------- Meldungen ---------- */
.subm-bw__alert {
  border: 1px solid #e3c4c4;
  background: #fdf3f3;
  color: #8a2b2b;
  border-radius: 8px;
  padding: 14px 18px;
  margin: 0 0 22px;
  font-size: .95rem;
}
.subm-bw__alert ul { margin: 8px 0 0; padding-left: 20px; }
.subm-bw__alert li { margin: 2px 0; }

.subm-bw__success {
  border: 1px solid var(--subm-border);
  border-left: 4px solid var(--subm-orange);
  background: #fff;
  border-radius: 14px;
  padding: 28px 30px;
}
.subm-bw__success h3 {
  margin: 0 0 8px;
  font-size: 1.3rem;
  font-weight: 800;
  color: var(--subm-blue);
}
.subm-bw__success p { margin: 0; color: var(--subm-gray-text); }

/* ---------- Formular ---------- */
.subm-bw__form { margin: 0; }

.subm-bw__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 20px;
}
.subm-bw__field { margin: 0; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.subm-bw__field--full { grid-column: 1 / -1; }

.subm-bw label {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--subm-gray-text);
}
.subm-bw__req { color: var(--subm-orange-text); }

.subm-bw input[type="text"],
.subm-bw input[type="email"],
.subm-bw input[type="tel"],
.subm-bw input[type="file"],
.subm-bw select,
.subm-bw textarea {
  width: 100%;
  font: inherit;
  font-size: 1rem;
  color: var(--subm-text);
  background: #fff;
  border: 1px solid var(--subm-border);
  border-radius: 8px;
  padding: .62rem .8rem;
}
.subm-bw textarea { resize: vertical; min-height: 120px; line-height: 1.55; }
.subm-bw input:focus,
.subm-bw select:focus,
.subm-bw textarea:focus {
  outline: 3px solid var(--subm-orange-light);
  outline-offset: 1px;
  border-color: var(--subm-blue);
}
.subm-bw input[type="file"] { padding: .5rem; background: var(--subm-surface-alt); }
.subm-bw input.subm-bw--invalid { border-color: #b0413e; }

.subm-bw__hint {
  font-size: .8rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: var(--subm-gray-text);
  line-height: 1.5;
}

/* ---------- Zustimmung ---------- */
.subm-bw__consent label {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  font-size: .95rem;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  color: var(--subm-text);
  cursor: pointer;
}
.subm-bw__consent input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
  flex: 0 0 auto;
  accent-color: var(--subm-blue);
}
.subm-bw__consent .subm-bw__hint { display: block; margin-top: 4px; }
.subm-bw__consent a { color: var(--subm-blue); }

/* ---------- Absenden ---------- */
.subm-bw__actions {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin: 26px 0 0;
}
.subm-bw__btn {
  font: inherit;
  font-size: 1rem;
  font-weight: 700;
  /* Blau auf Orange – weiße Schrift auf Orange erfüllt den Kontrast nicht. */
  background: var(--subm-orange);
  color: var(--subm-blue);
  border: 0;
  border-radius: 999px;
  padding: .78rem 1.6rem;
  cursor: pointer;
  transition: background .15s;
}
.subm-bw__btn:hover { background: var(--subm-orange-light); }
.subm-bw__btn:disabled { opacity: .6; cursor: default; }
.subm-bw__btn:focus-visible { outline: 3px solid var(--subm-blue); outline-offset: 2px; }

/* Honigtopf – für Menschen unsichtbar, für Bots auffindbar. */
.subm-bw__hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px; height: 1px;
  overflow: hidden;
}

@media (max-width: 600px) {
  .subm-bw__grid { grid-template-columns: 1fr; }
}
