*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Poppins',sans-serif;
}


/* ===========================
   LOADER
=========================== */

#loader{

    position:fixed;

    inset:0;

    background:#000000;

    display:flex;

    justify-content:center;

    align-items:center;

    z-index:99999;

    transition:opacity .8s ease, visibility .8s;
}

.loader-content{

    text-align:center;

    color:white;
}

.loader-logo{

    width:120px;

    height:120px;

    border-radius:50%;

    border:4px solid white;

    display:flex;

    justify-content:center;

    align-items:center;

    margin:auto;

    font-size:36px;

    font-weight:bold;

    animation:spinLogo 3s infinite linear;
}

.loader-content h2{

    margin-top:20px;

    letter-spacing:3px;
}

.loading-bar{

    width:265px;

    height:6px;

    background:rgba(255,255,255,.3);

    border-radius:20px;

    overflow:hidden;

    margin-top:30px;
}

.loading-bar span{

    display:block;

    height:100%;

    width:0;

    background:#9ACD32;

    animation:loading 2.5s forwards;
}

@keyframes loading{

    to{

        width:100%;
    }
}

@keyframes spinLogo{

    from{

        transform:rotate(0deg);
    }

    to{

        transform:rotate(360deg);
    }
}

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

header{

    position:fixed;

    top:0;

    left:0;

    width:100%;

    padding:20px 8%;

    display:flex;

    justify-content:space-between;

    align-items:center;

    transition:.4s ease;

    z-index:9999;

    background:transparent;

}

/* Sticky Header */

header.scrolled{

    background:rgba(255,255,255,.96);

    backdrop-filter:blur(12px);

    box-shadow:0 10px 30px rgba(0,0,0,.08);

    padding:15px 8%;

}

/* Logo */

.logo img{

    height:60px;

    transition:.35s;

}

header.scrolled .logo img{

    height:50px;

}

/* Navigation */

nav ul{

    display:flex;

    align-items:center;

    gap:35px;

    list-style:none;

}

nav ul li{

    position:relative;

}

nav ul li a{

    color:#ffffff;

    text-decoration:none;

    font-weight:600;

    transition:.3s;

    position:relative;

}

/* Header after scroll */

header.scrolled nav ul li a{

    color:#002D5A;

}

/* Hover */

nav ul li a:hover{

    color:#9ACD32;

}

/* Active */

nav ul li a.active{

    color:#9ACD32;

}

/* Underline */

nav ul li a::after{

    content:"";

    position:absolute;

    left:50%;

    bottom:-8px;

    width:0;

    height:3px;

    background:#9ACD32;

    border-radius:10px;

    transform:translateX(-50%);

    transition:.3s;

}

nav ul li a:hover::after,

nav ul li a.active::after{

    width:100%;

}

/*=========================================
        BLOG DROPDOWN
=========================================*/

.dropdown{
    position: relative;
}

.dropdown > a{
    display: flex;
    align-items: center;
    gap: 6px;
}

/* Hide menu by default */

.dropdown-menu{

    display: none;

    position: absolute;

    top: 100%;

    left: 0;

    min-width: 240px;

    background: #ffffff;

    border-radius: 10px;

    box-shadow: 0 10px 25px rgba(0,0,0,.15);

    padding: 8px 0;

    z-index: 9999;

}

/* TRUE DROPDOWN */

.dropdown-menu{
    display: none;
}

.dropdown-menu.show{
    display: block;


}

.dropdown-menu li a{

    display: block;

    padding: 12px 18px;

    color: #002D5A !important;

    text-decoration: none;

    transition: background .2s;

}

.dropdown-menu li a:hover{

    background: #9ACD32;

    color: #ffffff !important;

}

/* Arrow */

.arrow{

    font-size: 12px;

    transition: .3s;

}

.dropdown:hover .arrow{

    transform: rotate(180deg);

}


/* HERO */

.hero{

    height:100vh;

    position:relative;

    overflow:hidden;

    display:flex;

    justify-content:center;

    align-items:center;

    text-align:center;
}

/*=========================================
        ACTIVE NAVIGATION
=========================================*/

nav ul li a{

    position:relative;

    transition:.3s;

}

/* Active Link */

nav ul li a.active{

    color:#9ACD32;

}

/* Animated Underline */

nav ul li a::after{

    content:"";

    position:absolute;

    left:50%;

    bottom:-8px;

    width:0;

    height:3px;

    background:#9ACD32;

    border-radius:5px;

    transform:translateX(-50%);

    transition:.3s ease;

}

nav ul li a:hover::after{

    width:100%;

}

nav ul li a.active::after{

    width:100%;

}

/*=========================================
        HERO TYPING EFFECT
=========================================*/

.hero h2{

    font-size:58px;

    color:#ffffff;

    line-height:1.3;

    margin-bottom:25px;

}

#typing-text{

    color:#9ACD32;

    font-weight:700;

}

.cursor{

    color:#9ACD32;

    font-weight:bold;

    animation:blink .8s infinite;

}

@keyframes blink{

    50%{

        opacity:0;

    }

}

@media(max-width:768px){

    .hero h2{

        font-size:38px;

    }

}

/* Slides */

.slideshow{

    position:absolute;

    width:100%;

    height:100%;
}

.slide{

    position:absolute;

    width:100%;

    height:100%;

    background-size:cover;

    background-position:center;

    opacity:0;

    transition:opacity 1.5s ease-in-out;

    transform:scale(1);

    animation:zoom 12s linear infinite;
}

.slide.active{

    opacity:1;
}

/* Dark Overlay */

.overlay{

    position:absolute;

    width:100%;

    height:100%;

    background:rgba(0,0,0,.55);
}

/* Hero Text */

.hero-content{

    position:relative;

    color:white;

    z-index:2;

    animation:heroFade 1.5s ease;

}

@keyframes heroFade{

    from{

        opacity:0;

        transform:translateY(80px);
    }

    to{

        opacity:1;

        transform:translateY(0);
    }
}

.hero-content h1{

    font-size:65px;

    margin-bottom:20px;

    text-shadow:2px 2px 10px black;
}

.hero-content p{

    font-size:22px;

    max-width:800px;

    margin:auto;

    line-height:1.8;

    text-shadow:1px 1px 6px black;
}

/* Button */

.btn{

    display:inline-block;

    margin-top:40px;

    padding:18px 45px;

    background:#9ACD32;

    color:white;

    border-radius:40px;

    text-decoration:none;

    animation:float 2s infinite ease-in-out;

    transition:.4s;
}

.btn:hover{

    background:#0A66C2;

    transform:scale(1.08);
}

@keyframes float{

    0%{

        transform:translateY(0);
    }

    50%{

        transform:translateY(-8px);
    }

    100%{

        transform:translateY(0);
    }
}

.btn:hover{

    background:#0A66C2;

    transform:translateY(-5px);
}

/* Zoom Animation */

@keyframes zoom{

    from{

        transform:scale(1);
    }

    to{

        transform:scale(1.15);
    }
}

/*==================================================
                ABOUT SECTION
==================================================*/

.about{

    padding:100px 8%;
    background:#ffffff;
    position:relative;
    overflow:hidden;

}

/* Background Pattern */

.about::before{

    content:"";
    position:absolute;
    width:400px;
    height:400px;
    border-radius:50%;
    background:rgba(10,102,194,.04);
    top:-180px;
    right:-180px;
    filter:blur(50px);

}

.about::after{

    content:"";
    position:absolute;
    width:300px;
    height:300px;
    border-radius:50%;
    background:rgba(154,205,50,.05);
    bottom:-120px;
    left:-120px;
    filter:blur(40px);

}

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

.about .section-title{

    text-align:center;
    margin-bottom:60px;

}

.about .section-title span{

    color:#9ACD32;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;

}

.about .section-title h2{

    font-size:42px;
    color:#002D5A;
    margin-top:10px;

}

/*=========================================
            SLIDER
=========================================*/

.about-slider{

    display:flex;
    align-items:center;
    justify-content:center;
    gap:25px;
    position:relative;

}

.about-wrapper{

    width:100%;
    max-width:1150px;
    overflow:hidden;

}

/*=========================================
            SLIDES
=========================================*/

.about-slide{

    display:none;
    align-items:center;
    gap:60px;
    animation:aboutFade .6s ease;

}

.about-slide.active{

    display:flex;

}

@keyframes aboutFade{

    from{

        opacity:0;
        transform:translateX(40px);

    }

    to{

        opacity:1;
        transform:translateX(0);

    }

}

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

.about-image{

    flex:1;

}

.about-image img{

    width:100%;
    border-radius:20px;
    object-fit:cover;
    box-shadow:0 20px 45px rgba(0,0,0,.12);
    transition:.4s;

}

.about-image img:hover{

    transform:scale(1.02);

}

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

.about-content{

    flex:1;

}

.about-content span{

    display:inline-block;
    color:#0A66C2;
    font-weight:700;
    margin-bottom:12px;
    letter-spacing:1px;

}

.about-content h3{

    font-size:36px;
    color:#002D5A;
    margin-bottom:20px;

}

.about-content p{

    color:#555;
    font-size:17px;
    line-height:1.9;
    margin-bottom:20px;

}

.about-content ul{

    list-style:none;
    padding:0;
    margin-top:20px;

}

.about-content ul li{

    margin-bottom:12px;
    color:#555;
    font-size:17px;
    position:relative;
    padding-left:28px;

}

.about-content ul li::before{

    content:"✔";
    position:absolute;
    left:0;
    color:#9ACD32;
    font-weight:bold;

}

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

.about-btn{

    width:60px;
    height:60px;
    border:none;
    border-radius:50%;
    background:#0A66C2;
    color:#fff;
    font-size:22px;
    cursor:pointer;
    transition:.3s;
    box-shadow:0 10px 25px rgba(10,102,194,.25);

}

.about-btn:hover{

    background:#9ACD32;
    color:#002D5A;
    transform:scale(1.08);

}

/*=========================================
            DOTS
=========================================*/

.about-dots{

    margin-top:45px;
    text-align:center;

}

.about-dots .dot{

    width:14px;
    height:14px;
    background:#d5d5d5;
    display:inline-block;
    margin:0 6px;
    border-radius:50%;
    cursor:pointer;
    transition:.3s;

}

.about-dots .dot:hover{

    background:#0A66C2;

}

.about-dots .dot.active{

    width:35px;
    border-radius:20px;
    background:#0A66C2;

}

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

@media(max-width:992px){

    .about-slide{

        flex-direction:column;
        text-align:center;
        gap:40px;

    }

    .about-content h3{

        font-size:30px;

    }

    .about-btn{

        width:50px;
        height:50px;

    }

}

@media(max-width:768px){

    .about{

        padding:80px 6%;

    }

    .about .section-title h2{

        font-size:32px;

    }

    .about-content h3{

        font-size:28px;

    }

    .about-content p{

        font-size:16px;

    }

    .about-slider{

        gap:10px;

    }

}

@media(max-width:576px){

    .about-btn{

        position:absolute;
        top:45%;
        z-index:10;

    }

    .about-btn.prev{

        left:0;

    }

    .about-btn.next{

        right:0;

    }

}

/* ===================================
   SCROLL ANIMATION
=================================== */

.hidden{

    opacity:0;

    transform:translateY(80px);

    transition:all 1s ease;
}

.show{

    opacity:1;

    transform:translateY(0);
}

.card{

    opacity:0;

    transform:translateY(40px);

    transition:all .8s ease;
}

.about.show .card{

    opacity:1;

    transform:translateY(0);
}

.about.show .card:nth-child(1){

    transition-delay:.2s;
}

.about.show .card:nth-child(2){

    transition-delay:.5s;
}

/*==================================================
            WHY CHOOSE US
==================================================*/

.why-us{

    position: relative;

    width: 100%;

    padding: 100px 8%;

    overflow: hidden;

    background-image:
        linear-gradient(rgba(0,45,90,.75), rgba(0,45,90,.75)),
        url("imagesstatistics-bg.jpg");

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

    background-attachment: fixed;
}

/* Dark Overlay */

.why-overlay{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.15);

    z-index:1;
}

/* Main Container */

.why-container{

    position:relative;

    z-index:3;

    width:100%;

    max-width:1300px;

    margin:auto;
}

/* Heading */

.section-header{

    text-align:center;

    margin-bottom:70px;
}

.section-header span{

    color:#9ACD32;

    font-size:16px;

    letter-spacing:3px;

    font-weight:600;
}

.section-header h2{

    font-size:48px;

    color:#fff;

    margin:20px 0;
}

.section-header p{

    max-width:750px;

    margin:auto;

    color:rgba(255,255,255,.9);

    line-height:1.8;

    font-size:18px;
}

/* Grid */

.why-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(300px,1fr));

    gap:30px;
}

/* Cards */

.why-card{

    background:rgba(255,255,255,.12);

    border:1px solid rgba(255,255,255,.18);

    backdrop-filter:blur(15px);

    -webkit-backdrop-filter:blur(15px);

    border-radius:20px;

    padding:40px 30px;

    text-align:center;

    transition:.4s;

    box-shadow:0 15px 35px rgba(0,0,0,.25);
}

.why-card:hover{

    transform:translateY(-12px);

    background:rgba(255,255,255,.18);

    border-color:#9ACD32;

    box-shadow:
    0 0 30px rgba(154,205,50,.35),
    0 15px 40px rgba(0,0,0,.35);
}

/* Icons */

.why-card img{

    width:75px;

    height:75px;

    object-fit:contain;

    margin-bottom:25px;

    filter:brightness(0) invert(1);

    transition:.4s;
}

.why-card:hover img{

    transform:scale(1.15) rotate(8deg);
}

/* Text */

.why-card h3{

    color:#fff;

    margin-bottom:15px;

    font-size:24px;
}

.why-card p{

    color:rgba(255,255,255,.85);

    line-height:1.8;
}

/* Floating Background */

.background-shapes{

    position:absolute;

    inset:0;

    z-index:2;

    overflow:hidden;
}

.shape{

    position:absolute;

    border-radius:50%;

    background:rgba(255,255,255,.06);

    animation:floatShape 18s infinite ease-in-out;
}

.shape1{

    width:220px;

    height:220px;

    left:-80px;

    top:80px;
}

.shape2{

    width:350px;

    height:350px;

    right:-100px;

    top:120px;

    animation-delay:2s;
}

.shape3{

    width:180px;

    height:180px;

    left:20%;

    bottom:50px;

    animation-delay:4s;
}

.shape4{

    width:260px;

    height:260px;

    right:15%;

    bottom:-60px;

    animation-delay:6s;
}

@keyframes floatShape{

    0%{

        transform:translateY(0px);
    }

    50%{

        transform:translateY(-35px);
    }

    100%{

        transform:translateY(0px);
    }
}

/* Responsive */

@media(max-width:768px){

    .why-us{

        padding:80px 5%;
    }

    .section-header h2{

        font-size:36px;
    }

    .why-grid{

        grid-template-columns:1fr;
    }

}

/*=========================================
            OUR ACHIEVEMENTS
=========================================*/

.statistics{

    width:100%;

    padding:100px 8%;

    background:#ffffff;
}

.statistics-container{

    max-width:1300px;

    margin:auto;
}

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

.stats-title{

    text-align:center;

    margin-bottom:70px;
}

.stats-title span{

    color:#9ACD32;

    font-size:16px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;
}

.stats-title h2{

    margin:20px 0;

    font-size:48px;

    color:#002D5A;

    font-weight:700;
}

.stats-title p{

    max-width:700px;

    margin:auto;

    color:#666;

    line-height:1.8;

    font-size:18px;
}

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

.stats-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));

    gap:30px;
}

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

.stat-box{

    background:#ffffff;

    border-radius:20px;

    padding:40px 30px;

    text-align:center;

    border:1px solid #e8edf3;

    box-shadow:0 10px 30px rgba(0,0,0,.08);

    transition:.35s;
}

.stat-box:hover{

    transform:translateY(-10px);

    border-color:#9ACD32;

    box-shadow:
    0 15px 35px rgba(10,102,194,.12),
    0 20px 40px rgba(0,0,0,.10);
}

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

.stat-image{

    width:80px;

    height:80px;

    object-fit:contain;

    margin-bottom:20px;

    animation:floating 3s ease-in-out infinite;
}

/*==========================
        NUMBER
===========================*/

.stat-box h3{

    font-size:55px;

    color:#0A66C2;

    margin-bottom:15px;

    font-weight:700;
}

/*==========================
        LABEL
===========================*/

.stat-box p{

    color:#555;

    font-size:18px;

    font-weight:500;
}

/*==========================
      FLOAT ANIMATION
===========================*/

@keyframes floating{

    0%{

        transform:translateY(0px);

    }

    50%{

        transform:translateY(-10px);

    }

    100%{

        transform:translateY(0px);

    }

}

/*======================================================
                RECRUITMENT PROCESS
======================================================*/

.process{

    padding:100px 8%;

    background:#ffffff;

    overflow:hidden;

}

.process-container{

    max-width:1300px;

    margin:auto;

}

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

.section-header21{

    text-align:center;

    margin-bottom:80px;

}

.section-header21 span{

    display:inline-block;

    color:#9ACD32;

    font-size:15px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

    margin-bottom:15px;

}

.section-header21 h2{

    font-size:46px;

    color:#002D5A;

    margin-bottom:20px;

}

.section-header21 p{

    max-width:720px;

    margin:auto;

    color:#666;

    line-height:1.8;

    font-size:17px;

}

/*======================================================
                    TIMELINE
======================================================*/

.process-timeline{

    position:relative;

    display:grid;

    grid-template-columns:repeat(6,1fr);

    gap:30px;

    align-items:flex-start;

}

/* Animated Timeline Line */

.process-timeline::before{

    content:"";

    position:absolute;

    top:45px;

    left:8%;

    width:84%;

    height:5px;

    background:#0A66C2;

    border-radius:20px;

    z-index:1;

    transform:scaleX(0);

    transform-origin:left;

    animation:lineGrow 2s ease forwards;

}

/*======================================================
                    STEP
======================================================*/

.process-step{

    position:relative;

    text-align:center;

    z-index:2;

    opacity:0;

    transform:translateY(40px);

    animation:fadeUp .8s ease forwards;

}

.process-step:nth-child(1){

    animation-delay:.2s;

}

.process-step:nth-child(2){

    animation-delay:.4s;

}

.process-step:nth-child(3){

    animation-delay:.6s;

}

.process-step:nth-child(4){

    animation-delay:.8s;

}

.process-step:nth-child(5){

    animation-delay:1s;

}

.process-step:nth-child(6){

    animation-delay:1.2s;

}

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

.process-icon{

    position:relative;

    width:90px;

    height:90px;

    margin:auto;

    border-radius:50%;

    background:#0A66C2;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#ffffff;

    font-size:34px;

    box-shadow:0 12px 30px rgba(10,102,194,.25);

    overflow:hidden;

    transition:.35s;

    animation:floating 3s ease-in-out infinite;

}

/* Pulse Ring */

.process-icon::after{

    content:"";

    position:absolute;

    width:100%;

    height:100%;

    border-radius:50%;

    border:2px solid rgba(10,102,194,.30);

    animation:pulse 2.8s infinite;

}

.process-step:hover .process-icon{

    background:#9ACD32;

    color:#002D5A;

    transform:translateY(-10px) scale(1.10);

    box-shadow:0 18px 35px rgba(154,205,50,.35);

}

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

.process-step h3{

    margin-top:25px;

    margin-bottom:15px;

    color:#002D5A;

    font-size:22px;

}

.process-step p{

    color:#666;

    line-height:1.7;

    font-size:15px;

    padding:0 10px;

}

/*======================================================
                    ANIMATIONS
======================================================*/

@keyframes lineGrow{

    from{

        transform:scaleX(0);

    }

    to{

        transform:scaleX(1);

    }

}

@keyframes floating{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-8px);

    }

    100%{

        transform:translateY(0);

    }

}

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

@keyframes pulse{

    0%{

        transform:scale(1);

        opacity:.7;

    }

    100%{

        transform:scale(1.4);

        opacity:0;

    }

}

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

@media(max-width:1200px){

    .process-timeline{

        grid-template-columns:repeat(3,1fr);

        row-gap:60px;

    }

    .process-timeline::before{

        display:none;

    }

}

@media(max-width:768px){

    .process{

        padding:80px 6%;

    }

    .section-header h2{

        font-size:34px;

    }

    .process-timeline{

        grid-template-columns:1fr;

        gap:50px;

    }

    .process-step{

        max-width:400px;

        margin:auto;

    }

}

/*==================================================
            OUR TRUSTED PARTNERS
==================================================*/

.partners{

    position: relative;

    padding: 100px 8%;

    overflow: hidden;

    background-image:
        linear-gradient(rgba(0,45,90,.85), rgba(0,45,90,.85)),
        url("pic1.jpg");

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

    background-attachment: fixed;

}

/* Container */

.partners-container{

    max-width: 1300px;

    margin: auto;

    position: relative;

    z-index: 2;

}

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

.partners .section-header{

    text-align: center;

    margin-bottom: 70px;

}

.partners .section-header span{

    display: inline-block;

    color: #9ACD32;

    font-size: 15px;

    font-weight: 700;

    letter-spacing: 3px;

    text-transform: uppercase;

    margin-bottom: 15px;

}

.partners .section-header h2{

    color: #ffffff;

    font-size: 46px;

    margin-bottom: 20px;

}

.partners .section-header p{

    max-width: 720px;

    margin: auto;

    color: rgba(255,255,255,.9);

    line-height: 1.8;

    font-size: 17px;

}

/*=========================================
            LOGO SLIDER
=========================================*/

.partners-wrapper{

    width: 100%;

    overflow: hidden;

    position: relative;

}

/* Left Fade */

.partners-wrapper::before{

    content: "";

    position: absolute;

    top: 0;

    left: 0;

    width: 120px;

    height: 100%;

    background: linear-gradient(to right,
        rgba(0,45,90,1),
        rgba(0,45,90,0));

    z-index: 5;

}

/* Right Fade */

.partners-wrapper::after{

    content: "";

    position: absolute;

    top: 0;

    right: 0;

    width: 120px;

    height: 100%;

    background: linear-gradient(to left,
        rgba(0,45,90,1),
        rgba(0,45,90,0));

    z-index: 5;

}

/*=========================================
            TRACK
=========================================*/

.partners-track{

    display:flex;

    align-items:center;

    gap:30px;

    width:max-content;

    animation:logoSlide 60s linear infinite;

    will-change:transform;



}

/* Pause Animation */

.partners-wrapper:hover .partners-track{

    animation-play-state: paused;

}

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

.partner-card{

    width: 230px;

    height: 160px;

    flex-shrink: 0;

    display: flex;

    justify-content: center;

    align-items: center;

    background: rgba(255,255,255,.12);

    backdrop-filter: blur(14px);

    -webkit-backdrop-filter: blur(14px);

    border: 1px solid rgba(255,255,255,.18);

    border-radius: 20px;

    transition: .35s;

    box-shadow: 0 15px 35px rgba(0,0,0,.25);

}

.partner-card:hover{

    transform:translateY(-8px);

    background:rgba(255,255,255,.22);

    box-shadow:
        0 15px 40px rgba(0,0,0,.30),
        0 0 20px rgba(255,255,255,.20);



}

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

.partner-card img{

    max-width: 230px;

    max-height: 160px;

    object-fit: contain;

    transition: .35s;

    

    border-radius: 20px;

}

.partner-card:hover img{

    filter: grayscale(0);

    transform: scale(1.08);

}

/*=========================================
            CONTINUOUS ANIMATION
=========================================*/

@keyframes logoSlide{

    0%{

        transform:translateX(0);

    }

    100%{

        transform:translateX(-50%);

    }



}

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

@media(max-width:992px){

    .partner-card{

        width: 200px;

        height: 140px;

    }

}

@media(max-width:768px){

    .partners{

        padding: 80px 6%;

        background-attachment: scroll;

    }

    .partners .section-header h2{

        font-size: 34px;

    }

    .partner-card{

        width: 170px;

        height: 120px;

    }

    .partner-card img{

        max-width: 120px;

        max-height: 60px;

    }

    .partners-wrapper::before,

    .partners-wrapper::after{

        width: 50px;

    }

}

/*======================================================
                SUCCESS STORIES
======================================================*/

.testimonials{

    padding:100px 8%;

    background:#ffffff;

    overflow:hidden;

}

.testimonials-container{

    max-width:1300px;

    margin:auto;

}

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

.testimonials .section-header{

    text-align:center;

    margin-bottom:70px;

}

.testimonials .section-header span{

    display:inline-block;

    color:#9ACD32;

    font-size:15px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

    margin-bottom:15px;

}

.testimonials .section-header h2{

    color:#002D5A;

    font-size:46px;

    margin-bottom:20px;

    position:relative;

}

.testimonials .section-header h2::after{

    content:"";

    display:block;

    width:80px;

    height:4px;

    background:#0A66C2;

    border-radius:20px;

    margin:18px auto 0;

}

.testimonials .section-header p{

    max-width:720px;

    margin:auto;

    color:#666;

    line-height:1.8;

    font-size:17px;

}

/*======================================================
                TESTIMONIAL SLIDER
======================================================*/
/*=========================================
        TESTIMONIALS
=========================================*/

.testimonials{

    padding:100px 8%;

    background:#f8fbff;

    text-align:center;

}

.testimonial-slider{

    max-width:850px;

    margin:auto;

    position:relative;

}

.testimonial-card{

    display:none;

    background:#fff;

    padding:45px;

    border-radius:20px;

    box-shadow:0 15px 40px rgba(0,0,0,.08);

    animation:fade .6s;

}

.testimonial-card.active{

    display:block;

}

@keyframes fade{

    from{

        opacity:0;

        transform:translateY(20px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

.stars{

    color:#FFD700;

    font-size:28px;

    margin-bottom:25px;

}

.testimonial-text{

    font-size:18px;

    color:#555;

    line-height:1.8;

    margin-bottom:35px;

    font-style:italic;

}

.testimonial-card img{

    width:90px;

    height:90px;

    border-radius:50%;

    object-fit:cover;

    border:5px solid #9ACD32;

    margin-bottom:20px;

}

.testimonial-card h3{

    color:#002D5A;

    margin-bottom:8px;

}

.testimonial-card span{

    color:#0A66C2;

    font-weight:600;

}

.testimonial-dots{

    margin-top:30px;

}

.dot{

    width:14px;

    height:14px;

    background:#ccc;

    display:inline-block;

    border-radius:50%;

    margin:0 6px;

    cursor:pointer;

    transition:.3s;

}

.dot.active{

    background:#0A66C2;

}

@media(max-width:768px){

    .testimonial-card{

        padding:30px;

    }

    .testimonial-text{

        font-size:16px;

    }

}

/*======================================================
                    FAQ SECTION
======================================================*/

.faq{

    position: relative;

    padding: 100px 8%;

    overflow: hidden;

    background-image:
        linear-gradient(rgba(0,45,90,.85), rgba(0,45,90,.85)),
        url("slide1.jpg");

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

    background-attachment: fixed;

}

.faq-container{

    max-width:1000px;

    margin:auto;

}

.faq-list{

    margin-top:60px;

}

.faq-item{

    background:#ffffff;

    border-radius:18px;

    margin-bottom:20px;

    overflow:hidden;

    box-shadow:0 10px 25px rgba(0,0,0,.08);

    transition:.35s;

}

.faq-item:hover{

    transform:translateY(-3px);

}

.faq-question{

    width:100%;

    background:none;

    border:none;

    padding:25px 30px;

    display:flex;

    justify-content:space-between;

    align-items:center;

    cursor:pointer;

    font-size:19px;

    font-weight:600;

    color:#002D5A;

    text-align:left;

}

.faq-question i{

    color:#0A66C2;

    transition:.35s;

}

.faq-answer{

    max-height:0;

    overflow:hidden;

    transition:max-height .45s ease;

}

.faq-answer p{

    padding:0 30px 25px;

    color:#666;

    line-height:1.8;

}

.faq-item.active .faq-answer{

    max-height:250px;

}

.faq-item.active .faq-question i{

    transform:rotate(45deg);

    color:#9ACD32;

}

/* Responsive */

@media(max-width:768px){

    .faq{

        padding:80px 6%;

    }

    .faq-question{

        font-size:17px;

        padding:20px;

    }

    .faq-answer p{

        padding:0 20px 20px;

    }

}

.faq-item{

    border-left:5px solid transparent;

}

.faq-item.active{

    border-left:5px solid #9ACD32;

}

/*==================================================
                CONTACT US
==================================================*/

.contact{

    padding:100px 8%;

    background:#ffffff;

}

.contact-container{

    max-width:1300px;

    margin:auto;

}

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

.contact .section-header{

    text-align:center;

    margin-bottom:70px;

}

.contact .section-header span{

    display:inline-block;

    color:#9ACD32;

    font-size:15px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

    margin-bottom:15px;

}

.contact .section-header h2{

    color:#002D5A;

    font-size:46px;

    margin-bottom:20px;

    position:relative;

}

.contact .section-header h2::after{

    content:"";

    display:block;

    width:80px;

    height:4px;

    background:#0A66C2;

    border-radius:20px;

    margin:18px auto 0;

}

.contact .section-header p{

    max-width:700px;

    margin:auto;

    color:#666;

    line-height:1.8;

    font-size:17px;

}

/*=========================================
            LAYOUT
=========================================*/

.contact-content{

    display:grid;

    grid-template-columns:1fr 1.2fr;

    gap:40px;

}

/*=========================================
            CONTACT INFO
=========================================*/

.contact-info{

    background:#f7f9fc;

    border-radius:25px;

    padding:40px;

    box-shadow:0 12px 30px rgba(0,0,0,.08);

}

.contact-info h3{

    color:#002D5A;

    margin-bottom:30px;

    font-size:30px;

}

.info-box{

    display:flex;

    gap:18px;

    align-items:flex-start;

    margin-bottom:30px;

}

.info-box i{

    width:60px;

    height:60px;

    background:#0A66C2;

    color:#ffffff;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:22px;

    transition:.3s;

}

.info-box:hover i{

    background:#9ACD32;

    color:#002D5A;

    transform:translateY(-5px);

}

.info-box h4{

    color:#002D5A;

    margin-bottom:8px;

}

.info-box p{

    color:#666;

    line-height:1.7;

}

/*=========================================
            CONTACT FORM
=========================================*/

.contact-form{

    background:#ffffff;

    padding:40px;

    border-radius:25px;

    box-shadow:0 12px 30px rgba(0,0,0,.08);

}

.contact-form form{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.contact-form input,

.contact-form textarea{

    width:100%;

    padding:16px 20px;

    border:1px solid #d9d9d9;

    border-radius:12px;

    font-size:16px;

    color:#002D5A;

    transition:.3s;

    outline:none;

    background:#ffffff;

}

.contact-form input::placeholder,

.contact-form textarea::placeholder{

    color:#999;

}

.contact-form input:focus,

.contact-form textarea:focus{

    border-color:#0A66C2;

    box-shadow:0 0 10px rgba(10,102,194,.15);

}

.contact-form textarea{

    resize:vertical;

}

/*=========================================
            BUTTON
=========================================*/

.contact-form button{

    background:#0A66C2;

    color:#ffffff;

    border:none;

    padding:16px;

    border-radius:50px;

    font-size:17px;

    font-weight:600;

    cursor:pointer;

    transition:.3s;

}

.contact-form button:hover{

    background:#9ACD32;

    color:#002D5A;

}




/*==================================================
                    FOOTER
==================================================*/

.footer{

    background:#001B36;

    color:#ffffff;

    padding:80px 8% 0;

    

}

.footer-container{

    max-width:1300px;

    margin:auto;

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:50px;

    margin:0 0 8px;
    line-height:1;

}

/* Column */

.footer-column h3{

    color:#ffffff;

    margin-bottom:25px;

    font-size:22px;

    position:relative;
    

}

.footer-column h3::after{

    content:"";

    width:50px;

    height:3px;

    background:#9ACD32;

    position:absolute;

    left:0;

    bottom:-10px;

    border-radius:20px;

}

.footer-column p{

    color:rgba(255,255,255,.75);

    line-height:1.8;

    margin-bottom:15px;

    font-size:15px;

}

.footer-column i{

    color:#9ACD32;

    margin-right:10px;

}

/* Links */

.footer-column ul{

    list-style:none;

}

.footer-column ul li{

    margin-bottom:14px;

}

.footer-column ul li a{

    color:rgba(255,255,255,.75);

    text-decoration:none;

    transition:.3s;

}

.footer-column ul li a:hover{

    color:#9ACD32;

    padding-left:8px;

}

/* Social Icons */

.social-links{

    display:flex;

    gap:15px;

    margin-top:30px;

}

.social-links a{

    width:45px;

    height:45px;

    border-radius:50%;

    background:rgba(255,255,255,.08);

    display:flex;

    justify-content:center;

    align-items:center;

    color:#ffffff;

    transition:.3s;

    text-decoration:none;

}

.social-links a:hover{

    background:#9ACD32;

    color:#002D5A;

    transform:translateY(-6px);

}

/* Bottom */

.footer-bottom{

    border-top:1px solid rgba(255,255,255,.12);

    margin-top:60px;

    padding:25px 0;

    text-align:center;

}

.footer-bottom p{

    color:rgba(255,255,255,.65);

    font-size:14px;

}

.footer-map{
    margin-top:20px;
}

.footer-map h4{
    color:#ffffff;
    font-size:18px;
    margin-bottom:12px;
}

.footer-map iframe{
    width:100%;
    height:160px;
    border:3px solid #7ED957;   /* Yellow-green accent */
    border-radius:12px;
    box-shadow:0 8px 20px rgba(0,0,0,.2);

}

/* Responsive */

@media(max-width:992px){

    .footer-container{

        grid-template-columns:repeat(2,1fr);

    }

}

@media(max-width:768px){

    .footer{

        padding:70px 6% 0;

    }

    .footer-container{

        grid-template-columns:1fr;

        gap:40px;

    }

}

/*=============================
    FLOATING CONTACT BUTTON
==============================*/

.floating-contact{


    
    position:fixed;

    bottom:160px;

    Right:30px;

    z-index:9999;

    display:flex;

    flex-direction:column;

    align-items:center;

}

/* Contact Options */

.contact-options{

    display:flex;

    flex-direction:column;

    gap:12px;

    margin-bottom:15px;

    opacity:0;

    visibility:hidden;

    transform:translateY(20px);

    transition:.35s ease;

}

.contact-options.show{

    opacity:1;

    visibility:visible;

    transform:translateY(0);

}

/* Icons */

.contact-options a{

    width:56px;

    height:56px;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    text-decoration:none;

    color:#fff;

    font-size:24px;

    box-shadow:0 12px 25px rgba(0,0,0,.25);

    transition:.35s;

}

.contact-options a:hover{

    transform:translateY(-5px) scale(1.1);

}

/* Individual Colors */

.messenger{

    background:#0084FF;

}

.whatsapp{

    background:#25D366;

}

.viber{

    background:#7360F2;

}

.phone{

    background:#0A66C2;

}

/* Main Button */

#contactToggle{

    width:70px;

    height:70px;

    border:none;

    border-radius:50%;

    background:#9ACD32;

    color:#fff;

    cursor:pointer;

    font-size:30px;

    box-shadow:0 15px 35px rgba(0,0,0,.30);

    transition:.35s;

    animation:pulseButton 2s infinite;

}

#contactToggle:hover{

    transform:scale(1.1);

    background:#002D5A;

    color:#9ACD32;

}

/* Pulse Animation */

@keyframes pulseButton{

    0%{

        box-shadow:0 0 0 0 rgba(10,102,194,.55);

    }

    70%{

        box-shadow:0 0 0 18px rgba(10,102,194,0);

    }

    100%{

        box-shadow:0 0 0 0 rgba(10,102,194,0);

    }

}

/* Mobile */

@media(max-width:768px){

    #contactToggle{

        width:60px;

        height:60px;

        font-size:24px;

    }

    .contact-options a{

        width:50px;

        height:50px;

        font-size:20px;

    }

}

/*=========================================
            APPLICANT CTA
=========================================*/

.cta{

    position:relative;

    padding:110px 8%;

    text-align:center;

    overflow:hidden;

    background-image:
        linear-gradient(rgba(0,45,90,.82), rgba(0,45,90,.82)),
        url("slide1.jpg");

    background-size:cover;

    background-position:center;

    background-attachment:fixed;

}

.cta-overlay{

    position:absolute;

    inset:0;

    background:rgba(0,0,0,.15);

}

.cta-container{

    position:relative;

    z-index:2;

    max-width:850px;

    margin:auto;

}

.cta span{

    display:inline-block;

    color:#9ACD32;

    font-size:15px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

    margin-bottom:20px;

}

.cta h2{

    color:#ffffff;

    font-size:52px;

    margin-bottom:25px;

    line-height:1.2;

}

.cta p{

    color:rgba(255,255,255,.92);

    font-size:18px;

    line-height:1.8;

    margin-bottom:45px;

}

.cta-buttons{

    display:flex;

    justify-content:center;

    gap:20px;

    flex-wrap:wrap;

}

.cta-btn{

    padding:18px 36px;

    border-radius:50px;

    text-decoration:none;

    font-size:17px;

    font-weight:600;

    transition:.35s;

    display:inline-flex;

    align-items:center;

    gap:12px;

}

.cta-btn.primary{

    background:#9ACD32;

    color:#002D5A;

}

.cta-btn.primary:hover{

    background:#ffffff;

    transform:translateY(-5px);

}

.cta-btn.secondary{

    border:2px solid #ffffff;

    color:#ffffff;

}

.cta-btn.secondary:hover{

    background:#ffffff;

    color:#002D5A;

    transform:translateY(-5px);

}

@media(max-width:768px){

    .cta{

        padding:80px 6%;

        background-attachment:scroll;

    }

    .cta h2{

        font-size:36px;

    }

    .cta p{

        font-size:16px;

    }

}

/*=========================================
        SECTION DIVIDER
=========================================*/

.section-divider{

    width:100%;

    overflow:hidden;

    line-height:0;

}

.section-divider svg{

    display:block;

    width:100%;

    height:70px;

    fill:#f8fbff; /* Match the next section background */

}

#progressBar{

    position:fixed;

    top:0;

    left:0;

    width:0;

    height:4px;

    background:linear-gradient(
        90deg,
        #9ACD32 0%,
        #00C6FF 50%,
        #0A66C2 100%
    );

    box-shadow:
        0 0 10px rgba(154,205,50,.35),
        0 0 20px rgba(10,102,194,.25);

    z-index:10000;

    transition:width .08s linear;

}


/* =========================================
        FLOATING CHATBOT
========================================= */

.chatbot-wrapper{

    position:fixed;

    right:30px;

    bottom:72px;

    z-index:10000;

    font-family:'Poppins', sans-serif;

}


/* =========================================
        CHATBOT TOGGLE BUTTON
========================================= */

.chatbot-toggle{

    position:relative;

    width:70px;

    height:70px;

    border:none;

    border-radius:50%;

    background:#9ACD32;

    color:#002D5A;

    display:flex;

    align-items:center;

    justify-content:center;

    cursor:pointer;

    box-shadow:
        0 10px 30px rgba(0,0,0,.20);

    transition:.35s ease;

    animation:chatbotPulse 2.5s infinite;

}

.chatbot-toggle:hover{

    transform:scale(1.1);

    background:#002D5A;

    color:#ffffff;

}

.chatbot-icon{

    font-size:28px;

    line-height:1;

}


/* Notification */

.chatbot-notification{

    position:absolute;

    top:-3px;

    right:-3px;

    width:21px;

    height:21px;

    border-radius:50%;

    background:#e63946;

    color:#ffffff;

    font-size:11px;

    font-weight:700;

    display:flex;

    align-items:center;

    justify-content:center;

    border:2px solid #ffffff;

}


/* =========================================
        PULSE ANIMATION
========================================= */

@keyframes chatbotPulse{

    0%{

        box-shadow:
            0 0 0 0 rgba(154,205,50,.55),
            0 10px 30px rgba(0,0,0,.20);

    }

    70%{

        box-shadow:
            0 0 0 14px rgba(154,205,50,0),
            0 10px 30px rgba(0,0,0,.20);

    }

    100%{

        box-shadow:
            0 0 0 0 rgba(154,205,50,0),
            0 10px 30px rgba(0,0,0,.20);

    }

}


/* =========================================
        CHATBOT WINDOW
========================================= */

.chatbot-box{

    position:absolute;

    right:0;

    bottom:78px;

    width:360px;

    height:520px;

    background:#ffffff;

    border-radius:20px;

    overflow:hidden;

    box-shadow:
        0 20px 60px rgba(0,0,0,.20);

    display:flex;

    flex-direction:column;

    opacity:0;

    visibility:hidden;

    transform:
        translateY(20px)
        scale(.95);

    transform-origin:bottom right;

    transition:.35s ease;

}


/* Open */

.chatbot-box.active{

    opacity:1;

    visibility:visible;

    transform:
        translateY(0)
        scale(1);

}


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

.chatbot-header{

    min-height:78px;

    padding:14px 18px;

    background:
        linear-gradient(
            135deg,
            #002D5A,
            #0A66C2
        );

    color:#ffffff;

    display:flex;

    align-items:center;

    justify-content:space-between;

}


.chatbot-title{

    display:flex;

    align-items:center;

    gap:12px;

}


.chatbot-avatar{

    width:45px;

    height:45px;

    border-radius:50%;

    background:#9ACD32;

    color:#002D5A;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:22px;

}


.chatbot-title h3{

    margin:0;

    font-size:16px;

}


.chatbot-title span{

    display:block;

    margin-top:2px;

    font-size:11px;

    color:#9ACD32;

}


.chatbot-close{

    border:none;

    background:transparent;

    color:#ffffff;

    font-size:28px;

    cursor:pointer;

    line-height:1;

}


/* =========================================
        MESSAGES
========================================= */

.chatbot-messages{

    flex:1;

    padding:18px;

    overflow-y:auto;

    background:#f5f8fb;

}


.bot-message{

    display:flex;

    gap:9px;

    margin-bottom:18px;

}


.message-avatar{

    flex-shrink:0;

    width:32px;

    height:32px;

    border-radius:50%;

    background:#9ACD32;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:16px;

}


.message-content{

    max-width:80%;

    background:#ffffff;

    padding:11px 14px;

    border-radius:
        4px
        15px
        15px
        15px;

    box-shadow:
        0 3px 10px rgba(0,0,0,.05);

}


.message-content p{

    margin:0 0 7px;

    font-size:13px;

    line-height:1.55;

    color:#444;

}


.message-content p:last-child{

    margin-bottom:0;

}


/* =========================================
        USER MESSAGE
========================================= */

.user-message{

    display:flex;

    justify-content:flex-end;

    margin-bottom:15px;

}


.user-message p{

    max-width:80%;

    margin:0;

    padding:11px 14px;

    border-radius:
        15px
        4px
        15px
        15px;

    background:#0A66C2;

    color:#ffffff;

    font-size:13px;

    line-height:1.5;

}


/* =========================================
        QUICK QUESTIONS
========================================= */

.quick-questions{

    display:flex;

    flex-direction:column;

    gap:8px;

    margin-left:41px;

}


.quick-questions button{

    border:1px solid #dce5ed;

    background:#ffffff;

    color:#002D5A;

    padding:10px 12px;

    border-radius:10px;

    text-align:left;

    font-family:inherit;

    font-size:12px;

    cursor:pointer;

    transition:.25s ease;

}


.quick-questions button:hover{

    background:#9ACD32;

    border-color:#9ACD32;

    transform:translateX(3px);

}


/* =========================================
        INPUT AREA
========================================= */

.chatbot-input-area{

    padding:12px;

    background:#ffffff;

    border-top:1px solid #e8edf2;

    display:flex;

    gap:8px;

}


.chatbot-input-area input{

    flex:1;

    min-width:0;

    border:1px solid #dce3ea;

    outline:none;

    border-radius:25px;

    padding:11px 15px;

    font-family:inherit;

    font-size:12px;

}


.chatbot-input-area input:focus{

    border-color:#0A66C2;

}


.chatbot-input-area button{

    width:42px;

    height:42px;

    border:none;

    border-radius:50%;

    background:#0A66C2;

    color:#ffffff;

    cursor:pointer;

    font-size:17px;

    transition:.25s;

}


.chatbot-input-area button:hover{

    background:#9ACD32;

    color:#002D5A;

    transform:scale(1.05);

}


/* =========================================
        TYPING INDICATOR
========================================= */

.typing-message{

    display:flex;

    align-items:center;

    gap:4px;

    padding:5px 0;

}


.typing-message span{

    width:6px;

    height:6px;

    border-radius:50%;

    background:#9aa8b5;

    animation:typing 1.2s infinite;

}


.typing-message span:nth-child(2){

    animation-delay:.15s;

}


.typing-message span:nth-child(3){

    animation-delay:.3s;

}


@keyframes typing{

    0%,60%,100%{

        transform:translateY(0);

        opacity:.4;

    }

    30%{

        transform:translateY(-4px);

        opacity:1;

    }

}


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

@media(max-width:600px){

    .chatbot-wrapper{

        right:15px;

        bottom:120px;

    }

    .chatbot-box{

        width:
            calc(100vw - 30px);

        height:500px;

        right:0;

    }

    .chatbot-toggle{

        width:56px;

        height:56px;

    }

}

/* =========================================================
   JOB VACANCIES V2
   Modern Recruitment UI
========================================================= */


/* =========================================================
   MAIN SECTION
========================================================= */

.jobs-v2 {

    position: relative;

    padding: 100px 8%;

    overflow: hidden;

    background-image:
        linear-gradient(rgba(0,45,90,.85), rgba(0,45,90,.85)),
        url("slide4.jpg");

    background-size: cover;

    background-position: center;

    background-repeat: no-repeat;

    background-attachment: fixed;

}


/* =========================================================
   SUBTLE BACKGROUND PATTERNS
========================================================= */

.jobs-v2::before {

    content: "";

    position: absolute;

    width: 420px;

    height: 420px;

    top: -180px;

    left: -180px;

    border-radius: 50%;

    background:
        rgba(154, 205, 50, 0.10);

    pointer-events: none;

}


.jobs-v2::after {

    content: "";

    position: absolute;

    width: 500px;

    height: 500px;

    right: -220px;

    bottom: -250px;

    border-radius: 50%;

    background:
        rgba(0, 45, 90, 0.07);

    pointer-events: none;

}


/* =========================================================
   CONTAINER
========================================================= */

.jobs-v2-container {

    position: relative;

    z-index: 2;

    width: min(1200px, 92%);

    margin: 0 auto;

}


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

.jobs-v2-header {

    max-width: 780px;

    margin: 0 auto 45px;

    text-align: center;

}


.jobs-v2-label {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    padding: 7px 16px;

    margin-bottom: 14px;

    border-radius: 30px;

    color: #9ACD32;

    font-size: 12px;

    font-weight: 800;

    letter-spacing: 2px;

}


.jobs-v2-header h2 {

    margin: 0 0 15px;

    color: #fdfeff;

    font-size: clamp(32px, 4vw, 48px);

    line-height: 1.15;

    font-weight: 800;

}


.jobs-v2-header p {

    max-width: 680px;

    margin: 0 auto;

    color: #ffffff;

    font-size: 15px;

    line-height: 1.8;

}


/* =========================================================
   SEARCH + FILTER CONTROLS
========================================================= */

.jobs-v2-controls {

    display: grid;

    grid-template-columns:
        minmax(280px, 1fr)
        210px
        210px;

    gap: 14px;

    padding: 18px;

    margin-bottom: 24px;

    background:
        rgba(255, 255, 255, 0.88);

    border: 1px solid
        rgba(0, 45, 90, 0.07);

    border-radius: 18px;

    box-shadow:
        0 12px 35px
        rgba(0, 45, 90, 0.07);

    backdrop-filter: blur(12px);

}


/* =========================================================
   SEARCH
========================================================= */

.jobs-v2-search {

    position: relative;

    display: flex;

    align-items: center;

}


.jobs-v2-search-icon {

    position: absolute;

    left: 17px;

    z-index: 2;

    font-size: 16px;

    pointer-events: none;

}


.jobs-v2-search input {

    width: 100%;

    height: 52px;

    padding:
        0 45px
        0 47px;

    border: 1px solid #e0e7ed;

    border-radius: 12px;

    outline: none;

    background: #f9fbfc;

    color: #263746;

    font-family: inherit;

    font-size: 13px;

    transition:
        border-color .3s ease,
        background .3s ease,
        box-shadow .3s ease;

}


.jobs-v2-search input::placeholder {

    color: #98a5b1;

}


.jobs-v2-search input:focus {

    border-color: #0a66c2;

    background: #ffffff;

    box-shadow:
        0 0 0 4px
        rgba(10, 102, 194, 0.08);

}


/* =========================================================
   CLEAR SEARCH
========================================================= */

.jobs-v2-clear {

    position: absolute;

    right: 13px;

    width: 28px;

    height: 28px;

    display: flex;

    align-items: center;

    justify-content: center;

    border: none;

    border-radius: 50%;

    background: transparent;

    color: #8c99a5;

    font-size: 20px;

    cursor: pointer;

    opacity: 0;

    visibility: hidden;

    transition:
        opacity .25s ease,
        background .25s ease,
        color .25s ease;

}


.jobs-v2-clear.active {

    opacity: 1;

    visibility: visible;

}


.jobs-v2-clear:hover {

    background: #edf2f6;

    color: #002d5a;

}


/* =========================================================
   FILTER DROPDOWNS
========================================================= */

.jobs-v2-filter {

    position: relative;

}


.jobs-v2-filter::after {

    content: "⌄";

    position: absolute;

    right: 17px;

    top: 50%;

    transform: translateY(-55%);

    color: #6d7b88;

    font-size: 17px;

    pointer-events: none;

}


.jobs-v2-filter select {

    width: 100%;

    height: 52px;

    padding:
        0 42px
        0 15px;

    appearance: none;

    border: 1px solid #e0e7ed;

    border-radius: 12px;

    outline: none;

    background: #f9fbfc;

    color: #304252;

    font-family: inherit;

    font-size: 13px;

    cursor: pointer;

    transition:
        border-color .3s ease,
        background .3s ease,
        box-shadow .3s ease;

}


.jobs-v2-filter select:focus {

    border-color: #0a66c2;

    background: #ffffff;

    box-shadow:
        0 0 0 4px
        rgba(10, 102, 194, 0.08);

}


/* =========================================================
   RESULTS INFORMATION
========================================================= */

.jobs-v2-results {

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    margin-bottom: 22px;

}


.jobs-v2-result-count {

    display: flex;

    align-items: baseline;

    gap: 7px;

    color: #ffffff;

    font-size: 13px;

}


.jobs-v2-result-count strong {

    color: #9ACD32;

    font-size: 22px;

    font-weight: 800;

}


.jobs-v2-reset {

    border: none;

    background: transparent;

    color: #9ACD32;

    font-family: inherit;

    font-size: 12px;

    font-weight: 700;

    cursor: pointer;

    transition:
        color .25s ease,
        transform .25s ease;

}


.jobs-v2-reset:hover {

    color: #648c13;

    transform: translateX(3px);

}


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

.jobs-v2-grid {

    display: grid;

    grid-template-columns:
        repeat(3, minmax(0, 1fr));

    gap: 25px;

}


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

.job-v2-card {

    position: relative;

    display: flex;

    flex-direction: column;

    min-width: 0;

    overflow: hidden;

    border:
        1px solid
        rgba(0, 45, 90, 0.08);

    border-radius: 20px;

    background: #ffffff;

    box-shadow:
        0 10px 35px
        rgba(0, 45, 90, 0.08);

    opacity: 1;

    transform:
        translateY(0);

    transition:
        transform .45s cubic-bezier(.2,.8,.2,1),
        box-shadow .45s ease,
        border-color .35s ease;

}


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

.job-v2-card:hover {

    transform:
        translateY(-9px);

    border-color:
        rgba(154, 205, 50, 0.35);

    box-shadow:
        0 22px 50px
        rgba(0, 45, 90, 0.14);

}


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

.job-v2-image {

    position: relative;

    height: 205px;

    overflow: hidden;

    background-position: center;

    background-size: cover;

    background-repeat: no-repeat;

}


/* Dark overlay */

.job-v2-image::after {

    content: "";

    position: absolute;

    inset: 0;

    background:
        linear-gradient(
            to top,
            rgba(0, 20, 40, 0.45),
            rgba(0, 20, 40, 0.04)
        );

    transition:
        background .4s ease;

}


.job-v2-card:hover
.job-v2-image::after {

    background:
        linear-gradient(
            to top,
            rgba(0, 20, 40, 0.30),
            rgba(0, 20, 40, 0.02)
        );

}


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

.job-v2-image {

    transition:
        background-size .6s ease,
        transform .6s
        cubic-bezier(.2,.8,.2,1);

}


.job-v2-card:hover
.job-v2-image {

    transform:
        scale(1.04);

}


/* =========================================================
   NOW HIRING BADGE
========================================================= */

.job-v2-status {

    position: absolute;

    z-index: 3;

    top: 15px;

    left: 15px;

    display: inline-flex;

    align-items: center;

    padding: 7px 11px;

    border:
        1px solid
        rgba(255,255,255,.25);

    border-radius: 30px;

    background:
        rgba(18, 45, 20, 0.78);

    color: #c8ef68;

    font-size: 10px;

    font-weight: 800;

    letter-spacing: .5px;

    backdrop-filter: blur(8px);

}


/* =========================================================
   CATEGORY BADGE
========================================================= */

.job-v2-category {

    position: absolute;

    z-index: 3;

    right: 15px;

    bottom: 15px;

    display: inline-flex;

    align-items: center;

    padding: 7px 12px;

    border-radius: 30px;

    background:
        rgba(255,255,255,.92);

    color: #002d5a;

    font-size: 10px;

    font-weight: 800;

    box-shadow:
        0 5px 15px
        rgba(0,0,0,.12);

    backdrop-filter: blur(8px);

    transition:
        transform .3s ease;

}


.job-v2-card:hover
.job-v2-category {

    transform:
        translateY(-3px);

}


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

.job-v2-content {

    display: flex;

    flex-direction: column;

    flex: 1;

    padding: 23px 22px 22px;

}


.job-v2-content h3 {

    margin: 0 0 7px;

    color: #002d5a;

    font-size: 19px;

    line-height: 1.35;

    font-weight: 800;

}


.job-v2-content h4 {

    margin: 0 0 18px;

    color: #7b8995;

    font-size: 12px;

    font-weight: 600;

}


/* =========================================================
   JOB INFORMATION
========================================================= */

.job-v2-info {

    display: flex;

    flex-direction: column;

    gap: 8px;

    padding:
        15px 0;

    margin-bottom: 17px;

    border-top:
        1px solid #edf1f4;

    border-bottom:
        1px solid #edf1f4;

}


.job-v2-info span {

    display: flex;

    align-items: center;

    color: #657582;

    font-size: 12px;

    line-height: 1.4;

}


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

.job-v2-actions {

    display: grid;

    grid-template-columns:
        1fr 1fr;

    gap: 9px;

    margin-top: auto;

}


.job-v2-details,
.job-v2-apply {

    min-height: 43px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 9px 10px;

    border-radius: 10px;

    font-family: inherit;

    font-size: 11px;

    font-weight: 800;

    text-decoration: none;

    cursor: pointer;

    transition:
        transform .3s ease,
        background .3s ease,
        color .3s ease,
        border-color .3s ease,
        box-shadow .3s ease;

}


/* View Details */

.job-v2-details {

    border:
        1px solid #dce5ec;

    background: #ffffff;

    color: #174a70;

}


.job-v2-details:hover {

    transform:
        translateY(-2px);

    border-color: #0a66c2;

    background: #0a66c2;

    color: #ffffff;

    box-shadow:
        0 8px 20px
        rgba(10, 102, 194, 0.18);

}


/* Apply */

.job-v2-apply {

    border:
        1px solid #9acd32;

    background: #9acd32;

    color: #163000;

}


.job-v2-apply:hover {

    transform:
        translateY(-2px);

    background: #002d5a;

    border-color: #002d5a;

    color: #ffffff;

    box-shadow:
        0 8px 20px
        rgba(0, 45, 90, 0.20);

}


/* =========================================================
   CARD SCROLL REVEAL
========================================================= */

.job-v2-card {

    animation:
        jobCardReveal .7s
        cubic-bezier(.2,.8,.2,1)
        both;

}


.job-v2-card:nth-child(1) {

    animation-delay: .05s;

}


.job-v2-card:nth-child(2) {

    animation-delay: .12s;

}


.job-v2-card:nth-child(3) {

    animation-delay: .19s;

}


.job-v2-card:nth-child(4) {

    animation-delay: .26s;

}


.job-v2-card:nth-child(5) {

    animation-delay: .33s;

}


.job-v2-card:nth-child(6) {

    animation-delay: .40s;

}


@keyframes jobCardReveal {

    from {

        opacity: 0;

        transform:
            translateY(35px);

    }

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


/* =========================================================
   FILTERED CARD ANIMATION
========================================================= */

.job-v2-card.job-hidden {

    display: none;

}


.job-v2-card.job-filter-show {

    animation:
        jobFilterShow .45s
        cubic-bezier(.2,.8,.2,1)
        both;

}


@keyframes jobFilterShow {

    from {

        opacity: 0;

        transform:
            translateY(20px)
            scale(.97);

    }

    to {

        opacity: 1;

        transform:
            translateY(0)
            scale(1);

    }

}


/* =========================================================
   NO RESULTS
========================================================= */

.jobs-v2-empty {

    display: none;

    padding: 65px 20px;

    margin-top: 20px;

    border:
        1px dashed
        rgba(0,45,90,.15);

    border-radius: 20px;

    background:
        rgba(255,255,255,.65);

    text-align: center;

    animation:
        emptyJobReveal .5s ease both;

}


.jobs-v2-empty.active {

    display: block;

}


.jobs-v2-empty-icon {

    width: 65px;

    height: 65px;

    margin:
        0 auto 15px;

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

    background:
        rgba(154,205,50,.14);

    font-size: 27px;

}


.jobs-v2-empty h3 {

    margin: 0 0 8px;

    color: #002d5a;

    font-size: 21px;

}


.jobs-v2-empty p {

    max-width: 450px;

    margin: 0 auto 20px;

    color: #748391;

    font-size: 13px;

    line-height: 1.7;

}


.jobs-v2-empty button {

    padding:
        11px 18px;

    border: none;

    border-radius: 10px;

    background: #002d5a;

    color: #ffffff;

    font-family: inherit;

    font-size: 12px;

    font-weight: 700;

    cursor: pointer;

    transition:
        transform .25s ease,
        background .25s ease;

}


.jobs-v2-empty button:hover {

    transform:
        translateY(-2px);

    background: #0a66c2;

}


@keyframes emptyJobReveal {

    from {

        opacity: 0;

        transform:
            translateY(15px);

    }

    to {

        opacity: 1;

        transform:
            translateY(0);

    }

}


/* =========================================================
   FOOTER / VIEW ALL
========================================================= */

.jobs-v2-footer {

    display: flex;

    justify-content: center;

    margin-top: 42px;

}


.jobs-v2-view-all {

    position: relative;

    display: inline-flex;

    align-items: center;

    gap: 13px;

    padding:
        13px 20px
        13px 23px;

    border:
        1px solid
        rgba(0,45,90,.13);

    border-radius: 50px;

    background: #ffffff;

    color: #002d5a;

    font-family: inherit;

    font-size: 12px;

    font-weight: 800;

    cursor: pointer;

    overflow: hidden;

    transition:
        color .35s ease,
        border-color .35s ease,
        transform .35s ease,
        box-shadow .35s ease;

}


.jobs-v2-view-all::before {

    content: "";

    position: absolute;

    inset: 0;

    background: #002d5a;

    transform:
        translateX(-102%);

    transition:
        transform .4s
        cubic-bezier(.2,.8,.2,1);

    z-index: 0;

}


.jobs-v2-view-all span {

    position: relative;

    z-index: 1;

}


.jobs-v2-view-all:hover {

    color: #ffffff;

    border-color: #002d5a;

    transform:
        translateY(-3px);

    box-shadow:
        0 12px 25px
        rgba(0,45,90,.15);

}


.jobs-v2-view-all:hover::before {

    transform:
        translateX(0);

}


.jobs-v2-arrow {

    font-size: 18px;

    line-height: 1;

    transition:
        transform .3s ease;

}


.jobs-v2-view-all:hover
.jobs-v2-arrow {

    transform:
        translateX(5px);

}


/* =========================================================
   RESPONSIVE — TABLET
========================================================= */

@media (max-width: 1000px) {

    .jobs-v2 {

        padding: 90px 0;

    }


    .jobs-v2-controls {

        grid-template-columns:
            1fr 1fr;

    }


    .jobs-v2-search {

        grid-column:
            1 / -1;

    }


    .jobs-v2-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        gap: 20px;

    }

}


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

@media (max-width: 650px) {

    .jobs-v2 {

        padding: 75px 0;

    }


    .jobs-v2-container {

        width: 90%;

    }


    .jobs-v2-header {

        margin-bottom: 32px;

    }


    .jobs-v2-header h2 {

        font-size: 31px;

    }


    .jobs-v2-header p {

        font-size: 13px;

        line-height: 1.7;

    }


    .jobs-v2-controls {

        grid-template-columns: 1fr;

        gap: 10px;

        padding: 13px;

        border-radius: 15px;

    }


    .jobs-v2-search {

        grid-column: auto;

    }


    .jobs-v2-results {

        align-items: flex-start;

        flex-direction: column;

        gap: 7px;

        margin-bottom: 18px;

    }


    .jobs-v2-grid {

        grid-template-columns: 1fr;

        gap: 18px;

    }


    .job-v2-image {

        height: 190px;

    }


    .job-v2-content {

        padding: 20px;

    }


    .job-v2-content h3 {

        font-size: 18px;

    }


    .job-v2-actions {

        grid-template-columns:
            1fr 1fr;

    }

}


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

@media (max-width: 400px) {

    .jobs-v2-container {

        width: 92%;

    }


    .job-v2-image {

        height: 175px;

    }


    .job-v2-content {

        padding: 17px;

    }


    .job-v2-actions {

        grid-template-columns: 1fr;

    }


    .job-v2-details,
    .job-v2-apply {

        width: 100%;

    }

}


/* =========================================================
   REDUCED MOTION ACCESSIBILITY
========================================================= */

@media (prefers-reduced-motion: reduce) {

    .job-v2-card,
    .job-v2-image,
    .job-v2-details,
    .job-v2-apply,
    .jobs-v2-view-all,
    .jobs-v2-view-all::before {

        animation: none !important;

        transition: none !important;

    }

}


/* ==========================================
        BACK TO TOP BUTTON
========================================== */

.back-to-top {
    position: fixed;

    right: 38px;
    bottom: 10px;

    width: 48px;
    height: 48px;

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

    border: none;
    border-radius: 50%;

    background: #9ACD32;
    color: #002D5A;

    font-size: 22px;
    font-weight: 700;

    cursor: pointer;

    z-index: 10001;

    opacity: 0;
    visibility: hidden;

    transform: translateY(20px);

    box-shadow:
        0 8px 25px rgba(0, 45, 90, 0.20);

    transition:
        opacity .3s ease,
        visibility .3s ease,
        transform .3s ease,
        background .3s ease;
}

.back-to-top.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.back-to-top:hover {
    background: #002D5A;
    color: #ffffff;
    transform: translateY(-5px);
}


/* ACTIVE / CLICK */

.back-to-top:active {

    transform: translateY(-2px) scale(0.95);

}


/* MOBILE */

@media (max-width: 600px) {

    .back-to-top {

        right: 18px;
        bottom: 18px;

        width: 44px;
        height: 44px;

        font-size: 20px;

    }

}



/* =========================================================
   NEAT ENGAGEMENTS
   RESPONSIVE MASTER UPGRADE
   Phone • Tablet • Laptop • Desktop
========================================================= */


/* =========================================================
   GLOBAL RESPONSIVE SAFETY
========================================================= */

html,
body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
}

section {
    width: 100%;
}

.container,
.about-container,
.why-container,
.statistics-container,
.jobs-container,
.process-container,
.partners-container,
.testimonials-container,
.faq-container,
.contact-container,
.footer-container {
    width: 100%;
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
}


/* =========================================================
   DESKTOP
   1201px+
========================================================= */

@media (min-width: 1201px) {

    .hero-content {
        width: min(1000px, 90%);
        margin: auto;
    }

    .about-container {
        gap: 70px;
    }

    .hero-content h1 {
        font-size: clamp(52px, 5vw, 65px);
    }

    .hero-content p {
        font-size: clamp(18px, 1.6vw, 22px);
    }

}


/* =========================================================
   LAPTOP
   993px — 1200px
========================================================= */

@media (min-width: 993px) and (max-width: 1200px) {

    header {
        padding-left: 5%;
        padding-right: 5%;
    }

    nav ul li {
        margin-left: 22px;
    }

    .hero-content {
        width: 90%;
    }

    .hero-content h1 {
        font-size: 52px;
    }

    .hero-content p {
        max-width: 700px;
        font-size: 19px;
    }

    .about {
        padding-left: 6%;
        padding-right: 6%;
    }

    .about-container {
        gap: 40px;
    }

    .about-content h2 {
        font-size: 38px;
    }

    .why-us,
    .statistics,
    .jobs,
    .process,
    .partners,
    .testimonials,
    .faq,
    .contact {
        padding-left: 6%;
        padding-right: 6%;
    }

    .job-card {
        min-width: 320px;
    }

    .contact-content {
        gap: 25px;
    }

}


/* =========================================================
   TABLET
   769px — 992px
========================================================= */

@media (min-width: 769px) and (max-width: 992px) {

    /* HEADER */

    header {
        padding: 0 4%;
    }

    .logo img {
        max-width: 155px;
    }

    nav ul li {
        margin-left: 15px;
    }

    nav ul li a {
        font-size: 14px;
    }


    /* HERO */

    .hero {
        min-height: 700px;
        height: 100vh;
    }

    .hero-content {
        width: 90%;
    }

    .hero-content h1 {
        font-size: 48px;
        line-height: 1.15;
    }

    .hero-content p {
        max-width: 650px;
        font-size: 18px;
        line-height: 1.7;
    }

    .btn {
        padding: 15px 35px;
    }


    /* ABOUT */

    .about {
        padding: 85px 5%;
    }

    .about-container {
        gap: 35px;
    }

    .about-image,
    .about-content {
        min-width: 280px;
    }

    .about-content h2 {
        font-size: 36px;
    }


    /* WHY US */

    .why-us {
        padding: 85px 5%;
        background-attachment: scroll;
    }

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


    /* STATISTICS */

    .statistics {
        padding: 85px 5%;
    }

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

    .stats-title h2 {
        font-size: 40px;
    }



    /* =====================================================
       TESTIMONIALS
    ===================================================== */

    .testimonials {
        padding: 75px 5%;
    }

    .testimonials .section-header {
        margin-bottom: 45px;
    }

    .testimonial-card {
        width: 280px;
        min-height: 410px;
        padding: 25px;
        border-radius: 20px;
    }

    .testimonial-photo {
        width: 85px;
        height: 85px;
    }

    .testimonial-text {
        font-size: 14px;
    }

    .testimonial-card h3 {
        font-size: 20px;
    }

    .testimonial-card span {
        font-size: 13px;
    }


    /* =====================================================
       FAQ
    ===================================================== */

    .faq {
        padding: 75px 6%;
        background-attachment: scroll;
    }

    .faq-list {
        margin-top: 40px;
    }

    .faq-question {
        padding: 20px;
        font-size: 15px;
    }

    .faq-answer p {
        padding: 0 20px 20px;
        font-size: 13px;
    }


    /* =====================================================
       CONTACT
    ===================================================== */

    .contact {
        padding: 75px 6%;
    }

    .contact .section-header {
        margin-bottom: 45px;
    }

    .contact-content {
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .contact-info,
    .contact-form {
        padding: 25px;
        border-radius: 20px;
    }

    .contact-info h3 {
        font-size: 25px;
    }

    .info-box {
        gap: 12px;
        margin-bottom: 22px;
    }

    .info-box i {
        width: 48px;
        height: 48px;
        font-size: 18px;
        flex-shrink: 0;
    }

    .info-box p {
        font-size: 13px;
    }

    .contact-form input,
    .contact-form textarea {
        padding: 14px 16px;
        font-size: 14px;
    }

    .contact-form button {
        padding: 14px;
        font-size: 15px;
    }


    /* =====================================================
       FOOTER
    ===================================================== */

    .footer {
        padding: 65px 6% 0;
    }

    .footer-container {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .footer-column h3 {
        font-size: 19px;
        margin-bottom: 20px;
    }

    .footer-column p,
    .footer-column ul li a {
        font-size: 13px;
    }

    .footer-map iframe {
        height: 220px;
    }

    .footer-bottom {
        margin-top: 40px;
        padding: 20px 0;
    }

    .footer-bottom p {
        font-size: 11px;
        line-height: 1.6;
    }


    /* =====================================================
       FLOATING CONTACT
    ===================================================== */

    .floating-contact {
        right: 15px;
        bottom: 20px;
    }

    .contact-options a {
        width: 46px;
        height: 46px;
        font-size: 19px;
    }

    #contactToggle {
        padding: 12px 17px;
        font-size: 14px;
    }

}


/* =========================================================
   SMALL PHONES
   320px — 480px
========================================================= */

@media (max-width: 480px) {

    /* HEADER */

    header {
        height: 64px;
        padding: 0 4%;
    }

    .logo img {
        max-width: 125px;
        max-height: 45px;
    }


    /* HERO */

    .hero {
        min-height: 620px;
    }

    .hero-content {
        width: 92%;
    }

    .hero-content h1 {
        font-size: 31px;
    }

    .hero-content p {
        font-size: 13px;
    }

    .btn {
        padding: 12px 24px;
        font-size: 13px;
    }


    /* ABOUT */

    .about {
        padding: 60px 5%;
    }

    .about-content h2 {
        font-size: 29px;
    }

    .about-content p {
        font-size: 13px;
    }


    /* SECTIONS */

    .why-us,
    .statistics,
    .jobs,
    .process,
    .partners,
    .testimonials,
    .faq,
    .contact {
        padding-left: 5%;
        padding-right: 5%;
    }


    /* JOBS */

    .job-card {
        height: 410px;
        padding: 22px;
    }

    .job-card h3 {
        font-size: 20px;
    }

    .job-card h4 {
        font-size: 13px;
    }

    .job-card p {
        font-size: 12px;
    }

    .slider-btn {
        width: 38px;
        height: 38px;
        font-size: 15px;
    }


    /* PROCESS */

    .process-icon {
        width: 70px;
        height: 70px;
        font-size: 25px;
    }


    /* PARTNERS */

    .partner-card {
        width: 145px;
        height: 105px;
    }


    /* TESTIMONIAL */

    .testimonial-card {
        width: 260px;
        min-height: 400px;
        padding: 22px;
    }


    /* CONTACT */

    .contact-info,
    .contact-form {
        padding: 20px;
    }


    /* FOOTER */

    .footer-map iframe {
        height: 190px;
    }


    /* FLOATING CONTACT */

    .floating-contact {
        right: 12px;
        bottom: 15px;
    }

    #contactToggle {
        padding: 11px 14px;
        font-size: 13px;
    }

}


/* =========================================================
   EXTRA SMALL PHONES
   320px — 380px
========================================================= */

@media (max-width: 380px) {

    .logo img {
        max-width: 110px;
    }

    .hero-content h1 {
        font-size: 28px;
    }

    .hero-content p {
        font-size: 12px;
    }

    .job-card {
        height: 395px;
    }

    .testimonial-card {
        width: 245px;
    }

}


/* =========================================================
   ACCESSIBILITY
   Reduce animation for users who prefer less motion
========================================================= */

@media (prefers-reduced-motion: reduce) {

    *,
    *::before,
    *::after {

        animation-duration: 0.01ms !important;

        animation-iteration-count: 1 !important;

        scroll-behavior: auto !important;

        transition-duration: 0.01ms !important;

    }

}