*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Josefin  Sans /*sans-serif*/;
/*border:1px solid red;*/
}

html body{
overflow-x:hidden;
background:#fff;
width:100%;
}

/* TOP BAR */
.topbar{
height:48px;
background:#0b5a86;
padding:0 7%;
display:flex;
justify-content:space-between;
align-items:center;
color:#fff;
font-size:14px;
font-weight:500;
}

.topbar-left span{
margin-right:28px;
position:relative;
}
.topbar-left span::before{
    content:ur('image/geo-alt.svg');
direction:flex;
position:absolute;
    color:#fff;
}
.topbar-right span{
margin-left:18px;
cursor:pointer;
color:#fff;
}
.topbar-right span a{
margin-left:18px;
cursor:pointer;
color:#fff;
font-weight:700;
text-decoration:none;
}
/* HERO */
.hero{
position:relative;
min-height:40vh;
background:/*url('image/KMSB.png');*/
/*linear-gradient(rgba(6,48,77,.76),rgba(6,48,77,.76)),*/
url('https://images.unsplash.com/photo-1552664730-d307ca884978?auto=format&fit=crop&w=1700&q=80');
background-size:cover;
background-position:center;
overflow:visible;
}

/* NAVBAR */
.navbar{
height:95px;
padding:0 7%;
display:flex;
justify-content:space-between;
align-items:center;
}

.logo{
font-size:26px;
font-weight:800;
color:#f4c259;
line-height:1;
}

.logo span{
color:#1c2fc4;
font-size:32px;
font-weight:500;
margin-left:4px;
}
.logo span a{
color:#1c2fc4;
font-size:32px;
font-weight:500;
margin-left:-55px;
text-decoration:none;
}

.menu{
display:flex;
gap:34px;
list-style:none;
}

.menu li a{
color:#0b5a86;
text-decoration:none;
text-transform:uppercase;
font-size:18px;
font-weight:700;
letter-spacing:.5px;
}
    .menu li a:hover
    {
        padding:20px 0;
        border-bottom:1px solid #f4c259;
        color:#E65100;
    }

.quote-btn{
padding:15px 30px;
background:#2d8a85;
border-radius:40px;
color:#fff;
text-decoration:none;
font-size:14px;
font-weight:600;
}
    .quote-btn:hover
    {
        
        background-color:#9aa86a;
    }

/* HERO INNER */
.hero-inner{
padding:40px 7% 170px;
display:flex;
justify-content:space-between;
align-items:center;
gap:40px;
}

.left{
width:58%;

}

.left small{

font-size:14px;
letter-spacing:2px;
font-weight:600;
color:#f4c259;
margin-bottom:22px;
}

.left h1{
font-size:74px;
line-height:1.05;
font-weight:700;
margin-bottom:28px;
max-width:780px;
}

.left p{
font-size:20px;
font-weight:700;
line-height:1.5;
max-width:620px;
margin-bottom:36px;
color:#0066FF;
/*opacity:.96;*/
}

.hero-btns{
    margin-top:200px;
display:flex;
align-items:center;
gap:18px;
}

.btn-main{
padding:17px 34px;
background:#E65100;
border-radius:40px;
text-decoration:none;
color:#fff;
font-size:15px;
font-weight:600;
}

.play{
width:56px;
height:56px;
border-radius:50%;
background:#fff;
display:flex;
justify-content:center;
align-items:center;
font-size:18px;
color:#0b5a86;
}

/* RIGHT CARD */
.right{
    height:200px;
width:300px;

}

.card{
background:#0a527b;
padding:0px;
border-radius:18px 18px 0 0;
box-shadow:0 20px 45px rgba(0,0,0,.18);
}

.item{
padding:5px 0;
border-bottom:1px solid rgba(255,255,255,.12);
color:#fff;
}

.item:last-child{
border:none;
}

.item h3{

font-size:24px;
margin-bottom:5px;
font-weight:600;
}

.item p{

font-size:14px;
line-height:1.7;
opacity:.9;
}

/* STATS */
.stats{
position:absolute;
left:50%;
bottom:-72px;
transform:translate(-50%,50%);
width:95%;
background:#0b5a86;
display:grid;
grid-template-columns:repeat(4,1fr);
padding:35px 25px;
border-radius:0 0 18px 18px;

}

.stat{
text-align:center;
color:#fff;
}

.stat h2{
font-size:42px;
font-weight:700;
color:#f4c259;
margin-bottom:10px;

}

.stat p{
font-size:15px;
line-height:1.5;
}

/* RESPONSIVE */
@media(max-width:991px){

.topbar{
display:none;
}

.menu,.quote-btn{
display:none;
}

.hero-inner{
flex-direction:column;
padding:20px 7% 70px;
}

.left{
width:100%;
text-align:center;
}

.left h1{
font-size:44px;
}

.left p{
margin:auto auto 30px;
}

.hero-btns{
justify-content:center;
}

.right{
width:100%;
margin-top:40px;
}

.stats{
position:relative;
left:0;
transform:none;
width:100%;
grid-template-columns:repeat(2,1fr);
border-radius:18px;
margin-top:40px;
}
}
    /*===================================about*/
    /* ABOUT SECTION */
.about-section{
padding:200px 0;
background:#f7f7f7;
padding-bottom:50px;

}

.about-container{
max-width:1320px;
margin:auto;
display:flex;
align-items:center;
justify-content:space-between;
gap:40px;
}

/* LEFT SIDE */
.about-gallery{
    padding:30px 20px;
width:60%;
position:relative;
display:grid;
grid-template-columns:repeat(2,1fr);
gap:18px;
}

.img-box{
border-radius:18px;
overflow:hidden;

}

.img-box img{
width:100%;
height:100%;
object-fit:cover;
display:block;
/*border:1px solid red;*/
}

.img1{
height:325px;
}

.img2{
height:500px;
margin-top:-20px;
}

.img3{
height:325px;
margin-top:-150px;
}

/* Floating Award */
.award-box{
position:absolute;
left:300px;
bottom:60px;
background:#7c9b83;
color:#fff;
padding:22px 25px;
width:350px;
border-radius:16px;
display:flex;
gap:15px;
box-shadow:0 15px 30px rgba(0,0,0,.12);
}

.award-box span{
font-size:28px;
}

.award-box h4{
font-size:18px;
margin-bottom:8px;
font-weight:600;
}

.award-box p{
font-size:13px;
line-height:1.6;
}

/* RIGHT SIDE */
.about-content{
width:50%;
}

.about-content small{
  font-size: 18px;
  letter-spacing: 2px;
  color: #fff;
  font-weight:800;
  padding:15px;
  border:1px solid #ddd;
  border-radius:10px;
  background:#0a547d;
}

.about-content h2{
font-size:48px;
line-height:1.18;
font-weight:700;
color:#10233c;
margin-bottom:22px;
margin-top:22px;
}

.about-content p{
font-size:16px;
line-height:1.8;
color:#667;
margin-bottom:28px;
max-width:600px;
}

/* VIDEO ROW */
.video-row{
display:flex;
align-items:center;
gap:18px;
margin-bottom:28px;
}

.video-thumb{
min-width:250px;
height:152px;
border-radius:16px;
overflow:hidden;
position:relative;
}

.video-thumb img{
width:100%;
height:100%;
object-fit:cover;
}

.play-btn{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
width:52px;
height:52px;
background:#fff;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-size:18px;
color:#0a547d;
}

.blue-box{
background:#0a547d;
color:#fff;
padding:24px;
border-radius:16px;
min-width:250px;
}

.blue-box h4{
font-size:20px;
line-height:1.4;
margin-bottom:8px;
}

.blue-box p{
font-size:14px;
line-height:1.6;
color:#fff;
margin:0;
}

/* BUTTON */
.about-btn{
display:inline-block;
padding:15px 34px;
background:#2c7a7d;
color:#fff;
text-decoration:none;
border-radius:35px;
font-size:14px;
font-weight:600;
}
.fa-award:before {
    content: "\f559"
}
/* RESPONSIVE */
@media(max-width:991px){

.about-container{
flex-direction:column;
}

.about-gallery,
.about-content{
width:100%;
}

.about-content h2{
font-size:34px;
}

.video-row{
flex-direction:column;
align-items:flex-start;
}

.video-thumb,
.blue-box{
width:100%;
}

.award-box{
position:relative;
left:0;
bottom:0;
width:100%;
margin-top:15px;
}
}
    /*===========================socil link===========================*/
/* FULL SECTION */
.talk-social{
width:100%;

overflow:hidden;
margin:0;
padding:0;
}

/* TOP LOGO BAR */
.client-bar{
background:#003d63;
height:125px;
display:flex;
align-items:center;
justify-content:center;
border-radius:20px 20px 0 0;
animation:fadeTop 1s ease;
}

.client-wrap{
/*width:1200px;*/
/*display:flex;*/
justify-content:space-around;
align-items:center;
text-align:center;
vertical-align:middle;

padding:40px 0;
/*animation:logoScroll 10s linear infinite;*/
}
/*.client-bar:hover .client-wrap{
animation-play-state:paused;
}*/
.client-wrap span{
color:#fff;
font-size:14px;
font-weight:500;
opacity:.95;
letter-spacing:1px;
}
.client-wrap h1{
color:#fff;
font-size:32px;
font-weight:800;
opacity:.95;
letter-spacing:1px;
}

.client-wrap span img{
color:#fff;
font-size:14px;
font-weight:500;
opacity:.95;
letter-spacing:1px;
width:75px;height:50px;
background:#fff;
}
@keyframes logoScroll{
0%{
transform:translateX(50%);
}
100%{
transform:translateX(-50%);
}
}
/* HERO */
.hero-social{
/*height:560px;*/
background:url("image/SLB.jpg") center center/cover no-repeat;
position:relative;
display:flex;
align-items:center;
padding-left:5%;
padding-bottom:4%;
padding-top:4%;
}

/* DARK IMAGE LAYER */
.hero-social::before{
content:"";
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
/*background:rgba(0,0,0,.20);*/

}

/* CONTENT BOX */
.content-box{
position:relative;
z-index:2;
width:540px;
padding:48px 42px;
background:rgba(0,71,109,.58);
backdrop-filter: blur(2px);
border-radius:0 0 18px 18px;
animation:slideUp 1.2s ease;

}

/* SMALL TITLE */
.content-box h6{
font-size:11px;
color:#e4bf77;
letter-spacing:2px;
margin-bottom:18px;
font-weight:700;
}

/* MAIN HEADING */
.content-box h1{
font-size:50px;
line-height:1.15;
font-weight:700;
color:#fff;
margin-bottom:18px;
animation:leftText 1.4s ease;
}

/* PARA */
.content-box p{
font-size:15px;
line-height:1.9;
color:#dfeaf2;
margin-bottom:30px;
max-width:430px;
animation:leftText 1.6s ease;
}

/* BUTTON */
.content-box a{
display:inline-block;
padding:16px 34px;
background:#92a86f;
border-radius:40px;
color:#fff;
text-decoration:none;
font-size:14px;
font-weight:600;
transition:.4s;
animation:zoomBtn 1.8s ease;
}

.content-box a:hover{
background:#748d52;
transform:translateY(-3px);
}
.logo-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 25px;
  padding: 20px;
  margin:auto;
}

/* Same size cards */
.logo-card {
    width:275px;
  background: #fff;
  border-radius: 5px;
  border:3px solid rgba(0,0,0,.12);
  height: 130px;             
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
   object-fit:cover;
  transition: 0.3s ease;
  /*margin-left:50px;*/
}

.logo-card img {
  max-width: 215px;
  max-height: 155px;
   padding:20px;
 
  object-fit: cover;  
  transition: 0.3s ease;*/   
}

.logo-card:hover {
  transform: translateY(-10px);
  box-shadow: 0 15px 30px rgba(0,0,0,0.15);
}

.logo-card:hover img {
  transform: scale(1.1);
}
/* ANIMATION */
/*@keyframes slideUp{
from{
opacity:0;
transform:translateY(80px);
}
to{
opacity:1;
transform:translateY(0);
}
}

@keyframes leftText{
from{
opacity:0;
transform:translateX(-50px);
}
to{
opacity:1;
transform:translateX(0);
}
}

@keyframes zoomBtn{
from{
opacity:0;
transform:scale(.7);
}
to{
opacity:1;
transform:scale(1);
}
}

@keyframes fadeTop{
from{
opacity:0;
transform:translateY(-40px);
}
to{
opacity:1;
transform:translateY(0);
}
}*/

/* RESPONSIVE */
@media(max-width:991px){

.hero-social{
padding:40px;
justify-content:center;
height:auto;
min-height:550px;
}

.content-box{
width:100%;
max-width:620px;
}

.content-box h1{
font-size:38px;
}
}

@media(max-width:576px){

.client-wrap{
flex-wrap:wrap;
gap:15px;
padding:10px;
}

.client-bar{
height:auto;
padding:15px 0;
}

.content-box{
padding:30px 24px;
}

.content-box h1{
font-size:28px;
}

.content-box p{
font-size:14px;
}

.content-box a{
padding:14px 26px;
}
}
    /*==================================Services==============================*/
    /* SECTION */
.service-suite{
padding:70px 0;
width:100%;
}

/* CONTAINER */
.suite-container{
width:1320px;
margin:auto;
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
align-items:start;
}

/* LEFT IMAGE */
.suite-left img{
width:100%;
height:900px;
object-fit:cover;
border-radius:18px;
display:block;
animation:zoomImg 1.3s ease;
}

/* RIGHT SIDE */
.suite-right{
padding-top:30px;

}

.mini-title{
font-size: 18px;
  letter-spacing:2px;
  color: #fff;
  font-weight:800;
  padding:15px;
  
  border:1px solid #ddd;
  border-radius:10px;
  background:#0a547d;
}

.suite-right h2{
font-size:44px;
line-height:1.2;
font-weight:600;
color:#16263a;
max-width:620px;
margin-bottom:18px;
margin-top:18px;
animation:fadeUp 1s ease;
}

.suite-right p{
/*font-size:14px;
line-height:1.8;
color:#242424;
max-width:600px;
margin-bottom:18px;*/
font-size:16px;
line-height:1.8;
color:#667;
margin-bottom:18px;
max-width:600px;
}

/* IMAGE CARD AREA */
.suite-card-image{
position:relative;
width:100%;
max-width:620px;
}

.suite-card-image img{
width:100%;
height:500px;
object-fit:cover;
border-radius:18px;
display:block;
}

/* FLOAT CARD */
.floating-card{
position:absolute;
/*right:-40px;*/
top:0px;
width:630px;
margin:auto;
background:#fff;
border-radius:18px;
padding:28px 10px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
/*animation:slideLeft 1.2s ease;*/

}

    .card-box
    {
        width:600px;
    }
.card-box h4{
font-size:24px;
line-height:1.3;
font-weight:700;
color:#16263a;
margin-bottom:10px;
}

.card-box p{
   font-size:16px;
line-height:1.4;
color:#667;
margin-bottom:10px;
max-width:600px;
    /*width:100%;
font-size:14px;
line-height:1.2;
color:#7a7a7a;
margin-bottom:10px;
margin-right:10px;
padding:0;*/
}

.card-box a{
font-size:12px;
letter-spacing:1px;
text-decoration:none;
color:#1a4e73;
font-weight:600;
}

.line{
height:1px;
background:#ddd;
margin:10px 0;
}

/* ANIMATION */
@keyframes fadeUp{
from{
opacity:0;
transform:translateY(30px);
}
to{
opacity:1;
transform:translateY(0);
}
}

@keyframes slideLeft{
from{
opacity:0;
transform:translateX(80px);
}
to{
opacity:1;
transform:translateX(0);
}
}

@keyframes zoomImg{
from{
opacity:0;
transform:scale(1.08);
}
to{
opacity:1;
transform:scale(1);
}
}

/* RESPONSIVE */
@media(max-width:1200px){
.suite-container{
width:95%;
grid-template-columns:1fr;
gap:40px;
}

.suite-left img{
height:500px;
}

.floating-card{
position:relative;
right:auto;
top:auto;
margin-top:-40px;
margin-left:auto;
}
}

@media(max-width:768px){

.suite-right h2{
font-size:32px;
}

.floating-card{
width:100%;
margin-top:20px;
}

.suite-card-image img{
height:320px;
}
}

@media(max-width:576px){

.suite-left img{
height:360px;
}

.suite-right h2{
font-size:26px;
}

.card-box h4{
font-size:20px;
}
}
   /*===========================Solutions============================*/
   /* section */
.solutions-sec{
position:relative;
padding:55px 0 70px;
overflow:hidden;
background:url("image/man-bg.jpg") center center/cover no-repeat;
}

/* dark blue layer */
.solutions-overlay{
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
background:linear-gradient(to right,rgba(17,80,117,.82),rgba(2,42,68,.82));
z-index:1;
}

/* container */
.container{
width:1180px;
margin:auto;
position:relative;
z-index:2;
}

/* heading */
.title-area{
text-align:center;
margin-bottom:35px;
}

.title-area span{
display:block;
font-size:11px;
font-weight:600;
letter-spacing:2px;
color:#f1c56a;
margin-bottom:12px;
}

.title-area h2{
font-size:52px;
line-height:1.2;
color:#fff;
font-weight:600;
max-width:720px;
margin:auto;
}

/* grid */
.solution-grid{
display:grid;
grid-template-columns:320px 1fr 1fr;
grid-template-rows:350px 350px;
gap:16px;
align-items:stretch;
}

/* image box */
.video-box{
grid-row:1 / span 2;
position:relative;
overflow:hidden;
border-radius:18px;
}

.video-box img{
width:100%;
height:900px;
object-fit:cover;
display:block;
transition:.6s;
}

.video-box:hover img{
transform:scale(1.08);
}

.play-btn{
position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);
width:58px;
height:58px;
border-radius:50%;
background:#fff;
color:#0e4e72;
display:flex;
align-items:center;
justify-content:center;
font-size:22px;
text-decoration:none;
box-shadow:0 10px 20px rgba(0,0,0,.15);
}

/* cards */
.card{
border-radius:18px;
padding:28px 24px;
display:flex;
flex-direction:column;
justify-content:center;
transition:.4s;
}

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

.green{
background:#2d7776;
}

.blue{
background:#003e67;
}

.card i{
font-size:26px;
color:#f1c56a;
margin-bottom:14px;
font-style:normal;
}

.card h3{
font-size:28px;
line-height:1.3;
color:#fff;
font-weight:600;
margin-bottom:14px;
}

.card p{
font-size:14px;
line-height:1.7;
color:#d7e3ea;
margin-bottom:16px;
}

.card a{
font-size:11px;
letter-spacing:1px;
font-weight:600;
color:#f1c56a;
text-decoration:none;
}

/* responsive */
@media(max-width:1200px){

.container{
width:95%;
}

.title-area h2{
font-size:42px;
}

.card h3{
font-size:24px;
}
}

@media(max-width:991px){

.solution-grid{
grid-template-columns:1fr 1fr;
grid-template-rows:auto;
}

.video-box{
grid-column:1 / span 2;
grid-row:auto;
height:380px;
}

.title-area h2{
font-size:34px;
}
}

@media(max-width:576px){

.solution-grid{
grid-template-columns:1fr;
}

.video-box{
grid-column:auto;
height:300px;
}

.title-area h2{
font-size:26px;
}

.card h3{
font-size:20px;
}
}
    /*==============================why===============================*/
.jc-why {
  padding: 80px 20px;
  background: #ffffff;
 
}

.jc-container {
  max-width: 1320px;
  margin: auto;
}

/* TOP */
.jc-top {
  display: grid;
  grid-template-columns:.5fr 1fr;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 60px;
   padding:40px;
   background:#0c3c60;
}

.jc-left h2 {
    margin-top:40px;
  font-size: 36px;
  line-height: 1.3;
  color: #fff;
  padding-bottom:30px;
  
}

.jc-tag {
  font-size: 14px;
  letter-spacing: 2px;
  color: #fff;
  font-weight:700;
  padding:15px;
  border:1px solid #f6b65b;
  border-radius:10px;
  background:#f6b65b;

}

.jc-right {
    padding-top:60px;
    text-align:justify;
 font-size:16px;
line-height:1.4;
color:#fff;
margin-bottom:8px;
max-width:80%;
}

/* CARDS */
.jc-cards {
  display: flex;
  gap: 20px;
  margin-bottom: 40px;
}

.jc-card {
  flex: 1;
background-color: #FFFFFF;
    padding: 35px 35px 35px 35px;
    border-radius: 30px 30px 30px 30px;
    box-shadow: 0px 10px 25px 0px rgba(0, 0, 0, 0.05);
}

.jc-card h4 {
  font-size: 24px;
  margin-bottom: 10px;
  font-weight:700;
  line-height:1.4;
}

.jc-card p {
  /*font-size: 16px;
  color: #777;
  font-weight:500;*/
  font-size:16px;
line-height:1.4;
color:#667;
margin-bottom:8px;
max-width:600px;
}

/* ACTIVE */
.jc-active {
  background: #0c3c60;
  color: #fff;
}

.jc-active p {
  color: #ddd;
}

/* SLIDER */
.jc-slider {
  overflow: hidden;
  position: relative;
}

.jc-track {
  display: flex;
  gap: 20px;
  width: max-content;
  animation: jc-scroll 20s linear infinite;
}

.jc-track img {
  width: 300px;
  height: 200px;
  border-radius: 16px;
  object-fit: cover;
}

/* SCROLL ANIMATION */
@keyframes jc-scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(-50%);
  }
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .jc-top {
    flex-direction: column;
  }

  .jc-cards {
    flex-wrap: wrap;
  }

  .jc-card {
    flex: 1 1 48%;
  }
}

@media (max-width: 600px) {
  .jc-card {
    flex: 1 1 100%;
  }

  .jc-left h2 {
    font-size: 26px;
  }

  .jc-track img {
    width: 220px;
    height: 150px;
  }
}
/*===============================who we are*/
.vm-section {
  background: #0c3c60;
  padding: 0;
  /*font-family: 'Poppins', sans-serif;*/
}
    .ttitle
    {
      background:#fff;
      padding:20px;
    }
        .ttitle h1
        {
            padding:10px;
            text-align:center;
      vertical-align:middle;
      margin:auto;
            width:200px;
            font-size:28px;
            font-weight:800;
            background:#0a547d;
            border-radius:20px;
            color:#fff;
        }
    .ttitle p
    {
        padding:10px;
        font-size:18px;
            font-weight:500;
            color:#9aa86a;
             text-align:center;
      vertical-align:middle;
      margin:auto;
    }
.vm-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  min-height: 520px;
}

/* LEFT */
.vm-left {
  padding: 80px 60px;
  color: #fff;
}

.vm-tag {
  font-size: 18px;
  font-weight:700;
  letter-spacing: 2px;
  color: #f6b65b;
  display: block;
  margin-bottom: 10px;
}

.vm-left h2 {
  font-size: 32px;
   height:120px;
}

.vm-left p {
  /*font-size: 14px;
  color: #d1dbe5;
  margin-bottom: 30px;
   height:180px;*/
  font-size:16px;
line-height:1.3;
color:#fff;
margin-bottom:8px;
max-width:600px;
text-align:justify;
height:270px;
}

.vm-btn {
  display: inline-block;
  background: #8fa89a;
  color: #fff;
  padding: 14px 30px;
  border-radius: 30px;
  text-decoration: none;
  transition: 0.3s;
}

.vm-btn:hover {
  background: #a9c2b2;
}

/* CENTER IMAGE */
.vm-center img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* RIGHT */
.vm-right {
  padding: 60px 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 30px;
}

.vm-item h4 {
  color: #fff;
  margin-bottom: 8px;
  font-size:42px;
  line-height:1.3;

}

.vm-item p {
  font-size:16px;
line-height:1.3;
color:#fff;
margin-bottom:8px;
max-width:600px;
text-align:justify;
height:270px;
}

/* HIGHLIGHT CARD */
.vm-item.highlight {
  background: #2f6f73;
  padding: 25px;
  border-radius: 20px;
}

/* ANIMATION */
.vm-left,
.vm-center,
.vm-right {
  opacity: 0;
  transform: translateY(40px);
  animation: vmFade 1s ease forwards;
}

.vm-center {
  animation-delay: 0.2s;
}
.vm-right {
  animation-delay: 0.4s;
}

@keyframes vmFade {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* HOVER EFFECT (cards) */
.vm-item {
  transition: 0.3s;
}

.vm-item:hover {
  transform: translateX(10px);
}

/* RESPONSIVE */
@media (max-width: 992px) {
  .vm-container {
    grid-template-columns: 1fr;
  }

  .vm-left,
  .vm-right {
    padding: 40px 20px;
  }

  .vm-center {
    height: 300px;
  }
}
/*===========================Expert ===============================*/
/* TEAM SECTION */
.team-section{
    width:100%;
    padding:80px 20px;
    background:#f5f5f5;
}

.team-container{
    max-width:1300px;
    margin:auto;
}

/* TITLE */
.section-title{
    text-align:center;
    margin-bottom:50px;
}

.section-title span{
    color:#0d5b85;
    font-size:14px;
    font-weight:600;
    letter-spacing:2px;
}

.section-title h2{
    font-size:42px;
    margin-top:10px;
    color:#111;
    line-height:1.3;
}

/* GRID */
.team-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

/* CARD */
.team-card{
    position:relative;
    border-radius:20px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 10px 25px rgba(0,0,0,0.08);
    transition:0.4s ease;
    animation:fadeUp 1s ease forwards;
}

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

/* IMAGE */
.team-card img{
    width:100%;
    height:340px;
    object-fit:cover;
    display:block;
    transition:0.5s;
}

.team-card:hover img{
    transform:scale(1.08);
}

/* INFO */
.team-info{
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    padding:22px;
    background:linear-gradient(to top,#003b5c,#0d5b85cc,transparent);
    color:#fff;
    text-align:center;
}

.team-info h3{
    font-size:24px;
    margin-bottom:6px;
}

.team-info p{
    font-size:15px;
    color:#ffd56b;
    letter-spacing:1px;
}

/* ANIMATION */
@keyframes fadeUp{
    from{
        opacity:0;
        transform:translateY(50px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* RESPONSIVE */
@media(max-width:992px){
    .team-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .section-title h2{
        font-size:34px;
    }
}

@media(max-width:576px){
    .team-grid{
        grid-template-columns:1fr;
    }

    .section-title h2{
        font-size:28px;
    }

    .team-card img{
        height:300px;
    }
}
    /*========================================Contact=======================*/
    /* SECTION */
.contact-section{
    width:100%;
    background:#fff;
    position:relative;
}
    .headcontact
    {
        border-radius:18px 18px 0 0;
        background:#003f63;
    padding:30px 20px;

    /*margin-top:-140px;*/
    gap:20px;
    max-width:1340px;
    margin-left:auto;
    margin-right:auto;
    }
    .headcontact h1
    {
        font-size:14px;
        font-weight:500;
        color:#f4c259;
        text-align:center;
        vertical-align:central;
        margin:auto;
    }
    .headcontact p
    {
        padding:20px;
        font-size:34px;
        line-height:1.2;
        font-weight:700;
        color:#fff;
        text-align:center;
        vertical-align:central;
        margin:auto;
    }
/* TOP AREA */
.contact-top{
    max-width:1340px;
    margin:auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:50px;
    padding:0px 40px 220px;
}

/* FORM BOX */
.contact-form-box{
    background:#003f63;
    padding:40px;
    border-radius:0 0 20px 20px;
    box-shadow:0 20px 40px rgba(0,0,0,0.12);
    animation:fadeUp 1s ease;
}

.form-row{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:15px;
}

.input-box{
    margin-bottom:18px;
}

.input-box label{
    display:block;
    color:#fff;
    font-size:13px;
    margin-bottom:8px;
}

.input-box input,
.input-box select,
.input-box textarea{
    width:100%;
    height:48px;
    border:1px solid rgba(255,255,255,0.25);
    background:transparent;
    border-radius:30px;
    padding:0 18px;
    color:#fff;
    outline:none;
}

.input-box textarea{
    height:110px;
    border-radius:18px;
    padding-top:14px;
    resize:none;
}

.input-box select option{
    color:#000;
}

button{
    width:100%;
    height:52px;
    border:none;
    border-radius:30px;
    background:#8ca58d;
    color:#fff;
    font-weight:700;
    cursor:pointer;
    transition:.3s;
}

button:hover{
    background:#6d8f72;
}

/* TEXT */
.contact-text span{
    color:#f4c259;
    letter-spacing:2px;
    font-size:13px;
}

.contact-text h2{
    font-size:48px;
    line-height:1.3;
    color:#111;
    margin:15px 0 20px;
}

.contact-text p{
    color:#777;
    line-height:1.8;
    max-width:500px;
}

/* BG IMAGE AREA */
.info-wrap{
    background:url("image/project11.jpg") center/cover no-repeat;
    padding:80px 20px 60px;
    margin-top:-140px;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    max-width:1400px;
    margin-left:auto;
    margin-right:auto;
}

/* INFO CARD */
.info-card{
    background:#003f63;
    padding:35px 25px;
    border-radius:18px;
    color:#fff;
    transition:.4s;
    animation:fadeUp 1.2s ease;
}

.info-card.green{
    background:#2e7b83;
}

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

.info-card h4{
    font-size:20px;
    margin-bottom:12px;
}

.info-card p{
    color:#ddd;
    margin-bottom:20px;
}

.info-card a{
    color:#ffd86d;
    text-decoration:none;
    font-size:13px;
    font-weight:600;
}

/* MAP */
.map-box{
    width:100%;
    height:350px;
}

.map-box iframe{
    width:100%;
    height:100%;
    border:0;
}

/* ANIMATION */
@keyframes fadeUp{
    from{
        opacity:0;
        transform:translateY(50px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/* RESPONSIVE */
@media(max-width:1100px){

    .contact-top{
        grid-template-columns:1fr;
    }

    .info-wrap{
        grid-template-columns:repeat(2,1fr);
    }
}

@media(max-width:768px){

    .form-row{
        grid-template-columns:1fr;
    }

    .info-wrap{
        grid-template-columns:1fr;
    }

    .contact-text h2{
        font-size:34px;
    }

    .contact-top{
        padding:60px 20px 200px;
    }
}
    /*============================Gallery==============*/
  /* SECTION */
.scroll-gallery{
    width:100%;
    overflow:hidden;
    background:#f7f7f7;
    padding:40px 0;
   
}
    .Ghead
    {
        border-radius: 18px 18px 0 0;
        background: #003f63;
        padding: 30px 0;
        /*margin-top:-140px;*/

        width: 100%;
    }
.Ghead p
    {

        font-size:34px;
        line-height:1.2;
        font-weight:700;
        color:#fff;
        text-align:center;
        vertical-align:central;
        margin:auto;
    }
/* TRACK */
.scroll-track{
    display:flex;
     gap:30px;     
    /*width:max-content;*/
    animation:scrollMove 28s linear infinite;
}

/* IMAGE BOX */
.gallery-box{
    width:270px;
    height:220px;
    flex-shrink:0;
    overflow:hidden;
    position:relative;
    border-radius:20px;
}

.gallery-box img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:0.5s ease;
    display:block;
}

/* HOVER */
.gallery-box:hover img{
    transform:scale(1.1);
}

/* OVERLAY */
.gallery-box::after{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(0,63,99,0.15);
    transition:0.4s;
}

.gallery-box:hover::after{
    background:rgba(0,63,99,0.03);
}

/* SCROLL ANIMATION */
@keyframes scrollMove{
    0%{
        transform:translateX(0);
    }
    100%{
        transform:translateX(-50%);
    }
}

/* PAUSE ON HOVER */
.scroll-gallery:hover .scroll-track{
    animation-play-state:paused;
}

/* RESPONSIVE */
@media(max-width:768px){

    .gallery-box{
        width:220px;
        height:170px;
    }
}

@media(max-width:576px){

    .gallery-box{
        width:180px;
        height:140px;
    }
}
    /*==================================footer=============================*/
    /* FOOTER */
.main-footer{
    width:100%;
    background:#003f63;
    color:#fff;
    padding:70px 20px 20px;
    overflow:hidden;
}

/* CONTAINER */
.footer-container{
    max-width:1200px;
    margin:auto;
    display:grid;
    grid-template-columns:1.7fr 0.7fr 1.2fr 1fr;
    gap:40px;
    padding-bottom:45px;
    border-bottom:1px solid rgba(255,255,255,0.15);
}

/* BOX */
.footer-box h3{
    font-size:18px;
    margin-bottom:22px;
    font-weight:700;
}

.footer-box p,
.footer-box li,
.footer-box a{
    font-size:14px;
    line-height:1.8;
    color:#d7e6ef;
    text-decoration:none;
    list-style:none;
}

.footer-box ul{
    padding:0;
    margin:0;
}

.footer-box li{
    margin-bottom:8px;
    transition:.3s;
}

.footer-box li:hover{
    transform:translateX(6px);
}

.footer-box li a::before{
    content:"▸";
    margin-right:8px;
    color:#f3c86a;
}

/* LOGO */
.footer-logo{
    font-size:38px;
    margin-bottom:18px;
    font-weight:800;
    color:#fff;
}

.footer-logo span{
    color:#f3c86a;
    font-size:52px;
}

/* CONTACT */
.address{
    margin-bottom:20px;
}

.contact-line{
    margin-bottom:8px;
}

/* BOTTOM */
.footer-bottom{
    max-width:1200px;
    margin:auto;
    padding-top:18px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
}

.footer-bottom p{
    font-size:12px;
    color:#d7e6ef;
    letter-spacing:1px;
}

/* SOCIAL */
.social-icons{
    display:flex;
    gap:12px;
}

.social-icons a{
    width:34px;
    height:34px;
    border:1px solid rgba(255,255,255,0.2);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    text-decoration:none;
    font-size:14px;
    transition:.3s;
}

.social-icons a:hover{
    background:#f3c86a;
    color:#003f63;
    transform:translateY(-4px);
}

/* RESPONSIVE */
@media(max-width:992px){

    .footer-container{
        grid-template-columns:1fr 1fr;
    }
}

@media(max-width:576px){

    .footer-container{
        grid-template-columns:1fr;
    }

    .footer-bottom{
        flex-direction:column;
        text-align:center;
    }
}