/* Gate + Nurture — erbt Farben und Schriften aus der CI des jeweiligen Bausteins,
   damit die Schicht nicht wie ein Fremdkörper wirkt. Nur Variablen, keine Hex-Werte. */

#dbw-gate-huelle { animation: dbw-auf .32s ease both; }
@keyframes dbw-auf { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }

.dbw-gate {
  max-width: 560px; margin: 8vh auto; padding: 32px 30px 26px;
  background: var(--bl-ink, #141413); color: var(--bl-paper, #F5F2EA);
  border-radius: 16px; border-top: 3px solid var(--bl-accent, #D97757);
  box-shadow: 0 24px 70px rgba(0,0,0,.30);
}
.dbw-gate-eyebrow {
  font-family: "Space Mono", ui-monospace, monospace; font-size: 11px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase; color: var(--bl-accent-2, #E8A98E);
}
.dbw-gate h2 { margin: 10px 0 8px; font-size: 25px; line-height: 1.22; }
.dbw-gate-sub { margin: 0 0 22px; opacity: .84; font-size: 14.5px; line-height: 1.55; }

.dbw-gate-form { display: flex; flex-direction: column; gap: 13px; }
.dbw-gate-form label { display: flex; flex-direction: column; gap: 5px; font-size: 13px; font-weight: 600; }
.dbw-gate-form input, .dbw-gate-form select {
  font: inherit; font-weight: 400; padding: 11px 13px; border-radius: 9px;
  border: 1px solid rgba(255,255,255,.20); background: rgba(255,255,255,.06);
  color: inherit;
}
.dbw-gate-form input:focus, .dbw-gate-form select:focus {
  outline: none; border-color: var(--bl-accent, #D97757);
}
.dbw-gate-form select option { color: #141413; }
.dbw-gate-form .dbw-freiwillig span {
  font-weight: 400; opacity: .55; font-size: 11.5px; text-transform: none; letter-spacing: 0;
}
.dbw-gate-form small { font-weight: 400; opacity: .58; font-size: 11.5px; line-height: 1.45; }
.dbw-gate-form button { margin-top: 6px; }

.dbw-gate-note { margin-top: 4px; font-size: 11.5px; opacity: .6; line-height: 1.5; }
.dbw-gate-note a { color: var(--bl-accent-2, #E8A98E); }
.dbw-gate-note.dbw-fehler  { opacity: 1; color: #FFB4A2; }
.dbw-gate-note.dbw-hinweis { opacity: 1; }
.dbw-link {
  background: none; border: none; padding: 0; font: inherit; cursor: pointer;
  color: var(--bl-accent-2, #E8A98E); text-decoration: underline;
}

/* Nurture 2 · der O-Ton-Spiegel */
.dbw-oton {
  position: fixed; left: 16px; bottom: 16px; z-index: 9998; max-width: 380px;
  padding: 16px 18px; border-radius: 13px;
  background: var(--bl-ink, #141413); color: var(--bl-paper, #F5F2EA);
  border-left: 3px solid var(--bl-accent, #D97757);
  box-shadow: 0 16px 44px rgba(0,0,0,.28);
  animation: dbw-rein .45s ease both;
}
@keyframes dbw-rein { from { opacity: 0; transform: translateX(-14px); } to { opacity: 1; transform: none; } }
.dbw-oton.dbw-weg { animation: dbw-raus .5s ease both; }
@keyframes dbw-raus { to { opacity: 0; transform: translateX(-14px); } }
.dbw-oton-text {
  font-family: "Newsreader", Georgia, serif; font-style: italic;
  font-size: 15.5px; line-height: 1.45;
}
.dbw-oton-q  { margin-top: 7px; font-size: 11.5px; opacity: .62; }
.dbw-oton-note {
  margin-top: 11px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,.13);
  font-size: 12px; opacity: .78; line-height: 1.5;
}

@media (max-width: 620px) {
  .dbw-gate { margin: 4vh 12px; padding: 26px 20px 22px; }
  .dbw-gate h2 { font-size: 21px; }
  .dbw-oton { left: 12px; right: 12px; max-width: none; }
}

/* Ehrlichkeit vor dem Start — Gate A darf niemanden ueberraschen. */
.dbw-vorab{
  margin:0 0 18px;padding:13px 16px;border-radius:11px;
  background:#FFF8F5;border-left:3px solid var(--bl-accent,#D97757);
  font-size:13.5px;line-height:1.55;max-width:60ch;
}
.dbw-vorab b{color:var(--bl-accent-deep,#B45C3C)}