/*==================================================
  CAREER HIGHLIGHTS — COMPACT VERSION
==================================================*/

.career-highlights-section{
    padding:70px 0 80px;
    background:#f8fbff;
    position:relative;
}

.career-highlights-section .container{
    max-width:1400px;
    margin:0 auto;
    padding:0 20px;
}


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

.career-highlights-section .section-header{
    text-align:center;
    margin-bottom:0;
}

.career-highlights-section .section-tag{
    display:block;
    margin-bottom:8px;
}

.career-highlights-section .section-intro{
    max-width:850px;
    margin:12px auto 0;
}


/*=========================================
GRID
=========================================*/

.highlights-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:24px;
    margin-top:42px;
}


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

.highlight-card{
    background:#ffffff;

    border-radius:18px;

    padding:28px 22px 26px;

    text-align:center;

    position:relative;
    overflow:hidden;

    border:1px solid rgba(15,60,120,.08);

    box-shadow:0 10px 28px rgba(0,0,0,.07);

    transition:.3s ease;

    box-sizing:border-box;
}


/*=========================================
TOP ACCENT
=========================================*/

.highlight-card::before{
    content:"";

    position:absolute;
    top:0;
    left:0;

    width:100%;
    height:4px;

    background:linear-gradient(
        90deg,
        #0f3c78,
        #ff8a00
    );
}


/*=========================================
ICON
=========================================*/

.highlight-icon{
    width:72px;
    height:72px;

    margin:4px auto 18px;

    border-radius:50%;

    background:#ffffff;

    border:2px solid rgba(255,138,0,.25);

    display:flex;
    justify-content:center;
    align-items:center;

    box-shadow:0 7px 18px rgba(0,0,0,.07);

    transition:.3s ease;
}

.highlight-icon img{
    width:42px;
    height:42px;

    object-fit:contain;

    display:block;
}


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

.highlight-card h3{
    font-size:1.12rem;

    color:#082b52;

    margin:0 0 12px;

    font-weight:700;

    line-height:1.3;
}


/*=========================================
TEXT
=========================================*/

.highlight-card p{
    font-size:.88rem;

    line-height:1.55;

    color:#666;

    margin:0;
}

.highlight-card strong{
    color:#0f3c78;
}


/*=========================================
HOVER
=========================================*/

.highlight-card:hover{
    transform:translateY(-5px);

    box-shadow:0 16px 32px rgba(0,0,0,.10);
}

.highlight-card:hover .highlight-icon{
    transform:scale(1.05);

    border-color:#ff8a00;
}


/*=========================================
TABLET
=========================================*/

@media (max-width:1200px){

    .highlights-grid{
        grid-template-columns:repeat(2,1fr);
    }

}


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

@media (max-width:768px){

    .career-highlights-section{
        padding:55px 0 65px;
    }

    .highlights-grid{
        grid-template-columns:1fr;
        gap:20px;
        margin-top:35px;
    }

    .highlight-card{
        padding:26px 22px 24px;
    }

}