/* =========================================================
   Avyentra Job Management - Shortcode Frontend
   ========================================================= */

.avy-jobs-module{
    width:100%;
    box-sizing:border-box;
    color:#171717;
}

.avy-jobs-module *,
.avy-jobs-module *::before,
.avy-jobs-module *::after{
    box-sizing:border-box;
}

.avy-jobs-module .avy-container{
    width:min(1180px,92%);
    margin:0 auto;
}

.avy-jobs-module .avy-jobs-hero,
.avy-jobs-module .avy-job-detail-hero,
.avy-jobs-module .avy-apply-hero{
    padding:72px 0;
    background:#0b132b;
}

.avy-jobs-module .avy-eyebrow{
    display:inline-block;
    font-size:12px;
    letter-spacing:2px;
    font-weight:700;
    margin-bottom:14px;
    color: #f5da85;
}

.avy-jobs-module .avy-jobs-hero h1,
.avy-jobs-module .avy-job-detail-hero h1,
.avy-jobs-module .avy-apply-hero h1{
    font-size:44px;
    line-height:1.12;
    margin:0 0 14px;
    color:  #f5da85;;
}

.avy-jobs-module .avy-jobs-hero p,
.avy-jobs-module .avy-apply-hero p{
    font-size:18px;
    margin:0;
    max-width:700px;
    color: #f5da85;
}

.avy-jobs-module .avy-jobs-list-section,
.avy-jobs-module .avy-job-detail-content,
.avy-jobs-module .avy-apply-section{
    padding:60px 0;
}

.avy-jobs-module .avy-job-search{
    display:flex;
    gap:12px;
    background:#f4f4f4;
    padding:16px;
    margin-bottom:32px;
}

.avy-jobs-module .avy-job-search input{
    flex:1;
    min-width:0;
    border:1px solid #d2d2d2;
    padding:16px;
    font-size:16px;
    background:#fff;
}

.avy-jobs-module .avy-job-search button{
    border:1px solid #222;
    background:#fff;
    padding:0 32px;
    font-weight:600;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
}

.avy-jobs-module .avy-jobs-grid{
    display:grid;
    gap:24px;
}

.avy-jobs-module .avy-job-card{
    border:1px solid #ddd;
    background:#fff;
    padding:28px;
    transition:.2s;
}

.avy-jobs-module .avy-job-card:hover{
    box-shadow:0 12px 30px rgba(0,0,0,.08);
    transform:translateY(-2px);
}

.avy-jobs-module .avy-job-card-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:15px;
}

.avy-jobs-module .avy-job-icon{
    width:58px;
    height:58px;
    border:1px solid #e3e3e3;
    border-radius:18px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.avy-jobs-module .avy-job-icon .dashicons{
    font-size:28px;
    width:28px;
    height:28px;
}

.avy-jobs-module .avy-job-date{
    font-size:14px;
    color:#666;
}

.avy-jobs-module .avy-job-card h2{
    font-size:25px;
    margin:22px 0 15px;
}

.avy-jobs-module .avy-job-meta{
    display:flex;
    flex-wrap:wrap;
    gap:8px 22px;
    font-size:15px;
    margin-bottom:16px;
}

.avy-jobs-module .avy-job-excerpt{
    line-height:1.7;
    color:#444;
}

.avy-jobs-module .avy-job-actions{
    display:flex;
    gap:10px;
    margin-top:22px;
}

.avy-jobs-module .avy-job-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-decoration:none !important;
    border:1px solid #222;
    padding:12px 22px;
    font-weight:600;
    cursor:pointer;
    transition:.2s;
}

.avy-jobs-module .avy-primary{
    background:#222;
    color:#fff !important;
}

.avy-jobs-module .avy-primary:hover{
    background:#000;
    color:#fff !important;
}

.avy-jobs-module .avy-secondary{
    background:#fff;
    color:#222 !important;
}

.avy-jobs-module .avy-secondary:hover{
    background:#f3f3f3;
    color:#222 !important;
}

.avy-jobs-module .avy-large{
    width:100%;
    padding:16px 22px;
}

.avy-jobs-module .avy-no-jobs,
.avy-jobs-module .avy-no-search-results{
    text-align:center;
    padding:60px 20px;
    border:1px solid #ddd;
}

.avy-jobs-module .avy-detail-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 330px;
    gap:60px;
}

.avy-jobs-module .avy-detail-main section{
    margin-bottom:42px;
    
}

.avy-jobs-module .avy-detail-main h2{
    font-size:28px;
    margin:0 0 18px;
    color: #000;
}

.avy-jobs-module .avy-detail-main p,
.avy-jobs-module .avy-detail-main li{
    font-size:17px;
    line-height:1.8;
    color: #000;
}

.avy-jobs-module .avy-detail-main ul{
    padding-left:24px;
}

.avy-jobs-module .avy-detail-meta{
    display:flex;
    flex-wrap:wrap;
    gap:10px 28px;
    margin-top:28px;
    color: #fff;
}

.avy-jobs-module .avy-job-apply-card{
    align-self:start;
    border:1px solid #ddd;
    padding:28px;
    position:sticky;
    top:30px;
}

.avy-jobs-module .avy-job-apply-card h3{
    font-size:22px;
    margin:0 0 10px;
    color: #000;
}

.avy-jobs-module .avy-job-apply-card p{
    line-height:1.6;
    color:#555;
}

.avy-jobs-module .avy-deadline{
    padding:18px;
    background:#f7f7f7;
}

.avy-jobs-module .avy-back-link{
    display:inline-block;
    margin-bottom:25px;
    color:inherit;
    text-decoration:none;
    font-weight:600;
    color: #fff;
}

.avy-jobs-module .avy-application-card{
    max-width:900px;
    margin:0 auto;
    border:1px solid #ddd;
    padding:38px;
    background:#fff;
}

.avy-jobs-module .avy-application-card h2{
    font-size:24px;
    margin:0 0 22px;
    padding-top:8px;
}

.avy-jobs-module .avy-application-card h2:not(:first-of-type){
    margin-top:35px;
    border-top:1px solid #eee;
    padding-top:30px;
}

.avy-jobs-module .avy-form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
}

.avy-jobs-module .avy-form-field{
    margin-bottom:20px;
}

.avy-jobs-module .avy-form-field label{
    display:block;
    font-weight:600;
    margin-bottom:8px;
}

.avy-jobs-module .avy-form-field label span{
    color:#c00000;
}

.avy-jobs-module .avy-form-field input,
.avy-jobs-module .avy-form-field textarea,
.avy-jobs-module .avy-form-field select{
    width:100%;
    box-sizing:border-box;
    border:1px solid #ccc;
    padding:13px 14px;
    font:inherit;
    background:#fff;
}

.avy-jobs-module .avy-form-field input:focus,
.avy-jobs-module .avy-form-field textarea:focus,
.avy-jobs-module .avy-form-field select:focus{
    outline:0;
    border-color:#222;
}

.avy-jobs-module .avy-form-field small{
    display:block;
    margin-top:6px;
    color:#666;
}

.avy-jobs-module .avy-consent{
    display:flex;
    gap:10px;
    align-items:flex-start;
    margin:10px 0 25px;
    line-height:1.5;
}

.avy-jobs-module .avy-consent input{
    margin-top:5px;
}

.avy-jobs-module .avy-submit-button{
    min-width:220px;
}

.avy-jobs-module .avy-form-message{
    padding:14px 16px;
    margin-bottom:20px;
}

.avy-jobs-module .avy-form-message.error{
    background:#fff0f0;
    border:1px solid #e0aaaa;
    color:#8a0000;
}

.avy-jobs-module .avy-application-success{
    text-align:center;
    padding:30px 10px;
}

.avy-jobs-module .avy-success-icon{
    width:64px;
    height:64px;
    border-radius:50%;
    background:#222;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 18px;
    font-size:28px;
}

.avy-jobs-module .avy-application-success .avy-job-button{
    margin-top:15px;
}

.avy-jobs-module .avy-job-button[disabled]{
    opacity:.6;
    cursor:not-allowed;
}

@media(max-width:800px){

    .avy-jobs-module .avy-jobs-hero h1,
    .avy-jobs-module .avy-job-detail-hero h1,
    .avy-jobs-module .avy-apply-hero h1{
        font-size:34px;
    }

    .avy-jobs-module .avy-detail-layout{
        grid-template-columns:1fr;
        gap:30px;
    }

    .avy-jobs-module .avy-job-apply-card{
        position:static;
    }

    .avy-jobs-module .avy-form-grid{
        grid-template-columns:1fr;
    }
}

@media(max-width:560px){

    .avy-jobs-module .avy-jobs-hero,
    .avy-jobs-module .avy-job-detail-hero,
    .avy-jobs-module .avy-apply-hero{
        padding:48px 0;
    }

    .avy-jobs-module .avy-job-search{
        flex-direction:column;
    }

    .avy-jobs-module .avy-job-search button{
        padding:14px;
    }

    .avy-jobs-module .avy-job-actions{
        flex-direction:column;
    }

    .avy-jobs-module .avy-job-button{
        width:100%;
        box-sizing:border-box;
    }

    .avy-jobs-module .avy-application-card{
        padding:24px 18px;
    }
}


/* =========================================================
   AVYENTRA JOBS - COMPACT / CLEAN JOB LIST UI
   Add this at the VERY BOTTOM of existing CSS
   ========================================================= */

/* ---------- JOB OPENINGS HERO ---------- */

.avy-jobs-module .avy-jobs-hero{
    padding:48px 0;
    background:#0b132b;
}

.avy-jobs-module .avy-jobs-hero .avy-container{
    max-width:1180px;
}

.avy-jobs-module .avy-jobs-hero h1{
    font-size:42px;
    line-height:1.12;
    margin:0 0 10px;
    font-weight:700;
    color : #f5da85;
    
}

.avy-jobs-module .avy-jobs-hero p{
    font-size:17px;
    line-height:1.5;
    margin:0;
    max-width:720px;
    color: #fff;
}

.avy-jobs-module .avy-eyebrow{
    font-size:11px;
    letter-spacing:2.5px;
    margin-bottom:10px;
    color:#fff;
}


/* ---------- JOB LIST SECTION ---------- */

.avy-jobs-module .avy-jobs-list-section{
    padding:38px 0 50px;
}


/* ---------- SEARCH BAR ---------- */

.avy-jobs-module .avy-job-search{
    display:flex;
    gap:12px;
    background:#f5f5f5;
    padding:12px;
    margin-bottom:24px;
}

.avy-jobs-module .avy-job-search input{
    height:54px;
    padding:12px 16px;
    font-size:15px;
}

.avy-jobs-module .avy-job-search button{
    height:54px;
    min-width:145px;
    padding:0 24px;
    font-size:14px;
}


/* ---------- JOB CARD ---------- */

.avy-jobs-module .avy-job-card{
    padding:20px 24px;
    border:1px solid #dedede;
    background:#fff;
    transition:all .2s ease;
}

.avy-jobs-module .avy-job-card:hover{
    box-shadow:0 8px 22px rgba(0,0,0,.07);
    transform:translateY(-1px);
}


/* ---------- CARD TOP ---------- */

.avy-jobs-module .avy-job-card-top{
    min-height:46px;
}

.avy-jobs-module .avy-job-icon{
    width:48px;
    height:48px;
    border-radius:14px;
}

.avy-jobs-module .avy-job-icon .dashicons{
    font-size:23px;
    width:23px;
    height:23px;
}

.avy-jobs-module .avy-job-date{
    font-size:13px;
    color:#777;
}


/* ---------- JOB TITLE ---------- */

.avy-jobs-module .avy-job-card h2{
    font-size:22px;
    line-height:1.25;
    margin:15px 0 10px;
    font-weight:700;
}


/* ---------- JOB META ---------- */

.avy-jobs-module .avy-job-meta{
    display:flex;
    flex-wrap:wrap;
    gap:5px 18px;
    font-size:14px;
    line-height:1.5;
    margin-bottom:10px;
}


/* ---------- JOB DESCRIPTION ---------- */

.avy-jobs-module .avy-job-excerpt{
    font-size:14px;
    line-height:1.55;
    color:#4d4d4d;

    /* Keep cards compact */
    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
    overflow:hidden;
}


/* ---------- BUTTONS ---------- */

.avy-jobs-module .avy-job-actions{
    display:flex;
    gap:9px;
    margin-top:15px;
}

.avy-jobs-module .avy-job-button{
    padding:10px 19px;
    min-height:42px;
    font-size:14px;
}

.avy-jobs-module .avy-job-button .dashicons{
    font-size:16px;
}


/* ---------- SPACE BETWEEN JOB CARDS ---------- */

.avy-jobs-module .avy-jobs-grid{
    gap:16px;
}


/* =========================================================
   DESKTOP - SHOW 2 TO 3 JOBS COMFORTABLY
   ========================================================= */

@media(min-width:801px){

    .avy-jobs-module .avy-jobs-hero{
        padding:42px 0;
    }

    .avy-jobs-module .avy-jobs-list-section{
        padding:32px 0 45px;
    }

    .avy-jobs-module .avy-job-card{
        padding:18px 24px;
    }

}


/* =========================================================
   TABLET
   ========================================================= */

@media(max-width:800px){

    .avy-jobs-module .avy-jobs-hero{
        padding:38px 0;
    }

    .avy-jobs-module .avy-jobs-hero h1{
        font-size:34px;
    }

    .avy-jobs-module .avy-jobs-hero p{
        font-size:16px;
    }

    .avy-jobs-module .avy-jobs-list-section{
        padding:30px 0 40px;
    }

    .avy-jobs-module .avy-job-card{
        padding:18px 20px;
    }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media(max-width:560px){

    .avy-jobs-module .avy-jobs-hero{
        padding:32px 0;
    }

    .avy-jobs-module .avy-jobs-hero h1{
        font-size:30px;
        margin-bottom:8px;
    }

    .avy-jobs-module .avy-jobs-hero p{
        font-size:15px;
        line-height:1.5;
    }

    .avy-jobs-module .avy-jobs-list-section{
        padding:24px 0 35px;
    }

    .avy-jobs-module .avy-job-search{
        padding:10px;
        gap:8px;
        margin-bottom:18px;
    }

    .avy-jobs-module .avy-job-search input{
        height:48px;
        padding:10px 13px;
        font-size:14px;
    }

    .avy-jobs-module .avy-job-search button{
        height:46px;
        min-width:100%;
        padding:10px;
    }

    .avy-jobs-module .avy-job-card{
        padding:16px;
    }

    .avy-jobs-module .avy-job-card h2{
        font-size:20px;
        margin:13px 0 9px;
    }

    .avy-jobs-module .avy-job-meta{
        font-size:13px;
        gap:4px 12px;
    }

    .avy-jobs-module .avy-job-excerpt{
        font-size:13.5px;
        -webkit-line-clamp:2;
    }

    .avy-jobs-module .avy-job-actions{
        margin-top:13px;
    }

    .avy-jobs-module .avy-job-button{
        min-height:40px;
        padding:9px 16px;
        font-size:13px;
    }

}

/* =========================================================
   AVYENTRA JOB LISTINGS
   Hide job description from listing cards only
   Keep all other job information unchanged
   ========================================================= */

/* Hide the long job-description text */
.avy-job-card p {
    display: none !important;
}

/* Keep the job card compact */
.avy-job-card {
    padding: 20px 26px !important;
}

/* Keep title and posted time on the same clean card */
.avy-job-card h3 {
    margin-bottom: 10px !important;
}

/* Keep job information row visible */
.avy-job-card .avy-job-meta {
    margin-bottom: 0 !important;
}

/* Keep buttons visible if they exist */
.avy-job-card .avy-job-actions {
    margin-top: 16px !important;
}

/* =========================================================
   IMPORTANT:
   Do NOT hide anything inside the search section
   ========================================================= */

.avy-job-search,
.avy-search,
.avy-jobs-search,
.avy-job-search-form {
    display: flex !important;
}


/* =========================================================
   AVYENTRA JOB LISTING
   Hide description on desktop + mobile
   Keep all other job information
   ========================================================= */

.avy-job-card p {
    display: none !important;
}

/* Compact desktop card */
.avy-job-card {
    padding: 20px 26px !important;
}

/* Job title */
.avy-job-card h3 {
    margin-bottom: 10px !important;
}

/* Job information */
.avy-job-card .avy-job-meta {
    margin-bottom: 0 !important;
}

/* Buttons */
.avy-job-card .avy-job-actions {
    margin-top: 16px !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    /* Hide description on mobile as well */
    .avy-job-card p {
        display: none !important;
    }

    /* Smaller, cleaner job card */
    .avy-job-card {
        padding: 16px 18px !important;
    }

    /* Job title */
    .avy-job-card h3 {
        font-size: 20px !important;
        line-height: 1.3 !important;
        margin-bottom: 10px !important;
    }

    /* Job information can wrap naturally */
    .avy-job-card .avy-job-meta {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 6px 12px !important;
        margin-bottom: 0 !important;
    }

    /* Keep buttons usable on phone */
    .avy-job-card .avy-job-actions {
        margin-top: 14px !important;
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

}
/* =========================================================
   AVY FEATURED JOBS
   FULL WIDTH + RESPONSIVE
   ========================================================= */

.avy-featured-jobs {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);

    margin-top: 0;
    margin-bottom: 0;

    padding: 38px 0 42px;

    background: #ffffff;

    box-sizing: border-box;
}


/* =========================================================
   CONTAINER
   ========================================================= */

.avy-featured-jobs-container {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0 5.5%;
    box-sizing: border-box;
}


/* =========================================================
   HEADER
   ========================================================= */

.avy-featured-jobs-header {
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    margin-bottom: 18px;
    box-sizing: border-box;
}

.avy-featured-jobs-heading {
    margin: 0;
    padding: 0;
}


/* =========================================================
   LATEST OPPORTUNITIES
   ========================================================= */

.avy-featured-jobs-eyebrow {
    margin: 0 0 5px;
    padding: 0;

    font-family: Arial, Helvetica, sans-serif;

    font-size: 11px;
    line-height: 1.2;
    font-weight: 700;

    letter-spacing: 1.5px;

    text-transform: uppercase;

    color: #B88927;
}


/* =========================================================
   MAIN HEADING
   ========================================================= */

.avy-featured-jobs-heading h2 {
    margin: 0;
    padding: 0;

    font-family:
        Georgia,
        "Times New Roman",
        serif;

    font-size: 35px;
    line-height: 1.08;
    font-weight: 500;

    color: #111111;
}


/* =========================================================
   VIEW ALL JOBS
   ========================================================= */

.avy-view-all-jobs {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    margin-bottom: 4px;

    text-decoration: none !important;

    color: #B88927 !important;

    white-space: nowrap;

    flex-shrink: 0;
}

.avy-view-all-text {
    font-family: Arial, Helvetica, sans-serif;

    font-size: 11px;
    line-height: 1.2;
    font-weight: 700;

    letter-spacing: 0.6px;

    color: #B88927 !important;
}

.avy-view-all-arrow {
    font-family: Arial, Helvetica, sans-serif;

    font-size: 18px;
    line-height: 1;

    color: #B88927 !important;

    transition: transform .2s ease;
}

.avy-view-all-jobs:hover {
    color: #B88927 !important;
}

.avy-view-all-jobs:hover .avy-view-all-arrow {
    transform: translateX(4px);
}


/* =========================================================
   JOB GRID - DESKTOP
   ========================================================= */

.avy-featured-jobs-grid {
    width: 100%;

    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    gap: 20px;

    margin: 0;
    padding: 0;

    box-sizing: border-box;
}


/* =========================================================
   JOB CARD
   ========================================================= */

.avy-featured-job-card {
    position: relative;

    width: 100%;
    min-width: 0;

    min-height: 174px;

    padding: 16px 18px 14px;

    box-sizing: border-box;

    background: #ffffff;

    border: 1px solid #E7E7E7;

    border-radius: 5px;

    box-shadow:
        0 2px 8px rgba(0,0,0,.035);

    text-decoration: none;

    color: #222222;

    cursor: pointer;

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        border-color .2s ease;
}


/* =========================================================
   CARD HOVER
   ========================================================= */

.avy-featured-job-card:hover {
    transform: translateY(-2px);

    border-color: #dddddd;

    box-shadow:
        0 5px 15px rgba(0,0,0,.07);

    color: #222222;
}


/* =========================================================
   TITLE AREA
   ========================================================= */

.avy-featured-job-top {
    width: 100%;

    display: flex;

    align-items: flex-start;

    justify-content: space-between;

    gap: 8px;

    margin: 0 0 4px;

    padding: 0;
}


/* =========================================================
   JOB TITLE
   ========================================================= */

.avy-featured-job-title {
    flex: 1;

    margin: 0;
    padding: 0;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 16px;
    line-height: 1.2;
    font-weight: 700;

    color: #222222;
}


/* =========================================================
   GOLD CARD ARROW
   ========================================================= */

.avy-featured-job-arrow {
    flex: 0 0 auto;

    font-size: 20px;
    line-height: 1;

    color: #B88927;

    transition: transform .2s ease;
}

.avy-featured-job-card:hover .avy-featured-job-arrow {
    transform: translateX(3px);
}


/* =========================================================
   DEPARTMENT
   ========================================================= */

.avy-featured-job-department {
    margin: 0 0 12px;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 12px;
    line-height: 1.3;

    font-weight: 400;

    color: #505050;
}


/* =========================================================
   DETAILS
   ========================================================= */

.avy-featured-job-detail {
    width: 100%;

    display: flex;

    align-items: center;

    gap: 8px;

    margin: 0 0 8px;

    padding: 0;
}


/* =========================================================
   ICON
   ========================================================= */

.avy-featured-job-icon {
    flex: 0 0 18px;

    width: 18px;
    height: 18px;

    display: flex;

    align-items: center;
    justify-content: center;
}

.avy-featured-job-icon svg {
    width: 15px;
    height: 15px;

    fill: none;

    stroke: #6F6F6F;

    stroke-width: 1.7;

    stroke-linecap: round;
    stroke-linejoin: round;
}


/* =========================================================
   DETAIL TEXT
   ========================================================= */

.avy-featured-job-value {
    min-width: 0;

    overflow: hidden;

    text-overflow: ellipsis;

    white-space: nowrap;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 12px;

    line-height: 1.3;

    color: #505050;
}


/* =========================================================
   NO JOBS
   ========================================================= */

.avy-no-featured-jobs {
    padding: 20px 0;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    font-size: 14px;

    color: #666666;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1024px) {

    .avy-featured-jobs-container {
        padding-left: 4%;
        padding-right: 4%;
    }

    .avy-featured-jobs-heading h2 {
        font-size: 32px;
    }

    .avy-featured-jobs-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 16px;
    }

    .avy-featured-job-card {
        min-height: 174px;
    }
}


/* =========================================================
   MOBILE
   HORIZONTAL SWIPE SLIDER
   ========================================================= */

@media (max-width: 767px) {

    /* -----------------------------------------------------
       SECTION FULL WIDTH
       ----------------------------------------------------- */

    .avy-featured-jobs {
        width: 100vw;
        max-width: 100vw;

        margin-left: calc(50% - 50vw);

        padding: 30px 0 35px;

        overflow: hidden;
    }


    /* -----------------------------------------------------
       CONTAINER
       ----------------------------------------------------- */

    .avy-featured-jobs-container {
        width: 100%;
        max-width: 100%;

        margin: 0;

        padding-left: 18px;
        padding-right: 0;

        box-sizing: border-box;
    }


    /* -----------------------------------------------------
       HEADER
       ----------------------------------------------------- */

    .avy-featured-jobs-header {
        display: block;

        width: 100%;

        margin-bottom: 18px;

        padding-right: 18px;

        box-sizing: border-box;
    }


    /* -----------------------------------------------------
       EYEBROW
       ----------------------------------------------------- */

    .avy-featured-jobs-eyebrow {
        margin-bottom: 5px;

        font-size: 10px;

        letter-spacing: 1.5px;
    }


    /* -----------------------------------------------------
       HEADING
       ----------------------------------------------------- */

    .avy-featured-jobs-heading h2 {
        font-size: 28px;

        line-height: 1.1;
    }


    /* -----------------------------------------------------
       VIEW ALL JOBS
       ----------------------------------------------------- */

    .avy-view-all-jobs {
        display: inline-flex;

        margin-top: 10px;
        margin-bottom: 0;

        gap: 7px;
    }

    .avy-view-all-text {
        font-size: 11px;
    }

    .avy-view-all-arrow {
        font-size: 18px;
    }


    /* =====================================================
       JOB GRID
       CHANGE GRID TO HORIZONTAL SCROLL
       ===================================================== */

    .avy-featured-jobs-grid {

        display: flex;

        flex-direction: row;

        flex-wrap: nowrap;

        align-items: stretch;

        width: 100%;

        gap: 13px;

        margin: 0;

        padding: 0 18px 8px 0;

        box-sizing: border-box;

        overflow-x: auto;

        overflow-y: hidden;

        scroll-snap-type: x mandatory;

        scroll-behavior: smooth;

        -webkit-overflow-scrolling: touch;

        scrollbar-width: none;
    }


    /* Hide scrollbar - Chrome/Safari/Edge */

    .avy-featured-jobs-grid::-webkit-scrollbar {
        display: none;
    }


    /* =====================================================
       MOBILE CARD
       ONE CARD PER SCREEN
       ===================================================== */

    .avy-featured-job-card {

        flex: 0 0 calc(100vw - 36px);

        width: calc(100vw - 36px);

        min-width: calc(100vw - 36px);

        max-width: calc(100vw - 36px);

        min-height: 174px;

        padding: 16px 18px 14px;

        box-sizing: border-box;

        scroll-snap-align: start;

        scroll-snap-stop: always;

        transform: none;
    }


    /* -----------------------------------------------------
       MOBILE HOVER DISABLED
       ----------------------------------------------------- */

    .avy-featured-job-card:hover {
        transform: none;

        box-shadow:
            0 2px 8px rgba(0,0,0,.035);
    }


    /* -----------------------------------------------------
       MOBILE TITLE
       ----------------------------------------------------- */

    .avy-featured-job-title {
        font-size: 16px;

        line-height: 1.2;
    }


    /* -----------------------------------------------------
       MOBILE DEPARTMENT
       ----------------------------------------------------- */

    .avy-featured-job-department {
        margin-bottom: 12px;

        font-size: 12px;
    }


    /* -----------------------------------------------------
       MOBILE DETAILS
       ----------------------------------------------------- */

    .avy-featured-job-detail {
        gap: 8px;

        margin-bottom: 8px;
    }


    .avy-featured-job-value {
        font-size: 12px;
    }


    .avy-featured-job-icon {
        flex: 0 0 18px;

        width: 18px;
        height: 18px;
    }


    /* -----------------------------------------------------
       MOBILE CARD ARROW
       ----------------------------------------------------- */

    .avy-featured-job-arrow {
        font-size: 20px;
    }
}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 480px) {

    .avy-featured-jobs {
        padding-top: 27px;
        padding-bottom: 30px;
    }


    .avy-featured-jobs-container {
        padding-left: 15px;
        padding-right: 0;
    }


    .avy-featured-jobs-header {
        padding-right: 15px;

        margin-bottom: 17px;
    }


    .avy-featured-jobs-heading h2 {
        font-size: 25px;
    }


    /* -----------------------------------------------------
       SLIDER
       ----------------------------------------------------- */

    .avy-featured-jobs-grid {

        gap: 12px;

        padding-right: 15px;
    }


    /* -----------------------------------------------------
       CARD WIDTH
       ----------------------------------------------------- */

    .avy-featured-job-card {

        flex: 0 0 calc(100vw - 30px);

        width: calc(100vw - 30px);

        min-width: calc(100vw - 30px);

        max-width: calc(100vw - 30px);

        min-height: 174px;

        padding: 16px 17px 14px;
    }


    .avy-featured-job-title {
        font-size: 16px;
    }


    .avy-featured-job-department {
        font-size: 12px;

        margin-bottom: 12px;
    }


    .avy-featured-job-value {
        font-size: 12px;
    }
}


/* =========================================================
   VERY SMALL PHONES
   ========================================================= */

@media (max-width: 360px) {

    .avy-featured-jobs-heading h2 {
        font-size: 24px;
    }


    .avy-featured-job-card {

        min-height: 170px;

        padding: 15px;
    }
}