/*
 * AK2023 – Karriere
 * Ergänzt ak23.min.css für die neue Anzeigenstruktur, den Jobs-Block (Stationen)
 * und Bausteine für die Karriereseite. Eingebunden über _functions/karriere.php.
 * Farben wie im Theme: Blau #193282, Rot #e2001a, Grau #eee.
 */

/* ---------- Stellenanzeige: Kopf ---------- */

.single-jobs .job-neu .job-container .job-meta {
    color: #5a6378;
    font-weight: 500;
    font-size: 1rem;
    text-transform: none;
}

.single-jobs .job-neu .job-container h1 {
    padding-bottom: .5rem;
    overflow-wrap: break-word;
    hyphens: auto;
}

.single-jobs .job-neu .job-zielgruppe {
    color: #193282;
    font-weight: 500;
    margin-bottom: 1.75rem;
}

.single-jobs .job-neu .job-hook {
    color: #193282;
    font-weight: 900;
    font-size: 1.6rem;
    line-height: 1.3;
    margin: 0 0 1rem;
}

@media (max-width: 575px) {
    .single-jobs .job-neu .job-container h1 {
        font-size: 1.9rem;
    }
    .single-jobs .job-neu .job-hook {
        font-size: 1.35rem;
    }
}

/* ---------- Listen ---------- */

.job-liste {
    list-style: none;
    padding-left: 0;
    margin: 0 0 1.25rem;
}

.job-liste li {
    position: relative;
    padding-left: 1.6rem;
    margin-bottom: .55rem;
}

/* roter Winkel wie im Bewerbungs-Akkordeon */
.job-liste li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .5em;
    width: 8px;
    height: 8px;
    border-top: 3px solid #e2001a;
    border-right: 3px solid #e2001a;
    transform: rotate(45deg);
}

/* Nummer im Kreis: Tagesablauf (Fahrer) und Bewerbungsablauf im Stil „kreise“ */
.job-tagesablauf,
.ak23-ablauf--kreise {
    list-style: none;
    counter-reset: ak23-step;
    padding-left: 0;
    margin: 0 0 1.25rem;
}

.job-tagesablauf li,
.ak23-ablauf--kreise li {
    counter-increment: ak23-step;
    position: relative;
    padding-left: 2.6rem;
    margin-bottom: .9rem;
    min-height: 1.9rem;
}

.job-tagesablauf li::before,
.ak23-ablauf--kreise li::before {
    content: counter(ak23-step);
    position: absolute;
    left: 0;
    top: -.1rem;
    width: 1.9rem;
    height: 1.9rem;
    border-radius: 50%;
    background: #193282;
    color: #fff;
    font-weight: 700;
    font-size: .95rem;
    line-height: 1.9rem;
    text-align: center;
}

/* Bewerbungsablauf im Stil „liste“: normale nummerierte Liste wie im Fließtext */
.ak23-ablauf--liste {
    padding-left: 1.25rem;
    margin: 0 0 1.25rem;
}

.ak23-ablauf--liste li {
    margin-bottom: .5rem;
}

/* Bewerbungsablauf im Stil „absaetze“ */
.ak23-ablauf--absaetze {
    margin: 0 0 1.25rem;
}

.ak23-ablauf--absaetze p {
    margin-bottom: .75rem;
}

.ak23-ablauf strong {
    color: #193282;
}

/* ---------- Ehrlich gesagt ---------- */

.job-ehrlich {
    background: #eef1f8;
    padding: 1.25rem 1.5rem .5rem;
    margin: 1.75rem 0;
    -webkit-clip-path: polygon(35px 0, 100% 0, 100% 100%, 0 100%, 0 35px);
    clip-path: polygon(35px 0, 100% 0, 100% 100%, 0 100%, 0 35px);
}

.single-jobs .job-container .job-ehrlich h4 {
    padding-top: 0;
    color: #e2001a;
    text-transform: uppercase;
    font-size: 1rem;
    letter-spacing: .04em;
}

/* ---------- Zitat ---------- */

.job-zitat {
    display: flex;
    gap: 1.25rem;
    align-items: flex-start;
    margin: 2rem 0;
}

.job-zitat-foto {
    width: 110px;
    height: 110px;
    object-fit: cover;
    flex: 0 0 110px;
    -webkit-clip-path: polygon(22px 0, 100% 0, 100% 100%, 0 100%, 0 22px);
    clip-path: polygon(22px 0, 100% 0, 100% 100%, 0 100%, 0 22px);
}

.job-zitat blockquote {
    color: #193282;
    font-size: 1.25rem;
    font-weight: 500;
    line-height: 1.45;
    margin: 0 0 .5rem;
}

.job-zitat figcaption {
    color: #5a6378;
    font-size: .95rem;
}

@media (max-width: 575px) {
    .job-zitat {
        flex-direction: column;
    }
    .job-zitat blockquote {
        font-size: 1.1rem;
    }
}

/* ---------- Seitenleiste: Bewerberkontakt ---------- */

.page-sidebar-container .col-mitarbeiter--bewerber .asp-kurzvorstellung {
    font-size: .95rem;
    margin-bottom: .75rem;
}

.page-sidebar-container .col-mitarbeiter--bewerber .asp-kontakt a {
    text-decoration: none;
    color: #212529;
}

.page-sidebar-container .col-mitarbeiter--bewerber .asp-kontakt .bi {
    color: #193282;
    margin-right: .35rem;
}

/* ---------- Bewerbungsbereich ---------- */

.job-bewerben-bg {
    background-color: #eee;
}

.single-jobs .container.job-actions h4 {
    font-size: 1.25rem;
    padding-top: 1.25rem;
    padding-bottom: .5rem;
    color: #193282;
    font-weight: 900;
}

.single-jobs .job-actions .job-frage {
    background: #fff;
    color: #193282;
    font-weight: 700;
    font-size: 1.2rem;
    padding: 1rem 1.25rem;
    -webkit-clip-path: polygon(22px 0, 100% 0, 100% 100%, 0 100%, 0 22px);
    clip-path: polygon(22px 0, 100% 0, 100% 100%, 0 100%, 0 22px);
}

.single-jobs .job-actions .job-kontaktzeile {
    font-weight: 500;
}

.single-jobs .job-actions .job-kontaktzeile a {
    color: #e2001a;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
}

/* ---------- Jobs-Block: Liste und Stationen ---------- */

.ak23_block--ak23_jobs .job-item-zielgruppe {
    color: #5a6378;
    margin-top: -.25rem;
}

.ak23_block--ak23_jobs .job-station-teaser {
    max-width: 46rem;
    margin-bottom: 1rem;
}

.ak23_block--ak23_jobs .job-station-stellen {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ak23_block--ak23_jobs .job-station-stellen li {
    align-items: center;
    gap: 1rem;
    padding: .85rem 0;
    border-top: 1px solid #e6e6e6;
}

.ak23_block--ak23_jobs .job-station-stelle strong {
    display: block;
    color: #212529;
}

.ak23_block--ak23_jobs .job-station-ort {
    display: inline-flex;
    align-items: center;
    color: #5a6378;
    font-size: .95rem;
    margin-top: .2rem;
}

.ak23_block--ak23_jobs .job-station-stellen .btn {
    flex: 0 0 auto;
}

@media (max-width: 767px) {
    .ak23_block--ak23_jobs .job-station-stellen li {
        flex-direction: column;
        align-items: flex-start;
    }
    .ak23_block--ak23_jobs .job-station-stellen .btn {
        margin-left: 0 !important;
    }
}

/* ---------- Karriereseite: Bausteine für „Eigener Inhalt“ (HTML) ---------- */

.ak23-zitat {
    color: #193282;
    font-size: 1.35rem;
    font-weight: 500;
    line-height: 1.45;
    margin: 1.5rem 0;
}

.ak23-zitat footer {
    color: #5a6378;
    font-size: .95rem;
    font-weight: 400;
    margin-top: .5rem;
}

.ak23-kernsatz {
    color: #193282;
    font-weight: 900;
    font-size: 1.6rem;
    line-height: 1.3;
}

.ak23-shortcode-ablauf {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

/* ---------- Block „Bewerbungsablauf“ ---------- */

.ak23_block--ak23_bewerbungsablauf h3 {
    color: #193282;
    font-weight: 900;
    margin-bottom: 1rem;
}