 *{
         margin:0;
         padding:0;
         box-sizing:border-box;
         }
         body{
         font-family:'Inter',sans-serif;
         background:#ffffff;
         color:#08113d;
         }
         .container-custom{
         max-width:1280px;
         margin:auto;
         padding:0 18px;
         }
         /* =========================
         NAVBAR
         ========================= */
         .navbar{
         background:#fff;
         padding:18px 0;
         border-bottom:1px solid #edf1f7;
         }
         .logo-area{
         display:flex;
         align-items:center;
         gap:25px;
         }
         .logo-circle{
            width: 70px;
            height: 70px;
            border-radius: 50%;
            background: #0b5fff00;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #fff;
            font-size: 30px;
            border-width: 1px;
            border-style: solid;
         }
         i.fa-solid.fa-chart-column {
            color: #FF5722;
        }
         .logo-text{
         line-height:1;
         }
         .logo-text h2{
         font-size:35px;
         font-weight:600;
         /*letter-spacing:-1px;*/
         }
         .logo-text span{
         font-size:35px;
         font-weight:600;
         color:#fff;
         /*letter-spacing:4px;*/
         }
         .navbar-item{
         color:#08113d !important;
         font-weight:600;
         font-size:15px;
         margin:0 10px;
         }
         .join-btn{
         background:#0b5fff;
         color:#fff;
         border:none;
         border-radius:12px;
         padding:14px 26px;
         font-weight:700;
         font-size:15px;
         }
         /* =========================
         HERO
         ========================= */
         .hero-main{
             padding:120px 0 120px;
             /*background:*/
             background-size:cover !important;
             background-position: center !important;
             radial-gradient(circle at top right,#edf5ff 0%,#ffffff 60%);
         }
         .top-badge{
            display: inline-flex;
            align-items: center;
            gap: 10px;
            border: 1px solid #b4c5dd;
            padding: 4px 20px;
            border-radius: 100px;
            font-size: 15px;
            font-weight: 700;
            color: #0b5fff;
            margin-bottom: 28px;
            background: #dfeef1b3;
         }
         .hero-title{
             font-size:70px;
             line-height:1.05;
             font-weight:700;
             letter-spacing:0px;
             margin-bottom:28px;
         }
         .hero-title span{
         color:#0b5fff;
         }
         .hero-desc{
             color: #30374a;
             font-size: 18px;
             line-height: 1.6;
             max-width: 500px;
             margin-bottom: 27px;
         }
         .hero-note{
             display:flex;
             gap:14px;
             align-items:flex-start;
             font-size:17px;
             line-height:1.7;
             font-weight:600;
             color:#0b5fff;
             margin-bottom:34px;
         }
         .hero-btns{
         display:flex;
         gap:18px;
         }
         .primary-btn{
         background:#0b5fff;
         color:#fff;
         border:none;
         padding:16px 34px;
         border-radius:14px;
         font-weight:700;
         font-size:16px;
         }
         .secondary-btn{
         background:#fff;
         border:2px solid #d9e6ff;
         color:#0b5fff;
         padding:16px 34px;
         border-radius:14px;
         font-weight:700;
         font-size:16px;
         }
         /* =========================
         RIGHT GLOBE
         ========================= */
         .globe-wrap{
         position:relative;
         width:100%;
         height:640px;
         display:flex;
         align-items:center;
         justify-content:center;
         }
         .globe{
         width:560px;
         height:560px;
         border-radius:50%;
         position:relative;
         background:
         radial-gradient(circle at center,#ffffff 0%,#d9e9ff 65%,#c9deff 100%);
         overflow:hidden;
         }
         .globe::before{
         content:'';
         position:absolute;
         inset:40px;
         border-radius:50%;
         border:2px solid rgba(11,95,255,.12);
         }
         .globe::after{
         content:'';
         position:absolute;
         width:130%;
         height:130%;
         border:3px solid rgba(255,136,0,.3);
         border-radius:50%;
         top:-15%;
         left:-15%;
         transform:rotate(18deg);
         }
         .globe-logo{
         position:absolute;
         inset:0;
         display:flex;
         align-items:center;
         justify-content:center;
         font-size:170px;
         color:#0b5fff;
         }
         .person{
         position:absolute;
         width:56px;
         height:56px;
         border-radius:50%;
         background:#fff;
         box-shadow:0 15px 35px rgba(0,0,0,.08);
         display:flex;
         align-items:center;
         justify-content:center;
         color:#0b5fff;
         font-size:22px;
         }
         .p1{
         left:40px;
         top:120px;
         }
         .p2{
         left:100px;
         bottom:120px;
         }
         .p3{
         right:70px;
         top:180px;
         color:#ff7b00;
         }
         /* =========================
         FEATURE STRIP
         ========================= */
         .feature-strip{
         background:#fff;
         border-radius:26px;
         box-shadow:0 10px 40px rgba(0,0,0,.06);
         margin-top:-60px;
         padding:26px 20px;
         }
         .feature-box{
         display:flex;
         gap:16px;
         align-items:flex-start;
         padding:0 14px;
         }
         .feature-icon{
         width:58px;
         height:58px;
         min-width:58px;
         /*border-radius:16px;*/
         /*background:#eef4ff;*/
         color:#0b5fff;
         display:flex;
         align-items:center;
         justify-content:center;
         font-size:45px;
         }
         .feature-box h4{
         font-size:15px;
         font-weight:700;
         margin-bottom:2px;
         }
         .feature-box p{
         color:#6a7389;
         font-size:14px;
         line-height:1.4;
         }
         /* =========================
         SECTION
         ========================= */
         .section-space{
         padding:85px 0;
         }
         .section-title{
         text-align: center;
         font-size: 35px;
         font-weight: 600;
         margin-bottom: 14px;
         font-family: 'Inter', sans-serif;
         }
         .section-subtitle{
         text-align:center;
         color:#6a7389;
         font-size:16px;
         margin-bottom:30px;
         }
         /* =========================
         HOW IT WORKS
         ========================= */
         .steps{
         display:flex;
         justify-content:space-between;
         align-items:flex-start;
         gap:20px;
         }
         .step{
         text-align:center;
         flex:1;
         }
         .step-circle{
         width:100px;
         height:100px;
         border-radius:50%;
         background:#fff;
         box-shadow:0px 0px 8px 3px rgba(0,0,0,.06);
         margin:auto;
         margin-bottom:22px;
         display:flex;
         align-items:center;
         justify-content:center;
         font-size:50px;
         color:#0b5fff;
         }
         .step h3{
         font-size:19px;
         font-weight:600;
         margin-bottom:0px;
         }
         .step p{
         color:#6a7389;
         line-height:1.8;
         font-size:14px;
         }
         .arrow{
         font-size:30px;
         color:#0b5fff;
         margin-top:40px;
         }
         /* =========================
         PIPELINES
         ========================= */
         .pipeline-box{
         background:#fff;
         border:1px solid #edf1f7;
         border-radius:28px;
         padding:34px;
         }
         .pipeline-grid{
         display:grid;
         grid-template-columns:repeat(5,1fr);
         gap:18px;
         }
         .pipeline-card{
         border:1px solid #edf1f7;
         border-radius:18px;
         padding:24px 18px;
         /*min-height:130px;*/
         transition:.3s;
         display: flex;
         gap:10px;
         align-items: center;
         }
         .pipeline-card:hover{
         transform:translateY(-4px);
         box-shadow:0 10px 30px rgba(11,95,255,.08);
         }
         .pipeline-card i{
         font-size:45px;
         margin-bottom:0px;
         }
         .pipeline-card h4{
         font-size:14px;
         line-height:1.5;
         font-weight:700;
         }
         .blue{
         color:#0b5fff;
         }
         .green{
         color:#10b981;
         }
         .orange{
         color:#ff8a00;
         }
         .purple{
         color:#7b61ff;
         }
         .center-btn{
         text-align:center;
         margin-top:34px;
         }
         /* =========================
         JOIN SECTION
         ========================= */
         /*.join-box{
         background:#fff;
         border-radius:30px;
         border:1px solid #edf1f7;
         padding:32px;
         }*/
         .join-image{
         height:100%;
         min-height:420px;
         border-radius:24px;
         background:url('../../all.png') center/cover;
         }
         .join-tag{
         color:#0b5fff;
         font-size:14px;
         font-weight:800;
         margin-bottom:12px;
         display:block;
         }
         .join-title{
         font-size: 38px;
         line-height: 1.15;
         font-weight: 600;
         margin-bottom: 28px;
         }
         .join-title span{
         color:#0b5fff;
         }
         .check-grid{
         display:grid;
         grid-template-columns:repeat(2,1fr);
         gap:18px;
         margin-bottom:30px;
         }
         .check-item{
            display: flex;
            gap: 12px;
            align-items: center;
            font-weight: 400;
            color: #08113d;
            font-size: 13px;
         }
         .check-item i{
         color:#0b5fff;
         }
         /* =========================
         BOTTOM CTA
         ========================= */
         .bottom-cta{
         margin-top:50px;
         background:linear-gradient(90deg,#031d7a,#0b5fff);
         padding:55px 0;
         color:#fff;
         }
         .bottom-title{
         font-size:42px;
         line-height:1.15;
         font-weight:600;
         }
         .bottom-title span{
         color:#6fe2ff;
         }
         .bottom-desc{
         font-size:20px;
         line-height:1.8;
         }
         /* =========================
         FOOTER
         ========================= */
         .footer{
         padding:40px 0;
         background:#fff;
         }
         .footer-text{
         color:#08113d;
         line-height:1.8;
         font-weight:500;
         }
         .footer-text span{
            color: #073cb7;
         }
         .socials{
         display:flex;
         justify-content:flex-end;
         gap:14px;
         }
         .socials a{
         width:54px;
         height:54px;
         border-radius:50%;
         background:#08113d;
         color:#fff;
         display:flex;
         align-items:center;
         justify-content:center;
         font-size:20px;
         }
         /* =========================
         RESPONSIVE
         ========================= */
         @media(max-width:1400px){
            .hero-title{
                font-size: 53px;
            }
            .top-badge{
                font-size: 12px;
            }
         }
         @media(max-width:1200px){
         .pipeline-grid{
         grid-template-columns:repeat(3,1fr);
         }
         .hero-title{
         font-size:45px;
         }
         .step h3{
            font-size: 15px;
         }
         .step p{
            font-size: 13px;
         }
         }
         @media(max-width:991px){
            .arrow{
                display: none;
            }
            .steps{
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 20px;
            }
            .pbottom{
                justify-content: center;
            }
            .logo-text h2, .logo-text span{
                font-size: 30px;
            }
            .bottom-desc{
                font-size: 16px;
            }
            .join-title{
                font-size: 30px;
            }
            .primary-btn{
                padding: 16px 20px;
                font-size: 15px;
            }
         .pipeline-grid{
         grid-template-columns:repeat(2,1fr);
         }
         .hero-title{
         font-size:40px;
         }
         .steps{
         flex-direction:column;
         }
         .arrow{
         transform:rotate(90deg);
         margin:auto;
         }
         }
         @media(max-width:768px){
         .pipeline-grid{
         grid-template-columns:2, 1fr;
         }
         .footer .navbar-brand {
            justify-content: center;
        }
        .footer-text{
            text-align: center;
        }
         .hero-title{
         font-size:40px;
         }
         .hero-btns{
         flex-direction:column;
         }
         .primary-btn,
         .secondary-btn{
         width:100%;
         }
         .join-title{
         font-size:36px;
         }
         .check-grid{
         grid-template-columns:1fr;
         }
         .bottom-title{
         font-size:36px;
         }
         .socials{
         justify-content:center;
         margin-top:20px;
         }
         .hero-main{
            background: #F0F4FD;
            background: linear-gradient(90deg, rgba(240, 244, 253, 1) 50%, rgba(227, 237, 254, 1) 100%) !important;
         }
         }
         @media(max-width:600px){
            .logo-area{
                display: inline-block;
            }
            .pipeline-grid {
                grid-template-columns:  1fr;
            }
            .top-badge{
                font-size: 11px;
            }.step-circle{
                width: 70px;
                height: 70px;
                font-size: 30px;
            }
            .section-title{
                font-size: 27px;
            }
            .join-title {
        font-size: 24px;
    }
            .hero-title{
                font-size: 24px;line-height: 30px;margin-bottom: 20px;
            }.step .pbottom{display: inline-block;text-align: center;width: 100%;}
            .step .infobox{width: 100%;margin-top: 15px;}.pbottom .count{margin:0 auto;}
            .hero-desc{font-size: 15px;}.step{width: 100%;}
            .hero-note{font-size: 12px;}.feature-box p{font-size: 12px;}
            .hero-main{padding: 120px 0 90px;background-position: left !important;}
            .feature-icon{font-size: 40px;}
         }
         .logo-area img{
            height: 80px;
         }
         .hero-note span{
            color: #000;
         }
         .hero-note i{
            margin-top: 8px;
         }
         .pbottom {
            display: flex;
            text-align: left;
            gap: 10px;
            width: 80%;
            margin: 0 auto;
        }
         .pbottom .count{
            width: 20px;
            height: 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            border-radius: 10px;
            background-color: #0b5fff;
            color: #fff;
         }
        .infobox{
            width: 160px;
        }
        section.top-main {
    position: absolute;
    left: 0;
    right: 0;
    top: 10px;
}