.green {

    color: var(--green);
}

/* Single post (news/press/etc.) content area */
#single-post {
    padding: 60px 0;
    background: var(--white);
}

#single-post .services-tab-body-text p {
    margin-bottom: 1.1em;
}






#media-news-section {
    background: var(--navy-900);

    padding: 60px 0;
}



#media-news-section .news-card {
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    height: 350px;
    /* 🔥 force equal height */
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
}

#media-news-section .news-card .new-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* 🔥 keeps image proportional */
}

#media-news-section .news-card::after {
    content: "";
    position: absolute;
    inset: 0;

    background: linear-gradient(to top, rgba(0, 0, 47, 1) 16%, rgba(72, 72, 106, 0.71) 36%, rgba(174, 174, 189, 0.32) 62%, rgba(235, 235, 238, 0.08) 71%, rgba(255, 255, 255, 0) 100%);

    z-index: 1;
}


/* Bottom gradient ONLY (not full overlay) */
#media-news-section .news-content {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;

    padding: 20px;
    color: #fff;
    z-index: 2;


}

#media-news-section .datemedia-icon {
    width: 10px !important;
    height: 10px !important;
}

/* Badge */
#media-news-section .news-badge {
    position: absolute;
    top: 20px;
    right: 0px;
    background: var(--color-primary);
    color: #fff;
    padding: 10px 25px;
    border-radius: 30px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    font-size: var(--fs-small);
    z-index: 3;
}

#media-news-section .news-date {
    font-size: var(--fs-caption);
    font-family: var(--font-gamily);
    font-weight: 300;
}


#media-news-section .news-text {
    font-size: var(--fs-small);
    margin: 0;
}


.news-title {
    margin: 6px 0 12px;
    font-weight: 600;
    font-size: var(--fs-h3);
    font-family: var(--font-gamily);
}

.news-title-link {
    color: inherit;
    text-decoration: none;
    transition: color var(--hover-duration) ease;
}

.news-title-link:hover,
.news-title-link:focus-visible {
    color: var(--cyan-500);
}

/* Tabsss */


#media-tabs {
    background: linear-gradient(90deg,
            #ACADB1 0%,
            #C4C4C6 5%,
            #D5D5D6 10%,
            #DFDEDF 15%,
            #E3E2E2 20%,
            #CBCBCC 30%,
            #D6D6D6 40%,
            #E3E2E2 50%,
            #DCDBDB 60%,
            #CBCBCC 70%,
            #CFCFD0 80%,
            #D3D3D4 87%,
            #B3B4B7 95%,
            #A7A9AD 100%);
    ;
    padding: 50px 0 50px;
}



#media-tabs .nav-tabs-custom .nav-link {
    font-weight: 700;
    color: var(--navy-900);
    border: none;
    transition: all 0.2s;
    font-size: var(--fs-h3);
    background: transparent;
}


#media-tabs .nav-tabs-custom .nav-link:hover {

    color: var(--color-primary);

}

#media-tabs .nav-tabs-custom .nav-link.active {
    background: transparent;
    color: var(--color-primary);

}

/* -------------------- ROAD SAFETY SECTION STYLES (from second code) -------------------- */
#media-tabs .event-card {
    background: rgba(255, 255, 255, 0.98);
    border: none;
    border-radius: 28px;
    box-shadow: 14px 16px 12px rgba(0, 0, 0, 0.2), 5px -4px 6px rgba(0, 0, 0, 0.1);
    transition: all 0.35s cubic-bezier(0.2, 0.9, 0.4, 1.1);
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
}

#media-tabs .tab-pane.active .event-card {
    animation: fadeSlideUp 0.55s cubic-bezier(0.2, 0.9, 0.3, 1.1) backwards;
}

@keyframes fadeSlideUp {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

#media-tabs .event-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 28px 40px -16px rgba(0, 0, 0, 0.18), 0 0 0 1px rgba(239, 68, 68, 0.08);
}

#media-tabs .card-img-top-custom {
    width: 100%;
    height: 200px;
    object-fit: cover;
    transition: transform 0.4s ease;
}

#media-tabs .event-card:hover .card-img-top-custom {
    transform: scale(1.02);
}

#media-tabs .card-body-custom {
    padding: 1.3rem 1.3rem 1.6rem 1.3rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}



#media-tabs .event-meta {
    margin-bottom: 1rem;
    font-size: var(--fs-small);
    display: flex;
    align-items: center;
    gap: 0.39rem;
    color: var(--navy-900);
}

#media-tabs .btn-custom {
    border-radius: 60px;
    padding: 0.5rem 0.8rem;
    font-weight: 400;
    font-size: var(--fs-button);

}

#media-tabs .btn-custom-outline {
    border: 1.5px solid var(--color-primary);
    background: #44B6E5;
    color: var(--navy-900);

}

#media-tabs .btn-half {
    flex: 0 0 50%;
    max-width: 50%;
}

#media-tabs .btn-custom-outline:hover {
    background: var(--navy-800);
    color: var(--color-primary);
}




/* CARD LAYOUT */
#media-tabs .event-card-horizontal {
    display: flex;
    align-items: stretch;
    border-radius: 30px;
    overflow: hidden;
    border: 2px solid var(--color-primary);
    background: #f8fbff;
}

/* LEFT IMAGE */
#media-tabs .event-card-horizontal .event-image {
    flex: 0 0 36%;
}

#media-tabs .event-card-horizontal .event-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* RIGHT CONTENT */
#media-tabs .event-card-horizontal .event-content {
    flex: 1;
    padding: 25px 30px;
    display: flex;
    flex-direction: column;
}


#media-tabs .event-card-horizontal .btn-half {
    flex: 0 0 20%;
    max-width: 50%;
}

@media (max-width: 1027.98px) {

    #media-tabs .event-card-horizontal .btn-half {
        flex: 0 0 25%;
        max-width: 50%;
    }

}

@media (max-width: 991.98px) {

    #media-news-section {
        padding: 85px 0 40px;
    }

    #media-tabs .event-card-horizontal .btn-half {
        flex: 0 0 37%;
        max-width: 50%;
    }

    #media-tabs .event-card-horizontal .event-content {
        flex: 1;
        padding: 15px 20px;
    }

}

@media (max-width: 767px) {
    .event-card-horizontal {
        flex-direction: column;
    }

    .event-image {
        flex: 100%;
        height: 200px;
    }

    .event-btn {
        justify-content: center;
    }

    #media-tabs .event-card-horizontal .btn-half {
        flex: 0 0 50%;
        max-width: 50%;
    }
}


@media (max-width: 767.98px) {

    #media-news-section {
        padding: 65px 0 30px;
    }

    #media-tabs {
        padding: 20px 0 30px;
    }

}


.gallery-slider {
    width: 100%;
}

.gallery-slider {
    padding-bottom: 70px;
}

.gallery-slider .swiper-slide {
    width: 100%;
}

.swiper-pagination-bullet {
    background: var(--navy-900);
    opacity: 1;
    height: 14px;
    width: 14px;
}

.swiper-pagination-bullet-active {
    background: var(--color-primary);
    opacity: 1;
    height: 14px;
    width: 14px;
}

.gallery-slider img {
    width: 100%;
    height: 700px;
    /* optional */
    object-fit: cover;
    border-radius: 30px;
}


@media (max-width: 767.98px) {

    .gallery-slider img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .gallery-slider {
        padding-bottom: 45px;
    }

    .swiper-pagination-bullet {
        background: var(--navy-900);
        opacity: 1;
        height: 10px;
        width: 10px;
    }

    .swiper-pagination-bullet-active {
        background: var(--color-primary);
        opacity: 1;
        height: 10px;
        width: 10px;
    }

}


#get-in-touch-career {
    position: relative;
	background: var(--white);
	padding: 60px 0px 20px;

}

#get-in-touch-career .row {
    position: relative;
    z-index: 2;
    margin-bottom: 40px;
    /* THIS creates overlap */
}




/* CARD STYLE */
#get-in-touch-career .feature-card {
    background: #fff;
    border-radius: 25px;
    padding: 35px 16px 30px;
    height: 100%;
    transition: 0.3s;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}

/* HOVER EFFECT */
#get-in-touch-career .feature-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 35px rgba(0, 0, 0, 0.12);
}

/* ICON */
#get-in-touch-career .feature-icon {
    margin-bottom: 25px;
}

#get-in-touch-career .feature-icon img {
    width: 90px;
    height: 90px;
    object-fit: contain;
}

/* TITLE */
#get-in-touch-career .feature-card h5 {
    font-weight: 700;
    margin-bottom: 15px;
    min-height: 60px;
    padding-right: 5px;
    padding-left: 5px;


}



#jobs-section {
    background: linear-gradient(90deg,
            #ACADB1 0%,
            #C4C4C6 5%,
            #D5D5D6 10%,
            #DFDEDF 15%,
            #E3E2E2 20%,
            #CBCBCC 30%,
            #D6D6D6 40%,
            #E3E2E2 50%,
            #DCDBDB 60%,
            #CBCBCC 70%,
            #CFCFD0 80%,
            #D3D3D4 87%,
            #B3B4B7 95%,
            #A7A9AD 100%);


}

#jobs-section {
    position: relative;
    z-index: 1;
    padding-top: 50px;
    /* adjust based on overlap */

    padding-bottom: 40px;
}


#jobs-section .job-card {
    background: #fff;
    border-radius: 20px;
    padding: 30px;
    height: 100%;
    transition: all 0.3s ease;
}

#jobs-section .job-card:hover {
    transform: translateY(-5px);
}

/* Header */
#jobs-section .job-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 20px;
}

#jobs-section .job-title {
    font-size: var(--fs-h4);
    font-weight: 600;
    color: #1F3A5F;
    margin-bottom: 5px;
}

#jobs-section .job-meta {
    color: #26A9E0;
    font-size: var(--fs-body);
    margin: 0;
}

/* Button */
#jobs-section .apply-btn {
    background: #26A9E0;
    color: #fff;
    padding: 8px 40px;
    border-radius: 30px;
    text-decoration: none;
    font-size: var(--fs-button);
    white-space: nowrap;
    transition: 0.3s;
}

#jobs-section .apply-btn:hover {
    background: var(--navy-800);
    color: var(--white);
}


@media (max-width: 991.98px) {
	
	#get-in-touch-career{
	 padding: 80px 0px 15px;
	}


    #get-in-touch-career .feature-card h5 {
        min-height: 30px;

    }

    /* #jobs-section {
        padding-top: 245px;

    } */


}

@media (max-width: 767px) {
    #jobs-section .job-header {
        flex-direction: column;
        align-items: flex-start;
    }

    /* .apply-btn {
        margin-top: 10px;
    } */
    /* #jobs-section {
        padding-top: 228px;
    } */
	
	#get-in-touch-career{
	 padding: 55px 0px 15px;
	}

    #get-in-touch-career .feature-card {
        background: #fff;
        border-radius: 25px;
        padding: 20px 16px 20px;

    }

    #get-in-touch-career .feature-icon img {
        width: 70px;
        height: 70px;

    }
}

#jobs-section .job-card,
#get-in-touch-career .feature-card,
#impact-card .feature-card,
#csr .custom-card {
    opacity: 0;
    transform: translateY(var(--reveal-distance));
    transition: opacity var(--reveal-duration) var(--reveal-easing),
                transform var(--hover-duration) var(--reveal-easing);
}

#jobs-section .job-card.is-visible,
#get-in-touch-career .feature-card.is-visible,
#impact-card .feature-card.is-visible,
#csr .custom-card.is-visible {
    opacity: 1;
    transform: translateY(0);
}





/* page Our Impact */

.green-initiative-class {
    width: 100%;
    height: 780px;
    position: relative;
    z-index: 0;
}


#impact-card {
    background: linear-gradient(90deg,
            #ACADB1 0%,
            #C4C4C6 5%,
            #D5D5D6 10%,
            #DFDEDF 15%,
            #E3E2E2 20%,
            #CBCBCC 30%,
            #D6D6D6 40%,
            #E3E2E2 50%,
            #DCDBDB 60%,
            #CBCBCC 70%,
            #CFCFD0 80%,
            #D3D3D4 87%,
            #B3B4B7 95%,
            #A7A9AD 100%);

    padding-bottom: 100px;


}

/* CARD STYLE */
#impact-card .feature-card {
    background: #fff;
    border-radius: 30px;
    padding: 40px 25px 35px;
    border: 3px solid var(--green);
    height: 100%;
    transition: 0.3s;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
}

/* HOVER EFFECT */
#impact-card .feature-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 35px rgba(0, 0, 0, 0.12);
}

/* ICON */
#impact-card .feature-icon {
    margin-bottom: 30px;
}

#impact-card .feature-icon img {
    width: 100px;
    height: 100px;
    object-fit: contain;
}

/* TITLE */
#impact-card .feature-card h5 {
    font-weight: 700;
    margin-bottom: 25px;
    min-height: 75px;
    padding-right: 5px;
    padding-left: 5px;


}

#impact-card .row {

    margin-top: -320px;
    position: relative;
}



@media (min-width: 1441px) {

    .green-initiative-class {
        width: 100%;
        height: 780px;
        position: relative;
        z-index: 0;
    }



    #impact-card .row {

        margin-top: -320px;
        position: relative;
    }


}

@media (min-width: 1280px) {


    #impact-card .row {
        margin-top: -330px;

    }
}

@media (max-width: 1027px) {

    #impact-card .row {
        margin-top: -275px;

    }

    .green-initiative-class {
        height: 690px;
    }

    #impact-card .feature-card h5 {
        margin-bottom: 20px;
        min-height: 60px;
    }

}

@media (max-width: 991px) {

    #impact-card .row {
        margin-top: -290px;

    }

    #impact-card .feature-icon {
        margin-bottom: 20px;
    }

    #impact-card .feature-icon img {
        width: 85px;
        height: 85px;
        object-fit: contain;
    }

    .green-initiative-class {
        height: 560px;
    }

    #impact-card .feature-card h5 {
        margin-bottom: 15px;
        min-height: 20px;
    }

    #impact-card .feature-card {
        background: #fff;
        border-radius: 30px;
        padding: 20px 25px 20px;
    }

    #impact-card {
        padding-bottom: 60px;
    }


}



@media (max-width: 767px) {}



/* csr */

#csr {
    background: #4a8d5b;
    padding: 40px 0 60px;
}


#csr .custom-card {
    background: #fff;
    padding: 25px 20px 20px;
    border-radius: 30px;
        box-shadow: 14px 16px 12px rgba(0, 0, 0, 0.2), 5px -4px 6px rgba(0, 0, 0, 0.1);
    transition: 0.3s ease;
}

#csr .custom-card:hover {
    transform: translateY(-5px);
}

#csr .card-title {
    font-weight: 600;
    color: var(--navy-900);
    font-size: var(--fs-h3);
}

#csr .card-date {
    color: var(--navy-900);
    font-size: var(--fs-body);
    margin-bottom: 10px;
    font-weight: 400;
}



#csr .read-more {
    font-size: var(--fs-button) !important;
}



#csr .card-image img {
    border-radius: 15px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    width: 100%;
    height: 280px;
    object-fit: cover;
}

/* CSR Community: dynamic listing (see template-our-impact.php) */
#csr .csr-desc-clamp {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.csr-card-hidden {
    display: none;
}

/* Generic "load more" batching, reused by the Media news grid and the
   Careers job listing (see template-media.php / template-career.php). */
.load-more-hidden {
    display: none;
}

/* "Read more" popup - wider dialog, title + description only, styled
   like a real card instead of a bare Bootstrap default modal. */
.csr-modal-dialog {
    max-width: 720px;
}

.csr-modal-content {
    position: relative;
    border: none;
    border-radius: 30px;
    overflow: hidden;
    box-shadow: 0 25px 60px rgba(0, 0, 0, 0.35);
}

.csr-modal-close {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 2;
    width: 36px;
    height: 36px;
    background-color: #f4f4f4;
    background-position: center;
    border-radius: 50%;
    opacity: 1;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.csr-modal-body-wrap {
    padding: 48px 44px 40px;
}

.csr-modal-date {
    display: inline-block;
    background: var(--green);
    color: #fff;
    font-size: var(--fs-small);
    font-weight: 600;
    letter-spacing: 0.02em;
    padding: 5px 16px;
    border-radius: 999px;
    margin-bottom: 14px;
}

.csr-modal-title {
    color: var(--navy-900);
    font-weight: 700;
    font-size: var(--fs-h3);
    margin-bottom: 18px;
}

.csr-modal-body {
    max-height: 45vh;
    overflow-y: auto;
    padding-right: 6px;
    color: var(--navy-900);
    font-size: var(--fs-body);
    line-height: 1.7;
}

.csr-modal-body p {
    margin: 0 0 1em;
}

.csr-modal-body p:last-child {
    margin-bottom: 0;
}

.csr-modal-body::-webkit-scrollbar {
    width: 6px;
}

.csr-modal-body::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.15);
    border-radius: 3px;
}

@media (max-width: 575.98px) {
    .csr-modal-body-wrap {
        padding: 40px 22px 28px;
    }
}

@media (max-width: 767px) {

        #impact-card {
        padding-bottom: 40px;
    }

#csr {
   
    padding: 30px 0 40px;
}

}



/* career Sections */

#driver-section{

     background: linear-gradient(90deg, var(--blue-600) 0%, var(--cyan-500) 50%, var(--blue-600) 100%);
    padding: 50px 0 50px;  
}



/* Pill Field */
#driver-section .field-pill {
    display: flex;
    align-items: center;
    background: var(--white);
    border-radius: 50px;
    padding: 14px 17px;
    margin-bottom: 20px;
}

/* Label */
#driver-section .field-pill label, #driver-section .upload-field label {
    min-width: 110px;
    font-weight: 600;
    color: var(--navy-900);
    margin-bottom: 0;
    font-size: var(--fs-body);
}

/* Input */
#driver-section .field-pill input {
    border: none;
    background: transparent;
    width: 100%;
    outline: none;
    font-size: var(--fs-body);
    color: #6c757d;
}

/* Upload field */
#driver-section .upload-field {
    position: relative;
    overflow: hidden;
}
#driver-section  .upload-field{
     display: flex;
    align-items: center;
    background: var(--white);
    border-radius: 50px;
    margin-bottom: 20px;
     padding-left: 15px;
 }

#driver-section .upload-field {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* File name input */
#driver-section .file-name {
    flex: 1;
    border: none;
    background: transparent;
    outline: none;
    font-size: var(--fs-body);
    color: #6c757d;
}

/* Upload button */
#driver-section .upload-btn {
    background: #0d3b66;
    color: #fff;
    border: none;
    padding: 17px 30px;
    border-radius: 50px;
    white-space: nowrap;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    font-size: var(--fs-button);
}


@media (max-width: 767px) {

    #driver-section {
    padding: 30px 0 30px;
}

#driver-section .field-pill label, #driver-section .upload-field label {
    min-width: 70px;
}

#driver-section .upload-btn {
    padding: 17px 15px;
}

}

#training-deve{

    padding: 40px 0;
}


#training-deve .video-card {
    position: relative;
    border-radius: 30px;
    overflow: hidden;
    cursor: pointer;
    height: 350px;
}

/* Video */
#training-deve .video-bg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 30px;
}

/* Overlay hidden by default */
#training-deve .overlay {
    position: absolute;
    inset: 0;
    background: rgba(20, 60, 100, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    opacity: 0;
    transition: 0.3s ease;
}

/* Show on hover */
#training-deve .video-card:hover .overlay {
    opacity: 1;
}

/* Content */
#training-deve .overlay .content {
    color: #fff;
}

/* Play Button */
#training-deve .career-play-btn {
    width: 70px;
    height: 70px;
    background: #3db2d4;
    border-radius: 50%;
    border: none;
    font-size: 28px;
    color: #fff;
    margin-bottom: 10px;
    cursor: pointer;
}

/* When video is playing */
#training-deve .video-card.playing .overlay {
    opacity: 0;
    pointer-events: none;
}



#search{

    padding: 100px 0 40px;
}

/* CARD LAYOUT */
#search .event-card-horizontal {
    display: flex;
    align-items: stretch;
    border-radius: 30px;
    overflow: hidden;
    border: 2px solid var(--color-primary);
    background: #fff;
}

/* LEFT IMAGE */
#search .event-card-horizontal .event-image {
    flex: 0 0 36%;
}

#search .event-card-horizontal .event-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* RIGHT CONTENT */
#search .event-card-horizontal .event-content {
    flex: 1;
    padding: 25px 30px;
    display: flex;
    flex-direction: column;
}


#search .event-card-horizontal .btn-half {
    flex: 0 0 20%;
    max-width: 50%;
}

@media (max-width: 1027.98px) {

    #search .event-card-horizontal .btn-half {
        flex: 0 0 25%;
        max-width: 50%;
    }

}

@media (max-width: 991.98px) {

    #search .event-card-horizontal .btn-half {
        flex: 0 0 37%;
        max-width: 50%;
    }

    #search .event-card-horizontal .event-content {
        flex: 1;
        padding: 15px 20px;
    }

}

@media (max-width: 767px) {
    #search .event-card-horizontal {
        flex-direction: column;
    }

    

    #search .event-card-horizontal .btn-half {
        flex: 0 0 50%;
        max-width: 50%;
    }
}


@media (max-width: 767.98px) {



    #search {
        padding: 20px 0 30px;
    }


}

.custom-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
}

.custom-pagination .nav-links {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    padding-left: 20px;
}

/* Base style */
.custom-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    padding: 0 14px;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    text-decoration: none;
    font-weight: 500;
    color: #1a1a1a;
    background: #fff;
    transition: all 0.3s ease;
}
.screen-reader-text {
    font-weight: 600;
    font-size: var(--fs-h4);
    font-family: var(--font-gamily);
    color: var(--navy-900);
}

/* Hover */
.custom-pagination a.page-numbers:hover {
    background: var(--navy-900);
    color: #fff;
    border-color: var(--navy-900);
}

/* Active */
.custom-pagination .page-numbers.current {
    background: var(--color-primary);
    color: #fff;
    border-color: var(--color-primary);
    font-weight: 600;
}

/* Prev / Next */
.custom-pagination .prev,
.custom-pagination .next {
    padding: 0 18px;
    font-weight: 600;
}

/* Disabled (if needed) */
.custom-pagination .page-numbers.dots {
    border: none;
    background: transparent;
    pointer-events: none;
}

.navigation{
    display: flex;
    align-items: baseline;

}


/* ==============================
   CAREER CARDS
================================ */

.forcardsvert .career-cards {
    display: flex;
    flex-direction: column;
    gap: 38px;
    padding-top:40px;
    padding-bottom:50px;
}


/* ==============================
   CARD
================================ */

.forcardsvert .career-card {
    display: flex;
    align-items: stretch;
    min-height: 365px;
    overflow: hidden;
    border-radius: 40px;
}


/* ==============================
   LIGHT CARD
================================ */

.forcardsvert .career-card-light {
    background: #fff;
    border: 2px solid var(--navy-900);
}


/* ==============================
   DARK CARD
================================ */

.forcardsvert .career-card-dark {
    background: var(--navy-900);
}


/* ==============================
   IMAGE
================================ */

.forcardsvert .career-image {
    flex: 0 0 36%;
    padding: 25px;
    display: flex;
}

.forcardsvert .career-image img {
    width: 100%;
    height: 100%;
    min-height: 325px;
    object-fit: cover;
    display: block;
}

.forcardsvert .career-card-light .career-image img{
    border-top-left-radius: 40px;
    border-bottom-left-radius: 40px;
}

.forcardsvert .career-card-dark .career-image img{
    border-top-right-radius: 40px;
    border-bottom-right-radius: 40px;
}



/* ==============================
   CONTENT
================================ */

.forcardsvert .career-content {
    flex: 1;
    padding: 45px 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* ==============================
   DESCRIPTION
================================ */

.forcardsvert .career-description p {
    margin: 0 0 25px;
}

.forcardsvert .career-description p:last-child {
    margin-bottom: 0;
}


/* LIGHT CARD TEXT */

.forcardsvert .career-card-light .career-description {
    color: var(--navy-900);
}


/* DARK CARD TEXT */

.forcardsvert .career-card-dark .career-description {
    color: #fff;
}



/* ==============================
   DESKTOP IMAGE SIZING
================================ */

@media (min-width: 992px) {

    .forcardsvert .career-card {
        min-height: 365px;
    }

    .forcardsvert .career-image {
        flex: 0 0 36%;
    }

    .forcardsvert .career-content {
        padding: 45px 20px;
    }

}

@media (min-width: 768px) and (max-width: 991.98px) {

    .forcardsvert .career-card {
        min-height: 320px;
        border-radius: 30px;
    }

    .forcardsvert .career-image {
        flex: 0 0 40%;
        padding: 15px;
    }

    .forcardsvert .career-image img {
        min-height: 290px;
        border-radius: 22px;
    }

    .forcardsvert .career-content {
        padding: 15px;
    }

 
}

@media (max-width: 767.98px) {

    .forcardsvert .career-cards {
        gap: 25px;
    padding-top: 15px;
    padding-bottom: 20px;
    }

    .forcardsvert .career-card {
        flex-direction: column;
        min-height: auto;
        border-radius: 28px;
    }

    .forcardsvert .career-card-light,
    .forcardsvert .career-card-dark {
        border-radius: 28px;
    }

    .forcardsvert .career-image {
        flex: none;
        width: 100%;
        height: 230px;
        padding: 15px;
    }

    .forcardsvert .career-image img {
        min-height: 0;
        height: 100%;
        border-radius: 20px;
    }

    .forcardsvert .career-content {
        padding: 0px 20px 20px;
    }


    .forcardsvert .career-description p {
        margin-bottom: 14px;
    }

    #driver-section .upload-field {
    gap: 6px;
}
    #driver-section .upload-btn {
        padding: 17px 6px;
    }
#jobs-section {
    padding-top: 25px;
    padding-bottom: 30px;
}
}