body{font-family:Poppins,sans-serif;color:#374151}
.navbar{background:rgba(10,42,102,.85);backdrop-filter:blur(8px)}
.navbar-brand,h1,h2,h3,h4{font-family:Montserrat,sans-serif}
.hero{background:linear-gradient(135deg,#0A2A66,#153d8a);overflow:hidden;margin-top:100px;}
.hero h1{font-size:4rem;font-weight:800}.hero h1 span{color:#D4AF37}
.btn-gold{background:#D4AF37;color:#0A2A66;font-weight:700}
.hero-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);padding:50px;border-radius:24px;color:#fff;text-align:center;backdrop-filter:blur(10px)}
.orb{width:180px;height:180px;border-radius:50%;margin:0 auto 25px;background:radial-gradient(circle,#D4AF37,#2f63d8);animation:float 5s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-15px)}}
.svc{padding:30px;border:none;border-radius:18px;box-shadow:0 10px 25px rgba(0,0,0,.08);height:100%;transition:.3s}
.svc:hover{transform:translateY(-8px)}
.footer{background:#0A2A66;color:#fff}
/*==========================
HEADER
==========================*/

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

.header{

position:fixed;

top:0;

left:0;

width:100%;

height:100px;

background:#ffffff;

z-index:99999;

border-bottom:1px solid #ececec;

transition:.35s ease;

}

.header.scrolled{

height:80px;

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

}

.container{

max-width:1320px;

margin:auto;

padding:0 20px;

}

.header-wrapper{

height:100%;

display:flex;

justify-content:space-between;

align-items:center;

}

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

.logo img{

height:90px;

transition:.35s;

}

.header.scrolled .logo img{

height:56px;

}

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

.navigation ul{

display:flex;

align-items:center;

gap:48px;

list-style:none;

margin:0;

padding:0;

}

.navigation ul li{

position:relative;

}

.navigation ul li a{

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

font-size:15px;

font-weight:600;

letter-spacing:1px;

color:#0A2A66;

text-decoration:none;

transition:.3s;

display:block;

padding:40px 0;

}

.navigation ul li a:hover{

color:#D4AF37;

}

/* Gold Line */

.navigation ul li::after{

content:"";

position:absolute;

left:0;

bottom:28px;

width:0;

height:2px;

background:#D4AF37;

transition:.35s;

}

.navigation ul li:hover::after,

.navigation ul li.active::after{

width:100%;

}

.navigation ul li.active a{

color:#0A2A66;

font-weight:700;

}

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

@media(max-width:991px){

.navigation{

display:none;

}

.header{

height:80px;

}

.logo img{

height:55px;

}

}
/*=========================================
 HERO SECTION
=========================================*/

.hero{
    position: relative;
    overflow: hidden;
     min-height:780px;
    display:flex;
    align-items:center;
    background: linear-gradient(135deg,#061B45 0%,#0A2A66 40%,#123E88 100%);
    padding:120px 0 80px;
}

.hero::before{
    content:"";
    position:absolute;
    inset:0;
    background:url('../images/hero/hero-bg.png') center center/cover no-repeat;
    opacity:.18;
}

.hero-overlay{
    position:absolute;
    inset:0;
    
}

.hero .container{
    position:relative;
    z-index:10;
}

.hero-wrapper{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:80px;
}

.hero-content{
    width:52%;
}

.hero-image{
    width:48%;
    position:relative;
    text-align:center;
}

/*----------------------------------
 TAG
-----------------------------------*/

.hero-tag{

display:inline-block;

padding:12px 24px;

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

border-radius:50px;

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

backdrop-filter:blur(10px);

color:#ffffff;

font-size:14px;

font-weight:600;

letter-spacing:1px;

margin-bottom:35px;

}

/*----------------------------------
 HEADING
-----------------------------------*/

.hero h1{

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

font-size:68px;

font-weight:800;

line-height:1.15;

color:#ffffff;

margin-bottom:28px;

}

.hero h1 span{

color:#D4AF37;

}

/*----------------------------------
 DESCRIPTION
-----------------------------------*/

.hero p{

font-size:19px;

line-height:34px;

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

margin-bottom:45px;

max-width:650px;

}

/*----------------------------------
 BUTTON
-----------------------------------*/

.hero-btn{

display:inline-flex;

align-items:center;

justify-content:center;

padding:18px 42px;

border-radius:60px;

background:#D4AF37;

color:#0A2A66;

font-weight:700;

font-size:15px;

letter-spacing:1px;

text-decoration:none;

transition:.35s;

}

.hero-btn:hover{

background:#ffffff;

transform:translateY(-4px);

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

}

/*----------------------------------
 GLOBE
-----------------------------------*/

.globe{

width:620px;

max-width:100%;

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

filter:drop-shadow(0 30px 70px rgba(0,0,0,.35));

}

/*----------------------------------
 ICONS
-----------------------------------*/

.icon{

position:absolute;

width:70px;

animation:float2 5s ease-in-out infinite;

}

.azure{

top:8%;

left:5%;

}

.aws{

top:65%;

left:0;

}

.ai{

top:15%;

right:0;

}

.cloud{

bottom:10%;

right:15%;

}

.powerbi{

bottom:0;

left:35%;

}

.security{

top:42%;

right:-20px;

}

/*----------------------------------
 ANIMATIONS
-----------------------------------*/

@keyframes float{

0%{

transform:translateY(0px);

}

50%{

transform:translateY(-18px);

}

100%{

transform:translateY(0);

}

}

@keyframes float2{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-10px);

}

100%{

transform:translateY(0);

}

}

/*----------------------------------
 RESPONSIVE
-----------------------------------*/

@media(max-width:992px){

.hero{

padding:120px 0 80px;

}

.hero-wrapper{

flex-direction:column;

text-align:center;

}

.hero-content,

.hero-image{

width:100%;

}

.hero h1{

font-size:48px;

}

.hero p{

font-size:17px;

margin:auto auto 40px;

}

.hero-stats{

justify-content:center;

}

.globe{

width:420px;

margin-top:50px;

}

}

/*======================================
 HERO STATS
=======================================*/

.hero-stats{

margin-top:-55px;

position:relative;

z-index:20;

padding-bottom:70px;

}

.stats-box{

    background:#fff;

    max-width:1250px;

    margin:auto;

    border-radius:20px;

    padding:30px 20px;

    display:flex;

    justify-content:space-between;

    align-items:center;

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

}

.stat-item{

    flex:1;

    text-align:center;

    padding:0 15px;

}

.stat-item img{

    width:42px;

    margin-bottom:15px;

}

.stat-item h2{

    margin:0;

    font-size:42px;

    font-weight:800;

    color:#D4AF37;

    line-height:1;

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

}
.stat-item p{

    margin-top:10px;

    color:#666;

    font-size:16px;

    font-weight:500;

    line-height:24px;

}


.divider{

    width:1px;

    height:70px;

    background:#e8e8e8;

}

@media(max-width:991px){

.stats-box{

flex-direction:column;

padding:35px;

}

.divider{

display:none;

}

.stat-item{

margin-bottom:30px;

}

}

.stat-icon{

font-size:38px;

color:#D4AF37;

margin-bottom:15px;

display:block;

}

/*=====================================
TRUSTED TECHNOLOGIES
======================================*/

/*=================================================
TRUSTED TECHNOLOGIES
=================================================*/

.trusted-technologies{

    padding:90px 0;

    background:#ffffff;

}

.section-heading{

    text-align:center;

    margin-bottom:60px;

}

.sub-title{

    display:inline-block;

    color:#D4AF37;

    font-size:15px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:3px;

    margin-bottom:12px;

}

.section-heading h2{

    font-size:46px;

    font-weight:800;

    color:#0A2A66;

    margin-bottom:20px;

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

}

.section-heading p{

    max-width:720px;

    margin:auto;

    color:#666;

    font-size:18px;

    line-height:32px;

}

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

.technology-grid{

    display:grid;

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

    gap:18px;

}

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

.technology-card{

    background:#fff;

    border:1px solid #ececec;

    border-radius:18px;

    height:110px;

    display:flex;

    justify-content:center;

    align-items:center;

    transition:.35s;

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

    cursor:pointer;

}

.technology-card:hover{

    transform:translateY(-8px);

    border-color:#D4AF37;

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

}

.technology-card img{

    max-width:130px;

    max-height:42px;

    transition:.35s;

}

.technology-card:hover img{

    transform:scale(1.05);

}
@media(max-width:1200px){

.technology-grid{

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

}

}

@media(max-width:992px){

.technology-grid{

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

}

}

@media(max-width:576px){

.technology-grid{

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

}

.section-heading h2{

font-size:34px;

}

.technology-card{

height:95px;

}

}

/*==================================================
OUR SERVICES
==================================================*/

.services-section{

    position:relative;

    padding:110px 0;

    background:#071B4A url("../images/services/service-bg.png") center center/cover no-repeat;

    overflow:hidden;

}

/* Overlay */

.services-section::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(180deg,
    rgba(7,27,74,.92),
    rgba(8,34,88,.96));

}

/* Container */

.services-section .container{

    position:relative;

    z-index:5;

}

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

.services-heading{

    text-align:center;

    margin-bottom:70px;

}

.services-heading span{

    color:#D4AF37;

    font-size:16px;

    font-weight:700;

    letter-spacing:3px;

    text-transform:uppercase;

}

.services-heading h2{

    color:#ffffff;

    font-size:50px;

    font-weight:800;

    margin-top:15px;

    margin-bottom:20px;

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

}

.services-heading h2::after{

    content:"";

    display:block;

    width:80px;

    height:3px;

    background:#D4AF37;

    margin:18px auto 0;

}

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

.services-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
    gap:22px;
}

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

.service-card{

    position:relative;

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

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

    border-radius:18px;

    padding:45px 25px;

    text-align:center;

    overflow:hidden;

    backdrop-filter:blur(12px);

    transition:.4s;

    min-height:460px;

}

.service-card:hover{

    transform:translateY(-12px);

    border-color:#D4AF37;

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

}

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

.service-icon{

    width:90px;

    height:90px;

    margin:auto;

    margin-bottom:28px;

}

.service-icon img{

    width:100%;

    transition:.35s;

}

.service-card:hover img{

    transform:scale(1.12);

}

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

.service-card h3{

    color:#ffffff;

    font-size:22px;

    font-weight:700;

    margin-bottom:22px;

    line-height:1.4;

}

/*==================================
GOLD LINE
==================================*/

.gold-line{

    width:45px;

    height:3px;

    background:#D4AF37;

    margin:0 auto 28px;

    border-radius:50px;

}

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

.service-card p{

    color:#d9d9d9;

    font-size:17px;

    line-height:34px;

}

/*==================================
BOTTOM GLOW
==================================*/

.service-card::after{

    content:"";

    position:absolute;

    left:0;

    right:0;

    bottom:0;

    height:120px;

    background:url("../images/services/card-wave.png") center bottom/cover no-repeat;

    opacity:.28;

    transition:.4s;

}

.service-card:hover::after{

    opacity:.6;

}

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

@media(max-width:1400px){

.services-grid{

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

}

}

@media(max-width:991px){

.services-grid{

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

}

.services-heading h2{

font-size:40px;

}

}

@media(max-width:768px){

.services-grid{

grid-template-columns:1fr;

}

.service-card{

min-height:auto;

padding:40px 25px;

}

}
.service-icon{

    width:90px;
    height:90px;

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

    margin:0 auto 30px;

}

.service-icon i{

    font-size:70px;

    color:#D4AF37;

    transition:.35s;

}

.service-card:hover .service-icon i{

    transform:scale(1.15);

    color:#FFD86A;

}

/*======================================
INDUSTRIES
======================================*/

.industries-section{

    padding:110px 0;

    background:#F7F9FC;

}

.industries-grid{

    display:grid;

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

    gap:30px;

}

.industry-card{

    background:#fff;

    border-radius:18px;

    padding:45px 35px;

    text-align:center;

    transition:.35s;

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

    border:1px solid #ececec;

}

.industry-card:hover{

    transform:translateY(-10px);

    border-color:#D4AF37;

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

}

.industry-card i{

    font-size:55px;

    color:#D4AF37;

    margin-bottom:25px;

    display:block;

}

.industry-card h3{

    color:#0A2A66;

    font-size:24px;

    font-weight:700;

    margin-bottom:18px;

}

.industry-card p{

    color:#666;

    line-height:30px;

    font-size:16px;

}

@media(max-width:991px){

.industries-grid{

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

}

}

@media(max-width:768px){

.industries-grid{

grid-template-columns:1fr;

}

}

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

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

.why-us{

    padding:110px 0;

    background:linear-gradient(180deg,#F8FBFF,#EEF5FF);

}

.why-grid{

    display:grid;

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

    gap:30px;

    margin-top:70px;

}

.why-card{

    background:#ffffff;

    border-radius:20px;

    padding:45px 35px;

    text-align:center;

    transition:.35s;

    border:1px solid #E6ECF4;

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

}

.why-card:hover{

    transform:translateY(-10px);

    border-color:#D4AF37;

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

}

.why-icon{

    width:90px;

    height:90px;

    margin:auto;

    border-radius:50%;

    background:#0A2A66;

    display:flex;

    align-items:center;

    justify-content:center;

    margin-bottom:30px;

}

.why-icon i{

    color:#D4AF37;

    font-size:42px;

}

.why-card h3{

    font-size:26px;

    color:#0A2A66;

    margin-bottom:18px;

    font-weight:700;

}

.why-card p{

    color:#666;

    line-height:30px;

    font-size:16px;

}

@media(max-width:1200px){

.why-grid{

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

}

}

@media(max-width:768px){

.why-grid{

grid-template-columns:1fr;

}

}

/*==================================
OUR PROCESS
==================================*/

/*==================================
OUR PROCESS
==================================*/

.process-section{

    padding:110px 0;

    background:#F8FAFD;

    position:relative;

}

.process-grid{

    display:grid;

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

    gap:30px;

    margin-top:70px;

    position:relative;

    z-index:2;

}

.process-line{

    position:absolute;

    left:12%;

    right:12%;

    height:4px;

    margin-top:145px;

    background:linear-gradient(90deg,#D4AF37,#F7D96A);

    border-radius:50px;

}

.process-card{

    background:#ffffff;

    border-radius:22px;

    padding:40px 30px;

    text-align:center;

    position:relative;

    border:1px solid #E8EDF5;

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

    transition:.35s;

}

.process-card:hover{

    transform:translateY(-10px);

    border-color:#D4AF37;

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

}

.process-number{

    width:55px;

    height:55px;

    border-radius:50%;

    background:#D4AF37;

    color:#0A2A66;

    font-size:22px;

    font-weight:700;

    display:flex;

    justify-content:center;

    align-items:center;

    margin:-65px auto 25px;

    border:5px solid #F8FAFD;

}

.process-icon{

    width:90px;

    height:90px;

    margin:auto;

    background:#EEF4FF;

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    margin-bottom:25px;

}

.process-icon i{

    font-size:44px;

    color:#0A2A66;

}

.process-card h3{

    font-size:28px;

    color:#0A2A66;

    margin-bottom:18px;

    font-weight:700;

}

.process-card p{

    color:#666;

    line-height:30px;

}

.process-card.active{

    background:#0A2A66;

}

.process-card.active h3,

.process-card.active p{

    color:#fff;

}

.process-card.active .process-icon{

    background:#123C88;

}

.process-card.active .process-icon i{

    color:#D4AF37;

}

@media(max-width:992px){

.process-grid{

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

}

.process-line{

display:none;

}

}

@media(max-width:768px){

.process-grid{

grid-template-columns:1fr;

}

}

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

.success-section{

padding:110px 0;

background:#0A2A66;

}

.success-section .section-heading h2{

color:#fff;

}

.success-section .section-heading p{

color:#d9d9d9;

}

.success-grid{

display:grid;

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

gap:30px;

margin-top:70px;

}

.success-card{

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

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

border-radius:20px;

padding:45px;

text-align:center;

backdrop-filter:blur(10px);

transition:.35s;

}

.success-card:hover{

transform:translateY(-10px);

border-color:#D4AF37;

}

.success-card h2{

font-size:60px;

color:#D4AF37;

font-weight:800;

margin-bottom:20px;

}

.success-card h4{

color:#fff;

margin-bottom:18px;

}

.success-card p{

color:#d7d7d7;

line-height:30px;

}

@media(max-width:991px){

.success-grid{

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

}

}

@media(max-width:768px){

.success-grid{

grid-template-columns:1fr;

}

}

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

.cta-section{

padding:90px 0;

background:

linear-gradient(rgba(8,35,88,.93),
rgba(8,35,88,.93)),

url("../images/cta/world-map.png")
center center/cover no-repeat;

}

.cta-box{

max-width:900px;

margin:auto;

text-align:center;

}

.cta-box span{

color:#D4AF37;

letter-spacing:3px;

font-weight:700;

}

.cta-box h2{

font-size:64px;

color:#fff;
	 line-height:1.15;

margin:25px 0;

font-weight:800;
	text-shadow:0 8px 35px rgba(255,255,255,.12);

}

.cta-box p{

color:#d7d7d7;

font-size:20px;

line-height:36px;

margin-bottom:45px;

}

.cta-buttons{

display:flex;

justify-content:center;

gap:25px;

}

.btn-primary{

background:#D4AF37;

color:#0A2A66;

padding:18px 40px;

border-radius:50px;

font-weight:700;

text-decoration:none;

}

.btn-outline{

border:2px solid #fff;

color:#fff;

padding:18px 40px;

border-radius:50px;

text-decoration:none;

}

.btn-primary:hover{

transform:translateY(-4px);

box-shadow:0 15px 35px rgba(212,175,55,.45);

}

.btn-outline:hover{

background:#ffffff;

color:#0A2A66;

transform:translateY(-4px);

}
.cta-section{

position:relative;

overflow:hidden;

}

.cta-section::before{

content:"";

position:absolute;

width:450px;

height:450px;

background:radial-gradient(circle,#D4AF3725,transparent);

top:-180px;

left:-120px;

}

.cta-section::after{

content:"";

position:absolute;

width:500px;

height:500px;

background:radial-gradient(circle,#2D7CFF18,transparent);

bottom:-200px;

right:-120px;

}

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

.footer{

    background:#061B45;

    color:#ffffff;

}

.footer-top{

    display:grid;

    grid-template-columns:2fr 1fr 1fr 1.3fr;

    gap:60px;

    padding:80px 0 50px;

}

.footer-logo{

    width:220px;

    background:#ffffff;

    padding:18px 22px;

    border-radius:18px;

    display:inline-block;

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

    margin-bottom:25px;

    transition:.35s ease;

}

.footer-logo:hover{

    transform:translateY(-5px);

    box-shadow:0 18px 40px rgba(0,0,0,.28);

}

.footer-about{

    color:#BFC7D7;

    line-height:32px;

    margin-bottom:30px;

}

.footer-column h3{

    color:#ffffff;

    margin-bottom:25px;

    font-size:22px;

    position:relative;

}

.footer-column h3::after{

    content:"";

    width:45px;

    height:3px;

    background:#D4AF37;

    display:block;

    margin-top:10px;

}

.footer-column ul{

    list-style:none;

    padding:0;

    margin:0;

}

.footer-column ul li{

    margin-bottom:16px;

}

.footer-column ul li a{

    color:#BFC7D7;

    text-decoration:none;

    transition:.3s;

}

.footer-column ul li a:hover{

    color:#D4AF37;

    padding-left:8px;

}

.footer-contact li{

    display:flex;

    gap:12px;

    align-items:flex-start;

    color:#BFC7D7;

}

.footer-contact i{

    color:#D4AF37;

    margin-top:4px;

}

.footer-social{

    display:flex;

    gap:15px;

}

.footer-social a{

    width:45px;

    height:45px;

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

    border-radius:50%;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#ffffff;

    transition:.35s;

}

.footer-social a:hover{

    background:#D4AF37;

    color:#061B45;

    transform:translateY(-5px);

}

.footer-bottom{

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

    padding:25px 0;

    display:flex;

    justify-content:space-between;

    align-items:center;

}

.footer-bottom p{

    margin:0;

    color:#BFC7D7;

}

.footer-bottom a{

    color:#BFC7D7;

    margin-left:25px;

    text-decoration:none;

}

.footer-bottom a:hover{

    color:#D4AF37;

}

/* Responsive */

@media(max-width:991px){

.footer-top{

grid-template-columns:1fr 1fr;

}

.footer-bottom{

flex-direction:column;

gap:15px;

text-align:center;

}

}

@media(max-width:768px){

.footer-top{

grid-template-columns:1fr;

}

}