/* Gemeinsame Basis für alle Seiten. Seiten-eigene Styles stehen in der jeweiligen Seite. */
html, body { margin: 0; padding: 0; overflow-x: clip; }
body { -webkit-font-smoothing: antialiased; }
img, video { max-width: 100%; }

/* ---------- Klaro im Branding ---------- */
.klaro {
  --green1: #7B50D4; --green2: #5C37AC; --green3: #E8E0F7;
  --blue1: #9B78E0; --blue2: #7B50D4;
  --dark1: #373233; --dark2: #5A5456; --dark3: #8A8480;
  --light1: #FFFFFF; --light2: #F3F0FC; --light3: #E8E0F7;
  --white1: #FFFFFF; --white2: #F3F0FC; --white3: #EDE7FA;
  --button-text-color: #fff;
  --border-radius: 14px;
  --font-family: 'DM Sans', system-ui, sans-serif;
  --title-font-family: 'Outfit', system-ui, sans-serif;
  --font-size: 14px;
  --box-shadow-color: rgba(92, 55, 172, .22);
  --notice-max-width: 420px;
}
.klaro .cookie-notice, .klaro .cookie-modal { z-index: 2147483646 !important; }
.klaro .cookie-notice:not(.cookie-modal-notice) { border: 1px solid #C4AFEC !important; }
.klaro .cookie-notice .cn-body p, .klaro .cookie-modal p { line-height: 1.6; }
.klaro .cm-btn { font-family: 'Outfit', system-ui, sans-serif; font-weight: 700; border-radius: 9px !important; padding: 8px 14px !important; }
.klaro .cm-btn.cm-btn-success { background: #7B50D4 !important; }
.klaro .cm-btn.cm-btn-danger, .klaro .cm-btn.cn-decline { background: #EDE7FA !important; color: #373233 !important; }
.klaro a { color: #7B50D4 !important; }
.klaro .cm-powered-by { display: none !important; }

/* ---------- Gemeinsamer Fuß (nur auf Seiten ohne eigenen Fuß) ---------- */
.jd-footer { background: #373233; color: rgba(255,255,255,.75); text-align: center; padding: 28px 16px; font-family: 'Outfit', system-ui, sans-serif; font-size: 14px; }
.jd-footer a { color: rgba(255,255,255,.75); text-decoration: none; margin: 0 10px; display: inline-block; padding: 4px 0; }
.jd-footer a:hover { color: #fff; }
.jd-footer .jd-footer-name { display: block; color: #fff; font-weight: 700; margin-bottom: 8px; }

/* ---------- Formulare (ersetzen die allone-Formulare) ---------- */
.jd-form { display: grid; gap: 14px; text-align: left; font-family: 'DM Sans', system-ui, sans-serif; color: #373233; background: #fff; border-radius: 14px; padding: 24px; box-sizing: border-box; width: 100%; }
.jd-form * { box-sizing: border-box; }
.jd-form .jd-field { display: grid; gap: 6px; font-size: 14px; font-weight: 500; }
.jd-form .jd-field span { font-family: 'Outfit', system-ui, sans-serif; font-weight: 700; font-size: 13.5px; }
.jd-form input[type="text"], .jd-form input[type="email"] {
  width: 100%; font: inherit; font-size: 16px; padding: 12px 14px; border: 1.5px solid #E8E0F7; border-radius: 9px; background: #fff; color: #373233;
}
.jd-form input:focus { outline: none; border-color: #7B50D4; box-shadow: 0 0 0 3px rgba(123,80,212,.15); }
.jd-form .jd-check { display: flex; gap: 10px; align-items: flex-start; font-size: 13.5px; line-height: 1.55; color: #5A5456; cursor: pointer; }
.jd-form .jd-check input { margin-top: 3px; width: 18px; height: 18px; flex: none; accent-color: #7B50D4; }
.jd-form .jd-check a { color: #7B50D4; }
.jd-form .jd-btn { font-family: 'Outfit', system-ui, sans-serif; font-weight: 800; font-size: 16px; border: 0; border-radius: 9px; padding: 14px 20px; background: #7B50D4; color: #fff; cursor: pointer; width: 100%; }
.jd-form .jd-btn:hover { background: #5C37AC; }
.jd-form .jd-btn[disabled] { opacity: .6; cursor: wait; }
.jd-form .jd-form-msg { margin: 0; font-size: 14px; color: #5C37AC; }
.jd-form .jd-form-msg.is-error { color: #B42318; }
.jd-form .jd-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.jd-form .jd-form-h { margin: 0; font-size: 22px; }
.jd-form .jd-form-sub { margin: -6px 0 4px; font-size: 14px; color: #5A5456; }
.jd-form.is-done { text-align: center; }
.jd-success-box h3 { margin: 6px 0 10px; }
/* Brauerei-Seite hat eigenen Look */
.jd-form--brauerei { font-family: 'Poppins', system-ui, sans-serif; padding: 22px 18px 26px; }
.jd-form--brauerei .jd-form-h, .jd-form--brauerei .jd-success-box h3 { font-family: 'Big Shoulders Display', 'Arial Narrow', sans-serif; font-weight: 900; text-transform: uppercase; font-size: 30px; }
.jd-form--brauerei .jd-field span { font-family: 'Poppins', system-ui, sans-serif; font-weight: 600; }
.jd-form--brauerei input[type="text"], .jd-form--brauerei input[type="email"] { border-color: #E3D3B6; }
.jd-form--brauerei input:focus { border-color: #D96548; box-shadow: 0 0 0 3px rgba(217,101,72,.18); }
.jd-form--brauerei .jd-check input { accent-color: #D96548; }
.jd-form--brauerei .jd-check a { color: #A6412A; }
.jd-form--brauerei .jd-btn { font-family: 'Poppins', system-ui, sans-serif; font-weight: 700; background: #101828; }
.jd-form--brauerei .jd-btn:hover { background: #2B2A28; }

/* ---------- Gelbe Hinweise in den Rechtstexten ---------- */
.jd-anpassen { background: #FFF6BF; border: 2px solid #E6B800; border-radius: 10px; padding: 12px 14px; margin: 14px 0; }
.jd-anpassen-row td { background: #FFF6BF !important; }
.jd-anpassen-li { background: #FFF6BF; border: 2px solid #E6B800; border-radius: 8px; padding: 8px 10px 8px 26px !important; }
.jd-anpassen-label { display: block; font-family: 'Outfit', system-ui, sans-serif; font-weight: 800; font-size: 13px; color: #7A5B00; margin-bottom: 6px; letter-spacing: .01em; }

/* Platzhalter für Videos, die noch zu Bunny müssen (ohne src) */
video[data-bunny-src]:not([src]) { background: #E8E0F7; }

/* Klaro hell: weiße Karte auf Flieder-Rand */
.klaro .cookie-notice:not(.cookie-modal-notice), .klaro .cookie-modal .cm-modal.cm-klaro {
  background: #fff !important; color: #373233 !important; box-shadow: 0 14px 40px rgba(92,55,172,.22) !important;
}
.klaro .cookie-notice:not(.cookie-modal-notice) .cn-body p, .klaro .cookie-modal .cm-modal p,
.klaro .cookie-modal .cm-modal .cm-header h1, .klaro .cookie-modal .cm-list-title, .klaro .cookie-modal .cm-list-description,
.klaro .cookie-modal .cm-purpose .cm-list-label, .klaro .cookie-modal label { color: #373233 !important; }
.klaro .cookie-modal .cm-modal .cm-header, .klaro .cookie-modal .cm-modal .cm-footer { border-color: #E8E0F7 !important; }
.klaro .cookie-notice .cn-learn-more { color: #7B50D4 !important; font-weight: 700; }