.search-jobs {
    background: var(--bg-default);
    overflow: visible;
    position: relative;
}

    .search-jobs .sj-clear {
        flex: none;
        height: 41px;
        color: var(--title-primary-strong);
        font-weight: var(--fw-light);
        font-family: var(--font-tpSans-light);
        font-size: 18px;
        line-height: 24px;
        border-bottom: 1px solid #8051FF;
        outline: 0;
    }

    .search-jobs .tp-filter-dropdown__list {
        padding: 0;
        list-style: none;
        width: 100%;
        overflow-y: auto;
        max-height: 160px;
        margin: 0;
    }

    .search-jobs .tp-filter-dropdown__item {
        border: 1px solid #CED6DE;
        width: 100%;
        margin: 0;
        padding: 1rem;
        color: #3E4854;
        font-size: 14px;
        font-family: var(--font-tpSans-light);
        font-weight: 300;
    }

        .search-jobs .tp-filter-dropdown__item:hover {
            background: #F4F6F8;
        }

    .search-jobs .sj-search__heading {
        width: 100%;
        text-align: center;
        font-family: var(--font-tpSans-exLight);
        font-weight: var(--fw-extralight);
        font-size: var(--fs-96);
        line-height: 96px;
        background: linear-gradient(92.41deg, #000000 11.88%, var(--lavender-500) 57.91%, #000000 88.02%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .search-jobs .sj-search__box {
        width: 100%;
        display: flex;
        justify-content: center;
        padding: 40px 0px 80px;
    }

    .search-jobs .sj-form {
        width: 820px;
        max-width: 100%;
        display: flex;
        flex-direction: column;
        gap: 24px;
        overflow: visible;
        position: relative;
    }

    .search-jobs .sj-input {
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 12px 0;
        background: transparent;
        border: none;
        border-bottom: 1px solid var(--border-neutral-strong);
    }

        .search-jobs .sj-input:focus-within {
            border-color: var(--border-primary-strong);
        }

    .search-jobs .sj-input__icon {
        width: 19px;
        height: 19px;
        flex: none;
        color: var(--title-neutral);
        cursor: pointer;
    }

        .search-jobs .sj-input__icon svg {
            width: 100%;
            height: 100%;
            display: block;
        }

    .search-jobs .sj-input__field {
        flex: 1;
        min-width: 0;
        border: none;
        outline: none;
        background: none;
        font-family: var(--font-tpSans-light);
        font-weight: var(--fw-light);
        font-size: 18px;
        line-height: 24px;
        color: #010101;
    }

        .search-jobs .sj-input__field::placeholder {
            color: #010101;
            opacity: 1;
        }

        .search-jobs .sj-input__field::-webkit-search-cancel-button {
            -webkit-appearance: none;
        }

    .search-jobs .tag {
        display: inline-flex;
        align-items: center;
        height: 24px;
        padding: 4px 8px;
        background: var(--bg-primary-subtle);
        color: var(--title-primary-strong);
        font-weight: var(--fw-medium);
        font-family: var(--font-tpSans-medium);
        letter-spacing: -0.14px;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .search-jobs .tp-btn {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        height: 56px;
        width: 154px;
        background: var(--bg-primary-strong);
        color: var(--title-inverse);
        font-size: var(--fs-18);
        line-height: var(--lh-24);
        font-weight: var(--fw-light);
        font-family: var(--font-tpSans-light);
        isolation: isolate;
        cursor: pointer;
        text-decoration: none;
    }

        .search-jobs .tp-btn > * {
            position: relative;
            z-index: 2;
        }

    .search-jobs .tp-btn__accent {
        position: absolute;
        inset: 0;
        background: var(--bg-secondary-strong);
        transform: scaleX(0);
        transform-origin: left center;
        z-index: 1;
        transition: transform var(--t-base) var(--ease);
    }

    .search-jobs .tp-btn:hover .tp-btn__accent,
    .search-jobs .tp-btn:focus-visible .tp-btn__accent {
        transform: scaleX(1);
    }

    .search-jobs .tp-btn__icon {
        width: 24px;
        height: 24px;
        flex: none;
        transition: transform var(--t-base) var(--ease);
    }

        .search-jobs .tp-btn__icon svg {
            width: 100%;
            height: 100%;
            display: block;
        }

    .search-jobs .tp-btn:hover .tp-btn__icon,
    .search-jobs .tp-btn:focus-visible .tp-btn__icon {
        transform: rotate(-45deg);
    }

    .search-jobs .sj-selects {
        display: flex;
        gap: 24px;
    }

    .search-jobs .sj-select.disabled,
    .search-jobs .sj-page-nav[disabled] {
        opacity: 0.5;
        pointer-events: none;
    }

    .search-jobs .sj-select {
        flex: 1 1 0;
        outline: 0;
        width: 100%;
        height: 41px;
        padding: 12px 16px 12px 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
        background: var(--bg-default);
        border-bottom: 1px solid var(--border-neutral-strong);
        text-align: left;
        transition: border-color var(--t-fast) var(--ease);
        overflow: visible;
    }

        .search-jobs .sj-select:hover {
            border-color: var(--border-neutral-strong);
        }

    .search-jobs .sj-select__label {
        font-family: var(--font-tpSans-light);
        font-weight: var(--fw-light);
        font-size: 18px;
        line-height: 24px;
        color: #010101;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .search-jobs .sj-select__chevron {
        width: 12px;
        height: 12px;
        flex: none;
        color: var(--title-neutral);
        display: inline-flex;
    }

        .search-jobs .sj-select__chevron svg {
            width: 100%;
            height: 100%;
            display: block;
        }

    .search-jobs .sj-results {
        background: var(--bg-default);
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 48px;
        padding: 0 120px;
        position: relative;
    }

    .search-jobs .sj-filters,
    .search-jobs .sj-selects,
    .search-jobs .w-100 {
        position: relative;
    }

    .search-jobs .tp-filter-dropdown__body {
        position: absolute;
        top: 41px;
        left: 0;
        width: 100%;
        z-index: 100;
        background: #fff;
        z-index: 10;
        box-shadow: 0 8px 20px rgba(0,0,0,.12);
    }

    .search-jobs .sj-grid {
        width: 100%;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 24px;
    }

    .search-jobs .sj-card {
        /* --sj-notch-x: 48px;*/
        /*--sj-notch-y: 48px;*/
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        min-height: 388px;
        padding: 24px;
        background: var(--bg-neutral-subtle);
        clip-path: polygon( 0 0, 100% 0, 100% calc(100% - var(--sj-notch-y)), calc(100% - var(--sj-notch-x)) 100%, 0 100% );
    }

    .search-jobs .sj-card__top {
        display: flex;
        flex-direction: column;
        gap: 24px;
        width: 100%;
    }

    .search-jobs .sj-card__title {
        font-family: var(--font-tpSans-light);
        font-weight: var(--fw-light);
        font-size: var(--fs-24);
        line-height: var(--lh-32);
        letter-spacing: 0;
        color: var(--title-default);
    }

    .search-jobs .sj-card__tags {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
    }

    .search-jobs .sj-card__body {
        font-family: var(--font-tpSans-light);
        font-weight: var(--fw-light);
        font-size: var(--fs-18);
        line-height: var(--lh-24);
        color: var(--body-default);
    }

    .search-jobs .sj-card__cta {
        align-self: flex-start;
    }

        .search-jobs .sj-card__cta span {
            text-transform: lowercase;
        }

            .search-jobs .sj-card__cta span::first-letter {
                text-transform: uppercase;
            }

    .search-jobs .tag--secondary {
        background: var(--bg-neutral-medium);
        color: var(--title-default);
    }

    .search-jobs .sj-pagination {
        width: 100%;
        height: 80px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .search-jobs .sj-pages {
        display: flex;
        align-items: center;
        gap: 8px;
        overflow-x: auto;
        margin: 0 40px;
    }

    .search-jobs .sj-page-nav {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 16px;
    }

        .search-jobs .sj-page-nav[hidden] {
            display: none;
        }

    .search-jobs .sj-page-nav {
        position: relative;
        flex: none;
        width: 56px;
        height: 56px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin: 0;
        padding: 0;
        border: 0;
        border-radius: 0;
        cursor: pointer;
        color: var(--title-primary-strong);
        overflow: hidden;
        isolation: isolate;
        transition: color var(--t-base) var(--ease), background var(--t-base) var(--ease);
    }

    .search-jobs .tpc__arrow-accent {
        position: absolute;
        inset: 0;
        z-index: 1;
        background: var(--bg-primary-strong);
        transform: scaleX(0);
        transform-origin: left center;
        transition: transform var(--t-base) var(--ease);
    }

    .search-jobs .sj-page-nav__icon {
        position: relative;
        z-index: 2;
        width: 24px;
        height: 24px;
    }

        .search-jobs .sj-page-nav__icon svg {
            position: absolute;
            left: 4px;
            top: 4px;
            width: 16.7151px;
            height: 16px;
            display: block;
        }

    .search-jobs .sj-page-nav--prev .sj-page-nav__icon {
        transform: rotate(180deg);
    }

    .search-jobs .sj-page-nav:hover .tpc__arrow-accent,
    .search-jobs .sj-page-nav:focus-visible .tpc__arrow-accent,
    .search-jobs .sj-page-nav.is-pressed .tpc__arrow-accent {
        transform: scaleX(1);
    }

    .search-jobs .sj-page-nav:hover,
    .search-jobs .sj-page-nav:focus-visible,
    .search-jobs .sj-page-nav.is-pressed {
        color: var(--title-inverse);
    }

    .search-jobs .sj-page-num {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        font-family: var(--font-tpSans-light);
        font-weight: var(--fw-light);
        font-size: var(--fs-24);
        line-height: var(--lh-32);
        color: var(--title-default);
        transition: background var(--t-fast) var(--ease);
        padding: 0 1rem;
    }

        .search-jobs .sj-page-num:hover {
            background: var(--bg-neutral-subtle);
        }

        .search-jobs .sj-page-num.is-active {
            width: 48px;
            height: 48px;
            background: var(--bg-primary-subtle);
        }

    .search-jobs .sj__noResultsContent .medium-txt-title {
        font-family: var(--font-tpSans-exLight);
        color: #4b26ad;
        margin-bottom: 24px;
        text-align: center;
    }

    .search-jobs .sj__noResultsContent .medium-txt-body {
        font-family: var(--font-tpSans-light);
        color: #38514d;
        text-align: center;
    }

@media (min-width:1400px) {
    .search-jobs .sj-form {
        width: 1200px;
    }
}

@media (max-width: 1024px) {

    .search-jobs .sj-search__heading {
        font-size: 88px;
        line-height: 88px;
        background: linear-gradient(91deg, #000000 11.88%, var(--lavender-500) 57.91%, #000000 88.02%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .search-jobs .sj-form {
        width: 688px;
    }

    .search-jobs .sj-results {
        padding: 40px 40px 80px;
        gap: 40px;
    }

    .search-jobs .sj-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        max-width: 676px;
    }

    /*.search-jobs .sj-card {
        --sj-notch-x: 60px;
        --sj-notch-y: 80px;
    }*/

    .search-jobs .sj-pagination {
        max-width: 688px;
    }
}

@media (max-width: 767px) {

    .search-jobs .sj-clear {
        width: max-content;
    }

    .search-jobs .sj-search__heading {
        max-width: 100%;
        font-size: var(--fs-64);
        line-height: var(--lh-64);
        background: linear-gradient(90.24deg, #000000 11.88%, var(--lavender-500) 57.91%, #000000 88.02%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .search-jobs .sj-form {
        width: 320px;
        gap: 40px;
    }

    .search-jobs .sj-input__icon {
        width: 24px;
        height: 24px;
    }

    .search-jobs .sj-input__field {
        font-size: 18px;
        line-height: 18px;
    }

    .search-jobs .sj-filters {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .search-jobs .sj-selects {
        flex-direction: column;
        gap: 40px;
    }

    .search-jobs .sj-select {
        flex: none;
    }

    .search-jobs .sj-results {
        padding: 0 20px 80px;
        gap: 40px;
    }

    .search-jobs .sj-grid {
        grid-template-columns: minmax(0, 1fr);
        max-width: 320px;
    }

    .search-jobs .sj-pagination {
        max-width: 320px;
    }

    .search-jobs .sj-page-num:not(.is-active) {
        display: none;
    }
}