@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');


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


body {
    font-family: 'Roboto', sans-serif;
    overflow-x: hidden;
}

/* Services Style */
.service-bg-banner {
    background:
        linear-gradient(rgba(15, 23, 42, 0.6), rgba(15, 23, 42, 0.6)),
        url('./image/services-img/bg-banner.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 500px;
    width: 100%;
}

.bg-blue {
    background-color: #2c53b2;
}

.bg-inquire {
    background:
        linear-gradient(rgba(15, 23, 42, 0.6), rgba(15, 23, 42, 0.6)),
        /* 🔹 overlay color with opacity */
        url('./image/services-img/bg-inquire.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 500px;
    width: 100%;
}


.header-section {
    background-image: url("./image/assets/jobcon-bg.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh;
    position: relative;
}

.header-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(4, 26, 60, 0.6);
    z-index: 1;
}

.header-section .container,
.header-section .content {
    position: relative;
    z-index: 2;
}


.hero-section {
    padding-top: 120px;
    padding-bottom: 200px;
}

.content-column,
.image-column {
    min-height: 600px;
}

.bg-image {
    background: url('https://thejobconnections.xyz/wp-content/uploads/2024/07/7950bb99-df8d-46cc-ad51-05c256ec3240.jpeg') center/cover no-repeat;
    height: 100%;
}

.about-us-section {
    position: relative;
    z-index: 2;
}

.row.g-0 {
    margin-right: 0;
    margin-left: 0;
}

.about-us-container.custom-padding {
    padding-left: 4rem !important;
}

.values {
    padding-top: 38rem !important;
}

.text-container {
    max-width: 400px;
}

.hero {
    background: url("https://thejobconnections.xyz/wp-content/uploads/2024/07/Effective-Ways-to-Save-Money-as-an-OFW.jpg") center/cover no-repeat;
    color: white;
    padding: 10px 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 90vh;
    position: relative;
}

.hero h1 {
    font-size: 2.5rem;
    font-weight: bold;
}

.gallery img {
    width: 100%;
    height: auto;
    border-radius: 8px;
}

.bg-transparent-custom {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.topbar-border {
    border-bottom: 1px solid white !important;
}

.our-branches {
    background: url("https://thejobconnections.xyz/wp-content/uploads/2024/08/135b0218-7d43-4b57-8337-c1ab00ed9a63.jpg") center/cover no-repeat;
    color: white;
    padding: 10px 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 50vh;
    position: relative;
}

.jobs {
    background: url("./image/services-img/contact-img.webp") center/cover no-repeat;
    color: white;
    padding: 10px 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 50vh;
    position: relative;
}

.jobs::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(4, 26, 60, 0.6);
    z-index: 1; 
}

.jobs * {
    position: relative;
    z-index: 2;
}

.our-services {
    background: url("https://thejobconnections.xyz/wp-content/uploads/2024/07/carte-identite-service-consultation-gestion-projet-1.jpg") center/cover no-repeat;
    color: white;
    padding: 10px 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 70vh;
    position: relative;
}

.contacts {
    background: url("https://thejobconnections.xyz/wp-content/uploads/2024/07/tech_support_header.jpg") center/cover no-repeat;
    color: white;
    padding: 10px 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 70vh;
    position: relative;
}

.map-responsive {
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
    height: 0;
    width: 90%;
}
.map-responsive iframe {
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
}