.workbank-main-wrap > header { display: none !important; }
.section-wrap { margin-top: 0 !important; padding-top: 0 !important; }
main .section-wrap { margin-top: 0 !important; padding-top: 0 !important; }

:root {
    --xc-primary: #58BDE2;
    --xc-green: #2fb872;
    --xc-navy: #0c1f3a;
}

/* Banner */
.banner-section-wrap {
    position: relative;
    background: #f5fafd;
    padding: 55px 0 45px;
    text-align: center;
    overflow: hidden;
}
.banner-section-wrap::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(88,189,226,0.35) 1.4px, transparent 1.4px);
    background-size: 16px 16px;
    -webkit-mask-image: linear-gradient(to bottom, black, transparent 85%);
    mask-image: linear-gradient(to bottom, black, transparent 85%);
    pointer-events: none;
}
.banner-section-wrap .container { position: relative; }
.banner-section-wrap .eyebrow {
    display: inline-block;
    color: var(--xc-primary) !important;
    -webkit-text-fill-color: var(--xc-primary) !important;
    font-weight: 600;
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    border-bottom: 2px solid var(--xc-primary);
    padding-bottom: 6px;
    margin-bottom: 10px;
}
.banner-section-wrap h1,
.banner-section-wrap h2,
.banner-section-wrap h3,
.banner-section-wrap p,
.banner-section-wrap span {
    color: #0b2e4a !important;
    opacity: 1 !important;
    visibility: visible !important;
    -webkit-text-fill-color: #0b2e4a !important;
}
.banner-section-wrap h1 {
    font-weight: 800;
    font-size: 46px;
    margin-bottom: 14px;
}
.banner-section-wrap h1 .highlight {
    color: var(--xc-primary) !important;
    -webkit-text-fill-color: var(--xc-primary) !important;
}
.banner-section-wrap p {
    max-width: 640px;
    margin: 0 auto;
    color: #5a6b7a !important;
    -webkit-text-fill-color: #5a6b7a !important;
    font-size: 15px;
}

/* How we started / video section */
.about-main-wrap.common-padding:first-of-type,
section.about-main-wrap.common-padding:not([style]) {
    padding: 55px 0;
}
.about-main-wrap h2 {
    font-size: 20px;
    font-weight: 700;
    color: #0b2e4a;
    position: relative;
    padding-left: 20px;
    margin-bottom: 18px;
}
.about-main-wrap .left-block h2::before,
.about-main-wrap .right-block h2::before {
    content: "";
    position: absolute;
    left: 0;
    top: 6px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--xc-primary);
}
.about-main-wrap .left-block p { color: #5a6b7a; }

.vision-icon-row {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-top: 22px;
}
.vision-icon-row .icon-circle {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--xc-primary);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}
.vision-icon-row h2 {
    padding-left: 0;
    margin-bottom: 4px;
    font-size: 16px;
    color: var(--xc-primary);
}
.vision-icon-row h2::before { display: none; }
.vision-icon-row p { margin-bottom: 0; color: #5a6b7a; }

.video-wrap {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(11,46,74,0.18);
    background: var(--xc-navy);
}
.video-wrap iframe { display: block; }

/* Why choose section */
section.why-choose-wrap {
    position: relative;
    background: var(--xc-navy);
    padding: 60px 0 130px;
    overflow: hidden;
}
section.why-choose-wrap::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(88,189,226,0.15) 1.4px, transparent 1.4px);
    background-size: 18px 18px;
    pointer-events: none;
}
section.why-choose-wrap .container { position: relative; }
section.why-choose-wrap .center-block { text-align: center; margin-bottom: 0; }
section.why-choose-wrap .center-block h2 {
    color: #fff;
    font-weight: 700;
    font-size: 26px;
}
section.why-choose-wrap .center-block h2 .highlight { color: var(--xc-primary); }
section.why-choose-wrap .center-block p {
    color: #b7c3d1;
    max-width: 720px;
    margin: 10px auto 0;
}

.choose-cards-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;
    margin-top: 40px;
    position: relative;
    z-index: 2;
}
.choose-card {
    flex: 1 1 48%;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 14px 40px rgba(0,0,0,0.18);
    padding: 30px;
}
.choose-card .card-head {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 18px;
}
.choose-card .card-head .icon-circle {
    flex: 0 0 54px;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 22px;
}
.choose-card.candidates .card-head .icon-circle { background: var(--xc-primary); }
.choose-card.employers .card-head .icon-circle { background: var(--xc-green); }
.choose-card .card-head h3 { font-weight: 700; font-size: 18px; color: #0b2e4a; margin-bottom: 6px; }
.choose-card .card-head p { margin-bottom: 0; color: #5a6b7a; font-size: 14px; }

.choose-card .features-badge {
    display: inline-block;
    color: #fff;
    font-weight: 600;
    font-size: 12px;
    padding: 5px 16px;
    border-radius: 5px;
    margin-bottom: 12px;
}
.choose-card.candidates .features-badge { background: var(--xc-primary); }
.choose-card.employers .features-badge { background: var(--xc-green); }

.choose-card .feature-item {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 13px 0;
    border-bottom: 1px solid #eef2f5;
}
.choose-card .feature-item:last-child { border-bottom: none; }
.choose-card .feature-item .feature-icon {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}
.choose-card.candidates .feature-item .feature-icon { background: rgba(88,189,226,0.12); color: var(--xc-primary); }
.choose-card.employers .feature-item .feature-icon { background: rgba(47,184,114,0.12); color: var(--xc-green); }
.choose-card .feature-item .feature-text { flex: 1; }
.choose-card .feature-item p { margin-bottom: 0; color: #33414c; font-size: 14.5px; font-weight: 600; }
.choose-card .feature-item small { display: block; color: #8b98a3; font-weight: 400; margin-top: 2px; }
.choose-card .feature-item .coming-soon {
    display: inline-block;
    font-size: 11px;
    font-weight: 600;
    padding: 2px 10px;
    border-radius: 20px;
    margin-left: 8px;
    vertical-align: middle;
}
.choose-card.candidates .feature-item .coming-soon { background: rgba(88,189,226,0.15); color: #2a90b8; }
.choose-card.employers .feature-item .coming-soon { background: rgba(47,184,114,0.15); color: #1f8a54; }

@media (max-width: 1366px) {
    .banner-section-wrap { padding: 48px 0 38px; }
    .banner-section-wrap h1 { font-size: 40px; }
    section.why-choose-wrap { padding: 52px 0 110px; }
    .choose-card { padding: 26px; }
}

@media (max-width: 1200px) {
    .video-wrap iframe { height: 360px; }
    .choose-card .card-head .icon-circle { flex-basis: 48px; width: 48px; height: 48px; font-size: 19px; }
}

@media (max-width: 1199px) {
    .banner-section-wrap h1 { font-size: 36px; }
    .choose-card .card-head h3 { font-size: 17px; }
}

@media (max-width: 992px) {
    .banner-section-wrap h1 { font-size: 32px; }
    .video-wrap iframe { height: 320px; }
    .vision-icon-row { margin-top: 18px; }
}

@media (max-width: 767px) {
    .banner-section-wrap { padding: 36px 0 30px; }
    .banner-section-wrap h1 { font-size: 26px; }
    .banner-section-wrap p { font-size: 14px; padding: 0 12px; }

    .about-main-wrap h2 { font-size: 18px; }
    .video-wrap iframe { height: 260px; }

    section.why-choose-wrap { padding: 40px 0 90px; }
    section.why-choose-wrap .center-block h2 { font-size: 21px; }

    .choose-cards-wrap { flex-direction: column; gap: 20px; margin-top: 28px; }
    .choose-card { flex-basis: auto; padding: 22px; }
    .choose-card .card-head { gap: 12px; }
    .choose-card .card-head .icon-circle { flex-basis: 44px; width: 44px; height: 44px; font-size: 17px; }
}

@media (max-width: 567px) {
    .banner-section-wrap h1 { font-size: 22px; }
    .banner-section-wrap p { font-size: 13px; }

    .vision-icon-row { flex-direction: column; gap: 8px; }
    .video-wrap iframe { height: 210px; }

    section.why-choose-wrap .center-block h2 { font-size: 19px; }
    section.why-choose-wrap .center-block p { font-size: 13.5px; }

    .choose-card { padding: 18px; }
    .choose-card .card-head { flex-direction: column; }
    .choose-card .feature-item { gap: 10px; padding: 10px 0; }
    .choose-card .feature-item .feature-icon { flex-basis: 30px; width: 30px; height: 30px; font-size: 14px; }
    .choose-card .feature-item p { font-size: 13.5px; }
}
