/*=========================
TOP BAR
=========================*/

.top-bar{

    background:#0B5AA5;

    color:#fff;

    height:40px;

    display:flex;

    align-items:center;

    font-size:14px;

}

.top-left{

    font-weight:500;

}

.top-right{

    display:flex;

    justify-content:flex-end;

    align-items:center;

    gap:12px;

}

.top-right a{

    color:#fff;

    text-decoration:none;

    transition:.3s;

}

.top-right a:hover{

    color:#FFD54F;

}

.top-right span{

    opacity:.7;

}

@media(max-width:768px){

.top-bar{

height:auto;

padding:8px 0;

}

.top-left{

text-align:center;

margin-bottom:8px;

}

.top-right{

justify-content:center;

flex-wrap:wrap;

}

}

/*==========================
HEADER
===========================*/

.main-header{

    background:#fff;

    position:sticky;

    top:40px;

    z-index:999;

    box-shadow:0 4px 18px rgba(0,0,0,.08);

}

.navbar{

    min-height:90px;

}

.site-logo{
    width:100%;
    height:95px;
    object-fit:contain;
    transition:0.3s ease;
}


.brand-title{

    font-size:18px;

    font-weight:700;

    color:#0B5AA5;

}

.brand-subtitle{

    color:#666;

    font-size:18px;

}

.navbar-nav{

    gap:8px;

}

.nav-link{

    color:#222 !important;

    font-weight:600;

    padding:28px 15px !important;

    position:relative;

}

.nav-link.active{

    color:#0B5AA5 !important;

}

.nav-link.active::after{

    content:"";

    position:absolute;

    left:12px;

    right:12px;

    bottom:18px;

    height:3px;

    background:#0B5AA5;

    border-radius:20px;

}

.nav-link:hover{

    color:#0B5AA5 !important;

}

.header-right{

    display:flex;

    align-items:center;

    gap:15px;

}

.helpline{

    text-align:right;

}

.helpline small{

    display:block;

    color:#777;

    font-size:12px;

}

.helpline strong{

    color:#0B5AA5;

    font-size:18px;

}

.btn-login{

    border:2px solid #0B5AA5;

    color:#0B5AA5;

    padding:10px 24px;

    border-radius:8px;

    font-weight:600;

}

.btn-login:hover{

    background:#0B5AA5;

    color:#fff;

}

.btn-register{

    background:#F57C00;

    color:#fff;

    padding:10px 24px;

    border-radius:8px;

    font-weight:600;

}

.btn-register:hover{

    background:#E36F00;

    color:#fff;

}

@media(max-width:992px){

.main-header{

top:0;

}

.header-right{

margin-top:20px;

flex-direction:column;

align-items:flex-start;

}

.helpline{

text-align:left;

}

.nav-link{

padding:12px 0 !important;

}

.nav-link.active::after{

display:none;

}

}
/*======================================
 HERO SECTION
======================================*/

.hero-section{

    position:relative;

    height:650px;

    background:url("../images/hero.png") center center;

    background-size:cover;

    overflow:hidden;

}

.hero-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        rgba(6,42,102,.60),
        rgba(6,42,102,.35)
    );

}

.hero-section .container{

    position:relative;

    z-index:2;

}

.hero-content{

    padding-top:70px;

}

.hero-badge{

    display:inline-block;

    background:#ffffff;

    color:#0B5AA5;

    padding:10px 25px;

    border-radius:40px;

    font-weight:600;

    margin-bottom:25px;

}

.hero-content h1{

    color:#fff;

    font-size:64px;

    font-weight:800;

    margin-bottom:10px;

    text-transform:uppercase;

}

.hero-content h2{

    color:#FFD54F;

    font-size:32px;

    font-weight:700;

    margin-bottom:20px;

}

.hero-content p{

    color:#fff;

    font-size:18px;

    max-width:700px;

    margin:auto;

    line-height:1.8;

}

.hero-buttons{

    margin-top:40px;

}

.hero-buttons .btn{

    padding:15px 40px;

    border-radius:8px;

    font-size:16px;

    font-weight:600;

    margin:10px;

}

.btn-register{



    color:#fff;

}

.btn-register:hover{

    background:#DD6C00;

    color:#fff;

}

.btn-login{

    background:#F57C00;

    color:#dbeafe;

}

.btn-login:hover{

    background:#0B5AA5;

    color:#fff;

}

.workers-image{

    position:absolute;

    bottom:0;

    left:50%;

    transform:translateX(-50%);

    width:92%;

    max-width:1350px;

    z-index:1;

}

@media(max-width:992px){

.hero-section{

height:720px;

}

.hero-content h1{

font-size:42px;

}

.hero-content h2{

font-size:24px;

}

.workers-image{

width:120%;

}

}

@media(max-width:576px){

.hero-section{

height:760px;

}

.hero-content{

padding-top:50px;

}

.hero-content h1{

font-size:34px;

}

.hero-content h2{

font-size:20px;

}

.hero-buttons .btn{

display:block;

width:100%;

margin-bottom:15px;

}

}

/*======================================
 FLOATING SERVICES
======================================*/

.floating-services{

    position:relative;

    margin-top:-90px;

    z-index:20;

}

.service-wrapper{

    background:#fff;

    border-radius:18px;

    padding:35px;

    box-shadow:0 20px 45px rgba(0,0,0,.12);

}

.service-card{

    display:block;

    text-align:center;

    text-decoration:none;

    color:#222;

    padding:20px;

    border-radius:14px;

    transition:.35s;

    height:100%;

}

.service-card:hover{

    transform:translateY(-8px);

    box-shadow:0 12px 30px rgba(0,0,0,.12);

    color:#0B5AA5;

}

.service-icon{

    width:75px;

    height:75px;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    margin:0 auto 20px;

    color:#fff;

    font-size:30px;

}

.service-card h5{

    font-size:20px;

    font-weight:700;

    margin-bottom:12px;

}

.service-card p{

    font-size:15px;

    color:#666;

    line-height:1.6;

    margin:0;

}

@media(max-width:991px){

    .floating-services{

        margin-top:40px;

    }

}
/*======================================
QUICK SERVICES
======================================*/

.quick-services{

    background:#f7f9fc;

}

.section-subtitle{

    color:#0B5AA5;

    font-weight:600;

    text-transform:uppercase;

    letter-spacing:1px;

}

.section-heading{

    font-size:40px;

    font-weight:700;

    color:#1f2937;

    margin-top:10px;

}

.section-description{

    max-width:700px;

    margin:15px auto 0;

    color:#6b7280;

    font-size:16px;

}

.quick-card{

    display:block;

    text-align:center;

    background:#fff;

    border-radius:16px;

    padding:35px 25px;

    text-decoration:none;

    color:#222;

    transition:.3s;

    height:100%;

    box-shadow:0 8px 24px rgba(0,0,0,.06);

}

.quick-card:hover{

    transform:translateY(-8px);

    color:#0B5AA5;

    box-shadow:0 16px 35px rgba(0,0,0,.12);

}

.quick-icon{

    width:80px;

    height:80px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    margin:0 auto 20px;

    color:#fff;

    font-size:30px;

}

.quick-card h5{

    font-size:20px;

    font-weight:700;

    margin-bottom:12px;

}

.quick-card p{

    color:#6b7280;

    margin:0;

    line-height:1.7;

}
/*======================================
WELFARE SECTION
======================================*/

.welfare-section{

    background:#ffffff;

}

.welfare-image img{

    width:100%;

}

.benefit-item{

    display:flex;

    align-items:flex-start;

    gap:18px;

    margin-bottom:25px;

}

.benefit-icon{

    width:65px;

    height:65px;

    min-width:65px;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#fff;

    font-size:26px;

}

.benefit-item h5{

    font-weight:700;

    margin-bottom:8px;

    color:#1f2937;

}

.benefit-item p{

    margin:0;

    color:#6b7280;

    line-height:1.7;

}

.welfare-section .btn{

    padding:14px 35px;

    border-radius:10px;

    font-weight:600;

}
/*======================================
IMPACT SECTION
======================================*/

.impact-section{

    background:#0B5AA5;

    color:#fff;

}

.impact-section .section-subtitle{

    color:#FFD54F;

}

.impact-section .section-heading{

    color:#fff;

}

.impact-section .section-description{

    color:#dbeafe;

}

.impact-card{

    background:#fff;

    color:#222;

    text-align:center;

    padding:35px 25px;

    border-radius:16px;

    transition:.3s;

    height:100%;

}

.impact-card:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(0,0,0,.20);

}

.impact-icon{

    width:80px;

    height:80px;

    margin:auto;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#fff;

    font-size:34px;

    margin-bottom:20px;

}

.counter{

    font-size:42px;

    font-weight:700;

    color:#0B5AA5;

    margin-bottom:10px;

}

.impact-card p{

    margin:0;

    color:#666;

    font-size:17px;

    font-weight:500;

}
/*======================================
SECURITY SECTION
======================================*/

.security-section{

    background:#ffffff;

}

.security-wrapper{

    background:linear-gradient(135deg,#0B5AA5,#1976D2);

    border-radius:20px;

    padding:60px;

    color:#fff;

}

.security-subtitle{

    display:inline-block;

    background:rgba(255,255,255,.15);

    padding:8px 18px;

    border-radius:30px;

    margin-bottom:18px;

    font-weight:600;

}

.security-wrapper h2{

    font-size:42px;

    font-weight:700;

    margin-bottom:20px;

}

.security-wrapper p{

    color:#eef4ff;

    line-height:1.8;

    font-size:17px;

}

.trust-card{

    background:#fff;

    color:#222;

    border-radius:15px;

    padding:25px;

    text-align:center;

    height:100%;

    transition:.3s;

}

.trust-card:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(0,0,0,.15);

}

.trust-icon{

    width:70px;

    height:70px;

    border-radius:50%;

    background:#0B5AA5;

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:30px;

    margin:0 auto 20px;

}

.trust-card h5{

    font-weight:700;

    margin-bottom:10px;

}

.trust-card p{

    color:#666;

    font-size:15px;

    margin:0;

}

@media(max-width:991px){

.security-wrapper{

padding:40px 25px;

}

.security-wrapper h2{

font-size:32px;

margin-top:15px;

}

}/*======================================
SECURITY SECTION
======================================*/

.security-section{

    background:#ffffff;

}

.security-wrapper{

    background:linear-gradient(135deg,#0B5AA5,#1976D2);

    border-radius:20px;

    padding:60px;

    color:#fff;

}

.security-subtitle{

    display:inline-block;

    background:rgba(255,255,255,.15);

    padding:8px 18px;

    border-radius:30px;

    margin-bottom:18px;

    font-weight:600;

}

.security-wrapper h2{

    font-size:42px;

    font-weight:700;

    margin-bottom:20px;

}

.security-wrapper p{

    color:#eef4ff;

    line-height:1.8;

    font-size:17px;

}

.trust-card{

    background:#fff;

    color:#222;

    border-radius:15px;

    padding:25px;

    text-align:center;

    height:100%;

    transition:.3s;

}

.trust-card:hover{

    transform:translateY(-8px);

    box-shadow:0 15px 35px rgba(0,0,0,.15);

}

.trust-icon{

    width:70px;

    height:70px;

    border-radius:50%;

    background:#0B5AA5;

    color:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    font-size:30px;

    margin:0 auto 20px;

}

.trust-card h5{

    font-weight:700;

    margin-bottom:10px;

}

.trust-card p{

    color:#666;

    font-size:15px;

    margin:0;

}

@media(max-width:991px){

.security-wrapper{

padding:40px 25px;

}

.security-wrapper h2{

font-size:32px;

margin-top:15px;

}

}
/*======================================
ABOUT SECTION
======================================*/

.about-section{

    background:#ffffff;

}

.about-image img{

    border-radius:20px;

    box-shadow:0 20px 45px rgba(0,0,0,.10);

}

.about-list{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.about-item{

    display:flex;

    align-items:center;

    font-size:17px;

    font-weight:500;

}

.about-item i{

    color:#0B5AA5;

    font-size:22px;

    margin-right:15px;

}

.about-card{

    background:#fff;

    border-radius:15px;

    padding:25px;

    text-align:center;

    box-shadow:0 10px 25px rgba(0,0,0,.08);

    transition:.3s;

    margin-bottom:20px;

}

.about-card:hover{

    transform:translateY(-8px);

}

.about-card-icon{

    width:70px;

    height:70px;

    margin:auto;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#fff;

    font-size:28px;

    margin-bottom:18px;

}

.about-card h5{

    font-weight:700;

    margin-bottom:12px;

}

.about-card p{

    color:#6b7280;

    margin:0;

    line-height:1.7;

}
/*======================================
FOOTER
======================================*/

.footer-section{

    background:#0d1b2a;

    color:#fff;

    padding:70px 0 25px;

}

.footer-logo{

    width:60%;

}

.footer-text{

    color:#c8d1dc;

    margin-top:20px;

    line-height:1.8;

}

.footer-section h5{

    margin-bottom:25px;

    font-weight:700;

    color:#fff;

}

.footer-links{

    list-style:none;

    padding:0;

    margin:0;

}

.footer-links li{

    margin-bottom:14px;

}

.footer-links a{

    color:#c8d1dc;

    text-decoration:none;

    transition:.3s;

}

.footer-links a:hover{

    color:#ffffff;

    padding-left:6px;

}

.contact-info{

    list-style:none;

    padding:0;

    margin:0;

}

.contact-info li{

    display:flex;

    gap:15px;

    margin-bottom:20px;

}

.contact-info i{

    color:#4da3ff;

    font-size:20px;

    margin-top:3px;

}

.contact-info span{

    color:#c8d1dc;

    line-height:1.7;

}

.social-links{

    margin-top:25px;

}

.social-links a{

    width:42px;

    height:42px;

    border-radius:50%;

    background:rgba(255,255,255,.08);

    display:inline-flex;

    justify-content:center;

    align-items:center;

    margin-right:10px;

    color:#fff;

    text-decoration:none;

    transition:.3s;

}

.social-links a:hover{

    background:#0B5AA5;

    transform:translateY(-5px);

}

.footer-divider{

    border-color:rgba(255,255,255,.15);

    margin:45px 0 25px;

}

.copyright{

    margin:0;

    color:#bfc8d2;

}

.developer{

    margin:0;

    color:#bfc8d2;

}

.developer strong{

    color:#ffffff;

}
/*==================================================
MOBILE RESPONSIVE (ADD AT END OF landing.css)
==================================================*/

@media only screen and (max-width:768px){

/* Top Bar */

.top-bar{
    height:auto;
    padding:8px 10px;
    text-align:center;
}

.top-left{
    margin-bottom:8px;
}

.top-right{
    justify-content:center;
    flex-wrap:wrap;
}

/* Header */

.main-header{
    top:0;
}

.navbar{
    min-height:70px;
}

.site-logo{
    height:60px;
    width:auto;
    max-width:180px;
}

.navbar-toggler{
    border:none;
}

.nav-link{
    padding:12px 0 !important;
    text-align:center;
}

.header-right{
    flex-direction:column;
    align-items:center;
    margin-top:15px;
}

.helpline{
    text-align:center;
}

/* Hero */

.hero-section{
    height:auto;
    min-height:720px;
    padding:50px 0 220px;
    background-position:center center;
}

.hero-content{
    padding-top:20px;
}

.hero-badge{
    font-size:12px;
    padding:8px 18px;
}

.hero-content h1{
    font-size:34px;
}

.hero-content h2{
    font-size:20px;
    line-height:1.5;
}

.hero-content p{
    font-size:15px;
    padding:0 10px;
}

.hero-buttons .btn{
    width:100%;
    margin:10px 0;
}

.workers-image{
    width:170%;
    max-width:none;
    bottom:0;
}

/* Floating Services */

.floating-services{
    margin-top:30px;
}

.service-wrapper{
    padding:20px;
}

.service-card{
    margin-bottom:20px;
}

/* Quick Services */

.section-heading{
    font-size:28px;
}

.section-description{
    font-size:15px;
}

.quick-card{
    margin-bottom:20px;
}

/* Welfare */

.welfare-image{
    margin-bottom:30px;
}

.benefit-item{
    flex-direction:column;
    text-align:center;
}

.benefit-icon{
    margin:auto;
}

/* Impact */

.counter{
    font-size:32px;
}

.impact-card{
    margin-bottom:20px;
}

/* Security */

.security-wrapper{
    padding:30px 20px;
}

.security-wrapper h2{
    font-size:28px;
}

.trust-card{
    margin-bottom:20px;
}

/* About */

.about-image{
    margin-bottom:30px;
}

.about-card{
    margin-bottom:20px;
}

/* Footer */

.footer-logo{
    width:180px;
    margin:auto;
    display:block;
}

.footer-section{
    text-align:center;
}

.footer-links{
    margin-bottom:25px;
}

.contact-info li{
    justify-content:center;
}

.social-links{
    text-align:center;
}

}

/* Small Phones */

@media only screen and (max-width:480px){

.hero-section{
    min-height:680px;
}

.hero-content h1{
    font-size:28px;
}

.hero-content h2{
    font-size:18px;
}

.hero-content p{
    font-size:14px;
}

.workers-image{
    width:190%;
}

.site-logo{
    height:50px;
}

.section-heading{
    font-size:24px;
}

}