@font-face {
  font-family:Montserrat-ExtraBold;
  src: url(../font/Montserrat-ExtraBold.ttf);
}
@font-face {
  font-family:Montserrat-Regular;
  src: url(../font/Montserrat-Regular.otf);
}
@font-face {
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/nunito-sans-v6-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/nunito-sans-v6-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/nunito-sans-v6-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/nunito-sans-v6-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../font/nunito-sans-v6-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/nunito-sans-v6-latin-regular.svg#NunitoSans') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Poppins Extrabold';
  font-style: normal;
  font-weight: 800;
  src: url('../fonts/poppins-v15-latin-800.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/poppins-v15-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/poppins-v15-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/poppins-v15-latin-800.woff') format('woff'), /* Modern Browsers */
       url('../font/poppins-v15-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/poppins-v15-latin-800.svg#Poppins') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Nunito Sans semi';
  font-style: normal;
  font-weight: 600;
  src: url('../font/nunito-sans-v6-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/nunito-sans-v6-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/nunito-sans-v6-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/nunito-sans-v6-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../font/nunito-sans-v6-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/nunito-sans-v6-latin-600.svg#NunitoSans') format('svg'); /* Legacy iOS */
}
/*@font-face {
  font-family:inter-regular;
  src: url(../font/inter-regular.ttf);
}*/
@font-face {
  font-family: inter-regular;
  font-style: normal;
  font-weight: 400;
  src: url('../font/inter-v3-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/inter-v3-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/inter-v3-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/inter-v3-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../font/inter-v3-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/inter-v3-latin-regular.svg#Inter') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family:Oswald-Medium;
  src: url(../font/Oswald-Medium.ttf);
}
@font-face {
  font-family:Poppins;
  src: url(../font/Poppins-Bold.ttf);
}
@font-face {
  font-family:Poppins-Regular;
  src: url(../font/Poppins-Regular.ttf);
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  src: url('../font/inter-v3-latin-600.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../font/inter-v3-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../font/inter-v3-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../font/inter-v3-latin-600.woff') format('woff'), /* Modern Browsers */
       url('../font/inter-v3-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../font/inter-v3-latin-600.svg#Inter') format('svg'); /* Legacy iOS */
}


.banner-text {
    font-size: 44px;
    text-transform: uppercase;
    /*font-family: Montserrat-ExtraBold;*/
    /* background: #000; */
    color: #fff;
    padding-right: 26%;
    /*line-height: 60px;*/
    font-family: poppins;
    word-spacing: 5px;
    letter-spacing: 1px;
}
span.text-overlay {
    background: #000;
    padding: 0px 30px 0px 10px;
}
.top-banner {
    background-image: url(../img/images/top-banner.jpg);
    padding-top: 120px;
    padding-bottom: 120px;
    color: #fff;
    background-repeat: no-repeat;
    background-attachment: fixed;
    /*background-position: center;
    margin-top: -120px;
*/    background-size: contain;
}
button.request-btn {
    font-family: 'Montserrat-ExtraBold';
    font-size: 15px;
    background: #f6985b;
    border: unset;
    color: #fff;
    padding: 14px 28px;
    /*letter-spacing: 0.5px;*/
    margin-top: 10px;
}
.sec-marg {
    margin-top: 50px !important;
    margin-bottom: 30px;
}
.sec-marg1{
    margin-top:50px !important; 
    margin-bottom:50px;
    /*justify-content: center;
    display: flex;*/
}
.sec-title {
    font-size: 23px;
    /*font-family: oswald-medium;*/
    font-family: poppins;
    color: #ec8e5b;
    /*letter-spacing: -0.5px;*/
    margin-bottom: 5px;
}
.sec-head {
    font-size: 34px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 40px;
}
.sec-desc {
    font-family: 'Nunito Sans';
    font-size: 21px;
    color: #5a5a5a;
}
/*#syscom-homepage .px-md-5 {
    padding-right: 100px !important;
    padding-left: 100px !important;
}*/
.read-btn {
    font-family: 'Nunito Sans';
    font-size: 15px;
    font-weight: 600;
    background: #f6985b;
    border: unset;
    color: #fff;
    border-radius: 5px;
    padding: 15px 34px;
    /*letter-spacing: 0.5px;*/
}
.achievment-head {
    font-size: 40px;
    font-family: 'Montserrat-ExtraBold';
  color: #0f1221;
}
.achievment-desc {
    font-family: 'inter';
    font-size: 14px;
    line-height: 24px;
    /*letter-spacing: 0.12em;*/
    text-transform: uppercase;
    color: #959ab8;
  margin-bottom: 0px;
}
#achievement-section hr {
    margin-bottom: 0px;
    /* height: 3px; */
    background-color: #e0e2ef !important;
    border: 2px solid #e0e2ef;
}
hr.head-border {
    width: 6%;
    margin: auto;
    border: 1px solid #ec8e5b;
     color: #ec8e5b; 
    opacity: 1;
}
.choose-counter p {
    color: #eff1f3;
    font-family: 'Montserrat-ExtraBold';
    font-size: 70px;
  line-height: 70px;
}
.choose-card p {
    font-family: 'Montserrat-Regular';
    line-height: 27px;
    color: #575859;
    /*letter-spacing: 0.5px;*/
    font-size: 15px;
}
.choose-card {
    padding-left: 10px;
}
.service-card {
    
    padding: 35px 20px;
    webkit-transition: all 1s;
    -moz-transition: all 1s;
    transition: all 1s;
    transform: translateY(0);
   
}
.service-head {
    font-family: poppins 'Montserrat-ExtraBold';
    font-family: 'Poppins Extrabold';
    color: #101d31;
    margin-top: 30px;
}
.service-desc {
    font-family: 'Nunito Sans semi';
    font-size: 14.5px;
    color: #676868;
    line-height: 20px;
    /*letter-spacing: 0.5px;*/
}

#service-parent img {
    width: 100%;
    border-radius:10px;
}

 .footer-head a {
    text-decoration: none;
    color: unset;
    }
    .footer-head a:hover {
    text-decoration: none;
    color: unset;
    }

.card-pos {
    background: #fff;
    text-align: center;
    border-radius: 12px;
    position: relative;
    box-shadow: 0px 0px 40px 0px rgb(0 0 0 / 7%);
    /* box-shadow: 0px 0px 6px 11px #e7e7e7; */
    min-height: 388px;
    overflow: hidden;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    transition: all 1s;
    transform: translateY(0);
}
.hover-section {
    position: absolute;
    bottom: -140%;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    transition: all 1s;
    transform: translateY(0);
}

.card-pos:hover .hover-section {
    position: absolute;
    top: 0%;
    width: 100%;
    height: 100%;

}

.card-pos:hover .list-pos {
    position: absolute;
    top: 0%;
}

ul.course-list li {
    color: #fff;
    list-style-type: none;
    padding-top: 20px;
    text-align: initial;
    padding-left: 20px;
    font-family: 'Nunito Sans semi';
    font-size: 14px;
}
ul.course-list {
    padding: 0px;
}
.list-pos{
    position: absolute;
    bottom: -105%;
  transition: all 1s;

}
body {
    font-family: 'Lato', sans-serif
}

h1 {
    margin-bottom: 40px
}

label {
    color: #333
}
button.read-btn a {
    color: unset;
    text-decoration: none;
}
.btn-send {
    font-weight: 300;
    text-transform: uppercase;
    /*letter-spacing: 0.2em;*/
    width: 80%;
    margin-left: 3px
}

.help-block.with-errors {
    color: #ff5050;
    margin-top: 5px
}

.card {
    margin-left: 10px;
    margin-right: 10px
}
.form-head {
    font-family: 'Oswald-Medium';
    font-size: 22px;
    color: #1a2339;
}
hr.head-border1 {
    width: 6%;
    
    border: 1px solid #ec8e5b;
     color: #ec8e5b !important; 
    opacity: 1;
}

.test-message {
    font-family: 'Nunito Sans';
    line-height: 28px;
    color: #797979;
}
.test-name {
    margin-bottom: 0px;
    color: #242424;
    font-family: 'Nunito Sans';
}
.sys-footer {
    background: #101d31;
    color: #fff;
    padding-top: 40px;
}
#footer-link li {
    list-style: none;
    font-family: 'Nunito Sans';
    padding-top: 8px;
    opacity: 0.5;
    font-size: 16px;
}
#footer-link li:hover {
    opacity: 1;
  cursor: pointer;
}
.footer-head {
    font-size: 22px;
    font-family: 'Nunito Sans semi';
    text-transform: uppercase;
}
#footer-link {
    padding-left: 0px;
}
.copyright-text {
    font-family: 'Nunito Sans';
    opacity: 0.7;
}
.footer_icons a:hover{color:#fff !important; opacity: 1;}
.footer_icons svg {color:#fff !important; opacity: 0.8;}
.text-end.footer_icons a {
    padding-left: 10px;
}
.syscom-header .nav-link {
    font-family: 'Montserrat-Regular';
    /* font-weight: 600; */
    font-size: 15px;
    text-transform: uppercase !important;
    color: #232323 !important;
}
#syscom-homepage .nav-link.active, .navbar-light .navbar-nav .show>.nav-link {
    color: rgb(246 152 91) ;
}
#syscom-homepage .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover {
    color: rgb(246 152 91) ;
}
.potfolio-image {
    box-shadow: 1px 1px 15px 7px #e1e0e0;
}


button.request-btn a {
    text-decoration: none;
    color: unset;
}
.port-title {
    font-family: 'Montserrat-Regular';
    font-weight: 900;
    color: #000;
    margin-bottom: 5px;
}
.port-language {
    color: #858585;
    font-family: 'Montserrat-Regular';
    font-size: 13px;
    margin-top: 20px;
    margin-bottom: 5px;
}
span.forward-btn {
    padding-left: 8px;
    font-size: 22px;
    font-weight: bold;
    color: #f6985b;
}
.learn-btn a{text-decoration: none; color:#1c1c1c;}
.head-logo{width:160px !important;}
.bg-custom{background: #0a1d37;}
ul.slick-dots li {
    background: #0a1d37 !important;
    color: #fff;
    border-radius: 50%;
    width: 15px;
    height: 15px;
}
ul.slick-dots li.slick-active {
    background: #f6985b !important;
    color: #f6985b;
    border-radius: 50%;
  margin-top: 20px;
}
.slick-dots {
    position: absolute;
    bottom: -50px  !important;
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
}
.slick-slide img {
    display: unset !important;
}
.number.count {
    font-family: 'Montserrat-ExtraBold';
    font-size: 60px;
    line-height: 60px;
    color: #0f1221;
}
.count-child2 {
    font-family: 'Montserrat-Regular';
    color: #72706f;
    font-size: 15px;
    padding-left: 10px;
}
.counter-wrap {
    position: absolute;
    width: 20% !important;
    margin: auto !important;
    background: white;
    padding: 15px 0px;
    box-shadow: 0px 0px 30px 0px #e3e0e0d9;
    bottom: 5%;
    right: 31%;
    display: flex;
    justify-content: center;
    z-index: 2;
}
#about-sec {
    position: relative;
}

.certificate-div {
    border-right: 5px solid #ebe3e3;
}
.certification .choose-text {
    font-family: 'Inter';
    font-weight: 600;
    color: #202021;
    font-size: 18px;
}

/*mobile menu*/

  .mobile-menu {
    position: fixed;
    top: 0px;
    right: -300px;
    width: 300px;
    height: 100%;
    background: #fff;
    padding-left: 10px;
    z-index: 9999999;
    transition: all 0.5s;
    padding-bottom: 80px;
    overflow-y: scroll;
    display: none;
    }    
  .site-mobile-menu {
    width: 300px;
    display: none;}
.dropdown-colapse{border:2px solid #f2f2f2;}
.mobile-close:before {
    /*content: "\01F5D9";*/
    font-size: 34px;
}
.mobile-close svg {
    font-size: 25px;
    margin-top: 11px;
    margin-right: 10px;
    color: #454545;
}
.navbar-nav{position: relative;}
.dropdown-menu{position: absolute;}
.mobile-menu{position: fixed; top:0px; right:-300px; width:300px; height:100%; background:#fff; padding-left:10px; z-index:9999999; transition: all 0.5s; }
.mobile-menu li{list-style-type: none; padding-top:10px;}
.mobile-menu a{text-decoration: none; color:#666; font-size:14px !important; }
.rc-anchor-normal {
    height: 74px;
    width: 80%;
}

.hover-section img {
    width: 100%;
    height: 100%;
}

.view-btn {
    font-family: 'Nunito Sans';
    font-size: 14px;
    font-weight: 600;
    background: #d8dcdf;
    border: unset;
    color: #2a2a2a;
    border-radius: 5px;
    padding: 12px 28px;
    /*letter-spacing: 0.5px;*/
}
textarea#floatingTextarea::placeholder {
    color: rgba(0,0,0,0.6);
    font-family: 'Nunito Sans';
}
hr.head-border2 {
    width: 18%;
    border: 1px solid #ec8e5b;
     color: #ec8e5b !important; 
    opacity: 1;
}
.slick-dots li.slick-active button:before {
    opacity: .75;
    color: #f6985b !important;
}
.syscom-header {
    background: #f6f8fa !important;
}
ul#footer-link a {
    color: unset;
    text-decoration: none;
}

#syscom-policy .container-fluid {
    padding: 0px 100px;
}
/*media queries*/

@media screen and (max-width:1280px){
 
    #syscom-policy .container-fluid {
    padding: 0px 60px;
    }
    ul.course-list li {
    color: #fff;
    list-style-type: none;
    padding-top: 15px;
    text-align: initial;
    padding-left: 20px;
    font-family: 'Nunito Sans semi';
    font-size: 14px;
    }
  .sec-head {
    font-size: 28px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 40px;
  }
  .sec-title {
    font-size: 19px;
  }
  .sec-desc {
    font-family: 'Nunito Sans';
    font-size: 18px;
    color: #5a5a5a;
  }
  .choose-card p {
    font-family: 'Montserrat-Regular';
    line-height: 24px;
    color: #575859;
    /*letter-spacing: 0.5px;*/
    font-size: 14px;
  }
  .contact-info {
    /* position: absolute; */
    background: #0a1d37;
    color: #fff;
    padding: 20px 25px;
  }
  .read-btn {
    font-family: 'Nunito Sans';
    font-size: 14px;
    font-weight: 600;
    background: #f6985b;
    border: unset;
    color: #fff;
    border-radius: 5px;
    padding: 15px 34px;
    /*letter-spacing: 0.5px;*/
  }
  .achievment-head {
    font-size: 30px;
    font-family: 'Montserrat-ExtraBold';
    color: #0f1221;
  }
  .achievment-desc {
    font-family: 'inter';
    font-size: 13px;
  }
  .sec-marg {
    margin-top: 80px;
  }
  .choose-card p {
    font-family: 'Montserrat-Regular';
    line-height: 21px;
    color: #575859;
    /*letter-spacing: 0.5px;*/
    font-size: 13px;
  }
  #syscom-homepage .px-md-5 {
    padding-right: 80px !important;
    padding-left: 80px !important;
  }
  #syscom-homepage .px-md-5 {
    padding-right: 60px !important;
    padding-left: 60px !important;
  }
  .choose-counter p {
    color: #eff1f3;
    font-family: 'Montserrat-ExtraBold';
    font-size: 50px;
    line-height: 50px;
  }
  .choose-card img {
    width: 50px;
  }
}

@media screen and (max-width: 1180px){
    .counter-wrap {
    position: absolute;
    width: 20% !important;
    margin: auto !important;
    background: white;
    padding: 15px 0px;
    box-shadow: 0px 0px 30px 0px #e3e0e0d9;
    bottom: 0%;
    right: 31%;
    display: flex;
    justify-content: center;
    z-index: 2;
    }
}

@media screen and (max-width:1024px){
  .banner-text {
    font-size: 30px;
    text-transform: uppercase;
    font-family: Montserrat-ExtraBold;
    /* background: #000; */
    color: #fff;
    line-height: 40px;
  }
  .top-banner button.request-btn {
    font-family: 'Montserrat-ExtraBold';
    font-size: 15px;
    background: #f6985b;
    border: unset;
    color: #fff;
    padding: 14px 28px;
    /*letter-spacing: 0.5px;*/
    margin-top: 0px;
  }
  .top-banner {
    background-image: url(../img/images/top-banner.jpg);
    padding-top: 60px;
    padding-bottom: 60px;
    color: #fff;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: contain;
  }
}

@media screen and (max-width:990px){
    .head-logo {
    width: 130px !important;
    }
    #syscom-homepage .nav-link {
    font-family: 'Montserrat-Regular';
    /* font-weight: 600; */
    color: #232323;
    font-size: 14px;
    }
    .number.count {
    font-family: 'Montserrat-ExtraBold';
    font-size: 50px;
    line-height: 50px;
    color: #0f1221;
    }
    .count-child2 {
    font-family: 'Montserrat-Regular';
    color: #72706f;
    font-size: 14px;
    padding-left: 10px;
    }
    .counter-wrap {
    position: absolute;
    width: 24%;
    top:80%;
    }
    .banner-text {
    font-size: 26px;
    text-transform: uppercase;
    font-family: Montserrat-ExtraBold;
    /* background: #000; */
    color: #fff;
    line-height: 36px;
    }
    .top-banner button.request-btn {
    font-family: 'Montserrat-ExtraBold';
    font-size: 13px;
    background: #f6985b;
    border: unset;
    color: #fff;
    padding: 12px 24px;
    /*letter-spacing: 0.5px;*/
    margin-top: 0px;
   }
}

@media screen and (max-width: 850px){
    .navbar-expand-md .navbar-nav .nav-link {
    padding-right: 0rem !important;
    padding-left: 0rem !important;
        }
    #syscom-homepage .px-md-5 {
    padding-right: 50px !important;
    padding-left: 50px !important;
    }
    .head-logo {
    width: 120px !important;
    }
    #syscom-homepage .nav-link {
    font-family: 'Montserrat-Regular';
    /* font-weight: 600; */
    color: #232323;
    font-size: 12px;
    text-transform: uppercase;
    }
    .service-desc {
    font-family: 'Nunito Sans semi';
    font-size: 12.5px;
    color: #676868;
    line-height: 20px;
    /*letter-spacing: 0.5px;*/
        }
}


@media screen and (max-width:768px){
  #syscom-policy .container-fluid {
    padding: 0px 40px;
    }
    .counter-wrap {
    position: absolute;
    width: 35% !important;
    bottom: 8%;
    top: unset;
    right: 6%;
    }

button.request-btn {
    font-family: 'Montserrat-ExtraBold';
    font-size: 14px;
    background: #f6985b;
    border: unset;
    color: #fff;
    padding: 11px 21px;
    /*letter-spacing: 0.5px;*/
}
.banner-text {
    font-size: 31px;
    text-transform: uppercase;
    font-family: Montserrat-ExtraBold;
    /* background: #000; */
    color: #fff;
    line-height: 43px;
}
    .top-banner {
    background-image: url(../img/images/top-banner.jpg);
    padding-top: 60px;
    padding-bottom: 60px;
    color: #fff;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 80px;
    margin-top: -120px;
    background-size: contain;
    }
    .port-language {
    color: #858585;
    font-family: 'Montserrat-Regular';
    font-size: 12px;
    margin-top: 20px;
    margin-bottom: 5px;
    }
    .test-message {
    font-family: 'Nunito Sans';
    line-height: 21px;
    color: #797979;
    font-size: 14px;
    }
    .test-message {
    font-family: 'Nunito Sans';
    line-height: 22px;
    color: #797979;
    font-size: 15px;
    }
    .info-desc {
    font-family: 'Nunito Sans';
    font-size: 14px;
    }
    .mobile-menu {
    position: fixed;
    top: 0px;
    right: -300px;
    width: 300px;
    height: 100%;
    background: #fff;
    padding-left: 10px;
    z-index: 9999999;
    transition: all 0.5s;
    padding-bottom: 80px;
    overflow-y: scroll;
    display: block;
    } 
    .navbar-collapse {
    display: none;
    }

  /*#syscom-homepage .px-md-5 {
    padding-right: 40px !important;
    padding-left: 40px !important;
  }*/
  .contact-info {
    /* position: absolute; */
    background: #0a1d37;
    color: #fff;
    padding: 22px 20px;
  }
.contact-desc{
    font-size: 18px;
    line-height: 1.9;
    color: #5f6368;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
    font-weight: 400;
}
  .info-desc {
    font-family: 'Nunito Sans';
    font-size: 14px;
  }
  .info-head {
    font-family: 'Nunito Sans';
    color: #fa9351;
    margin-top: 25px;
  }
  form#contact-form {
    padding: 40px 20px;
  }
    .form-sec{
    background: #dfe0e4;

    }
  form#contact-form textarea {
    height: 150px;
  }
  .read-btn {
    font-family: 'Nunito Sans';
    font-size: 13px;
    font-weight: 600;
    background: #f6985b;
    border: unset;
    color: #fff;
    border-radius: 5px;
    padding: 15px 34px;
    /*letter-spacing: 0.5px;*/
  }
  .info-head {
    font-family: 'Nunito Sans';
    color: #fa9351;
    margin-top: 20px;
    margin-bottom: 5px;
  }
  .choose-counter p {
    color: #eff1f3;
    font-family: 'Montserrat-ExtraBold';
    font-size: 50px;
    line-height: 70px;
  }
  .choose-card img {
    width: 40px;
  }
  .choose-card p {
    font-family: 'Montserrat-Regular';
    line-height: 20px;
    color: #575859;
    /*letter-spacing: 0.5px;*/
    font-size: 13px;
  }
  .achievment-head {
    font-size: 30px;
    font-family: 'Montserrat-ExtraBold';
    color: #0f1221;
  }
  .achievment-desc {
    font-family: 'inter';
    font-size: 11px;}
  .sec-title {
    font-size: 18px;
  }
  .sec-head {
    font-size: 27px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 36px;
  }
  .sec-desc {
    font-family: 'Nunito Sans';
    font-size: 16px;
    color: #5a5a5a;
  }
  .read-btn {
    font-family: 'Nunito Sans';
    font-size: 13px;
    font-weight: 600;
    background: #f6985b;
    border: unset;
    color: #fff;
    border-radius: 5px;
    padding: 13px 35px;
    /*letter-spacing: 0.5px;*/
  }
  
  .footer-head {
    font-size: 18px;
    font-family: 'Nunito Sans semi';
  }
   
  #footer-link li {
    font-size: 13px;
  }
  .copyright-text {
    font-family: 'Nunito Sans';
    opacity: 0.7;
    font-size: 13px;
  }
}


@media screen and (max-width: 680px){
    .counter-wrap {
    position: absolute;
    width: 34% !important;
    bottom: 11%;
    top: unset;
    right: 7%;
    }
}

@media screen and (max-width:577px){
    #syscom-policy .container-fluid {
    padding: 0px 40px;
    }
    #recaptcha {
    transform: scale(0.77);
    -webkit-transform: scale(0.77);
    transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    }
    .sec-marg1 {
    margin-top: 30px !important;
    margin-bottom: 30px;
    }
    .sys-footer {
    background: #101d31;
    color: #fff;
    padding-top: 0px;
    }
    .sys-footer .mt-5 {
        margin-top: 2rem!important;
    }
    .top-banner {
    background-image: unset;
    padding-top: 80px;
    padding-bottom: 80px;
    color: #fff;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    margin-top: -120px;
    background-size: cover;
    background: #f3f3f3;
    }
    .hover-section img {
    width: 100%;
    height: auto;
    }
    .hover-section {
    position: absolute;
    bottom: -140%;
    -webkit-transition: all 1s;
    -moz-transition: all 1s;
    transition: all 1s;
    transform: translateY(0);
    }
    #contact-sec .col-sm-4 {
    padding: 0px;
    }
    .form-sec {
    background: #dfe0e4;
    margin-top: 20px !important;
    }
    .test-message {
    text-align: center;
    }
    .test-name {
    text-align: center;
    }
  .counter-wrap {
    position: unset;
    width: 74% !important;
    top: 80% !important;
    padding-top: 23px !important;
    margin: unset !important;
    margin-top: 20px !important;
  }
    .mobile-menu {
    position: fixed;
    top: 0px;
    right: -300px;
    width: 225px;
    height: 100%;
    background: #fff;
    padding-left: 10px;
    z-index: 9999999;
    transition: all 0.5s;
    padding-bottom: 80px;
    overflow-y: scroll;
    display: block;
    }
  .test-image {
    width: 80%;
    margin: auto;
    padding-bottom: 20px;
  }
  #syscom-homepage .px-md-5 {
     padding-right: 30px !important; 
     padding-left: 30px !important; 
  }
  .sec-title {
    font-size: 16px;
 
  }
  .sec-head {
    font-size: 23px;
    line-height: 30px;
  }
  .sec-desc {
    font-family: 'Nunito Sans';
    font-size: 15px;
    color: #5a5a5a;
  }
  .read-btn {
    font-family: 'Nunito Sans';
    font-size: 13px;
    font-weight: 600;
    background: #f6985b;
    border: unset;
    color: #fff;
    border-radius: 5px;
    padding: 12px 27px;
    /*letter-spacing: 0.5px;*/
  }
  .choose-card p {
    font-family: 'Montserrat-Regular';
    line-height: 25px;
    color: #575859;
    /*letter-spacing: 0.5px;*/
    font-size: 14px;
  }
  .sec-marg {
    margin-top: 60px !important;
  }
  form#contact-form {
    padding: 25px 15px;
    background: #dfe0e4;
  }
  form#contact-form .form-control {
    border: unset;
    /* height: 35px; */
    margin: 10px 0px;
  }
  .form-head {
    font-family: 'Oswald-Medium';
    font-size: 20px;
    color: #1a2339;
  }
  form#contact-form textarea {
    height: 120px;
  }
  .head-logo {
    width: 130px !important;
  }
  

  
}



@media screen and (max-width:480px){
    .card-pos:hover .hover-section {
    position: absolute;
    top: 0%;
    width: 117%;
    height: auto;
    }
}

@media screen and (max-width: 380px){
    .card-pos:hover .hover-section {
    position: absolute;
    top: 0%;
    width: 145%;
    height: auto;
    }
}



/*about us*/
/*#syscom-policy .container-fluid {
    padding: 40px;
}*/
/*#syscom-policy .container-fluid {
    padding: 0px 30px;
}*/
.service-list #internal-ul {
    padding-left: 0%;
}
#internal-section ul {
    padding-left: 5%;
}
.why-sec ul {
    padding-left: 5%;
}

.about-banner {
    /*background-image: url(../img/images/company-banner.jpg);*/
    padding-top: 150px;
    padding-bottom: 150px;
    color: #fff;
    background-size: unset;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 37px;
    /* margin-top: -120px; */
    width: 100%;
    background-color: #f6f6f6;
}

.abt-banner-text {
    font-size: 40px;
    text-transform: uppercase;
    font-family: 'Montserrat-ExtraBold';
    color: black;
    margin-bottom: 0px;
}
.ab-sec-desc {
    font-family: 'Nunito Sans';
    color: #454647;
    /* font-size: 14px; */
    line-height: 26px;
}
.choose-text {
    font-family: 'Montserrat-Regular';
    font-weight: 600;
    color: #0a1d37;
    font-size: 21px;
}
.choose-ul li::marker {
    color: #ff8a58;
    /* font-size: 16px; */
}
.choose-ul li {
    font-family: 'inter-regular';
    color: #454545;
    font-size: 15px;
    padding-top: 5px;
}
.choose-overlay {
    background: #f8f0df;
    opacity: 0.95;
    padding: 20px 0px !important;
}
.certificate-div {
    border-right: 3px solid #eed4ba;
}
.choose-overlay ul {
    padding-left: 1rem;
}
.choose-background {
    background-image: url(../img/images/about-choose.jpg);
    width: 100%;
    height: auto;
    padding-top: 80px;
    padding-bottom: 80px;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
}
.why-sec {
    background: #f3f3f3;
}
.about-card {
    background: #f3f3f3;
    padding: 28px 25px 15px;
}
.about-head {
    font-size: 18px;
    font-family: 'Montserrat-Regular';
    font-weight: 600;
}
.about-card p {
    font-family: 'Nunito Sans';
    line-height: 22px;
    color: #797979;
    font-size: 14.5px;
}

.about-redirect svg {
    font-size: 31px;
    color: #797979;
}
.counter-wrap-abt {
    position: absolute;
    top: 16%;
    left: 35%;
    color: #ff8a58;
    width:auto !important;
}
.counter-wrap-abt .number.count {
    font-family: 'Montserrat-ExtraBold';
    font-size: 60px;
    line-height: 60px;
    color: #ff8a58;
}
#about-sec {
    position: relative;
}
.achievement {
    font-family: muli;
    word-spacing: 1px;
    /*letter-spacing: 1px;*/
    line-height: 24px;
    font-size: 30px;
    margin-bottom: 0px;
}
.achievement-span {
    font-size: 16px;
    line-height: 0px;
}

.company-desc {
    font-family: 'Poppins';
    font-size: 25px;
    color: #424243;
    /* font-weight: 800; */
    /* padding-left: 20px; */
}
.company-desc span {
    color: #ef8e5b;
}
.achievment-div {
    background: #000;
    opacity: 0.9;
}
@media screen and (max-width: 1280px){
    .counter-wrap-abt {
    position: absolute;
    top: 16%;
    left: 35%;
    color: #ff8a58;
    width: auto !important;
    }
    .about-banner {
    background-image: url(../img/images/company-banner.jpg);
    padding-top: 150px;
    padding-bottom: 150px;
    color: #fff;
    background-size: unset;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 37px;
    /* margin-top: -120px; */
    width: 100%;
    background-position-x: 90%;
    background-color: #f6f6f6;
    }
}


@media screen and (max-width: 1100px){
    .abt-banner-text {
    font-size: 32px;
    text-transform: uppercase;
    font-family: 'Montserrat-ExtraBold';
    color: black;
    margin-bottom: 0px;
    }
}

@media screen and (max-width: 1024px){
    .company-desc {
    font-family: 'Poppins';
    color: #3c3b3b;
    /* font-weight: 600; */
    font-size: 22px;
    /*letter-spacing: 1px;*/
    }
    .about-banner {
    background-image: url(../img/images/company-banner.jpg);
    padding-top: 70px;
    padding-bottom: 70px;
    color: #fff;
    background-size: contain;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    margin-top: -120px;
    }
}

@media screen and (max-width:768px){
    .certification .choose-text {
    font-size: 16px;
    }
    .about-banner {
    background-image: url(../img/images/company-banner.jpg);
    padding-top: 60px;
    padding-bottom: 60px;
    color: #fff;
    background-size: contain;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center;
    margin-top: -120px;
    }
}

@media screen and (max-width:990px){
    .company-desc {
    font-family: 'Poppins';
    color: #3c3b3b;
    /* font-weight: 600; */
    font-size: 20px;
        /*letter-spacing: 1px;*/
    }
}


@media screen and (max-width:577px){
    .company-desc {
    /* font-weight: 600; */
    font-size: 22px;
    }
}



@media screen and (max-width:1200px){
    .counter-wrap-abt {
    left: 37.5%;}
    .about-head {
    font-size: 17px;
    font-family: 'Montserrat-Regular';
    font-weight: 600;
    }
}
@media screen and (max-width: 1100px)
{
   .about-banner {
    background-image: url(../img/images/company-banner.jpg);
    padding-top: 110px;
    padding-bottom: 110px;
    color: #fff;
    background-size: unset;
    background-repeat: no-repeat;
    background-size: contain;
    background-attachment: fixed;
    background-position-x: 30%;
    margin-top: -120px;
}
.counter-wrap-abt {
    left: 38.5%;
    top: 29%;
}
    .ab-sec-desc {
    font-family: 'Nunito Sans';
    color: #454647;
    /* font-size: 14px; */
    font-size: 15px;
    line-height: 25px;
    }
    .about-card {
    background: #f3f3f3;
    padding: 20px 17px 15px;
    }
    .about-head {
    font-size: 16px;
    font-family: 'Montserrat-Regular';
    font-weight: 600;
    }
    
}

@media screen and (max-width:1024px){
    .counter-wrap-abt {
    left: 37.5%;
    top: 21%;
    }
    .choose-text {
    font-family: 'Montserrat-Regular';
    font-weight: 600;
    color: #0a1d37;
    font-size: 18px;
    }
    .test-message {
    font-family: 'Nunito Sans';
    line-height: 25px;
    color: #797979;
    font-size: 15px;
    }
    .about-card p {
    font-family: 'Nunito Sans';
    line-height: 22px;
    color: #797979;
    font-size: 13.5px;
    }
    .about-banner {
    background-image: url(../img/images/company-banner.jpg);
    padding-top: 110px;
    padding-bottom: 110px;
    color: #fff;
    background-size: unset;
    background-repeat: no-repeat;
    background-size: contain;
    background-attachment: fixed;
    background-position-x: 30%;
    margin-top: -120px;
    background-position-y: 60px;
  }
}

@media screen and (max-width:990px){
    .counter-wrap-abt .number.count {
    font-family: 'Montserrat-ExtraBold';
    font-size: 50px;
    line-height: 50px;
    color: #ff8a58;
    }
    .counter-wrap-abt {
    left: 39%;
    top: 33%;
    }
    #about-sec .sec-head {
    font-size: 26px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 33px;
    /* margin-bottom: 0px !important; */
    }
    .ab-sec-desc {
    font-family: 'Nunito Sans';
    color: #454647;
    font-size: 13px;
    font-size: 14px;
    line-height: 22px;
    }
    .choose-ul li {
    font-family: 'inter-regular';
    color: #454545;
    font-size: 14px;
    padding-top: 5px;
    }
    .test-message {
    font-family: 'Nunito Sans';
    line-height: 23px;
    color: #797979;
    font-size: 14.5px;
    }
    .choose-text {
    font-family: 'Montserrat-Regular';
    font-weight: 600;
    color: #0a1d37;
    font-size: 17px;
    }
    .about-card p {
    font-family: 'Nunito Sans';
    line-height: 19px;
    color: #797979;
    font-size: 13px;
    }
    .about-head {
    font-size: 15px;
    font-family: 'Montserrat-Regular';
    font-weight: 600;
    }
    .about-banner {
    background-image: url(../img/images/company-banner.jpg);
    padding-top: 100px;
    padding-bottom: 100px;
    color: #fff;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 55px;
    background-position-x: 40%;
    margin-top: -120px;
    background-size: contain;
    }
}
@media screen and (max-width: 900px){
    .counter-wrap-abt {
    left: 38%;
    top: 33%;
    }
}

@media screen and (max-width:800px){
    .counter-wrap-abt .number.count {
    font-family: 'Montserrat-ExtraBold';
    font-size: 45px;
    line-height: 45px;
    color: #ff8a58;
    }
    .counter-wrap-abt {
    left: 36.5%;
    top: 24%;
    }
    #about-sec .sec-head {
    font-size: 24px;
    }
    .ab-sec-desc {
    font-family: 'Nunito Sans';
    color: #454647;
    font-size: 13px;
    font-size: 13px;
    line-height: 20px;
    }
    .choose-overlay {
    background: #f8f0df;
    opacity: 0.9;
    }
    .certificate-div {
    border-right: unset;
    }
    
}

@media screen and (max-width: 800px){
    .about-banner {
    background-image: url(../img/images/company-banner.jpg);
    padding-top: 80px;
    padding-bottom: 80px;
    color: #fff;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-x: 90%;
    background-position-y: 55px;
    margin-top: -120px;
    background-size: contain;
  }
}


@media screen and (max-width:767px){
    
    
   
    .choose-text {
    font-size: 16px;
    }
    .about-card p {
    font-family: 'Nunito Sans';
    line-height: 22px;
    color: #797979;
    font-size: 14px;
    }
    .about-head {
    font-size: 18px;
    margin-bottom: 15px;
    }
    #about-image {
    text-align: center;
    }
    .counter-wrap-abt {
        left: 66%;
        top: 11%;
    }
    .counter-wrap-abt .number.count {
    font-family: 'Montserrat-ExtraBold';
    font-size: 60px;
    line-height: 60px;
    color: #ff8a58;
    }
    .ab-sec-desc {
    font-family: 'Nunito Sans';
    color: #454647;
    font-size: 13px;
    font-size: 15px;
    line-height: 26px;
    }
}
@media screen and (max-width:680px){
    .counter-wrap-abt {
    left: 67.5%;
    top: 11%;
    }
    .about-banner {
    background-image: url(../img/images/company-banner.jpg);
    padding-top: 80px;
    padding-bottom: 80px;
    color: #fff;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-x: 90%;
    background-position-y: 76px;
    margin-top: -120px;
    background-size: contain;
    }
    
}

@media screen and (max-width:577px){
    .breadcrum-syscom p {
    font-family: 'Nunito Sans';
    font-size: 15px !important;
    }
    #about-image {
    text-align: center;
    width: 100%;
    padding: 0px;
    }
    .counter-wrap-abt {
    left: 70.5%;
    top: 14%;
    }
    .choose-background {
    background-image: unset;
    width: 100%;
    height: auto;
    padding-top: 0px;
    padding-bottom: 80px;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-size: cover;
    /* display: none; */
    }
    .why-sec .test-message {
    font-size: 14px;
    text-align: left;
    }
    .about-card p {
    font-family: 'Nunito Sans';
    line-height: 22px;
    color: #797979;
    font-size: 15px;
    }
}
@media screen and (max-width:450px){
    .counter-wrap-abt .number.count {
    font-family: 'Montserrat-ExtraBold';
    font-size: 50px ;
    }
    .counter-wrap-abt {
    left: 68%;
    top: 7.5%;
    }
}

@media screen and (max-width:400px){
    .counter-wrap-abt .number.count {
    font-family: 'Montserrat-ExtraBold';
    font-size: 40px;
    }
    .counter-wrap-abt {
    left: 68%;
    top: 6.5%;
    }
    .about-card p {
    font-family: 'Nunito Sans';
    line-height: 22px;
    color: #797979;
    font-size: 14.5px;
    }
    .about-card {
    background: #f3f3f3;
    padding: 30px 22px 15px;
    }
}




/*infrastructure page*/
.internal_text {
    position: absolute;
    z-index:-1;
}


.breadcrum-syscom a {
    color: #f6985b;
    text-decoration: none;
    font-size: 17px;
    font-family: 'Nunito Sans';
}
.breadcrum-syscom a:hover {
    cursor: pointer;
    color: #f6985b;
}
.breadcrum-syscom li {
    font-family: 'Nunito Sans';
    font-size: 17px;
}
.breadcrum-syscom .breadcrumb-item+.breadcrumb-item::before {
    float: left;
    padding-right: .5rem;
    color: #ffffff;
    content: var(--bs-breadcrumb-divider, "|");
}

.breadcrum-syscom p {
    font-family: 'Nunito Sans';
    font-size: 17px;
}
.internal-div {
    background: #f3f3f3;
    padding: 30px 80px 30px 40px;
}
.internal-div {
    background: #f3f3f3;
    padding: 30px 80px 30px 40px !important;
    position: absolute;
    right: 100px;
    width: 55% !important;
}
#internal-sec {
    position: relative;
}
ul#internal-ul li {
    font-family: 'Nunito Sans';
    font-size: 14px;
    padding-top: 5px;
    display: flex;
    text-transform: uppercase;
    list-style-type: none;
}
#internal-ul {
    padding-left: 0rem;
}
#internal-sec1 {
    padding: 40px 20px;
}
ul#internal-ul li svg {
    color: #ec8e5b;
    margin-right: 15px;
}
@media screen and (max-width: 1280px){
  #internal-sec1 {
    padding: 50px 20px;
  }
    #internal-section img {
    width: 100%;
    height: 100%;
    }
    .internal-div {
    background: #f3f3f3;
    padding: 30px 80px 30px 40px !important;
    position: absolute;
    right: 60px;
    width: 55% !important;
    }
}
@media screen and (max-width:1200px){
#internal-sec1 {
    padding: 40px 3px;
}
ul#internal-ul li {
    font-family: 'Nunito Sans';
    font-size: 13px;
    padding-top: 4px;
    display: flex;
    list-style-type: none;
}
.internal-div {
    background: #f3f3f3;
    padding: 30px 80px 30px 40px !important;
    position: absolute;
    right: 65px;
}
}


@media screen and (max-width:1100px){
    
    #internal-section img {
    width: 100%;
    height: 100%;
    }
}
@media screen and (max-width:1024px){
    ul#internal-ul li {
    font-family: 'Nunito Sans';
    font-size: 12px;
    padding-top: 4px;
    display: flex;
    list-style-type: none;
    }
    .internal-div {
    background: #f3f3f3;
    padding: 30px 60px 30px 30px;
    position: absolute;
    right: 60px;
    }
}

@media screen and (max-width:800px){
    .sec-head {
    font-size: 25px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 25px;
    }
    .ab-sec-desc {
    font-family: 'Nunito Sans';
    color: #454647;
    font-size: 13px;
    font-size: 13px;
    line-height: 18px;
    }
    .internal-div {
    background: #f3f3f3;
    padding: 30px 40px 30px 20px !important;
    position: absolute;
    right: 60px;
    }
    #internal-sec1 {
    width: 100%;
    }
    #internal-section img {
    width: 100%;
    height: 100%;
    display: none;
    }
    #internal-sec1 {
    width: 100%;
    padding: 30px 60px;
    }
}

@media screen and (max-width: 768px){
    .internal-div {
    background: #f3f3f3;
    padding: 30px 40px 30px 20px !important;
    position: absolute;
    right: 40px;
    }
}

@media screen and (max-width:700px){
    #internal-sec .sec-head {
    font-size: 20px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 20px;
    }
    .internal-div {
    background: #f3f3f3;
    padding: 20px 30px 20px 15px;
    position: absolute;
    right: 50px;
    }
    
}

@media screen and (max-width:640px){
    #internal-sec .sec-head {
    font-size: 16px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 4px;
    }
    .internal-div {
    background: #f3f3f3;
    padding: 20px 30px 20px 15px !important;
    position: absolute;
    right: 39px;
        }
    .ab-sec-desc {
    font-family: 'Nunito Sans';
    color: #454647;
    font-size: 13px;
    font-size: 13px;
    line-height: 18px;
    margin-bottom: 0px;
    }
}

@media screen and (max-width:577px){
    .breadcrum-syscom a {
    color: #f6985b;
    text-decoration: none;
    font-size: 14px;
    font-family: 'Nunito Sans';
    }
     .breadcrum-syscom li {
    font-family: 'Nunito Sans';
    font-size: 14px;
    }
    .about-banner {
    background-image: unset;
    padding-top: 60px;
    padding-bottom: 60px;
    background-color: #f3f3f3;
        }
    .internal-div {
    background: #f3f3f3;
    padding: 40px 60px 40px 30px !important;
    position: unset;
    right: 0px;
    width: 100% !important;
    }
    #internal-sec .sec-head {
    font-size: 20px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 20px;
    }
    .ab-sec-desc {
    font-family: 'Nunito Sans';
    color: #454647;
    font-size: 13px;
    font-size: 15px;
    line-height: 24px;
    margin-bottom: 0px;
    }
    ul#internal-ul li {
    font-family: 'Nunito Sans';
    font-size: 14px;
    padding-top: 5px;
    display: flex;
    list-style-type: none;
    }
    ul#internal-ul .col-sm-6 {
    padding: 0px;
    }
    .choose-text {
    font-size: 20px;
    }
    #internal-sec1 {
    width: 100%;
    padding: 30px 30px;
    }
}
@media screen and (max-width:400px){
    .breadcrum-syscom .breadcrumb-item+.breadcrumb-item::before {
    float: left;
    /*padding-right: .1rem;*/
    color: #ffffff;
    content: var(--bs-breadcrumb-divider, "|");
    }
    .breadcrum-syscom a {
    color: #f6985b;
    text-decoration: none;
    font-size: 13px;
    font-family: 'Nunito Sans';
    }
    .breadcrum-syscom li {
    font-family: 'Nunito Sans';
    font-size: 12px;
    }
    ul#internal-ul li {
    font-family: 'Nunito Sans';
    font-size: 12.5px;
    padding-top: 5px;
    display: flex;
    list-style-type: none;
    }
}

/*vision page*/
#syscom-quote p {
    font-family: 'Nunito Sans';
    font-size: 16px;
    opacity: 0.9;
}
#syscom-quote svg {
    font-size: 30px;
    margin: 0px 10px;
    color: #787878;
}

@media screen and (max-width:768px){
    #syscom-quote p {
    font-family: 'Nunito Sans';
    font-size: 13px;
    opacity: 0.9;
    }
    #syscom-quote svg {
    font-size: 20px;
    margin: 0px 10px;
    color: #787878;
    }
}

@media screen and (max-width:577px){
    #syscom-quote p {
    font-family: 'Nunito Sans';
    font-size: 12px;
    opacity: 0.9;
    }
}




/*services*/
.internal-background.internal_text {
    padding-left: 0px;
}
#services-section .col-sm-6{
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.service-banner {
    background: #f3f3f5;
    /*background-image: url(../img/images/service-banner.jpg);*/
    padding-top: 40px;
    padding-bottom: 40px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 80px;
    width: 100%;
    height: auto;
    background-size: contain;
}

#service-parent h3 {
    font-family: 'Montserrat-Regular';
    font-weight: 600;
    font-size: 20px;
}
#service-parent .services-desc {
    font-family: 'Nunito Sans';
    font-size: 16px;
}
#service-parent .learn-btn a {
    text-decoration: none;
    color: #fff ;
}
#service-parent .learn-btn1 a {
    text-decoration: none;
    color: #053f55 !important;
}
#service-parent span.forward-btn {
    padding-left: 8px;
    font-size: 22px;
    font-weight: bold;
    color: #ffffff;
}
#service-parent span.forward-btn1 {
    padding-left: 8px;
    font-size: 22px;
    font-weight: bold;
    color: #053f55 ;
}
.services-card {
    /* background: #f1f1f1; */
    padding: 30px 35px 20px 25px;
    color: #fff;
    border-radius: 10px;
    width: 80%;
}
.service-color{background-color:#F47373;}
.service-color1{background-color:#033F54;}
.service-color-1 {
    background-color: #d4e9e5;
}
.service-text-cust{color: #053f55 !important; }
.service-color2{background-color:#F69E7B;}
.service-color-2 {
    background-color: #f9d4c7;
}
.service-color3{background-color:#F48989;}
#service-parent {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
.services-card {
    position: absolute;
    /* top: 0px; */
    justify-content: center;
}
.services-card-custom {
    position: absolute;
    /* top: 0px; */
    justify-content: center;
    background-image: url(../img/images/service4.jpg);
    /* background: #f1f1f1; */
    
/*    padding: 30px 35px 20px 25px !important;*/
    color: #fff;
    border-radius: 10px !important;
    width: 80%;
    box-shadow: 1px 1px 18px 4px #777777;
}
.services-card-custom1 {
    position: absolute;
    /* top: 0px; */
    justify-content: center;
    background-image: url(../img/images/service8.jpg);
    /* background: #f1f1f1; */
   
/*    padding: 30px 35px 20px 25px !important;*/
    color: #fff;
    border-radius: 10px !important;
    width: 80%;
    box-shadow: 1px 1px 18px 4px #777777;
}
.card-overlay {
    width: 100%;
    height: 100%;
    background: #fff8f85e;
    padding: 30px 35px 20px 25px !important;
    /* opacity: 0.2; */
}
#service-parent p.learn-btn {
    text-align: end;
}

@media screen and (max-width:1280px){
    .service-banner {
    background: #f3f3f5;
    background-image: url(../img/images/service-banner.jpg);
    /*padding-top: 100px;*/
    /*padding-bottom: 100px;*/
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 90px;
    width: 100%;
    height: auto;
    background-size: contain;
    }
}

@media screen and (max-width:1200px){
    #service-parent .services-desc {
    font-family: 'Nunito Sans';
    font-size: 15px;
    }
    #service-parent h3 {
    font-family: 'Montserrat-Regular';
    font-weight: 600;
    font-size: 20px;
    }
    .services-card {
    /* background: #f1f1f1; */
    padding: 20px 25px 20px 25px;
    color: #fff;
    border-radius: 10px;
    width: 80%;
    }
    #service-parent p.learn-btn {
    text-align: end;
    margin-bottom: 0px;
    }
    
}

@media screen and (max-width:1100px){
    .service-banner {
    /*background: azure;*/
    background-image: url(../img/images/service-banner.jpg);
    /*padding-top: 50px;*/
    /*padding-bottom: 50px;*/
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: unset;
    background-size: contain;
    width: 100%;
    height: unset;
    }
}

@media screen and (max-width:1024px){
    #service-parent h3 {
    font-family: 'Montserrat-Regular';
    font-weight: 600;
    font-size: 18px;
    }
    #service-parent .services-desc {
    font-family: 'Nunito Sans';
    font-size: 14px;
    }
}

@media screen and (max-width:990px){
    button.request-btn {
    font-family: 'Montserrat-ExtraBold';
    font-size: 14px;
    }
    .abt-banner-text {
        font-size: 30px;
    }
    .services-card {
    /* background: #f1f1f1; */
    padding: 15px 20px 15px 20px;
    color: #fff;
    border-radius: 10px;
    width: 85%; 
    }
    #service-parent .services-desc {
    font-family: 'Nunito Sans';
    font-size: 13px;
    margin-bottom: 0px;
    }
    #service-parent span.forward-btn {
    padding-left: 8px;
    font-size: 18px;
    font-weight: bold;
    color: #ffffff;
    }
    #service-parent .learn-btn a {
    text-decoration: none;
    color: #ffffff;
    font-size: 14px;
    }
    #service-parent h3 {
    font-family: 'Montserrat-Regular';
    font-weight: 600;
    font-size: 16px;
    }
}

@media screen and (max-width:840px){
    .service-banner {
    background: #f3f3f5;
    background-image: url(../img/images/service-banner.jpg);
    padding-top: 70px;
    padding-bottom: 70px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: unset;
    background-size: contain;
    width: 100%;
    height: unset;
    }
    .services-card {
    /* background: #f1f1f1; */
    padding: 15px 15px 15px 15px;
    color: #fff;
    border-radius: 10px;
    width: 85%;
    }
    #service-parent .services-desc {
    font-family: 'Nunito Sans';
    font-size: 12px;
    margin-bottom: 0px;
    }
    .service-display{
        display: none;
    }
}

@media screen and (max-width:768px){
    .service-banner {
    background: #f3f3f5;
    background-image: url(../img/images/service-banner.jpg);
    padding-top: 60px;
    padding-bottom: 60px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-x: 52%;
    background-size: unset;
    width: 100%;
    height: unset;
    }
}

@media screen and (max-width:680px){
    /*.service-banner {
    background: #f3f3f5;
    background-image: url(../img/images/service-banner.jpg);
    padding-top: 55px;
    padding-bottom: 55px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: unset;
    background-size: contain;
    width: 100%;
    height: unset;
    }*/
    #service-parent .services-desc {
    font-family: 'Nunito Sans';
    font-size: 11px;
    margin-bottom: 0px;
    }
    #service-parent h3 {
    font-family: 'Montserrat-Regular';
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 5px;
    }
}

@media screen and (max-width:577px){
    .service-message .test-message {
    text-align: left;
    }
    #internal-section ul {
    padding-left: 20px;
    }
    .service-banner {
    background: #f3f3f5;
    padding-top: 60px;
    padding-bottom: 60px;
    }
    #service-parent h3 {
    font-size: 18px;
    margin-bottom: 10px;
    }
    #service-parent .services-desc {
    font-size: 15px;
    margin-bottom: 10px;
    }
    #service-parent .learn-btn a {
    font-size: 16px;
    }
    .services-card {
    padding: 25px 30px 25px 30px;
    }
}

@media screen and (max-width:480px){
    #service-parent h3 {
    font-size: 15px;
    margin-bottom: 6px;
    }
    #service-parent .services-desc {
    font-size: 13px;
    margin-bottom: 6px;
    }
    #service-parent .learn-btn a {
    font-size: 15px;
    }
    .services-card {
    padding: 20px 22px 19px 22px;
    }
}

@media screen and (max-width:390px){
    .services-card {
    padding: 10px 15px 10px 15px;
    }
    #service-parent h3 {
    font-size: 14px;
    }
    #service-parent .services-desc {
    font-size: 12px;
    }
    #service-parent .learn-btn a {
    font-size: 14px;
    }
}


/*service internal page*/

.internal-background{background:#f0f3f7;}
.internal_head {
    font-size: 28px;
    font-family: 'Poppins';
    font-weight: 600;
    color: #0a1d37;
}
.interna_desc {
    font-family: 'Nunito Sans';
    font-size: 17px;
    color: #333333;
}
.internal_img {
    position: unset;
    right: 0;
    z-index:12;
}
#internal_parent {
    position: relative;
}
.internal_text {
    padding: 40px 0px;
}
.internal_quote {
    font-size: 37px;
    font-family: poppins;
    font-weight: 800;
}
.internal_quote svg {
    margin: 0px 10px;}
.internal_feature.bg-white {
    background: white !important;
    border-radius: 15px;
    padding: 80px 95px 80px 35px;
    box-shadow: 1px 1px 10px #ddd;
}
.internal_card {
    position: unset;
    left: unset;
    padding-left: 100px !important;
}
.internal_feature.bg-white h3 {
    font-family: 'Montserrat-ExtraBold';
    font-size: 28px;
    line-height: 30px;
}
ul.internal_ul {
    padding-left: 25px;
    padding-top: 20px;
}
ul.internal_ul li {
    font-family: 'Nunito Sans';
    line-height: 28px;
}

@media screen and (max-width:1280px){
    .internal_card {
    position: unset;
    left: 60px !important;
    z-index:12;
    }
}

@media screen and (max-width:1100px){
    .internal_head {
    font-size: 30px;}
    .interna_desc {
    font-family: 'Nunito Sans';
    font-size: 16px;
    }
    .internal_feature.bg-white {
    padding: 65px 75px 65px 35px;
    }
    .internal_card {
    position: unset;
    left: unset;
    padding-left: 60px !important;
    }
    
}

@media screen and (max-width:1024px){
    .internal_text {
    padding: 20px 0px;
    }
    .internal_feature.bg-white {
    padding: 55px 60px 55px 35px;
    }
    .internal_feature.bg-white h3 {
    font-size: 21px;
    }
    .internal_quote {
    font-size: 30px;
    font-family: poppins;
    font-weight: 800;
    }
    .interna_desc {
    font-family: 'Nunito Sans';
    font-size: 15px;
    }
    .internal_head {
    font-size: 25px;
    }

}

@media screen and (max-width:990px){
    
    .internal_feature.bg-white {
    padding: 35px 40px 35px 25px;
    }
    .internal_card {
    position: unset;
    padding-left: 60px !important;
    width: 50% !important;
    }
    ul.internal_ul li {
    line-height: 24px;
    font-size: 15px;
    }
}

@media screen and (max-width:840px){
    .interna_desc {
    font-family: 'Nunito Sans';
    font-size: 13px;
    margin-bottom: 0px;
    }
    .internal_head {
    font-size: 19px;
    }
}

@media screen and (max-width:768px){
    .internal_card {
    position: unset;
    padding-left: 60px !important;
    width: 60% !important;
    margin: auto;
    margin-bottom: 30px;
    }
    #internal_parent .col-sm-6 {
    width: 100% !important;
    }
    .internal_text {
    position: unset;
    z-index: -1;
    }
    #internal_parent .col-sm-6.internal_img {
    text-align: center;
    }

    .interna_desc {
    font-family: 'Nunito Sans';
    font-size: 15px;
    margin-bottom: 0px;
    }
    .internal_quote {
    font-size: 25px;}
    .internal_card {
    position: unset;
    padding-left: 40px !important;
    }
    .internal_feature.bg-white {
    padding: 20px 30px 20px 15px;
    }
    ul.internal_ul li {
    line-height: 24px;
    font-size: 14px;
    }
    
}

@media screen and (max-width:680px){
    .internal_quote {
    font-size: 20px;
    }
    .internal_feature.bg-white {
    padding: 10px 20px 10px 10px;
    }
    .internal_feature.bg-white h3 {
    font-size: 18px;
    line-height: 23px;
    }
    ul.internal_ul {
    padding-left: 20px;
    padding-top: 10px;
    }
    ul.internal_ul li {
    line-height: 22px;
    font-size: 13px;
    }
    .internal_head {
    font-size: 22px;
    }
}

@media screen and (max-width:577px){
    #internal_parent .col-sm-6.internal_img {
    text-align: center;
    width: 85% !important;
    padding: 0px;
    /* margin: 0px 30px !important; */
        }
    .internal_text {
    position: unset;
    z-index: -1;
    margin-top: 30px !important;
    }
    .internal_img {
    position: unset;
    width: 90% !important;
    margin: auto;
    margin-top: auto;
    padding-bottom: 30px;
    padding-left: unset !important;
    }
    .internal_text {
    padding: 30px 0px;
    }
    .internal_card {
    position: unset;
    }
    .internal_card {
    position: unset;
    width: 90% !important;
    margin: auto;
    padding-bottom: 30px;
    padding-left: unset !important;
    padding-right: 0px !important;
}
    .internal_feature.bg-white h3 {
    font-size: 25px;
    line-height: 28px;
    }
    ul.internal_ul li {
    line-height: 26px;
    font-size: 15px;
    }
    .internal_feature.bg-white {
    padding: 30px 60px 30px 30px;
    }
    .internal_head {
    font-size: 26px;
    }
    .interna_desc {
    font-family: 'Nunito Sans';
    font-size: 15px;
    margin-bottom: 0px;
    }
    .internal_quote {
    font-size: 26px;
    text-align: center;
    }
}
@media screen and (max-width:400px){
    .internal_feature.bg-white {
     padding: 25px 40px 25px 20px;
    }
    .internal_feature.bg-white h3 {
    font-size: 21px;
    line-height: 24px;
    }
    ul.internal_ul li {
    line-height: 24px;
    font-size: 14px;
    }
    .internal_quote {
    font-size: 21px;
    text-align: center;
    }
}

/*web development*/
    #web_development .internal_quote {
    font-size: 26px;
    font-family: poppins;
    font-weight: 800;
    }
    #development_ul h3 {
    font-family: 'Montserrat-ExtraBold';
    font-size: 30px;
    line-height: 35px;
    }
    
@media screen and (max-width:768px){
    #web_development .internal_quote {
    font-size: 22px;
    font-family: poppins;
    font-weight: 800;
    }
    #development_ul h3 {
    font-family: 'Montserrat-ExtraBold';
    font-size: 23px;
    line-height: 30px;
    }
}
@media screen and (max-width: 680px){
    #web_development .internal_quote {
    font-size: 17px;
    font-family: poppins;
    font-weight: 800;
        }
}

@media screen and (max-width:577px){
    #web_development .internal_quote {
    font-size: 18px;
    font-family: poppins;
    font-weight: 800;
    }
}

/*web hosting*/

span.hosting-head {
    color: #ff9158;
    font-family: 'Montserrat-ExtraBold';
}




#services-accordion .accordion {
    margin: auto;
    width: 100%;
}
#services-accordion .accordion input {
    display: none;
}
#services-accordion .box {
    position: relative;
    background: white;
    height: 64px;
    transition: all .15s ease-in-out;
}
#services-accordion .box::before {
    content: '';
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    pointer-events: none;
    box-shadow: 0 -1px 0 #e5e5e5,0 0 2px rgba(0,0,0,.12),0 2px 4px rgba(0,0,0,.24);
}
#services-accordion header.box {
    background: #0a1d37;
    z-index: 1;
    cursor: initial;
    box-shadow: 0 -1px 0 #e5e5e5, 0 0 2px -2px rgb(0 0 0 / 12%), 0 2px 4px -4px rgb(0 0 0 / 24%);
    margin-top: 50px;
}
#services-accordion header .box-title {
    margin: 0;
    font-weight: normal;
    font-size: 16pt;
    color: white;
    cursor: initial;
}
#services-accordion .box-title {
    width: calc(100% - 40px);
    height: 64px;
    line-height: 64px;
    padding: 0 20px;
    display: inline-block;
    cursor: pointer;
    -webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;
}
#services-accordion .box-content {
    width: calc(100% - 40px);
    padding: 30px 20px;
    font-size: 11pt;
    color: rgba(0,0,0,.54);
    display: none;
}
#services-accordion .box-close {
    position: absolute;
    height: 64px;
    width: 100%;
    top: 0;
    left: 0;
    cursor: pointer;
    display: none;
}
#services-accordion input:checked + .box {
    height: auto;
    margin: 16px 0;
    box-shadow: 0 0 6px rgb(209 201 201 / 16%), 0 6px 12px rgb(157 148 148 / 32%);
}
 input:checked + .box .box-title {
    border-bottom: 1px solid rgba(0,0,0,.18);
}
#services-accordion input:checked + .box .box-content,
input:checked + .box .box-close {
    display: inline-block;
}
#services-accordion .arrows section .box-title {
    padding-left: 44px;
    width: calc(100%);
}
#services-accordion .arrows section .title-dropdown:before {
    position: absolute;
    display: block;
    content: '\203a';
    font-size: 18pt;
    left: 20px;
    top: -2px;
    transition: transform .15s ease-in-out;
    color: rgba(0,0,0,.54);
}
#services-accordion input:checked + section.box .title-dropdown:before {
    transform: rotate(90deg);
}
ul.services-link li {
    text-decoration: none;
    list-style-type: none;
    font-family: 'Nunito Sans semi';
    padding-top: 10px;
    color: #555353;
    font-size: 16px;
    /* border-bottom: 1px solid #ddd; */
}
ul.services-link li a {
    text-decoration: none;
    color: unset;
}
.box-title a {
    text-decoration: none;
    color: unset;
    font-family: 'Nunito Sans';
    font-weight: 600;
    color: #3d3c3c;
}

/*product */

.product-banner {
    background: #f3f3f5;
    /*background-image: url(../img/images/product-banner.jpg);*/
    padding-top: 20px;
    padding-bottom: 20px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: unset;
    background-position-x: 100%;
    width: 100%;
    height: auto;
    background-position-y: 80px;
}
.sec-title1 {
    font-size: 20px;
    font-family: oswald-medium;
    color: #ec8e5b;
    /*letter-spacing: -0.5px;*/
    margin-bottom: 5px;
}
.sec-head1 {
    font-size: 30px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 40px;
}
.learn-btn1 a {
    text-decoration: none;
    color: #ff9158;
    font-family: 'Poppins';
}

@media screen and (max-width:1100px){
    .sec-head1 {
    font-size: 28px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 40px;
    }
}

@media screen and (max-width:900px){
    
.sec-head1 {
    font-size: 24px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 40px;
}
.sec-title1 {
    font-size: 18px;
    font-family: oswald-medium;
    color: #ec8e5b;
    /*letter-spacing: -0.5px;*/
    margin-bottom: 0px;
}   
}
@media screen and (max-width:768px){
    .sec-head1 {
    font-size: 21px;
    font-family: poppins;
    color: #0a1d37;
    line-height: 28px;
    }
    .product-banner {
    background: #f3f3f5;
    background-image: url(../img/images/product-banner.jpg);
    padding-top: 60px;
    padding-bottom: 60px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-x: 85%;
    width: 100%;
    height: auto;
    background-size: unset;
    }
}
@media screen and (max-width:577px){
    .product-banner {
    background: #f3f3f5;
     background-image: unset; 
    padding-top: 60px;
    padding-bottom: 60px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: unset;
    width: 100%;
    height: auto;
    background-size: contain;
    }
}

/*contact us*/
#syscom-map iframe {
    height: 250px;
    box-shadow: 1px 1px 16px 4px #e2e0e0;
}
.info-desc a {
    color: unset;
    text-decoration: none;
}


#contact-box .internal_img {
    position: absolute;
    right: 0;
    z-index: 12;
}
#contact-box .internal_img {
    padding: 40px 0px;
    box-shadow: rgb(3 26 115 / 15%) 0 3px 25px;
}
#contact-page label {
    margin-top: 20px;
    font-family: 'Nunito Sans semi';
}
#contact-page .form-sec {
    padding: 30px 40px !important;
}
#contact-box .internal_text {
    position: unset;
    z-index: -1;
}
.contact-banner {
    background: #f3f3f5;
/*    background-image: url(../img/images/contact-banner.jpg);*/
    padding-top: 130px;
    padding-bottom: 130px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 70px;
    width: 100%;
    height: auto;
    background-size: contain;
}

.contact-box{box-shadow: 1px 10px 18px 5px #ecececd1;}
#main .mb_content-section:first-child {
    margin-bottom: 0;
}

#contact-box .internal_text {
    z-index: 23;
}
#contact-box .internal_img {
    padding: 40px 0px;
    box-shadow: rgb(3 26 115 / 15%) 0 3px 25px;
}
#contact-box .form-sec {
    background: #ffffff;
}
#contact-box input.form-control {
    height: 45px;
    border: 1px solid #DBDBDB;
}
#contact-box .contact-desc {
    font-family: 'Nunito Sans semi';
    line-height: 25px;
    font-size: 17px;
    margin-top: 20px;
}
#contact-box .info-head {
    font-family: 'poppins-regular';
    color: #fa9351;
    margin-top: 15px;
    font-size: 18px;
    font-weight: 600;
}
#contact-box .info-desc {
    font-family: 'Nunito Sans semi';
    font-size: 16px;
}
.info-text {
    font-family: 'inter-regular';
    font-size: 14px;
    font-weight: 400;
    color: #f6985b !important;
}
a#reload {
    color: #101d31;
    font-family: 'inter-regular';
    text-decoration: none;
    /* margin-top: 20px !important; */
}
#captcha_image {
    display: block;
}

@media screen and (max-width:768px){
    #captcha {
    text-align: center;
    }


    .contact-button {
    text-align: center;
    }
    #contact-box .internal_img {
    position: unset;
    right: 0;
    z-index: 12;
    }
    #contact-box iframe {
    height: 300px;
    }
}


/*career page*/

#career-form #captcha_image {
    display: block;
    margin: auto;
}

.career-banner {
    background: #f3f3f5;
    /*background-image: url(../img/images/career-banner.jpg);*/
    padding-top: 30px;
    padding-bottom: 30px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 100px;
    width: 100%;
    height: auto;
    background-size: contain;
}
.career-background {
    background: #ebf1f6;
}
.career-card {
    background: #fff;
    padding: 20px 40px;
    border-radius: 10px;
    box-shadow: 1px 1px 16px 1px #6d6d6d30;
}
.career-type {
    font-size: 22px;
    font-family: oswald;
    /*letter-spacing: 1px;*/
    color: #101d31;
}
.career-desc {
    font-family: 'Nunito Sans semi';
    line-height: 27px;
    margin-top: 16px;
    color: #898d8d;
}
.career-req {
    font-family: 'inter';
    line-height: 27px;
    margin-top: 16px;
    color: #f6985b;
}
.career-req span {
    color: #767979;
}
.career-desc {
    font-family: 'Inter';
    line-height: 27px;
    margin-top: 16px;
    color: #898d8d;
}
.career-btn svg {
    font-size: 34px;
    color: #101d31;
    cursor: pointer;
}
.career-open {
    font-family: 'Inter';
    /* font-size: large; */
}
.career-card a {
    text-decoration: none;
}

@media screen and (max-width:1024px){
    .career-desc {
    font-family: 'Inter';
    line-height: 20px;
    margin-top: 14px;
    color: #898d8d;
    font-size: 15px;
    }
    .career-type {
    font-size: 20px;
    }
    .career-banner {
    background: #f3f3f5;
    background-image: url(../img/images/career-banner.jpg);
    padding-top: 100px;
    padding-bottom: 100px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 100px;
    width: 100%;
    height: auto;
    background-size: contain;
    }
}



@media screen and (max-width:768px){
.career-desc {
    font-family: 'Inter';
    line-height: 20px;
    margin-top: 14px;
    color: #898d8d;
    font-size: 15px;
    }
    .career-card {
    background: #fff;
    padding: 20px 30px;
    border-radius: 10px;
    box-shadow: 1px 1px 16px 1px #6d6d6d30;
    }
    .career-req {
    font-family: 'inter';
    line-height: 27px;
    margin-top: 16px;
    color: #f6985b;
    font-size: 15px;
    }

    .career-banner {
    background: #f3f3f5;
    background-image: url(../img/images/career-banner.jpg);
    padding-top: 60px;
    padding-bottom: 60px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 100px;
    width: 100%;
    height: auto;
    background-size: contain;
}

}

@media screen and (max-width: 680px){
    .career-card {
    background: #fff;
    padding: 20px 20px;
    border-radius: 10px;
    box-shadow: 1px 1px 16px 1px #6d6d6d30;
    }
    .career-desc {
    font-family: 'Inter';
    line-height: 17px;
    margin-top: 14px;
    color: #898d8d;
    font-size: 14px;
    }
    .career-req {
    font-family: 'inter';
    line-height: 18px;
    margin-top: 20px;
    color: #f6985b;
    font-size: 14px;
    }
}


@media screen and (max-width: 577px){
    #contact-box .internal_img {
    padding: 40px 0px;
    box-shadow: rgb(3 26 115 / 15%) 0 3px 25px;
    width: 100% !important;
    }
    .career-banner {
    background: #f3f3f5;
    background-image: unset !important;
    padding-top: 60px;
    padding-bottom: 60px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 100px;
    width: 100%;
    height: auto;
    background-size: contain;
    }

}

/*enquiry*/
#enquiry-form {
    position: relative;
    background: #fff;
    box-shadow: 1px 10px 18px 5px #ecececd1;
    /* box-shadow: 1px 1px 10px 10px #f4f4f4; */
}
#enquiry-form {
    background: #fff;
    width: 60%;
    box-shadow: 1px 10px 18px 5px #ecececd1;
    /* box-shadow: 1px 1px 10px 10px #f4f4f4; */
    margin: auto;
}
#enquiry-form label {
    font-family: 'Nunito Sans semi';
}
#enquiry-form input {
    height: 40px;
    background: #f6f6f6;
    border: 1px solid #ece9e9;
    font-family: 'Nunito Sans';
}
#enquiry-form textarea {
    background: #f6f6f6;
    border: 1px solid #ece9e9;
}
.enquiry-select select{word-wrap: normal;
    height: 35px;
    background: #f6f6f6;
    border: 1px solid #ece9e9;
    font-family: 'Nunito Sans';
    color: #3d3d3d;
    padding: 0px 10px;
}

.svg-pos img {
    position: absolute;
    bottom: -3%;
    right: -13%;
    width: 250px;
}

@media screen and (max-width:1280px){
    .contact-banner {
    background: #f3f3f5;
    /* background-image: url(../img/images/contact-banner.jpg); */
    padding-top: 130px;
    padding-bottom: 130px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 100px;
    width: 100%;
    height: auto;
    background-size: contain;
    }
    
    #enquiry-form {
    background: #fff;
    width: 70%;
    }
}

@media screen and (max-width:1024px){
    .svg-pos img {
    position: absolute;
    bottom: -2%;
    right: -9%;
    width: 250px;
    }
    #enquiry-form label {
    font-family: 'Nunito Sans semi';
    font-size: 15px;
    }
    .contact-banner {
    background: #ffffff;
    /* background-image: url(../img/images/contact-banner.jpg); */
    padding-top: 90px;
    padding-bottom: 90px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 100px;
    width: 100%;
    height: auto;
    background-size: contain;
    }
    #enquiry-form {
    width: 80%;
    }
}


@media screen and (max-width:768px){
    .svg-pos img {
      position: absolute;
      bottom: -2%;
      right: -9%;
      width: 200px;
    }
    .contact-banner {
    background: #ffffff;
    /* background-image: url(../img/images/contact-banner.jpg); */
    padding-top: 80px;
    padding-bottom: 80px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 100px;
    width: 100%;
    height: auto;
    background-size: contain;
    }
    .info-text {
    font-size: 15px;
    }
    #enquiry-form label {
    font-family: 'Nunito Sans semi';
    font-size: 14px;
    }
    #enquiry-form {
    width: 90%;
    }
    img#captcha_image {
    display: block;
    margin: auto;
    }
    

}   

@media screen and (max-width:680px){
    .svg-pos img {
    position: absolute;
    bottom: -2%;
    right: -9%;
    width: 200px;
    }
}

@media screen and (max-width:577px){
    .info-text {
    font-size: 14px;
    }
    .svg-pos img {
    position: unset;
    display: none;
    }
    .contact-banner {
    background: #f3f3f3;
    background-image: unset !important;
    padding-top: 60px;
    padding-bottom: 60px;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-position-y: 100px;
    width: 100%;
    height: auto;
    background-size: contain;
    }
}


/*career view*/
.test-message1 strong {
    font-size: 18px;
    color: #343434;
    margin-bottom: 20px !important;
}
.test-message1 p {
    font-size: 17px;
    font-family: 'inter-regular';
    color: #676767;
    margin-top: 20px;
    margin-left: unset !important;
}
.test-message1 li {
    font-family: 'inter-regular';
    font-size: 17px;
    color: #676767;
    padding-top: 3px;
}
.test-message1 ul {
    padding-left: 20px;
}
#career-form label {
    font-family: 'inter-regular';
    font-weight: 600;
}
#career-form .form-control {
    border: 2px solid #e0dddd;
    border-radius: 6px;
    height: 50px;
    font-family: 'Nunito Sans';
}
.career-form {
    background: #fff;
    /* width: 60%; */
    box-shadow: 1px 10px 18px 5px #ecececd1;
    /* box-shadow: 1px 1px 10px 10px #f4f4f4; */
    margin: auto;
    padding: 40px 40px !important;
}
.present-add {
    font-family: 'Montserrat-Regular !important';
    text-transform: uppercase;
    /*letter-spacing: 1px;*/
    /* background: #f5f6f9; */
    color: #ec8e5b;
}
.address-parent {
    background: #f5f6f9;
    padding: 8px 20px;
    margin: 20px 0px !important;
}
.career-form td {
    font-family: 'inter-regular' !important;
}
#career-form th {
    font-family: 'inter-regular';
    font-weight: 600;
    font-size: 17px;
}
.career-form h5 {
    font-family: 'inter-regular';
    margin-bottom: 30px;
}
#contact-sec #contact-form {
    padding: 20px 30px !important;
}

#contact-sec #contact-form label {
    padding-top: 10px !important;
    font-family: inter-regular;
}
#captcha input {
    width: 200px;
}

@media screen and (max-width: 1280px){
    #career-form label {
    font-family: 'inter-regular';
    font-weight: 600;
    font-size: 15px;
    }
    #career-form .form-control {
    height: 45px;
    }

}

@media screen and (max-width: 1024px){
    .career-form {
        padding: 30px 30px !important;
    }
}
@media screen and (max-width: 990px){
    .career-form {
    padding: 40px !important;
    }
}
@media screen and (max-width:577px){
    #captcha {
    text-align: center;
    }
    .career-form {
        padding: 30px 20px !important;
    }
    #career-form img#captcha_image {
    display: block;
    margin: auto;
    }
    #career-form th {
    font-family: 'inter-regular';
    font-weight: 600;
    font-size: 14px;
    }
    .career-form h5 {
    font-family: 'inter-regular';
    margin-bottom: 30px;
    font-size: 17px;
    }
    #career-form label {
    font-family: 'inter-regular';
    font-weight: 600;
    font-size: 14px;
    }
    #career-form .form-control {
    height: 40px;
    }
}
button.request-btn a {
    text-decoration: none;
    color: unset;
}


/* Flash messages */
.message {
    padding: 1rem;
    background: #eff8ff;
    color: #2779bd;
    border-color: #6cb2eb;
    border-width: 1px;
    border-style: solid;
    border-radius: 4px;
    font-size: 14px;
    padding: 0.4em;
    margin: 0.4em 1em;
}
.message.hidden {
    display: none;
}
.message.success {
    background: #e3fcec;
    color: #1f9d55;
    border-color: #51d88a;
}
.message.error {
    background: #fcebea;
    color: #cc1f1a;
    border-color: #ef5753;
}

.error{
    color: #ef5753;
}

/*servie accordion*/


#service-accordion .accordion-button:not(.collapsed)::after {
    background-image: url(../img/images/minus.png);
    transform: rotate(
-180deg);
}
#service-accordion .accordion-button::after {
    flex-shrink: 0;
    width: 1.25rem;
    height: 1.25rem;
    margin-left: auto;
    content: "";
    background-image: url(../img/images/plus.png);
    background-repeat: no-repeat;
    background-size: 1.25rem;
    transition: transform .2s ease-in-out;
}
#service-accordion .accordion-header {
    margin-bottom: 0;
    /*background: #0a1d37;*/
    /*border: 2px solid #e1e1e1;*/
    transition: all .15s ease-in-out;
    color: #fff;
}
#service-accordion .accordion-item {
    background-color: #ffffff;
    border: 1px solid #e2e2e2;
}
#service-accordion .accordion-button:not(.collapsed) {
    color: #fff !important;
    box-shadow: inset 0 -1px 0 rgb(0 0 0 / 13%);
    background: #101d31;
    /*border: 2px solid #101d31;*/
}
#service-accordion .accordion-flush .accordion-item .accordion-button {
    border-radius: 0;
    font-family: inter;
    color: #0a1d37;
}
#service-accordion .accordion-button a {
    color: unset;
    text-decoration: none;
    font-family: inter;
}
#service-accordion ul {
    padding-left: 0px;
    /* color: blue; */
}
label.box-title {
    font-family: 'Inter';
    font-size: 22px;
    color: #2b2b2b;
    margin-bottom: 0px;
}
.bg-layer {
    background: #101d31;
}

@media screen and (max-width:680px){
    #service-accordion .accordion-button a {
        color: unset;
        text-decoration: none;
        font-size: 15px;
        font-family: inter;
    }
}

@media screen and (max-width: 577px){
    #service-accordion .accordion-button a {
    color: unset;
    text-decoration: none;
    font-family: inter;
    font-size: 14px;
    }
    #service-accordion {
    padding: 30px !important;
    }

       
}

/*life3@syscom*/
.life-desc {
    font-family: 'Inter';
    line-height: 28px;
    /* margin-top: 20px; */
    font-size: 18px;
    color: #7e7a7a;
}
#team-building {
    background: url(../img/images/life-background.jpg);
    background-size: cover;
    background-attachment: fixed;
    background-position: center;
}
.bg-overlay {
    background: #0a1d37bf;
}
.fun-div {
    padding: 40px 100px 40px 40px;
}
.bg-fun{  background: #ebebeb;}

#life-section .bg-custom .sec-head {
    color: #fff;
}
#life-section .bg-custom .ab-sec-desc {
    color: #fff;
    opacity: 0.8;
}
#fun-images img {
    width: 100%;
}
#fun-images .activity-div {
    padding-left: 5px !important;
    padding-right: 5px !important;
    margin-top: 10px;
    position: relative;
}
.join_team h1 {
    font-family: Montserrat-ExtraBold;
    font-size: 70px;
    color: #323232;
    line-height: 70px;
    margin-bottom: 15px;
}
.join_team .read-btn {
    font-family: 'inter';
    font-size: 16px;
    font-weight: 600;
    background: #f6985b;
    border: unset;
    color: #fff;
    border-radius: 0px;
    padding: 13px 28px;
    /*letter-spacing: 0.5px;*/
}
.title-text {
    bottom: 0px;
    position: absolute;
    left: 20px;
    font-family: 'Montserrat-Extrabold';
    font-size: 16px;
    color: #fff;
}
#life-section .equal-div {
    overflow: hidden;
}
#life-section {
    justify-content: space-around;
}
#life-section .col-sm-8 {
    width: 69%;
}
#life-section .col-sm-4 {
    width: 29%;
}
#life-section .equal-div .img-fluid {
    max-width: 100%;
    height: 100%;
}

@media screen and (max-width:1280px){
    #life-section .equal-div .img-fluid {
    max-width: 100%;
    height: auto;
    }
    #life-section .col-sm-8 {
    width: 69%;
    display: flex;
    align-items: center;
    }
}

@media screen and (max-width:1100px){
    .join_team h1 {
    font-size: 60px;
    line-height: 60px;
    }
}


@media screen and (max-width:1024px){
#life-section .equal-div .img-fluid {
    max-width: unset !important;
    height: auto !important;
    width: 100%;
}

    
}

@media screen and (max-width:990px){
    #life-section .equal-div .img-fluid {
    max-width: unset !important;
    height: 100% !important;
    width: 120% !important;
    }
    .title-text {
    bottom: 0px;
    position: absolute;
    left: 10px;
    font-family: 'Montserrat-Extrabold';
    font-size: 14px;
    color: #fff;
    }
    
    .join_team .read-btn {
    font-size: 15px;
    padding: 11px 22px;
    }
}

@media screen and (max-width:850px){
    .join_team h1 {
    font-size: 40px;
    line-height: 40px;
    }
    .join_team .read-btn {
    font-size: 14px;
    padding: 10px 20px;
    }
    #life-section .equal-div .img-fluid {
    max-width: unset !important;
    height: 100% !important;
    width: 140% !important;
    }
}

@media screen and (max-width:768px){
    
    #life-section .equal-div .img-fluid {
    max-width: unset !important;
    height: auto !important;
    width: 100% !important;
    }
    
    .join_team .read-btn {
    font-size: 13px;
    padding: 10px 20px;
    }
    #life-section .col-sm-4 {
    width: 60%;
    }
    #life-section .col-sm-8 {
    width: 100%;
    display: flex;
    margin-top: 20px;
    align-items: center;
    }
}


@media screen and (max-width:577px){
    .pl-mobile{ padding-left: 5px !important;}
    .pr-mobile{ padding-right: 5px !important;}
    #fun-images {
    width: 95%;
    margin: auto !important;
    padding-top: 50px;
    }
    .join_team h1 {
    font-size: 60px;
    line-height: 60px;
    }
    .join_team{ margin-top: 30px;   }
    #life-section .col-sm-4 {
    width: 90%;
    }
    #life-section .equal-div .img-fluid {
    max-width: 100% !important;
    height: auto !important;
    width: auto;
    }
    #life-section .equal-div {
    overflow: hidden;
    height: unset !important;
    }
    .fun-div {
    padding: 30px;
    }
}
/*life3@syscom*/

.life-desc {
    font-family: 'Inter';
    line-height: 28px;
    /* margin-top: 20px; */
    font-size: 18px;
    color: #7e7a7a;
}

#team-building {
    background: url(../img/images/life-background.jpg);
    background-size: cover;
    background-attachment: fixed;
    background-position: center;
}

.bg-overlay {
    background: #0a1d37bf;
}

.fun-div {
    padding: 40px 100px 40px 40px;
}

.bg-fun {
    background: #ebebeb;
}

#life-section .bg-custom .sec-head {
    color: #fff;
}

#life-section .bg-custom .ab-sec-desc {
    color: #fff;
    opacity: 0.8;
}

#fun-images img {
    width: 100%;
}

#fun-images .activity-div {
    padding-left: 5px !important;
    padding-right: 5px !important;
    margin-top: 10px;
    position: relative;
}

.join_team h1 {
    font-family: Montserrat-ExtraBold;
    font-size: 70px;
    color: #323232;
    line-height: 70px;
    margin-bottom: 15px;
}

.join_team .read-btn {
    font-family: 'inter';
    font-size: 16px;
    font-weight: 600;
    background: #f6985b;
    border: unset;
    color: #fff;
    border-radius: 0px;
    padding: 13px 28px;
    /*letter-spacing: 0.5px;*/
}

.title-text {
    top: 10px;
    position: absolute;
    left: 20px;
    font-family: 'Montserrat-Extrabold';
    font-size: 16px;
    color: #fff;
    text-shadow: 2px 1px black;
}

#life-section .equal-div {
    overflow: hidden;
}

#life-section {
    justify-content: space-around;
}

#life-section .col-sm-8 {
    width: 69%;
}

#life-section .col-sm-4 {
    width: 29%;
}

#life-section .equal-div .img-fluid {
    max-width: 100%;
    height: 100%;
}

#fun-images .slick-dots {
    bottom: 10px !important;
    z-index: 5;
}

#fun-images .slick-dotted.slick-slider {
    margin-bottom: 0px;
    /*z-index: 3;*/
}

#fun-images ul.slick-dots li {
    background: transparent !important;
    border: 2px solid;
    /*color:#fff;*/
}

#fun-images ul.slick-dots li.slick-active {
    background: #f6985b !important;
    color: #f6985b;
    border-radius: 50%;
    margin-top: 20px;
}


@media screen and (max-width:1280px) {
    #life-section .equal-div .img-fluid {
        max-width: 100%;
        height: auto;
    }
    #life-section .col-sm-8 {
        width: 69%;
        display: flex;
        align-items: center;
    }
}

@media screen and (max-width:1100px) {
    .join_team h1 {
        font-size: 60px;
        line-height: 60px;
    }
}

@media screen and (max-width:1024px) {
    #life-section .equal-div .img-fluid {
        max-width: unset !important;
        height: auto !important;
        width: 100%;
    }
}

@media screen and (max-width:990px) {
    #life-section .equal-div .img-fluid {
        max-width: unset !important;
        height: 100% !important;
        width: 120% !important;
    }
    .title-text {
        bottom: 0px;
        position: absolute;
        left: 10px;
        font-family: 'Montserrat-Extrabold';
        font-size: 14px;
        color: #fff;
    }
    .join_team .read-btn {
        font-size: 15px;
        padding: 11px 22px;
    }
}

@media screen and (max-width:850px) {
    .join_team h1 {
        font-size: 40px;
        line-height: 40px;
    }
    .join_team .read-btn {
        font-size: 14px;
        padding: 10px 20px;
    }
    #life-section .equal-div .img-fluid {
        max-width: unset !important;
        height: 100% !important;
        width: 140% !important;
    }
}

@media screen and (max-width:768px) {
    #life-section .equal-div .img-fluid {
        max-width: unset !important;
        height: auto !important;
        width: 100% !important;
    }
    .join_team .read-btn {
        font-size: 13px;
        padding: 10px 20px;
    }
    #life-section .col-sm-4 {
        width: 60%;
    }
    #life-section .col-sm-8 {
        width: 100%;
        display: flex;
        margin-top: 20px;
        align-items: center;
    }
}

@media screen and (max-width:577px) {
    .pl-mobile {
        padding-left: 5px !important;
    }
    .pr-mobile {
        padding-right: 5px !important;
    }
    #fun-images {
        width: 95%;
        margin: auto !important;
        padding-top: 50px;
    }
    .join_team h1 {
        font-size: 60px;
        line-height: 60px;
    }
    .join_team {
        margin-top: 30px;
    }
    #life-section .col-sm-4 {
        width: 90%;
    }
    #life-section .equal-div .img-fluid {
        max-width: 100% !important;
        height: auto !important;
        width: auto;
    }
    #life-section .equal-div {
        overflow: hidden;
        height: unset !important;
    }
    .fun-div {
        padding: 30px;
    }
    .life-desc {
        font-size: 16px;
    }
}

===================================================================================================
/* Container Spacing */
#syscom-homepage .top-banner {
    padding-top: 50px;
    padding-bottom: 50px;
}

/* Badge & Tagline Flex Wrapper */
#syscom-homepage .badge-tagline-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-bottom: 20px;
}

/* Custom Years Badge Element */
#syscom-homepage .badge-years {
    background-color: #ec8e5b; /* Brand Orange Accent */
    color: #ffffff;
    padding: 6px 12px;
    border-radius: 20px;
    font-weight: bold;
    text-transform: uppercase;
    margin-right: 15px;
    display: inline-block;
}

/* Tagline Inline Text Context */
#syscom-homepage .tagline-text {
    color: #6c757d;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    /*letter-spacing: 1px;*/
}

/* Brand Accent Color Text Overrides */
#syscom-homepage .brand-accent-text {
    color: #ec8e5b !important;
}

/* Paragraph Layout Constraints */
#syscom-homepage .banner-description {
    font-size: 18px;
    line-height: 1.6;
    color: #495057;
    margin-top: 20px;
    margin-bottom: 35px;
}

/* CTA Navigation Action Wrapper */
#syscom-homepage .cta-actions-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

/* Primary Call To Action Button Style */
#syscom-homepage .primary-cta-btn {
    background-color: #ec8e5b; /* Brand Orange Accent */
    color: #ffffff !important;
    margin-right: 15px;
    display: inline-block;
    text-decoration: none;
    padding: 12px 12px;
    border-radius: 4px;
    font-weight: bold;
    transition: background-color 0.2s ease-in-out;
}

#syscom-homepage .primary-cta-btn:hover {
    background-color: #d67946; /* Slightly darker shade for interactive hover */
}

#syscom-homepage .arrow-icon {
    margin-left: 8px;
}

/* Secondary See Our Work Link Layout */
#syscom-homepage .secondary-cta-btn {
    display: inline-block;
    font-weight: bold;
    color: #212529 !important;
    text-decoration: none;
    border-bottom: 2px solid #212529;
    padding-bottom: 4px;
    transition: color 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

#syscom-homepage .secondary-cta-btn:hover {
    color: #ec8e5b !important;
    border-color: #ec8e5b;
}

/*=====================*/
.bg-orange {
    background-color:#ec8e5b !important;
}

.process-circle{
    width: 60px;
    height: 60px;
}

.bg-orange{
    background-color: #ec8e5b;
}


.badge{
    display: inline-block;
    padding: 12px 22px;
    border-radius: 50px;
    background-color: #ec8e5b;
    color: #fff;
    font-size: 32px;
    font-weight: 700;
    line-height: 1;
}

/*-------------FAQ------------------------*/
#faq-section{
    position: relative;
}

.faq-support-text{
    font-size: 18px;
    color: #6c757d;
    line-height: 1.8;
}

.custom-faq .faq-card{
    border: 0;
    border-radius: 24px !important;
    overflow: hidden;
    margin-bottom: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.06);
    background: #fff;
}

.custom-faq .accordion-button{
    padding: 28px 32px;
    font-size: 20px;
    font-weight: 400;
    line-height: 26px;
    color: #111;
    background: #fff;
    box-shadow: none !important;
    font-family: poppins;
}

.custom-faq .accordion-button:not(.collapsed){
    background: #fff;
    color: #ec8e5b;
}

.custom-faq .accordion-button:focus{
    box-shadow: none;
    border: 0;
}

.custom-faq .accordion-body{
    padding: 0 32px 30px;
    font-size: 15px;
    line-height: 1.9;
    color: #6c757d;
}

.custom-faq .accordion-button::after{
    background-size: 18px;
}

/*-------------------CONTACT-----------------------------*/
.contact-form-wrapper{
    background: #ffffff;
    border-radius: 30px;
    padding: 45px;
    border: 1px solid #efefef;
    box-shadow: 0 15px 50px rgba(0,0,0,0.06);
    position: relative;
    overflow: hidden;
}

.contact-form-wrapper::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 5px;
    background: #ec8e5b;
}

.contact-form-top{
    margin-bottom: 35px;
}

.form-badge{
    display: inline-block;
    background: rgba(236,142,91,0.12);
    color: #ec8e5b;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 18px;
    border-radius: 50px;
    /*letter-spacing: 0.5px;*/
    margin-bottom: 18px;
}

.contact-form-title{
    font-size: 38px;
    font-weight: 700;
    line-height: 1.2;
    color: #111;
    margin-bottom: 16px;
}

.contact-form-subtext{
    font-size: 17px;
    line-height: 1.8;
    color: #6c757d;
    max-width: 90%;
    margin-bottom: 0;
}

.contact-divider{
    width: 100%;
    height: 1px;
    background: #ececec;
    margin-bottom: 35px;
}

.contact-label{
    font-size: 14px;
    font-weight: 600;
    color: #111;
    margin-bottom: 10px;
    display: block;
}

.contact-input{
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 14px;
    min-height: 58px;
    padding: 14px 18px;
    font-size: 15px;
    color: #111;
    transition: all 0.3s ease;
    box-shadow: none !important;
}

.contact-input:focus{
    border-color: #ec8e5b;
    background: #fff;
}

.contact-textarea{
    min-height: 170px;
    resize: none;
    padding-top: 16px;
}

.contact-submit-btn{
    background: #ec8e5b;
    border: 0;
    color: #fff;
    padding: 16px 34px;
    border-radius: 14px;
    font-size: 15px;
    font-weight: 600;
    transition: all 0.3s ease;
}

.contact-submit-btn:hover{
    background: #d97843;
    transform: translateY(-2px);
}

@media(max-width:767px){

    .contact-form-wrapper{
        padding: 30px 22px;
    }

    .contact-form-title{
        font-size: 30px;
    }

    .contact-form-subtext{
        max-width: 100%;
        font-size: 16px;
    }

}

/*----------------------------------*/
#software-slides .slick-list{
    padding-bottom: 20px;
}

#software-slides .slick-track{
    display: flex !important;
}

#software-slides .slick-slide{
    height: inherit !important;
    display: flex !important;
}

#software-slides .slick-slide > div{
    width: 100%;
}

#software-slides .col{
    height: 100%;
}

#software-slides .card{
    height: 95%;
    display: flex;
    flex-direction: column;
}

#software-slides .primary-cta-btn{
    margin-top: auto;
}
/*-----------------------------------*/
.contact-cta-section{
    background: #f8f8f8;
}

.contact-cta-wrapper{
    background: #ffffff;
    border-radius: 30px;
    padding: 30px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.06);
}

.contact-cta-desc{
    font-size: 15px;
    line-height: 1.9;
    color: #5f5f5f;
}

.trust-box{
    display: flex;
    align-items: flex-start;
    gap: 15px;
}

.trust-icon{
    min-width: 30px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #ec8e5b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}

.trust-box p{
    margin-bottom: 0;
    color: #555;
    line-height: 1.7;
    font-size: 15px;
}

.contact-modal-card{
    background: #111827;
    padding: 40px 30px;
    border-radius: 28px;
    color: #fff;
    position: relative;
    overflow: hidden;
}

.contact-mini-title{
    color: #ec8e5b;
    font-weight: 500;
    /*letter-spacing: 1px;*/
    text-transform: uppercase;
    display: inline-block;
    margin-bottom: 15px;
    font-size: 12px;
}

.contact-modal-heading{
    font-size: 20px;
    line-height: 1.2;
    font-weight: 700;
    margin-bottom: 20px;
}

.contact-modal-text{
    color: rgba(255,255,255,0.75);
    line-height: 1.9;
    margin-bottom: 30px;
    font-size: 15px;
}

.contact-service-list{
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.contact-service-list span{
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.12);
    padding: 8px 14px;
    border-radius: 50px;
    font-size: 12px;
}

.contact-note{
    color: rgba(255,255,255,0.65);
    font-size: 14px;
}

@media screen and (max-width:991px){

    .contact-cta-wrapper{
        padding: 40px 25px;
    }

    .contact-modal-heading{
        font-size: 32px;
    }

}

/*-------------------------*/

.row .mx-0 .px-0 .mt-3 {
    background-color: #eff1f3;
}

.service-hero-desc {
    padding-right: 26%;
}


.hero-label-wrap1 {
    display: flex;
    justify-content: flex-start;
}

.badge-years1 {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    background: rgba(236, 142, 91, 0.08);
    border: 1px solid rgba(236, 142, 91, 0.25);
    border-radius: 60px;
    color: #df6f32;
    font-size: 14px;
    font-weight: 700;
    /*letter-spacing: 1px;*/
    text-transform: uppercase;
    line-height: 1;
}

.badge-years1::before {
    content: "";
    width: 10px;
    height: 10px;
    background-color: #ec8e5b;
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0 0 12px rgba(236, 142, 91, 0.5);
}

/*----------- Services ------------------------------*/

.why-us-section {
    /*padding: 100px 0;*/
    background: #f0f3f7;
}

.why-support-text {
    font-size: 15px;
    line-height: 1.8;
    color: #666;
    max-width: 500px;
}

.why-box {
    position: relative;
    padding: 35px;
    border-radius: 24px;
    background: #fff;
    border: 1px solid #ececec;
    transition: 0.3s;
    height: 100%;
}

.why-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 40px rgba(0,0,0,0.06);
}

.why-count {
    font-size: 50px;
    font-weight: 700;
    line-height: 1;
    color: rgba(236, 142, 91, 0.5);
    margin-bottom: 20px;
}

.why-box-title {
    font-size: 16px;
    font-family: poppins;
    font-weight: 400;
    /*line-height: 1.4;*/
    color: #0f172a;
    margin-bottom: 15px;
}

.why-box-text {
    font-size: 14px;
    line-height: 1.8;
    color: #666;
    margin-bottom: 0;
}

@media(max-width:991px){

    .why-us-section {
        padding: 70px 0;
    }

    .why-support-text {
        max-width: 100%;
    }
}

@media(max-width:767px){

    .why-box {
        padding: 28px;
    }

    .why-count {
        font-size: 48px;
    }

    .why-box-title {
        font-size: 20px;
    }
}

/*''''''''''''''''''''''''''''''''''*/
.services-section {
    padding: 100px 0;
    background: #f8f9fc;
}

.services-support-text {
    max-width: 760px;
    margin: auto;
    font-size: 15px;
    /*line-height: 1.9;*/
    color: #666;
    margin-top: 10px;
}

.service-modern-card {
    position: relative;
    background: #fff;
    border-radius: 24px;
    padding: 35px 30px;
    border: 1px solid #ececec;
    transition: 0.3s;
    overflow: hidden;
}

.service-modern-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 18px 50px rgba(0,0,0,0.08);
}

.service-modern-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: #ec8e5b;
}

.service-card-number {
    font-size: 54px;
    font-weight: 700;
    color: rgba(236, 142, 91, 0.15);
    line-height: 1;
    margin-bottom: 20px;
}

.service-modern-title {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.4;
    color: #111;
    margin-bottom: 18px;
}

.service-modern-text {
    font-size: 16px;
    line-height: 1.9;
    color: #666;
    margin-bottom: 30px;
}

.service-modern-link {
    font-size: 15px;
    font-weight: 600;
    color: #ec8e5b;
    text-decoration: none;
    transition: 0.3s;
}

.service-modern-link:hover {
    /*letter-spacing: 0.5px;*/
    color: #111;
}

@media(max-width:991px){

    .services-section {
        padding: 80px 0;
    }

    .service-modern-card {
        padding: 30px 25px;
    }

    .service-modern-title {
        font-size: 22px;
    }
}

@media(max-width:767px){

    .service-card-number {
        font-size: 44px;
    }

    .service-modern-title {
        font-size: 20px;
    }

    .service-modern-text {
        font-size: 15px;
    }
}

/*---------------------------------*/

.process-wrapper{
    position: relative;
    max-width: 1400px;
    margin: auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 35px;
}

.process-item{
    display: flex;
    gap: 28px;
    position: relative;
    margin-bottom: 0;
    height: 100%;
}

.process-left{
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}

.process-number-wrap{
    width: 70px;
    height: 70px;
    min-width: 70px;
    border-radius: 50%;
    background: linear-gradient(135deg, #ec8e5b 0%, #ffb088 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 20px 45px rgba(236,142,91,.25);
    position: relative;
    z-index: 2;
    transition: .35s ease;
}

.process-number{
    font-size: 25px;
    font-weight: 600;
    color: #fff;
    line-height: 1;
}

.process-line{
    width: 2px;
    flex: 1;
    background: linear-gradient(to bottom, #ec8e5b 0%, rgba(236,142,91,.08) 100%);
    margin-top: 12px;
}

.process-content{
    flex: 1;
}

.process-card{
    background: #fff;
    border-radius: 30px;
    padding: 30px;
    position: relative;
    overflow: hidden;
    border: 1px solid #f1f1f1;
    transition: all .35s ease;
    box-shadow: 0 15px 45px rgba(0,0,0,.04);
    height: 100%;
}

.process-card::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    height: 6px;
    background: #ec8e5b;
    transition: .4s ease;
}

.process-item:hover .process-card::before{
    width: 100%;
}

.process-item:hover .process-card{
    transform: translateY(-10px);
    box-shadow: 0 35px 75px rgba(0,0,0,.08);
}

.process-item:hover .process-number-wrap{
    transform: scale(1.08);
}

.process-label{
    display: inline-block;
    background: rgba(236,142,91,.12);
    color: #d65813;
    padding: 10px 18px;
    border-radius: 60px;
    font-size: 12px;
    font-weight: 500;
    /*letter-spacing: .5px;*/
    margin-bottom: 20px;
    text-transform: uppercase;
}

.process-title{
    /*font-size: 34px;*/
    font-size: 20px;
    font-weight: 700;
    color: #111;
    margin-bottom: 18px;
    line-height: 1.2;
}

.process-description{
    color: #6a6a6a;
    font-size: 15px;
    line-height: 1.95;
    margin-bottom: 0;
}

.last-process-item{
    margin-bottom: 0;
}

@media(max-width:991px){

    .process-wrapper{
        grid-template-columns: 1fr;
    }

    .process-card{
        padding: 34px;
    }

    .process-title{
        font-size: 28px;
    }

}

@media(max-width:767px){

    .process-item{
        flex-direction: column;
        gap: 20px;
    }

    .process-left{
        flex-direction: row;
    }

    .process-line{
        display: none;
    }

    .process-number-wrap{
        width: 75px;
        height: 75px;
        min-width: 75px;
    }

    .process-number{
        font-size: 26px;
    }

    .process-card{
        padding: 28px 24px;
        border-radius: 24px;
    }

    .process-title{
        font-size: 24px;
    }

}

/*----------------------------*/
.final-cta-section{
    background:
        radial-gradient(circle at top left, rgba(236,142,91,.08), transparent 30%),
        radial-gradient(circle at bottom right, rgba(236,142,91,.05), transparent 30%),
        #f7f8fc;
    overflow: hidden;
    position: relative;
}

.cta-main-wrapper{
    background: #fff;
    border-radius: 40px;
    padding: 70px;
    position: relative;
    overflow: hidden;
    box-shadow: 0 35px 90px rgba(0,0,0,.06);
}

.cta-main-wrapper::before{
    content: "";
    position: absolute;
    top: -120px;
    right: -120px;
    width: 320px;
    height: 320px;
    border-radius: 50%;
    background: rgba(236,142,91,.08);
}

.cta-label{
    display: inline-block;
    background: rgba(236,142,91,.12);
    color: #ec8e5b;
    padding: 12px 20px;
    border-radius: 60px;
    font-size: 13px;
    font-weight: 700;
    /*letter-spacing: .6px;*/
    text-transform: uppercase;
    margin-bottom: 24px;
}

.cta-heading{
    font-size: 56px;
    font-weight: 800;
    line-height: 1.18;
    color: #111;
    margin-bottom: 28px;
}

.cta-heading span{
    display: block;
}

.cta-description{
    font-size: 17px;
    line-height: 2;
    color: #6b6b6b;
    margin-bottom: 45px;
    max-width: 90%;
}

.cta-trust-grid{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 22px;
}

.trust-item{
    display: flex;
    gap: 16px;
    align-items: flex-start;
    background: #fff7f3;
    padding: 22px;
    border-radius: 22px;
    transition: .35s ease;
}

.trust-item:hover{
    transform: translateY(-6px);
    box-shadow: 0 20px 40px rgba(236,142,91,.12);
}

.trust-icon{
    width: 30px;
    height: 30px;
    min-width: 30px;
    border-radius: 50%;
    background: #ec8e5b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
}

.trust-item p{
    margin: 0;
    color: #444;
    line-height: 1.7;
    font-size: 15px;
    font-weight: 500;
}

.consultation-form-box{
    background: #111;
    border-radius: 35px;
    padding: 50px;
    position: relative;
    overflow: hidden;
}

.form-glow{
    position: absolute;
    top: -100px;
    right: -100px;
    width: 250px;
    height: 250px;
    background: rgba(236,142,91,.15);
    border-radius: 50%;
    filter: blur(20px);
}

.consultation-title{
    color: #fff;
    font-size: 36px;
    font-weight: 800;
    margin-bottom: 40px;
    position: relative;
    z-index: 2;
}

.custom-input,
.custom-select,
.custom-textarea{
    background: rgba(255,255,255,.06);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    height: 62px;
    color: #fff;
    padding: 18px 22px;
    font-size: 15px;
    transition: .3s ease;
}

.custom-textarea{
    height: auto;
    resize: none;
    padding-top: 24px;
}

.custom-input:focus,
.custom-select:focus,
.custom-textarea:focus{
    background: rgba(255,255,255,.08);
    border-color: #ec8e5b;
    box-shadow: none;
    color: #fff;
}

.custom-select option{
    color: #111;
}

.floating-group{
    position: relative;
}

.floating-group label{
    position: absolute;
    left: 22px;
    top: 18px;
    color: rgba(255,255,255,.55);
    transition: .3s ease;
    pointer-events: none;
    font-size: 15px;
}

.custom-input:focus + label,
.custom-input:valid + label,
.custom-textarea:focus + label,
.custom-textarea:valid + label{
    top: -10px;
    left: 18px;
    background: #111;
    padding: 0 8px;
    font-size: 12px;
    color: #ec8e5b;
}

.cta-submit-btn{
    border: none;
    background: linear-gradient(135deg, #ec8e5b 0%, #ffb088 100%);
    color: #fff;
    width: 100%;
    height: 64px;
    border-radius: 18px;
    font-size: 16px;
    font-weight: 700;
    transition: .35s ease;
}

.cta-submit-btn:hover{
    transform: translateY(-4px);
    box-shadow: 0 20px 45px rgba(236,142,91,.25);
}

.response-note{
    color: rgba(255,255,255,.55);
    text-align: center;
    margin-top: 18px;
    margin-bottom: 0;
    font-size: 14px;
}

@media(max-width:1199px){

    .cta-heading{
        font-size: 46px;
    }

    .cta-main-wrapper{
        padding: 50px;
    }

}

@media(max-width:991px){

    .cta-heading{
        font-size: 40px;
    }

    .cta-description{
        max-width: 100%;
    }

    .cta-trust-grid{
        grid-template-columns: 1fr;
    }

    .consultation-form-box{
        margin-top: 20px;
    }

}

@media(max-width:767px){

    .cta-main-wrapper{
        padding: 28px;
        border-radius: 28px;
    }

    .cta-heading{
        font-size: 32px;
    }

    .consultation-form-box{
        padding: 30px 24px;
        border-radius: 28px;
    }

    .consultation-title{
        font-size: 28px;
    }

}

/*==================--services/web-design--======================*/

.why-syscom-section{
    background:#f7f8fc;
    overflow:hidden;
}

/* Heading */

.why-tag{
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    line-height: 1.2;
    color: var(--orange-glow);
    background: rgba(255, 96, 46, 0.08);
    padding: 6px 14px;
    border-radius: 50px;
    border: 1px solid rgba(255, 96, 46, 0.12);
    margin-bottom: 18px;
    font-family: poppins;
}

.why-heading{
    font-size: 22px;
    line-height: 26px;
    font-family: poppins;
    font-weight:500;
    color:#111827;
    margin-bottom:22px;
}

.why-description{
    font-size: 15px;
    line-height: 23px;
    font-weight: 400;
    color:#6b7280;
    max-width:850px;
    margin:auto;
}

/* Cards */

.why-card{
    position:relative;
    padding:40px 30px;
    background:#ffffff;
    border-radius:28px;
    border:1px solid #eceef5;
    transition:all 0.35s ease;
    overflow:hidden;
    z-index:1;
}

.why-card::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,#ffffff 0%,#fff7f2 100%);
    opacity:0;
    transition:0.4s ease;
    z-index:-1;
}

.why-card:hover{
    transform:translateY(-10px);
    box-shadow:0 25px 60px rgba(17,24,39,0.08);
    border-color:#ffd9c5;
}

.why-card:hover::before{
    opacity:1;
}

.why-number{
    width:50px;
    height:50px;
    border-radius:50%;
    background:#ec8e5b;
    color:#ffffff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    font-weight:700;
    margin-bottom:30px;
    box-shadow:0 12px 30px rgba(236,142,91,0.25);
}

.why-card-title{
    font-size:20px;
    font-weight:500;
    color:#111827;
    line-height: 24px;
    margin-bottom:18px;
}

.why-card-text{
    font-size:15px;
    line-height: 29px;
    font-weight: 400;
    color:#6b7280;
    margin-bottom:0;
}

/* Responsive */

@media(max-width:991px){

    .why-heading{
        font-size:40px;
    }

    .why-card{
        padding:35px 28px;
    }

}

@media(max-width:767px){

    .why-heading{
        font-size:32px;
    }

    .why-description{
        font-size:16px;
        line-height:1.7;
    }

    .why-card-title{
        font-size:22px;
    }

}

/*----------section 2----------------*/

.included-features-section{
    background:#ffffff;
}


.included-label{
    display:inline-block;
    padding:8px 18px;
    background:#fff4ee;
    color:#ec8e5b;
    border-radius:50px;
    font-size:14px;
    font-weight:600;
    margin-bottom:20px;
}

.included-heading{
    font-size:34px;
    line-height:1.15;
    font-weight:700;
    color:#111827;
    margin-bottom:0;
}

.included-description{
    font-size:17px;
    line-height:1.9;
    color:#6b7280;
}


.included-wrapper{
    border-top:1px solid #ececec;
}

.included-item{
    display:flex;
    gap:50px;
    padding:30px 0;
    border-bottom:1px solid #ececec;
    transition:0.3s ease;
}

.included-item:hover{
    padding-left:15px;
}

.included-left{
    min-width:120px;
}

.included-count{
    font-size: 50px;
    font-weight: 700;
    line-height: 1;
    color: rgba(236, 142, 91, 0.5);
    margin-bottom: 20px;
}

.included-right{
    max-width:850px;
}

.included-title{
    font-size: 16px;
    font-family: poppins;
    font-weight: 400;
    /*line-height: 1.4;*/
    color: #0f172a;
    margin-bottom: 15px;
}

.included-text{
    font-size: 14px;
    line-height: 1.8;
    color: #666;
    margin-bottom: 0;
}


@media(max-width:991px){

    .included-heading{
        font-size:40px;
    }

    .included-item{
        gap:30px;
    }

    .included-title{
        font-size:24px;
    }

}

@media(max-width:767px){

    .included-heading{
        font-size:32px;
    }

    .included-item{
        flex-direction:column;
        gap:18px;
        padding:30px 0;
    }

    .included-count{
        font-size:42px;
    }

    .included-title{
        font-size:22px;
    }

    .included-text{
        font-size:15px;
        line-height:1.8;
    }

}
/*---------------Section 3---------------------------------*/

:root {
    --bg-dark-canvas: #090b11;
    --surface-bento: #121622;
    --surface-bento-hover: #181e2e;
    --accent-orange: #ff602e;
    --text-primary: #ffffff;
    --text-secondary: #94a3b8;
    --border-card: rgba(255, 255, 255, 0.06);
    --border-card-hover: rgba(255, 96, 46, 0.25);
}

.premium-services-grid-section {
    background-color: var(--bg-dark-canvas);
    color: var(--text-primary);
    font-family: 'Plus Jakarta Sans', sans-serif;
    padding: 100px 0;
}

/* --- Typography & Header Section --- */
.creative-tag-label {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    line-height: 13px;
    text-transform: uppercase;
    /*letter-spacing: 2px;*/
    color: var(--accent-orange);
    margin-bottom: 16px;
    background: rgba(255, 96, 46, 0.1);
    padding: 6px 16px;
    border-radius: 100px;
    border: 1px solid rgba(255, 96, 46, 0.15);
    font-family: poppins;
}

.creative-main-heading {
    font-size: 22px;
    font-weight: 500;
    /*letter-spacing: -1.5px;*/
    color: var(--text-primary);
}

.creative-sub-support {
    font-size: 15px;
    line-height: 23px;
    color: var(--text-secondary);
}

/* --- Bento Grid Engine System --- */
.bento-services-masonry {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 60px;
}

.bento-service-card {
    background: var(--surface-bento);
    border: 1px solid var(--border-card);
    border-radius: 24px;
    padding: 25px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 270px;
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
}

/* Specific Asymmetrical Layout Logic */
.card-featured-wide {
    grid-column: span 2;
}

.card-meta-header {
    margin-bottom: 24px;
}

/* Luxury Icon container */
.service-icon-box {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.03);
    border: 1px solid rgba(255, 255, 255, 0.05);
    color: var(--text-secondary);
    transition: all 0.3s ease;
}

.card-content-mid {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.card-title-text {
    font-size: 20px;
    font-weight: 700;
    /*letter-spacing: -0.5px;*/
    color: var(--text-primary);
    margin-bottom: 12px;
    line-height: 24px;
}

.card-description-paragraph {
    font-size: 15px;
    line-height: 29px;
    font-weight: 400;
    color: var(--text-secondary);
    margin-bottom: 24px;
}

/* Internal Micro CTA Styling */
/*.card-action-footer {
    margin-top: auto;
    padding-top: 12px;
}*/

.card-internal-anchor {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none !important;
    color: var(--text-primary);
    font-size: 13px;
    font-weight: 600;
    transition: color 0.3s ease;
}

.anchor-icon-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

/* --- Interactive Dynamics --- */
.bento-service-card:hover {
    transform: translateY(-6px);
    background: var(--surface-bento-hover);
    border-color: var(--border-card-hover);
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25), 0 0 1px 1px var(--border-card-hover) inset;
}

.bento-service-card:hover .service-icon-box {
    background: rgba(255, 96, 46, 0.1);
    border-color: rgba(255, 96, 46, 0.2);
    color: var(--accent-orange);
}

.bento-service-card:hover .card-internal-anchor {
    color: var(--accent-orange);
}

.bento-service-card:hover .anchor-icon-arrow {
    transform: translateX(6px);
}

/* --- Balanced Mobile/Tablet Adjustments --- */
@media(max-width: 1200px) {
    .bento-services-masonry {
        grid-template-columns: repeat(2, 1fr);
    }
    .card-featured-wide {
        grid-column: span 2;
    }
}

@media(max-width: 991px) {
    .creative-main-heading {
        font-size: 36px;
    }
    .bento-services-masonry {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .card-featured-wide {
        grid-column: span 1;
    }
    .bento-service-card {
        min-height: auto;
        padding: 30px;
    }
}

@media(max-width: 575px) {
    .creative-main-heading {
        font-size: 28px;
    }
    .premium-services-grid-section {
        padding: 60px 0;
    }
}

/*----------------- section 4 ----------------------------*/

/* Added styling constraints for the newly inserted image layer */
.anchor-image-wrapper img {
    width: 100%;
    max-height: 240px;
    object-fit: cover;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

:root {
    --matrix-bg: #ffffff;
    --matrix-dark-panel: #090d16;
    --matrix-accent: #2563eb;
    --matrix-border: #e2e8f0;
    --text-slate-dark: #0f172a;
    --text-slate-muted: #475569;
}

.matrix-split-section {
    background-color: #f8fafc;
    font-family: 'Plus Jakarta Sans', sans-serif;
}

/* Master Outer Container Box */
.matrix-wrapper-box {
    border: 1px solid var(--matrix-border);
    background: var(--matrix-bg);
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 10px 30px -10px rgba(0,0,0,0.04);
}

/* --- Left Main Panel Style --- */
.matrix-anchor-panel {
    background: var(--matrix-dark-panel);
    color: #ffffff;
    position: relative;
}

.matrix-tag {
    font-size: 11px;
    font-weight: 700;
    /*letter-spacing: 2px;*/
    color: var(--matrix-accent);
    background: rgba(37, 99, 235, 0.15);
    padding: 6px 12px;
    border-radius: 6px;
    display: inline-block;
}

.matrix-main-title {
    font-size: 22px;
    font-weight: 500;
    /*letter-spacing: -1.5px;*/
    line-height: 26px;
}

.matrix-lead-text {
    font-size: 14px;
    line-height: 21px;
    font-weight: 400;
}

/* --- Right Grid Cells Architecture --- */
.data-cell-block {
    background: var(--matrix-bg);
    transition: background-color 0.3s ease;
}

/* Grid Border Systems using clean single-lines instead of stacked cards */
.cell-border-bottom {
    border-bottom: 1px solid var(--matrix-border);
}

.cell-border-right {
    border-right: 1px solid var(--matrix-border);
}

.cell-meta {
    display: flex;
    align-items: center;
}

.cell-scope {
    font-size: 11px;
    font-weight: 600;
    color: #ec8e5b;
    text-transform: uppercase;
    /*letter-spacing: 1px;*/
}

.cell-heading {
    font-size: 16px;
    font-weight: 400;
    color: var(--text-slate-dark);
    line-height: 19px;
    /*letter-spacing: -0.5px;*/
    margin-bottom: 12px;
    font-family: poppins;
}

.cell-text {
    font-size: 14px;
    color: var(--text-slate-muted);
    line-height: 25px;
    font-weight: 400;
    margin: 0;
}

/* Terminal Accent Block styling */
.cell-accent-block {
    background: var(--matrix-accent);
    color: #ffffff;
}

/* --- Hover Micro-Dynamics --- */
.data-cell-block:not(.cell-accent-block):hover {
    background: #f8fafc;
}

/* --- Responsive Layout Switches --- */
@media (max-width: 991px) {
    .cell-border-right {
        border-right: none;
    }
    .matrix-main-title {
        font-size: 30px;
    }
    /* Enforce separation on vertical layouts */
    .matrix-data-grid .row > div:not(:last-child) {
        border-bottom: 1px solid var(--matrix-border);
    }
}

/*-----------------section 5 ---------------------*/

:root {
    --neutral-dark: #0f172a;
    --neutral-muted: #64748b;
    --orange-glow: #ff602e;
    --indigo-glow: #4f46e5;
    --teal-glow: #0ea5e9;
    --pink-glow: #d946ef;
}

.related-services-section {
    background-color: #fafbfe;
    font-family: 'Plus Jakarta Sans', sans-serif;
    color: var(--neutral-dark);
}

/* --- Centered Section Header Style System --- */
.sec-title {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    line-height: 1.2;
    color: var(--orange-glow);
    background: rgba(255, 96, 46, 0.08);
    padding: 6px 14px;
    border-radius: 50px;
    border: 1px solid rgba(255, 96, 46, 0.12);
    margin-bottom: 18px;
}

.sec-head {
    /*font-size: 38px;
    font-weight: 800;*/
    font-size: 22px;
    font-weight: 500;
    /*letter-spacing: -1.5px;*/
    line-height: 1.2;
    color: var(--neutral-dark);
}

.head-border {
    width: 60px;
    height: 3px;
    background: var(--orange-glow);
    border: none;
    opacity: 1;
    border-radius: 2px;
}

.faq-support-text {
    font-size: 15px;
    color: var(--neutral-muted);
    line-height: 23px;
    font-weight: 400;
    max-width: 620px;
    margin: auto;
    margin-top: 10px;
}

/* --- Premium Card Structural Block --- */
.service-premium-card {
    background: #ffffff;
    border: 1px solid rgba(15, 23, 42, 0.04);
    border-radius: 24px;
    box-shadow: 0 10px 30px -10px rgba(15, 23, 42, 0.02);
    transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.service-card-title {
    font-size: 20px;
    font-weight: 500;
    font-family: poppins;
    /*letter-spacing: -0.5px;*/
    line-height: 24px;
}

.service-card-description {
    font-size: 15px;
    color: var(--neutral-muted);
    line-height: 1.6;
}

/* Custom Icon Geometric Adapters */
.service-icon-wrapper {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.service-icon-wrapper svg {
    width: 22px;
    height: 22px;
}

/* Individual Color Layer Accents */
.dev-accent { color: var(--orange-glow); background: rgba(255, 96, 46, 0.08); }
.ecom-accent { color: var(--indigo-glow); background: rgba(79, 70, 229, 0.08); }
.cms-accent { color: var(--teal-glow); background: rgba(14, 165, 233, 0.08); }
.app-accent { color: var(--pink-glow); background: rgba(217, 70, 239, 0.08); }

/* Interactive Typography Links */
.service-action-link {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--neutral-dark);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    transition: color 0.25s ease;
}

.arrow-move {
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Kinetic Interface Triggers */
.service-premium-card:hover {
    transform: translateY(-6px);
    border-color: rgba(15, 23, 42, 0.08);
    box-shadow: 0 25px 50px -20px rgba(15, 23, 42, 0.08);
}

.service-premium-card:hover .service-action-link {
    color: var(--orange-glow);
}

.service-premium-card:hover .arrow-move {
    transform: translateX(4px);
}

/* Mobile Alignment Cleaners */
@media (max-width: 991px) {
    .sec-head {
        font-size: 30px;
    }
}

.img-fluid{
    max-width: 70% !important;
}

.product-image{
    justify-content: center;
    display: flex;
    align-items: center;
}