
:root{
--primary:#0D2DBB;
--secondary:#3B1CFF;
--accent:#8B5CF6;
--pink:#EC4899;
--dark:#08142E;
--white:#FFFFFF;
--light:#F8FAFC;
}
.logo{
    display:flex;
    align-items:center;
    gap:12px;
}

.logo img{
    height:55px;
}

.brand{
    font-size:24px;
    font-weight:700;
    color:#0D2DBB;
}

.tagline{
    font-size:12px;
    color:#64748B;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}

body{
font-family:'Segoe UI',sans-serif;
background:#f8fafc;
color:#1e293b;
line-height:1.7;
overflow-x:hidden;
}

.section{padding:100px 8%;}

.section h2{
font-size:42px;
margin-bottom:25px;
color:var(--primary);
text-align:center;
}

.navbar{
position:fixed;
top:0;
left:0;
width:100%;
background:rgba(255,255,255,.95);
backdrop-filter:blur(10px);
box-shadow:0 4px 15px rgba(0,0,0,.08);
z-index:1000;
}

.navbar .container{
display:flex;
justify-content:space-between;
align-items:center;
padding:15px 8%;
}

.logo img{height:70px;width:auto;}

nav a{
margin-left:25px;
text-decoration:none;
font-weight:600;
color:#334155;
transition:.3s;
}

nav a:hover{color:var(--secondary);}

.hero{
min-height:100vh;
display:flex;
align-items:center;
padding-top:100px;
background:linear-gradient(135deg,#ffffff,#edf2ff);
}

.hero-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:60px;
align-items:center;
}

.hero h1{
font-size:60px;
line-height:1.1;
color:var(--dark);
margin-bottom:20px;
}

.hero p{
font-size:20px;
margin-bottom:30px;
}

.hero img{
width:100%;
animation:float 5s ease-in-out infinite;
}

.btn{
display:inline-block;
padding:15px 30px;
background:linear-gradient(135deg,#0D2DBB,#3B1CFF);
color:white;
border-radius:50px;
text-decoration:none;
font-weight:600;
transition:.3s;
}

.btn:hover{
transform:translateY(-4px);
box-shadow:0 10px 25px rgba(13,45,187,.25);
}

.vision-grid,.about-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:70px;
align-items:center;
}

.vision-image img,.about-image img{
width:100%;
border-radius:25px;
box-shadow:0 20px 40px rgba(0,0,0,.1);
}

.cards{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
gap:30px;
margin-top:40px;
}

.card{
background:white;
padding:20px;
border-radius:24px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
transition:.4s;
}

.card:hover{transform:translateY(-10px);}

.card img{
width:100%;
height:220px;
object-fit:cover;
border-radius:18px;
margin-bottom:20px;
}

#process img,#industries img{
width:100%;
border-radius:25px;
box-shadow:0 15px 35px rgba(0,0,0,.12);
}

.contact-banner{padding:60px 8%;}
.contact-banner img{width:100%;border-radius:25px;}

.footer{
background:linear-gradient(rgba(8,20,46,.95),rgba(8,20,46,.95)),url('../images/footer-bg.webp');
background-size:cover;
background-position:center;
color:white;
text-align:center;
padding:80px 20px;
}

.fade-up{
opacity:0;
transform:translateY(40px);
transition:.8s;
}

.fade-up.show{
opacity:1;
transform:translateY(0);
}

@keyframes float{
0%,100%{transform:translateY(0);}
50%{transform:translateY(-15px);}
}

@media(max-width:768px){
.hero-grid,.vision-grid,.about-grid{grid-template-columns:1fr;}
.hero h1{font-size:40px;}
nav{display:none;}
.cards{grid-template-columns:1fr;}
}

.contact-section{

padding:120px 8%;

background:#F8FAFC;

}

.contact-container{

display:grid;

grid-template-columns:1fr 1.2fr;

gap:60px;

align-items:start;

}

.contact-tag{

color:#3B1CFF;

font-weight:700;

letter-spacing:2px;

font-size:14px;

}

.contact-info h2{

font-size:56px;

line-height:1.1;

margin:20px 0;

color:#0D2DBB;

}

.contact-info p{

font-size:18px;

color:#64748B;

margin-bottom:30px;

}

.contact-item{

display:flex;

gap:18px;

margin-bottom:25px;

}

.icon{

width:55px;
height:55px;

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

border-radius:14px;

background:#EEF2FF;

font-size:22px;

}

.contact-form-box{

background:white;

padding:40px;

border-radius:24px;

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

}

.row{

display:grid;

grid-template-columns:1fr 1fr;

gap:20px;

}

.form-group{

margin-bottom:20px;

}

.form-group label{

display:block;

margin-bottom:8px;

font-weight:600;

}

.form-group input,
.form-group textarea,
.form-group select{

width:100%;

padding:16px;

border:1px solid #CBD5E1;

border-radius:14px;

font-size:16px;

}

.contact-btn{

width:100%;

padding:18px;

border:none;

border-radius:16px;

font-size:18px;

font-weight:600;

color:white;

background:
linear-gradient(
135deg,
#0D2DBB,
#3B1CFF
);

cursor:pointer;

}

.contact-btn:hover{

transform:translateY(-3px);

}

@media(max-width:768px){

.contact-container{

grid-template-columns:1fr;

}

.row{

grid-template-columns:1fr;

}

.contact-info h2{

font-size:40px;

}

}
.map-section{

padding:80px 8%;

background:white;

}

.map-section h2{

text-align:center;

margin-bottom:30px;

}

.map-section iframe{

width:100%;

border:none;

border-radius:24px;

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

}
.footer{

background:
linear-gradient(
rgba(8,20,46,.96),
rgba(8,20,46,.96)
),
url('../images/footer-bg.webp');

background-size:cover;
background-position:center;

}
.footer-cta{

padding:80px 20px;

text-align:center;

background:
linear-gradient(
135deg,
#ffffff,
#eef2ff
);

}

.footer-cta h2{

font-size:48px;

margin-bottom:15px;

color:#08142E;

}

.footer-cta p{

font-size:20px;

margin-bottom:30px;

color:#64748B;

}

.footer{

padding:70px 8% 30px;

color:white;

}

.footer-grid{

display:grid;

grid-template-columns:
1.5fr 1fr 1fr 1fr;

gap:20px;

margin-bottom:40px;

}

.footer-logo{

height:80px;

margin-bottom:20px;

}

.footer h4{

margin-bottom:20px;

}

.footer ul{

list-style:none;

}

.footer ul li{

margin-bottom:10px;

}

.footer a{

color:white;

text-decoration:none;

}

.socials{

text-align:center;

margin:30px 0;

}

.socials a{

margin:0 15px;

color:white;

font-weight:600;

}

.footer-bottom{

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

padding-top:20px;

text-align:center;

}

#successMessage{

margin-top:15px;

font-weight:600;

color:#16A34A;

text-align:center;

}

.error-message{

color:#DC2626 !important;

}