/* Meta Row Wrapper */
.personio-meta-row {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    margin: 45px 0 80px 0;
    align-items: flex-start;
}

.personio-meta-item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    font-family: 'Poppins', Arial, sans-serif;
}

.personio-meta-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 0px;
}

.personio-meta-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.personio-meta-label {
    color: #54645b;
    font-size: 15px;
    font-weight: 600;
}

.personio-meta-value {
    color: #54645b;
    font-size: 15px;
    font-weight: 400;
    padding-left: 22px;
}
.personio-meta-row {
    margin: 45px 0 50px 0;
}
.single-personioposition .et_pb_section_0_tb_header .et_pb_row_0_tb_header {
    background-color: #001f10 !important;
}
span.meta-separator {
    margin: 0px 3px;
}
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap");

.post-type-archive-personioposition {
    background-color: #001f10 !important;
}

.post-type-archive-personioposition h2.entry-title {
    background: #e7ecd8;
    border-radius: 5px;
    padding: 0;
    margin-bottom: 0;
}

.post-type-archive-personioposition h2.entry-title a {
    color: #000 !important;
    font-size: 20px;
    word-wrap: break-word;
}

.post-type-archive-personioposition .personioposition {
    position: relative;
    max-width: 1350px;
    margin: 15px auto 0px;
    padding: 7px 22px 22px 22px !important;
    background: #e8eddc;
    border-radius: 10px;
    box-sizing: border-box;
    font-family: "Poppins", Arial, sans-serif;
    width: 80% !important;
}

.post-type-archive-personioposition .entry-content.personio-integration-pagination {
    background: #fff;
    padding: 50px 0 !important;
}

.post-type-archive-personioposition .entry-content.personio-integration-pagination p {
    width: 80%;
    max-width: 1350px;
    margin: 0 auto;
}

.post-type-archive-personioposition .personioposition .entry-content {
    margin: 0;
    padding: 0;
}

.post-type-archive-personioposition .personioposition .entry-title {
    margin: 0 0 9px;
    font-family: "Poppins", Arial, sans-serif;
    font-size: 23px;
    line-height: 28px;
    font-weight: 700;
    letter-spacing: 0;
    color: #000;
}

.post-type-archive-personioposition .personioposition .entry-title a {
    color: inherit;
    text-decoration: none;
}

.post-type-archive-personioposition .personioposition .personio-hide-title p {
    margin: 0;
    font-family: "Poppins", Arial, sans-serif;
    font-size: 15px;
    line-height: 1.45;
    font-weight: 400;
    color: #465344;
}

.post-type-archive-personioposition .personioposition::after {
    content: "+";
    position: absolute;
    top: 50%;
    right: 29px;
    width: 31px;
    height: 31px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #00d278;
    color: #fff;
    font-family: Arial, sans-serif;
    font-size: 30px;
    line-height: 29px;
    font-weight: 300;
    text-align: center;
}

/* =========================================
   PERSONIO POSITION FILTER FIX (NO JUMP)
========================================= */

.post-type-archive-personioposition .personio-position-filter {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box;
    font-family: "Poppins", Arial, sans-serif !important;
}

.single-personioposition a.personio-integration-back-button {
    display: none !important;
}

.post-type-archive-personioposition .personio-position-filter fieldset {
    display: grid !important;
    grid-template-columns: 320px 224px 224px 127px;
    column-gap: 15px;
    align-items: end;
    max-width: 1350px;
    margin: 0 auto !important;
    padding: 0 !important;
    border: 0 !important;
    width: 80%;
}

.post-type-archive-personioposition form.entry-content.personio-position-filter.personio-position-filter-linklist.site-content.site-container.content-bg.content-area {
    margin-bottom: 80px !important;
}

.post-type-archive-personioposition .personio-position-filter legend,
.post-type-archive-personioposition .personio-position-filter-reset {
    display: none !important;
}

.post-type-archive-personioposition .personio-position-filter div {
    position: relative !important;
    margin: 0 !important;
    padding: 0 !important;
    height: 65px !important;
    /* Fixed height taaki niche wale elements move na hon */
}

.post-type-archive-personioposition .personio-position-filter div > p {
    margin: 0 0 14px !important;
    padding-left: 10px;
    color: #ffffff !important;
    font-size: 17px;
    line-height: 1;
    font-weight: 500;
}

.post-type-archive-personioposition .personio-position-filter div:nth-of-type(1) > p {
    font-size: 0;
}

.post-type-archive-personioposition .personio-position-filter div:nth-of-type(1) > p::before {
    content: "Fachgebiet";
    font-size: 17px;
}

.post-type-archive-personioposition .personio-position-filter div:nth-of-type(3) > p {
    font-size: 0;
}

.post-type-archive-personioposition .personio-position-filter div:nth-of-type(3) > p::before {
    content: "Standorte";
    font-size: 17px;
}

.post-type-archive-personioposition .personio-position-filter ul {
    position: absolute !important;
    top: 31px !important;
    left: 0;
    z-index: 2;
    width: 100%;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
    list-style: none !important;
    background: #014b29;
    border-radius: 7px;
    box-sizing: border-box;
}

.post-type-archive-personioposition .personio-position-filter ul::before {
    content: "Bitte auswählen";
    display: block;
    height: 34px;
    padding: 7px 10px;
    color: #ffffff;
    font-size: 15px;
    line-height: 20px;
    font-weight: 500;
    box-sizing: border-box;
}

.post-type-archive-personioposition .personio-position-filter div:hover ul,
.post-type-archive-personioposition .personio-position-filter div:focus-within ul {
    height: auto !important;
    max-height: 260px !important;
    overflow-y: auto !important;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.22);
    z-index: 9999 !important;
}

.post-type-archive-personioposition .personio-position-filter li {
    margin: 0 !important;
    padding: 0 !important;
}

.post-type-archive-personioposition .personio-position-filter li a {
    display: block;
    padding: 8px 10px;
    background: #014b29;
    color: #ffffff !important;
    font-size: 14px;
    line-height: 1.35;
    font-weight: 500;
    text-decoration: none !important;
}

.post-type-archive-personioposition .personio-position-filter li a:hover,
.post-type-archive-personioposition .personio-position-filter li a:focus {
    background: #00d879;
    color: #002d19 !important;
}

.post-type-archive-personioposition .personio-position-filter button[type="submit"] {
    width: 127px;
    height: 42px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 999px;
    background: #00d879 !important;
    color: #ffffff !important;
    font-family: "Poppins", Arial, sans-serif !important;
    font-size: 16px;
    line-height: 42px;
    font-weight: 500;
    text-align: center;
    cursor: pointer;
    display: block !important;
}

.post-type-archive-personioposition article.site-main.entry.entry-content.inside-article.site-content.site-content.site-container.content-bg.content-area.ht-container.personio-hide-title.container,
.post-type-archive-personioposition article.site-main.entry.inside-article.container.site-content.site-container.content-bg.content-area.ht-container {
    padding-top: 0px;
    width: 100%;
}

.post-type-archive-personioposition article.site-main.entry.entry-content.inside-article.site-content.site-content.site-container.content-bg.content-area.ht-container.personio-hide-title.container:before,
.post-type-archive-personioposition article.site-main.entry.inside-article.container.site-content.site-container.content-bg.content-area.ht-container:before {
    display: none;
}

.post-type-archive-personioposition .personio-position-filter button[type="submit"]:hover,
.post-type-archive-personioposition .personio-position-filter button[type="submit"]:focus {
    background: #08ef8b !important;
}

.post-type-archive-personioposition form.entry-content.personio-position-filter ul {
    background: #00391d;
    display: block;
}

.post-type-archive-personioposition article.site-main.entry.entry-content.inside-article.site-content.site-content.site-container.content-bg.content-area.ht-container.personio-hide-title.container {
    padding-bottom: 126px;
    padding-top: 20px !important;
}

.post-type-archive-personioposition .stellen-box .personio-hide-title:nth-child(2) {
    background: #F8F9F3;
    padding-top: 70px;
}

.post-type-archive-personioposition .inside-article .entry-content.personio-hide-title {
    padding: 0;
    background: #e7ecd8;
}

.post-type-archive-personioposition .stellen-box article.site-main.entry.entry-content.inside-article.site-content.site-content.site-container.content-bg.content-area.ht-container.personio-hide-title.container {
    width: 80%;
}

/* =========================================
   IT-HAUS JOB PAGE — SCREENSHOT STYLE
========================================= */

/* Google Font */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

.single-personioposition {
    background-color: #f8f9f3 !important;
}

.single-personioposition div#et-main-area {
    padding-top: 100px;
}

/* =========================================
   HEADER
========================================= */

body.post-type-archive-personioposition {
    background-color: #f8f9f3 !important;
}

.post-type-archive-personioposition header.et-l.et-l--header {
    background-color: #001f10;
}

.post-type-archive-personioposition footer.et-l.et-l--footer {
    margin-top: 50px;
}

/* =========================================
   MAIN JOB ARTICLE
========================================= */

.single-personioposition.site-main.entry,
.single-personioposition.entry,
.single-personioposition.inside-article {
    width: 100%;
    margin: 0 auto !important;
    padding: 0 30px 60px !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Remove theme-generated decorations */

.single-personioposition::before,
.single-personioposition::after,
.single-personioposition .entry-content::before,
.single-personioposition .entry-content::after {
    box-shadow: none;
}

/* Content column */

.single-personioposition .entry-content,
.single-personioposition > header.entry-content {
    width: 100%;
    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

/* =========================================
   JOB TITLE
========================================= */

.single-personioposition .entry-title {
    margin: 0 0 32px !important;
    padding: 0;
    color: #050705 !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: clamp(26px, 3vw, 28px) !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    letter-spacing: -0.65px;
    text-transform: none;
}

/* Title area spacing */

.single-personioposition > header.entry-content {
    padding-top: 95px !important;
    margin-bottom: 0 !important;
}

/* =========================================
   SECTION HEADINGS
========================================= */

.single-personioposition .entry-content h3 {
    margin: 0 0 15px !important;
    padding: 0;
    color: #082719 !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 22px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
    letter-spacing: -0.35px;
    text-transform: none;
}

.single-personioposition .entry-content h3:not(:first-child) {
    margin-top: 54px !important;
}

/* =========================================
   PARAGRAPHS
========================================= */

.single-personioposition .entry-content p {
    margin: 0 0 14px;
    color: #5e6c62;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.85;
}

/* =========================================
   JOB RESPONSIBILITIES / PROFILE LISTS
========================================= */

.single-personioposition .entry-content ul {
    margin: 0 0 20px !important;
    padding: 0 0 0 2px !important;
    list-style: none !important;
}

.single-personioposition .entry-content ul li {
    position: relative;
    margin: 0 0 7px !important;
    padding: 0 0 0 7px !important;
    color: #5e6c62 !important;
    font-size: 16px !important;
    font-weight: 400;
    line-height: 1.75 !important;
    list-style: none !important;
}

/* Green vertical line beside every list item */

.single-personioposition .entry-content ul li::before {
    content: "";
    position: absolute;
    top: 9px;
    left: -2px;
    width: 3px;
    height: 11px;
    background: #00d278;
    border-radius: 1px;
}

/* Bold labels in benefits section */

.single-personioposition .entry-content ul li strong {
    color: #082719;
    font-weight: 600;
}

/* =========================================
   APPLICATION BUTTONS
========================================= */

.single-personioposition .personio-integration-application-button {
    margin-top: 35px;
}

.single-personioposition a.personio-integration-application-button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-height: 39px;
    padding: 10px 19px !important;
    margin: 0px 0 10px !important;
    background: #00d278 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 25px !important;
    box-shadow: none !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1.4;
    text-align: center;
    text-decoration: none !important;
    transition: background-color .2s ease,
                transform .2s ease;
}

.single-personioposition p:empty {
    display: none;
}

.single-personioposition a.personio-integration-application-button:hover {
    background: #00b875 !important;
    color: #fff !important;
    transform: translateY(-1px);
}

/* Back link */

.single-personioposition a.personio-integration-back-button {
    display: inline-block;
    margin: 12px 0 0 12px;
    color: #082719 !important;
    font-size: 16px;
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* =========================================
   CAREER / COMPANY INFORMATION SECTION
========================================= */

.single-personioposition .entry-content h3:last-of-type {
    margin-top: 55px !important;
}

/* Links within article */

.single-personioposition .entry-content a:not(.personio-integration-application-button) {
    color: #00b875;
    text-decoration: none;
}

.single-personioposition .entry-title:before {
    content: 'WIR GESTALTEN IT.';
    position: absolute;
    top: -45px;
    font-style: italic;
    color: #00d278 !important;
    font-size: 26px;
    line-height: 1em;
    letter-spacing: 1px;
    font-family: "Carbon BoldItalic", monospace !important;
    font-weight: 400;
}
/* =========================================
   RESPONSIVE TABLET
========================================= */

@media (max-width: 768px) {
    .single-personioposition.site-main.entry,
    .single-personioposition.entry,
    .single-personioposition.inside-article {
        padding: 0 24px 45px !important;
    }

    .single-personioposition > header.entry-content {
        padding-top: 65px !important;
    }

    .single-personioposition .entry-title {
        font-size: 25px !important;
        line-height: 1.4 !important;
        letter-spacing: -0.4px;
    }

    .single-personioposition .entry-content h3 {
        font-size: 20px !important;
    }

    .single-personioposition .entry-content h3:not(:first-child) {
        margin-top: 42px !important;
    }
}

/* =========================================
   RESPONSIVE MOBILE
========================================= */

@media (max-width: 1150px) {
    .post-type-archive-personioposition .personio-position-filter fieldset {
        grid-template-columns: unset;
    }

    .post-type-archive-personioposition .personio-position-filter div {
        margin-bottom: 22px !important;
        width: 75%;
    }
}

@media (max-width: 768px) {
    .post-type-archive-personioposition .personioposition .entry-title {
        line-height: 30px;
    }

    .post-type-archive-personioposition .personioposition::after {
        right: 29px;
        height: 20px;
        width: 20px;
        font-size: 20px;
        line-height: 20px;
        display: none
    }

    .post-type-archive-personioposition h2.entry-title a {
        font-size: 18px;
        line-height: 20px;
    }
}

@media (max-width: 520px) {
    .post-type-archive-personioposition .personio-position-filter div {
        width: 100%;
    }
}

@media (max-width: 480px) {
    .single-personioposition.site-main.entry,
    .single-personioposition.entry,
    .single-personioposition.inside-article {
        padding: 0 20px 35px !important;
    }

    .single-personioposition > header.entry-content {
        padding-top: 48px !important;
    }

    .single-personioposition .entry-title:before {
        font-size: 20px;
    }

    .single-personioposition .entry-title {
        margin-bottom: 24px !important;
        font-size: 20px !important;
        line-height: 1.42 !important;
    }

    .single-personioposition .entry-content h3 {
        margin-bottom: 12px !important;
        font-size: 20px !important;
        line-height: 1.5 !important;
    }

    .single-personioposition .entry-content h3:not(:first-child) {
        margin-top: 36px !important;
    }

    .single-personioposition .entry-content p,
    .single-personioposition .entry-content ul li {
        font-size: 16px !important;
        line-height: 1.8 !important;
    }

    .single-personioposition .entry-content ul li {
        margin-bottom: 8px !important;
    }

    .single-personioposition a.personio-integration-application-button {
        min-height: 38px;
        padding: 10px 18px !important;
    }

    .single-personioposition a.personio-integration-back-button {
        margin-left: 0;
    }
}

.personio-meta-row {
    margin: 45px 0 80px 0;
}

.single-personioposition .et_pb_section_0_tb_header .et_pb_row_0_tb_header {
    background-color: #001f10 !important;
}

span.meta-separator {
    margin: 0px 3px;
}

/* Personio Pagination Design */
/* Personio Pagination Design */

.post-type-archive-personioposition .personio-integration-pagination {
    padding: 50px 0 !important;
    background: #f8f9f3 !important;
    box-sizing: border-box;
}

.post-type-archive-personioposition .personio-integration-pagination p {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 0px;
    width: 80%;
    max-width: 1350px;
    margin: 0 auto !important;
    padding: 0 !important;
    box-sizing: border-box;
}


.post-type-archive-personioposition
.personio-integration-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 23px;
    padding: 0 5px;
    box-sizing: border-box;
    border: none !important;
    border-radius: 3px;
    background: transparent;
    color: #54645b !important;
    font-family: "Poppins", Arial, sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    text-decoration: none !important;
    transition: background-color 0.2s ease;
}

/* Current active page */

.post-type-archive-personioposition
.personio-integration-pagination .page-numbers.current {
    background: #e7ecd8 !important;
    color: #294a39 !important;
}

/* Page number hover */

.post-type-archive-personioposition
.personio-integration-pagination a.page-numbers:not(.prev):not(.next):hover {
    background: #dce8cf !important;
    color: #002d19 !important;
}

/* Previous and Next buttons */

.post-type-archive-personioposition
.personio-integration-pagination a.prev,
.post-type-archive-personioposition
.personio-integration-pagination a.next {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 23px;
    width: 23px;
    height: 23px;
    padding: 0;
    border-radius: 3px;
    background: #00c982 !important;
    color: #ffffff !important;
    font-size: 0;
    font-weight: 700;
    position: relative;
}

/* Arrow symbols updated with new angle icons */

.post-type-archive-personioposition
.personio-integration-pagination a.prev::after {
    content: "" !important;
    display: block !important;
    width: 30px !important;
    height: 30px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
}

.post-type-archive-personioposition
.personio-integration-pagination a.next::after {
    content: "" !important;
    display: block !important;
    width: 30px !important;
    height: 30px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpath d='M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
}

/* Arrow hover */

.post-type-archive-personioposition
.personio-integration-pagination a.prev:hover,
.post-type-archive-personioposition
.personio-integration-pagination a.next:hover {
    background: #08ef8b !important;
    color: #002d19 !important;
}

/* Mobile */

@media (max-width: 768px) {
    .post-type-archive-personioposition .personio-integration-pagination {
        width: 100%;
        margin-top: 0px !important;
    }

    .post-type-archive-personioposition
    .personio-integration-pagination p {
        gap: 6px;
    }
}