/* Brevos Anmeldeformulare im Seitenstil, vor und nach dem Laden von Brevos
   eigenem Stil gleich. Selektoren nur über Brevos Klassen, Feldtypen und die
   Formular-IDs, die Brevos Skript selbst verlangt; nie über Reihenfolge. */
.brevo-formular h3 { font-size: var(--t-h3-gross); margin: 0 0 1rem; color: var(--red-dark); }
.brevo-formular .entwurf-hinweis { font-size: var(--t-fein); color: var(--text-soft); border-left: 2px solid var(--line-strong); padding-left: .75rem; }
.brevo-formular .form-hinweis { margin: 0 0 1.25rem; font-size: var(--t-fein); line-height: 1.6; color: var(--text-soft); }
.brevo-formular .form-status { margin: 1rem 0 0; font-size: var(--t-fein); font-weight: 600; line-height: 1.6; color: var(--text); }
.brevo-formular .sib-form-container a { color: var(--red-dark); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.brevo-formular .sib-form-container a:hover { color: var(--black); }
.no-js .brevo-formular .brevo-einbettung,
.no-js .brevo-formular [data-brevo-status] { display: none; }

/* Hülle: Brevos Kästen, Ränder und Schriften fallen weg. */
.brevo-formular .sib-form,
.brevo-formular .sib-form-container,
.brevo-formular #sib-container { display: block; width: auto; max-width: none; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--text); font: inherit; text-align: left; }
.brevo-formular #sib-form > div { margin: 0 0 1.5rem; }
.brevo-formular #sib-form > div:last-of-type { margin-bottom: 0; }
.brevo-formular #sib-form > div:has(> [data-brevo-titel]) { display: none; }
.brevo-formular #sib-form .sib-form-block { padding: 0; color: inherit; font: inherit; text-align: left; }
.brevo-formular #sib-form .sib-form-block p { margin: 0; font: inherit; line-height: 1.6; }
.brevo-formular--einwilligung-text #sib-form .sib-text-form-block { font-size: var(--t-fein); color: var(--text-soft); }
.brevo-formular #sib-form .input--hidden { display: none !important; }

/* Bezeichnung, Feld, Hinweis, Fehler */
.brevo-formular #sib-form .form__label-row { display: block; }
.brevo-formular #sib-form .entry__label { display: block; max-width: none; margin: 0 0 .5rem; padding: 0; color: var(--text); font: inherit; font-weight: 600; line-height: 1.4; }
.brevo-formular #sib-form .entry__label::after { content: none; }
.brevo-formular #sib-form .entry__label > * { float: none; }
.brevo-formular #sib-form .entry__field { display: block; max-width: none; margin: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.brevo-formular #sib-form .input { box-sizing: border-box; display: block; width: 100%; min-width: 0; height: auto; min-height: 3rem; margin: 0; padding: .75rem; border: 1px solid var(--black); border-radius: 0; background: var(--ground); color: var(--text); font: inherit; line-height: 1.4; box-shadow: none; outline: 0; }
.brevo-formular #sib-form .input:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; }
.brevo-formular #sib-form .entry_errored .input { border: 2px solid var(--red-dark); padding: calc(.75rem - 1px); }
.brevo-formular #sib-form .entry__specification { display: block; max-width: none; margin: .5rem 0 0; color: var(--text-soft); font-size: var(--t-fein); line-height: 1.6; }
.brevo-formular #sib-form .entry__error { display: none; max-width: none; margin: .6rem 0 0; padding: 0 0 0 .75rem; border: 0; border-left: 2px solid var(--red); border-radius: 0; background: none; color: var(--red-dark); font-size: var(--t-fein); font-weight: 600; line-height: 1.5; }
.brevo-formular #sib-form .form-feldmeldung { margin: .6rem 0 0; color: var(--red-dark); font-size: var(--t-fein); font-weight: 600; line-height: 1.5; }

.brevo-formular #sib-form .brevo-bot-schutz { margin: 0 0 1.5rem; }
.brevo-formular #sib-form .brevo-bot-schutz > label { display: flex; align-items: flex-start; gap: .75rem; min-height: 44px; margin: 0; padding: .625rem 0; color: var(--text); font-family: var(--font-sans); font-size: var(--t-fein); font-weight: 400; line-height: 1.6; cursor: pointer; }
.brevo-formular #sib-form .brevo-bot-schutz > label > span { min-width: 0; overflow-wrap: anywhere; }
.brevo-formular #sib-form .brevo-bot-schutz .form-feldmeldung { margin: .6rem 0 0; font-size: var(--t-fein); font-weight: 600; line-height: 1.5; }
.brevo-formular #sib-form [data-brevo-einwilligung] { -webkit-appearance: none; appearance: none; position: static; flex: none; width: 1.25rem; height: 1.25rem; margin: .15em 0 0; padding: 3px; border: 2px solid var(--black); border-radius: 0; background: var(--card); background-clip: content-box; box-shadow: none; opacity: 1; cursor: pointer; }
.brevo-formular #sib-form [data-brevo-einwilligung]:checked { background-color: var(--black); }
.brevo-formular #sib-form [data-brevo-einwilligung]:focus-visible { outline: 3px solid var(--red); outline-offset: 3px; }
.brevo-formular #sib-form [data-brevo-einwilligung][aria-invalid="true"] { border-color: var(--red-dark); }

/* Auswahl als Kachel: Rand in Tinte, eckige Marke, gewählte Kachel mit
   doppeltem Rand, getönter Fläche und gefüllter Marke. Brevos Ersatzkreis
   (.radio-button, .checkbox) bleibt aus, das echte Eingabefeld zeichnet. */
.brevo-formular #sib-form .entry__choice { width: auto; margin: 0; padding: 0; text-indent: 0; color: var(--text); font: inherit; }
.brevo-formular #sib-form .entry__choice + .entry__choice { margin-top: .5rem; }
.brevo-formular #sib-form .entry__choice > label { display: flex; align-items: center; gap: .75rem; min-height: 3rem; padding: .625rem .875rem; border: 1px solid var(--black); background: var(--card); color: var(--text); font: inherit; line-height: 1.4; cursor: pointer; }
.brevo-formular #sib-form .entry__choice .radio-button,
.brevo-formular #sib-form .entry__choice .checkbox { display: none; }
.brevo-formular #sib-form .entry__choice input[type="radio"],
.brevo-formular #sib-form .entry__choice input[type="checkbox"] { -webkit-appearance: none; appearance: none; position: static; z-index: auto; flex: none; width: 1.25rem; height: 1.25rem; margin: 0; padding: 3px; border: 2px solid var(--black); border-radius: 0; background: var(--card); background-clip: content-box; opacity: 1; cursor: pointer; }
.brevo-formular #sib-form .entry__choice input:checked { background-color: var(--black); }
@media (hover: hover) {
  .brevo-formular #sib-form .entry__choice > label:hover { background: var(--ground); }
}
.brevo-formular #sib-form .entry__choice > label:has(input:checked) { padding: calc(.625rem - 1px) calc(.875rem - 1px); border-width: 2px; background: var(--ground-deep); font-weight: 600; }
.brevo-formular #sib-form .entry_errored .entry__choice > label:not(:has(input:checked)) { border-color: var(--red-dark); }
/* "Ja, mit Newsletter" ist die hervorgehobene Wahl: rote Kante, kräftige Schrift. "Nein" bleibt klein, ohne Rahmen. */
.brevo-formular #sib-form .entry__choice > label:has(input[name="NEWSLETTER_WAHL"][value="1"]) { min-height: 3.25rem; padding: calc(.75rem - 1px) calc(.875rem - 1px); border: 2px solid var(--red); font-weight: 600; }
.brevo-formular #sib-form .entry__choice > label:has(input[name="NEWSLETTER_WAHL"][value="1"]:checked) { background: var(--ground-deep); }
.brevo-formular #sib-form .entry__choice input[name="NEWSLETTER_WAHL"][value="1"] { border-color: var(--red); }
.brevo-formular #sib-form .entry__choice input[name="NEWSLETTER_WAHL"][value="1"]:checked { background-color: var(--red); }
.brevo-formular #sib-form .entry__choice > label:has(input[name="NEWSLETTER_WAHL"][value="2"]) { min-height: 44px; border: 0; padding: .625rem .875rem; background: transparent; font-size: var(--t-karte); color: var(--text); }
@supports selector(:has(*)) {
  .brevo-formular #sib-form .entry__choice > label:has(input:focus-visible) { outline: 3px solid var(--red); outline-offset: 3px; }
  .brevo-formular #sib-form .entry__choice input:focus-visible { outline: 0; }
}

/* Absenden bleibt auch während des Ladens die sichtbare Hauptaktion. */
.brevo-formular #sib-form .sib-form-block__button { display: flex; align-items: center; justify-content: center; gap: .6rem; width: min(100%, 22rem); max-width: 100%; min-height: 3.5rem; margin: .5rem auto 0; padding: 1rem 2.25rem; border: 1px solid var(--red); border-radius: 0; background: var(--red); color: var(--white); font-family: var(--font-sans); font-size: var(--t-knopf); font-weight: 600; line-height: 1.25; text-align: center; opacity: 1; cursor: pointer; transition: background-color .2s var(--ease), border-color .2s var(--ease); }
.brevo-formular #sib-form .sib-form-block__button:hover { background: var(--red-dark); border-color: var(--red-dark); }
.brevo-formular #sib-form .sib-form-block__button[aria-busy="true"] { cursor: progress; }
.brevo-formular #sib-form .sib-form-block__button:disabled { cursor: default; }
.brevo-formular #sib-form .progress-indicator__icon { flex: none; width: 1.2rem; height: 1.2rem; margin: 0; fill: currentColor; }
.brevo-formular #sib-form .sib-hide-loader-icon { display: none; }

/* Brevos Meldungen nach dem Absenden */
.brevo-formular .sib-form-container .sib-form-message-panel { display: none; box-sizing: border-box; width: 100%; max-width: none; margin: 0 0 1.5rem; padding: 1rem 1.25rem; border: 1px solid var(--black); border-left-width: 4px; border-radius: 0; background: var(--card); color: var(--text); font: inherit; line-height: 1.5; text-align: left; }
.brevo-formular .sib-form-container .sib-form-message-panel--active { display: block; }
.brevo-formular #success-message { border-left-color: #1a7f37; }
.brevo-formular #error-message { border-left-color: var(--red); }
.brevo-formular .sib-form-message-panel .sib-form-message-panel__text { display: flex; align-items: flex-start; gap: .75rem; margin: 0; padding: 0; }
.brevo-formular .sib-form-message-panel .sib-notification__icon { flex: none; width: 1.25rem; height: 1.25rem; margin: .15em 0 0; }
.brevo-formular #success-message .sib-notification__icon { fill: #1a7f37; }
.brevo-formular #error-message .sib-notification__icon { fill: var(--red-dark); }
.brevo-formular .sib-form-message-panel__inner-text { font-weight: 600; }

@media (max-width: 700px) {
  .brevo-formular #sib-form .sib-form-block__button { width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  .brevo-formular #sib-form .progress-indicator__icon { animation: none; }
}

.werkstatt-video { position: relative; margin: 0; }
.werkstatt-video > .bildmarke { bottom: calc(var(--t-knopf) * 1.6 + 2.35rem); right: .75rem; }

.werkstatt-video > .video-vorschau[hidden] ~ .bildmarke { display: none; }