/* ================================================================
   C.A. Picard — Karriere: Stellenangebote (Row-per-Stelle + Accordion)
   Header-Module (Bild + Tags + Headline + Titel + Meta) immer sichtbar
   Detail-Module (mit .picard-stelle-detail) collapsible via .is-expanded
   ================================================================ */

.picard-stellen-section {
    font-family: Roboto, sans-serif;
}

.picard-stellen-app {
    color: #333;
    margin-bottom: 32px;
}

/* --- Filter Bar -------------------------------------------------- */

.picard-filter-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 24px 40px;
    padding: 24px 28px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .03);
    margin-bottom: 16px;
}

.picard-filter-group {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.picard-filter-label {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #6b7280;
    padding-right: 4px;
}

.picard-chip-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.picard-chip {
    font-family: Roboto, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    color: #374151;
    background: #f3f4f6;
    border: 1px solid transparent;
    border-radius: 999px;
    padding: 10px 18px;
    cursor: pointer;
    transition: all .18s ease;
    white-space: nowrap;
}

.picard-chip:hover {
    background: #e5e7eb;
    color: #111827;
}

.picard-chip.is-active {
    background: #C6041F;
    color: #fff;
    border-color: #C6041F;
    box-shadow: 0 2px 6px rgba(198, 4, 31, .25);
}

.picard-chip.is-active:hover {
    background: #a80319;
    border-color: #a80319;
}

.picard-filter-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 4px 0;
    font-size: 14px;
    color: #6b7280;
}

.picard-count strong {
    color: #111827;
    font-size: 18px;
    font-weight: 700;
    margin-right: 4px;
}

.picard-reset {
    background: none;
    border: none;
    color: #C6041F;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    text-decoration: underline;
    text-underline-offset: 3px;
    padding: 4px 8px;
}

/* --- Stelle-Row als clickable Card ------------------------------ */

.picard-stellen-section .et_pb_row.picard-stelle {
    position: relative;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .05), 0 1px 3px rgba(0, 0, 0, .03);
    transition: all .3s cubic-bezier(.4, 0, .2, 1);
    padding: 28px 32px !important;
    border-radius: 14px !important;
    overflow: hidden;
}

.picard-stellen-section .et_pb_row.picard-stelle:hover {
    box-shadow: 0 12px 32px rgba(0, 0, 0, .08), 0 4px 8px rgba(0, 0, 0, .04);
    transform: translateY(-4px);
}

.picard-stellen-section .et_pb_row.picard-stelle.is-expanded {
    padding: 36px 32px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .06), 0 2px 6px rgba(0, 0, 0, .04);
}

.picard-stellen-section .et_pb_row.picard-stelle.is-hidden {
    display: none !important;
}

/* Plus/Minus Chevron-Icon oben rechts — affordant (Picard-rot) */
.picard-stellen-section .et_pb_row.picard-stelle::before {
    content: "";
    position: absolute;
    top: 28px;
    right: 28px;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #fef2f2;
    border: 2px solid #fecaca;
    transition: all .2s ease;
    z-index: 2;
    pointer-events: none;
}

/* Chevron-down SVG als Icon (klappen = nach unten) */
.picard-stellen-section .et_pb_row.picard-stelle::after {
    content: "" !important;
    position: absolute;
    top: 31px !important;
    right: 30px !important;
    bottom: auto !important;
    left: auto !important;
    width: 38px !important;
    height: 38px !important;
    display: block !important;
    visibility: visible !important;
    clear: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C6041F' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px 20px;
    transition: all .2s ease;
    z-index: 3;
    pointer-events: none;
}

/* Hover auf Card → Icon weiß auf rot */
.picard-stellen-section .et_pb_row.picard-stelle:hover::before {
    background: #C6041F;
    border-color: #C6041F;
    transform: scale(1.08);
    box-shadow: 0 4px 10px rgba(198, 4, 31, .25);
}

.picard-stellen-section .et_pb_row.picard-stelle:hover::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    transform: scale(1.08);
}

/* Aufgeklappt → Chevron UP, rot + weiß */
.picard-stellen-section .et_pb_row.picard-stelle.is-expanded::before {
    background: #C6041F;
    border-color: #C6041F;
}

.picard-stellen-section .et_pb_row.picard-stelle.is-expanded::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FFFFFF' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='18 15 12 9 6 15'/%3E%3C/svg%3E");
}

/* Image Column (1/3) */
.picard-stellen-section .picard-stelle-col-img {
    display: flex !important;
    align-items: flex-start;
}

.picard-stellen-section .picard-stelle__image img {
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: 8px;
}

.picard-stellen-section .et_pb_row.picard-stelle.is-expanded .picard-stelle__image img {
    aspect-ratio: 16 / 10;
}

/* Text Column (2/3) */
.picard-stellen-section .picard-stelle-col-text {
    padding-right: 56px; /* Platz fürs Plus-Icon */
}

/* Tags Host (Divi Text-Modul) + JS-generated Tags inside */
.picard-stellen-section .picard-stelle__tags-host {
    margin: 0 0 12px !important;
}

.picard-stellen-section .picard-stelle__tags-host .et_pb_text_inner {
    /* Leere Tags-Host (ohne JS-Tags) soll keinen Platz nehmen */
    min-height: 0;
}

/* Tags (per JS in die Tags-Host injiziert) */
.picard-stelle__tags {
    display: flex;
    gap: 6px;
}

.picard-tag {
    display: inline-flex;
    align-items: center;
    height: 22px;
    padding: 0 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    border-radius: 4px;
    background: #f3f4f6;
    color: #374151;
    line-height: 22px;
}

.picard-tag--typ-fachkraft {
    background: #fef2f2;
    color: #C6041F;
}

.picard-tag--typ-ausbildung {
    background: #ecfdf5;
    color: #047857;
}

.picard-tag--ort {
    background: #f3f4f6;
    color: #374151;
}

/* --- Detail-Module: Collapsed/Expanded Animation ---------------- */

.picard-stellen-section .et_pb_row.picard-stelle .picard-stelle-detail {
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    margin: 0 !important;
    transition: max-height .45s ease, opacity .25s ease, margin .3s ease;
    pointer-events: none;
}

/* Padding-Reset nur für Text-Module (Buttons brauchen ihr eigenes Padding) */
.picard-stellen-section .et_pb_row.picard-stelle .picard-stelle-detail:not(.et_pb_button) {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.picard-stellen-section .et_pb_row.picard-stelle.is-expanded .picard-stelle-detail {
    max-height: 2000px;
    opacity: 1;
    pointer-events: auto;
}

/* Individual margin overrides for expanded state */
.picard-stellen-section .et_pb_row.picard-stelle.is-expanded .picard-stelle-list {
    margin-top: 8px !important;
    margin-bottom: 8px !important;
}

.picard-stellen-section .et_pb_row.picard-stelle.is-expanded .picard-apply-btn {
    margin-top: 24px !important;
    margin-bottom: 8px !important;
}

.picard-stellen-section .et_pb_row.picard-stelle.is-expanded .picard-stelle__hint {
    margin-top: 0 !important;
    margin-bottom: 4px !important;
}

/* Bullet-Listen */
.picard-stellen-section .picard-stelle-list h3 {
    font-family: Roboto, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
    color: #C6041F !important;
    margin: 16px 0 10px !important;
    padding: 0 !important;
}

.picard-stellen-section .picard-stelle-list ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.picard-stellen-section .picard-stelle-list ul li {
    position: relative;
    padding-left: 22px !important;
    padding-bottom: 8px;
    font-size: 15px !important;
    line-height: 1.55 !important;
    color: #374151 !important;
    list-style: none !important;
    background: none !important;
}

.picard-stellen-section .picard-stelle-list ul li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    width: 6px;
    height: 6px;
    background: #C6041F;
    border-radius: 50%;
}

.picard-stellen-section .picard-stelle-list ul li::marker {
    content: "" !important;
    color: transparent !important;
}

.picard-stellen-section .picard-stelle-list--two ul {
    column-count: 2;
    column-gap: 32px;
}

.picard-stellen-section .picard-stelle-list--two ul li {
    break-inside: avoid;
}

/* --- Apply-Button (Picard-Standard: padding 0.3em 1em, radius 3px, 16px font) --- */
/* Wichtig: .picard-stelle__apply ist direkt am <a>, nicht Wrapper */

.picard-stellen-section .et_pb_button.picard-stelle__apply {
    padding: 5px 16px !important;
    font-family: Roboto, sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.7em !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    border-radius: 3px !important;
    transition: all .2s ease !important;
}

.picard-stellen-section .et_pb_button.picard-stelle__apply:hover {
    background: #a80319 !important;
    border-color: #a80319 !important;
    padding: 5px 16px !important; /* gegen Divi-Hover-Padding-Shift */
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(198, 4, 31, .25);
}

/* --- Empty State ------------------------------------------------- */

/* Empty-State (toggled by JS via style.display — see functions.php) */
#picard-stellen-empty {
    display: none;
}
#picard-stellen-empty.is-empty {
    display: block;
    text-align: center;
    padding: 60px 28px;
    background: #fff;
    border: 1px dashed #d1d5db;
    border-radius: 12px;
    color: #6b7280;
    max-width: 560px !important;
    margin: 40px auto !important;
}
/* Search-icon pseudo (replaces inline SVG) */
#picard-stellen-empty::before {
    content: "";
    display: block;
    width: 48px;
    height: 48px;
    margin: 0 auto 16px;
    background: #9ca3af;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E") center/contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.35-4.35'/%3E%3C/svg%3E") center/contain no-repeat;
}
#picard-stellen-empty .picard-stellen-empty-h4 { margin: 0 !important; }
#picard-stellen-empty .picard-stellen-empty-h4 h4 {
    font-family: Roboto, sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #111827 !important;
    margin: 0 0 8px 0 !important;
    text-align: center;
}
#picard-stellen-empty .picard-stellen-empty-p { margin: 0 !important; }
#picard-stellen-empty .picard-stellen-empty-p p {
    margin: 0 0 20px 0 !important;
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: #6b7280;
    text-align: center;
}
/* CTA button (white-on-red, similar pattern to initiativ-b-btn) */
#picard-stellen-empty .picard-stellen-empty-btn { text-align: center !important; }
#picard-stellen-empty a.picard-stellen-empty-btn,
#picard-stellen-empty .picard-stellen-empty-btn .et_pb_button {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    font: 600 15px/1 Roboto, sans-serif !important;
    padding: 13px 26px !important;
    border-radius: 6px !important;
    background: #C6041F !important;
    color: #fff !important;
    border: 2px solid #C6041F !important;
    text-decoration: none !important;
    transition: all .18s ease !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
}
#picard-stellen-empty a.picard-stellen-empty-btn::before,
#picard-stellen-empty a.picard-stellen-empty-btn:hover::before,
#picard-stellen-empty .picard-stellen-empty-btn .et_pb_button::before,
#picard-stellen-empty .picard-stellen-empty-btn .et_pb_button:hover::before {
    display: none !important; content: none !important;
}
/* Arrow ::after */
#picard-stellen-empty a.picard-stellen-empty-btn::after,
#picard-stellen-empty .picard-stellen-empty-btn .et_pb_button::after {
    content: "→" !important;
    display: inline-block !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    margin-left: 6px !important;
    color: #fff !important;
    font-size: 16px !important;
    line-height: 1 !important;
    opacity: 1 !important;
    transition: transform .18s ease !important;
}
#picard-stellen-empty a.picard-stellen-empty-btn:hover,
#picard-stellen-empty .picard-stellen-empty-btn .et_pb_button:hover {
    background: #a80319 !important;
    border-color: #a80319 !important;
    padding: 13px 26px !important;
}
#picard-stellen-empty a.picard-stellen-empty-btn:hover::after,
#picard-stellen-empty .picard-stellen-empty-btn .et_pb_button:hover::after {
    transform: translateX(3px);
}

/* --- Plain Text-Links (Initiativbewerbung, Empty-State) ---------- */

.picard-apply-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-family: Roboto, sans-serif;
    font-size: 15px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none !important;
    padding: 13px 26px;
    border-radius: 6px;
    background: #C6041F;
    color: #fff !important;
    border: 2px solid #C6041F;
    transition: all .18s ease;
}

.picard-apply-link:hover {
    background: #a80319;
    border-color: #a80319;
}

.picard-apply-link--outline {
    background: transparent;
    color: #C6041F !important;
}

.picard-apply-link--outline:hover {
    background: #C6041F;
    color: #fff !important;
}

/* --- Initiativbewerbung Banner (Full-width Rot) ------------------ */

.picard-initiativ-section {
    position: relative;
    overflow: hidden;
}

/* Subtle diagonale Pattern im Background für Textur */
.picard-initiativ-section::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(135deg, rgba(255,255,255,.04) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.04) 50%, rgba(255,255,255,.04) 75%, transparent 75%, transparent);
    background-size: 40px 40px;
    pointer-events: none;
    z-index: 0;
}

.picard-initiativ {
    position: relative;
    z-index: 1;
    text-align: center;
    color: #fff;
}

.picard-initiativ__icon {
    color: #fff;
    margin: 0 auto 24px;
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: .9;
}

.picard-initiativ__icon svg {
    width: 100%;
    height: 100%;
}

.picard-initiativ__title {
    font-family: Roboto, sans-serif !important;
    font-size: 36px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    color: #fff !important;
    margin: 0 0 16px !important;
}

.picard-initiativ__lead {
    font-size: 17px !important;
    line-height: 1.6 !important;
    color: rgba(255, 255, 255, .92) !important;
    margin: 0 auto 32px !important;
    max-width: 560px;
}

.picard-initiativ__btn {
    display: inline-block;
    font-family: Roboto, sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.7em;
    padding: 5px 24px;
    background: #fff;
    color: #C6041F !important;
    border: 2px solid #fff;
    border-radius: 3px;
    text-decoration: none !important;
    transition: all .2s ease;
}

.picard-initiativ__btn:hover {
    background: transparent;
    color: #fff !important;
    border-color: #fff;
    transform: translateY(-1px);
}

@media (max-width: 780px) {
    .picard-initiativ__title {
        font-size: 28px !important;
    }
    .picard-initiativ__lead {
        font-size: 16px !important;
    }
}

/* --- Responsive -------------------------------------------------- */

@media (max-width: 980px) {
    .picard-stellen-section .et_pb_row.picard-stelle {
        padding: 20px !important;
    }
    .picard-stellen-section .et_pb_row.picard-stelle.is-expanded {
        padding: 24px !important;
    }
    .picard-stellen-section .picard-stelle-col-text {
        padding-left: 0;
        padding-right: 48px;
    }
    .picard-stellen-section .picard-stelle-list--two ul {
        column-count: 1;
    }
}

@media (max-width: 780px) {
    .picard-filter-bar {
        gap: 20px;
        padding: 20px;
    }
    .picard-filter-group {
        width: 100%;
    }
    .picard-initiativ {
        padding: 24px;
    }
    .picard-stellen-section .et_pb_row.picard-stelle::before {
        top: 20px; right: 20px;
    }
    .picard-stellen-section .et_pb_row.picard-stelle::after {
        top: 31px; right: 31px;
    }
}

/* ==================================================================
   INITIATIVBEWERBUNG — Asymmetric Human-Split
   50/50 grid: red content left, team photo with duotone right
   ================================================================== */

.picard-initiativ-b {
    overflow: hidden !important;
    padding: 0 !important;
    position: relative;
}
.picard-initiativ-b > .et_pb_row {
    width: 100% !important;
    max-width: 1400px !important;
    padding: 0 !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: 1.05fr .95fr;
    min-height: 520px;
    position: relative;
}

/* Left content column */
.picard-initiativ-b .picard-initiativ-b-content {
    padding: 80px 60px !important;
    width: 100% !important;
    margin: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center;
    color: #fff;
    position: relative;
    z-index: 2;
}
.picard-initiativ-b-content > .et_pb_module { margin: 0 !important; }

/* Eyebrow with hairline */
.picard-initiativ-b .picard-initiativ-b-eyebrow p {
    margin: 0 0 22px 0;
    font: 700 13px/1 "Roboto", sans-serif !important;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: rgba(255, 255, 255, .9);
    display: inline-flex;
    align-items: center;
    gap: 14px;
}
.picard-initiativ-b .picard-initiativ-b-eyebrow p::before {
    content: "";
    width: 40px;
    height: 2px;
    background: #fff;
    flex-shrink: 0;
}

/* H2 */
.picard-initiativ-b .picard-initiativ-b-h2 h2 {
    font-family: "Roboto", sans-serif !important;
    font-size: 44px !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    color: #fff !important;
    margin: 0 0 22px 0 !important;
    letter-spacing: -1px;
    max-width: 500px;
}

/* Lead */
.picard-initiativ-b .picard-initiativ-b-lead p {
    font-family: "Roboto", sans-serif !important;
    font-size: 17px !important;
    line-height: 1.65 !important;
    color: rgba(255, 255, 255, .92) !important;
    margin: 0 0 36px 0 !important;
    max-width: 460px;
}

/* CTA Button — INVERSE Picard-Pattern (weiß auf rotem BG, rote Schrift, kein Hover-Change)
   FIX 2026-04-29: Selektor war .picard-initiativ-b-btn .et_pb_button (nested),
   aber im DOM sind beide Klassen am gleichen <a>. Korrekter Selektor: a.picard-initiativ-b-btn */
.picard-initiativ-b a.picard-initiativ-b-btn,
.picard-initiativ-b a.picard-initiativ-b-btn:visited {
    background-color: #ffffff !important;
    color: #C6041F !important;
    border: 0 !important;
    padding: 0.3em 1em !important;
    font: 600 16px/1.7em Roboto, sans-serif !important;
    border-radius: 3px !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    transition: none !important;
    margin: 0 !important;
    box-shadow: none !important;
}
/* Disable Divi default icon (::before / ::after) */
.picard-initiativ-b a.picard-initiativ-b-btn::before,
.picard-initiativ-b a.picard-initiativ-b-btn::after,
.picard-initiativ-b a.picard-initiativ-b-btn:hover::before,
.picard-initiativ-b a.picard-initiativ-b-btn:hover::after {
    display: none !important;
    content: none !important;
}
/* Hover = base — KEIN visuelles Change (David-Requirement 2026-04-29) */
.picard-initiativ-b a.picard-initiativ-b-btn:hover {
    background-color: #ffffff !important;
    color: #C6041F !important;
    padding: 0.3em 1em !important;
    transform: none !important;
    box-shadow: none !important;
}

/* Right visual column — background image with red overlay + clip-path slant
   FIX 2026-04-29: Divi setzt et_pb_column_empty {display:none} für leere Columns —
   override mit display:block !important und min-height. */
.picard-initiativ-b .picard-initiativ-b-visual,
.picard-initiativ-b .picard-initiativ-b-visual.et_pb_column_empty {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    position: relative;
    background-image: url('/wp-content/uploads/2026/02/Teamfoto-bearbeitet.jpg');
    background-size: cover;
    background-position: center;
    clip-path: polygon(14% 0, 100% 0, 100% 100%, 0 100%);
    margin-left: -70px !important;
    min-height: 520px;
    overflow: hidden;
}
.picard-initiativ-b .picard-initiativ-b-visual::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(198, 4, 31, .78), rgba(60, 0, 10, .55));
    mix-blend-mode: multiply;
    pointer-events: none;
}
.picard-initiativ-b .picard-initiativ-b-visual::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(100deg, rgba(198, 4, 31, .35) 0%, rgba(198, 4, 31, 0) 50%);
    pointer-events: none;
}

/* Mobile */
@media (max-width: 980px) {
    .picard-initiativ-b > .et_pb_row {
        grid-template-columns: 1fr !important;
        min-height: auto;
    }
    /* include the .et_pb_column_empty variant - the base rule uses it too and
       its higher specificity kept margin-left:-70px alive on mobile */
    .picard-initiativ-b .picard-initiativ-b-visual,
    .picard-initiativ-b .picard-initiativ-b-visual.et_pb_column_empty {
        clip-path: none;
        margin-left: 0 !important;
        min-height: 260px;
        order: 2;
    }
    .picard-initiativ-b .picard-initiativ-b-content {
        padding: 60px 30px !important;
        order: 1;
    }
}
@media (max-width: 780px) {
    .picard-initiativ-b .picard-initiativ-b-h2 h2 {
        font-size: 32px !important;
    }
}
/* ==================================================================
   Fixes 2026-04-23 (zweite Iteration)
   — Apply-Button: Icon permanent weg (auch bei Hover)
   — Apply-Button: einheitliches Rot + weißer Text für alle 10 Buttons
     (Divi Inline-CSS deckt nur btn_0–3 — neue btn_4–9 brauchen Fallback)
   — Row-Spacing: 16px Abstand zwischen Stelle-Karten
     (Divi ignoriert custom_margin aus Shortcode inkonsistent)
   ================================================================== */

/* Apply-Button: Icon komplett aus */
.picard-stellen-section .et_pb_button.picard-stelle__apply::after,
.picard-stellen-section .et_pb_button.picard-stelle__apply::before,
.picard-stellen-section .et_pb_button.picard-stelle__apply:hover::after,
.picard-stellen-section .et_pb_button.picard-stelle__apply:hover::before {
    display: none !important;
    content: none !important;
    opacity: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Apply-Button: rote Base + weißer Text (Fallback für alle Buttons, unabhängig von Divi-ID) */
.picard-stellen-section .et_pb_button.picard-stelle__apply,
.picard-stellen-section .et_pb_button.picard-stelle__apply:visited {
    background-color: #C6041F !important;
    color: #ffffff !important;
    border: none !important;
}

.picard-stellen-section .et_pb_button.picard-stelle__apply:hover {
    background-color: #a80319 !important;
    color: #ffffff !important;
    border: none !important;
}

/* Row-Spacing: 16px zwischen Stelle-Karten */
.picard-stellen-section .et_pb_row.picard-stelle {
    margin-bottom: 16px !important;
}

/* ==================================================================
   Stellenangebote HERO — dark bg + smooth-scroll CTA (2026-04-23)
   ================================================================== */

/* Smooth-scroll global (scoped to this page via body class is not needed
   because rule is harmless elsewhere and existing pages have no anchors
   that would behave differently). */
html {
    scroll-behavior: smooth;
}

/* Anchor target — Filter-Bar lands exactly at viewport top edge.
   Small breathing room of 16px so the border-radius of the filter bar
   isn't glued to the viewport top. */
#stellen-filter {
    scroll-margin-top: 16px;
}

/* Hero CTA: same Picard Apply-Button look (rot, weiß, kein Icon)
   — ergänzt die existing .picard-stelle__apply CSS für Hero-Button,
   der NICHT in .picard-stellen-section sitzt. */
.picard-stellen-hero .et_pb_button.picard-hero-cta::after,
.picard-stellen-hero .et_pb_button.picard-hero-cta::before,
.picard-stellen-hero .et_pb_button.picard-hero-cta:hover::after,
.picard-stellen-hero .et_pb_button.picard-hero-cta:hover::before {
    display: none !important;
    content: none !important;
    opacity: 0 !important;
    width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.picard-stellen-hero .et_pb_button.picard-hero-cta,
.picard-stellen-hero .et_pb_button.picard-hero-cta:visited {
    background-color: #C6041F !important;
    color: #ffffff !important;
    border: none !important;
    padding: 13px 26px !important;
    font-family: Roboto, sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.7em !important;
    border-radius: 6px !important;
    transition: all .2s ease !important;
}

.picard-stellen-hero .et_pb_button.picard-hero-cta:hover {
    background-color: #a80319 !important;
    color: #ffffff !important;
    border: none !important;
    padding: 13px 26px !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(198, 4, 31, .25);
}

/* ==================================================================
   Stellenangebote HERO — finale Polish (2026-04-23)
   — H1 + Intro immer weiß (Divi inline-CSS unzuverlässig nach Content-Updates)
   — Dunkler Gradient-Overlay über Featured-Image für Text-Kontrast
   — Featured Image sanft abgedimmt
   ================================================================== */

/* Section-Layering: Overlay zwischen hero-featured-image und Content */
.picard-stellen-hero {
    position: relative;
    overflow: hidden;
}

.picard-stellen-hero .hero-featured-image {
    filter: brightness(0.55);
}

.picard-stellen-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg,
                rgba(11, 11, 11, 0.65) 0%,
                rgba(11, 11, 11, 0.35) 50%,
                rgba(11, 11, 11, 0.55) 100%);
    z-index: 0;
    pointer-events: none;
}

/* Ensure content is above overlay + image */
.picard-stellen-hero > .et_pb_row,
.picard-stellen-hero .et_pb_row,
.picard-stellen-hero .et_pb_column {
    position: relative;
    z-index: 2;
}

/* Text colors — override Divi inline CSS reliably */
.picard-stellen-hero h1 {
    color: #ffffff !important;
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.35);
}

.picard-stellen-hero .et_pb_text p {
    color: rgba(255, 255, 255, 0.92) !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.35);
}

/* ==================================================================
   Karriere-Eyebrow — Sie-Form Opener über H1 (Stellenangebote)
   Stil übernommen von css-karriere-ausbildung.css für Konsistenz
   ================================================================== */
.picard-stellen-hero .karriere-eyebrow {
    color: #ff4757;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: .14em;
    text-transform: uppercase;
    margin-bottom: 14px;
    display: block;
    text-shadow: 0 1px 8px rgba(0, 0, 0, 0.6);
}