/* DETAILS
==================================================
	Theme Name: 
==================================================
*/

@charset "utf-8";

/*..............embedded fonts..............*/
/*  */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
/*..............embedded fonts..............*/
/*..............custom fonts..............*/
/*..............custom fonts..............*/


:root {
  /* General Transitions */
  --transition-common: all 0.4s ease;

  /* Colors */
  --color-accent: #349CD7;
  --rgb-accent: 230, 57, 70;
  --color-primary: #333333;
  --color-secondary: #04C7F4;
  --color-tertiary: #737373;
  /* 3rd */
  --color-quaternary: #272A4B;
  /* 4th */
  --color-quinary: #231F20;
  /* 5th */
  /* --color-senary: #284495; 
    --color-octonary: #284495;
    --color-nonary: #284495; 
    --color-denary: #284495;  */
  --color-white: #fff;
  --color-black: #000;

  /* Font Settings */
  --ff-base: "Poppins", sans-serif;
  --ff-awesome: "Font Awesome 6 Free";
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  /* Font Sizes */
  --f-size-XXL: clamp(2.1875rem, 1.3058rem + 2.4535vw, 4.25rem);
  /* 68px-38px */
  --f-size-XL: clamp(1.875rem, 1.3941rem + 1.3383vw, 3rem);
  /* 48px-32px */
  --f-size-L: clamp(1.625rem, 1.3578rem + 0.7435vw, 2.25rem);
  /* 30px-20px */
  --f-size-M: clamp(1.19rem, 0.80rem + 0.658vw, 1.5rem);
  /* 24px-20px */
  --f-size-S: clamp(1.375rem, 1.3216rem + 0.1487vw, 1.5rem);
  /*20px-18px*/
  --f-size-XS: clamp(1rem, 0.9466rem + 0.1487vw, 1.125rem);
  /*20px-18px*/
  --f-size-Body: 18px;
  /*18px-16px*/

  /* Layout Adjustments */
  --margin-title: 0 0 24px 0;
  --margin-paragraph: 0 0 24px 0;
  --gap-50: 50px;
  --gap-40: 40px;
  --border-radius-image: 10px;
  --padding-height: clamp(60px, 7.563vw, 100px);
  --btn-gradient: linear-gradient(97.65deg, #42A7FF 3.81%, #4C6CCF 103.35%);

  /* Form Styling */
  --form-height: 50px;
  --form-font-color: #777;
  --form-placeholder-color: #999999;
  --form-border-radious: 8px;
  --form-holder-bg: #f3f3f3;
}


/*..............common styles..............*/
html { overflow-x: hidden; }
body { margin: 0; padding: 0; font-family: var(--ff-base); font-size: var(--f-size-Body); /*18px-16px*/ font-weight: var(--fw-regular); color: var(--color-primary); overflow-x: hidden; }
h1, h2, h3, h4, h5, h6 { margin: var(--margin-title); padding: 0; font-family: var(--ff-base); font-weight: var(--fw-semibold); line-height: 1.25; }
h1 { font-size: var(--f-size-XXL); /* 68px-35px */ }
h2 { font-size: var(--f-size-XL); /* 48px-30px */ color: var(--color-quaternary); }
h3 { font-size: var(--f-size-L); /* 36px-26px */ }
h4 { font-size: var(--f-size-M); /* 14px-19px */ }
h5 { font-size: var(--f-size-S); /*24px-22px*/ }
h6 { font-size: var(--f-size-XS); /*18px-16px*/ }
:is(h1, h2, h3, h4, h5, h6):last-child { margin-bottom: 0; }

p { color: var(--color-tertiary); margin: var(--margin-paragraph); line-height: 1.45; }
p:last-child { margin-bottom: 0; }
p strong { font-weight: 600; }
img { max-width: 100%; user-select: none; -webkit-user-drag: none; }
figure { margin: 0; }
a, img { border: 0; text-decoration: none; outline: none; }
a, a:link, a:visited, a:focus, a:hover { color: var(--color-accent); outline: none; text-decoration: none; transition: var(--transition-common); }
a:hover { text-decoration: none; }
ul { padding: 0; margin: 0; list-style: none; }
.form-row { margin-bottom: 24px; }
input, textarea, select, .form-control { font-weight: 300; outline: none; background-color: transparent !important; font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem) !important; color: #1E3466 !important; }

input[type="submit"] { font-weight: 300; transition: var(--transition-common); outline: none; color: var(--bs-white) !important; font-weight: var(--fw-medium); border: 0; }
input[type="submit"]:hover, .btn:hover input[type="submit"] { color: #4C6CCF !important; }
input:not([type="submit"]) { height: 56px !important; }


select { appearance: none; -webkit-appearance: none; height: 56px !important; padding-right: 40px !important; background-image: url(../images/btm-arrow.svg); background-repeat: no-repeat; background-position: 96% center; background-size: 12px; }
input.form-control, textarea.form-control, select.form-control {border: 1px solid #C2E1EE !important; border-radius: 8px !important; box-shadow: none !important; resize: none; background-color: #E8F8FF !important; padding: 14px 16px !important; color: #999999 !important; }
textarea.form-control { height: 142px !important; border-radius: 8px !important; }
input.form-control, select.form-control { border-radius: 100px; }
form label { transition: all 0.4s; }

input[type="checkbox"] { width: 18px; height: 18px !important; border: 1px solid #4D141F !important; border-radius: 3px !important; }
label.form-check-label { font-size: clamp(0.875rem, 0.76rem + 0.308vw, 1.125rem); margin-bottom: 0 !important; }
.form-check-input:checked[type=checkbox] { background-color: #4D141F !important; }
::placeholder { color: #90ACB8 !important; opacity: 1; display: none; }
::-ms-input-placeholder { color: #90ACB8 !important; display: none; }
textarea.form-control::placeholder { color: #90ACB8 !important; display: none; }


input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-box-shadow: 0 0 0px 1000px transparent inset !important; -webkit-text-fill-color: #000 !important; transition: background-color 9999s ease-out, color 9999s ease-out; transition-delay: 9999s; }

/*CF7*/
form .labelanime label { background-color: #fffaf1; transform: translateY(-8px) translateX(14px); height: auto; line-height: 1; font-size: 16px; color: #999999; }
span.wpcf7-spinner.spinner-border.spinner-border-sm.ajax-loader { position: absolute; /*top: 23px;*/ left: unset; right: 15px; bottom: 37%; width: 15px; min-width: 15px; height: 15px; z-index: 2; max-height: 20px; max-width: 20px; border: 1px solid #ffffff; opacity: 1 !important; background-color: transparent !important; border-right-color: #00000000 !important; display: unset; transform: unset; }
span.wpcf7-spinner.spinner-border.spinner-border-sm.ajax-loader::before { display: none; }


/* --- only use for wordpress (Image alignment) --- */
.alignleft, .alignnone { float: left; margin: 0 15px 10px 0; }
.alignright { float: right; margin: 0 0 10px 15px; }
.aligncenter { margin: 10px auto; display: block; }
.grecaptcha-badge { visibility: hidden; }

/* --- only use for wordpress (Image alignment) --- */


/* Utility Classes */
.common-blue-bg { background: linear-gradient(90.08deg, #3565DC 0.08%, #34A2FF 30.47%, #34A2FF 42.86%, #3C85F1 73.84%, #4F79E2 99.33%); } 
.common-blue-bg h2, .common-blue-bg p, .common-blue-bg h6.subtitle { color: var(--bs-white); }

.light-bg { background-color: #F5F7FF !important; }
.padding-common { padding: var(--padding-height) 0; }

.mt-20 { margin-top: 20px !important; }
.mt-40 { margin-top: 40px !important; }
.mt-32 { margin-top: 32px !important; }
.mt-24 { margin-top: 24px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-40 { margin-bottom: 40px !important; }
.mb-32 { margin-bottom: 32px !important; }
.mb-24 { margin-bottom: 24px !important; }


.rounded-corner-8 { border-radius: 8px !important;}
.rounded-corner-15 { border-radius: 15px !important;}
.background-cover { background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; }
.overlay-content { position: relative; z-index: 3; }
.responsive-image-wrapper { position: relative; overflow: hidden; }
.responsive-image-wrapper img { display: block; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;  }
.sub-title { display: inline-block; padding: 10px 16px 10px 36px; background: var(--color-white); border: 2px solid #E6ECFF; border-radius: 100px; color: var(--color-tertiary); font-weight: var(--fw-medium); text-transform: uppercase; position: relative; isolation: isolate; }
.sub-title::before { content: ""; width: 12px; height: 12px; background: linear-gradient(142.47deg, #AF5CFD 17.01%, #852FD5 94.57%); border-radius: 50%; position: absolute; z-index: 1; top: 16px; left: 16px; animation: zoom-dot 2s infinite ease-in-out; }
.mt-50 { margin-top: var(--gap-50); }
.mb-50 { margin-bottom: var(--gap-50); }
.fade-bg { background: #F5F8FF; }
.overlay-content { position: relative; z-index: 3; }
.text-gradient { background: linear-gradient(90deg, #349CD7 0%, #AF5CFD 100%); color: transparent; background-clip: text; }
.link-border-box a { background-image: linear-gradient(#cf303000 95%, #d6644b 0, #d6644b); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; }
.link-border-box a:hover { background-position-x: right; background-position-y: bottom; background-size: 100% 100%; }
.link-border-box.white-border-box a { background-image: linear-gradient(#cf303000 95%, #ffffff 0, #ffffff); background-position-y: bottom; background-repeat: no-repeat; background-size: 0 100%; text-decoration: none; transition: background-size .3s cubic-bezier(.79, .01, .22, .99) 0s, background-position 0s step-end .3s, color .3s; }
.link-border-box.white-border-box a:hover { background-position-x: right; background-position-y: bottom; background-size: 100% 100%; }

@media only screen and (min-width: 1600px) {
  .container { max-width: 1440px; }
}

/* --- Button Styles --- */
.btn, a.btn { display: inline-block; border: 0; border-radius: 10px; padding: 14px 70px 14px 35px; font-size: var(--f-size-Body); font-weight: var(--fw-medium); color: var(--color-white); cursor: pointer; overflow: hidden; position: relative; z-index: 1; transition: var(--transition-common); -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); background: linear-gradient(97.65deg, #42A7FF 3.81%, #4C6CCF 103.35%); isolation: isolate; gap: 16px; border: 1px solid transparent; text-transform: capitalize;  box-shadow: 0px -4px 4px 0px #00000033 inset; }
span.button-arrow { width: 40px; height: 40px; background-color: var(--bs-white); border-radius: 6px; display: flex; align-items: center; justify-content: center; position: absolute; right: 8px;top: 50%;
transform: translateY(-50%); z-index: 2; }
.btn:hover, a.btn:hover { color: #4C6CCF !important; border: 1px solid #4C6CCF; }
span.button-arrow img { transition: var(--transition-common); -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); }
.btn:hover span.button-arrow img { transform: rotate(45deg); }
a.btn.border-btn, .btn.border-btn { background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.4); backdrop-filter: blur(10px); box-shadow: none; }
a.btn:after, .btn:after { width: 100%; height: 100%; content: ""; position: absolute; left: 0; top: -120%; background-color: var(--bs-white); z-index: -1; transition: all 0.6s ease; -webkit-transition: all 0.6s ease; -moz-transition: all 0.6s ease; -ms-transition: all 0.6s ease; -o-transition: all 0.6s ease; transform: scale(1.2); }
a.btn:hover:after, .btn:hover:after { top: 0; }
a.btn.border-btn:hover, .btn.border-btn:hover { color: #4C6CCF !important; }
.btn.btn-border:hover::after { width: 100%; }

/* --- Button Styles --- */

/* --- checkbox and radio button Styles --- */
.builder_radiobox ul li label { font-weight: normal; }
.builder_radiobox ul li input[type="radio"] { opacity: 0; }
.builder_radiobox ul li input[type="radio"]:empty~label { position: relative; float: left; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; padding: 0 0 0 22px; }
.builder_radiobox ul li input[type="radio"]:empty~label:before { position: absolute; display: block; top: 2px; bottom: 0; left: 0; content: ""; width: 16px; height: 16px; background: url('../images/radiobutton.png') left top no-repeat; }
.builder_radiobox ul li input[type="radio"]:checked~label:before { background: url('../images/radiobutton.png') left bottom no-repeat; }

/* --- checkbox and radio button Styles --- */



/*-----scroll-bar-design----------*/
/* width */
::-webkit-scrollbar { width: 8px; height: 4px; }

/* Track */
::-webkit-scrollbar-track { box-shadow: inset 0 0 2px #263B79; }

/* Handle */
::-webkit-scrollbar-thumb { background: var(--color-tertiary); border-radius: 10px; }

/*-----scroll-bar-design----------*/


/*-----Header design----------*/
.main-header { padding: 0; z-index: 999; width: 100%; left: 50%; transform: translateX(-50%); position: fixed; background: #ffffff00; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); top: 0; }
.main-header .main-menu { margin-right: 25px; }
.main-header .header-row { padding: 22px 40px;  margin-inline: -40px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); background: rgba(43, 56, 143, 0.2); border-radius: 0 0 10px 10px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); backdrop-filter: blur(20px) }
.main-header.fixed .header-row { padding: 15px 40px; background: rgb(39 42 75 / 73%); }
.main-menu ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; align-items: center; }
.main-menu ul li a { display: block; padding: 10px 15px; color: #9DAACF; position: relative; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); }
.main-menu>ul>li>a:hover { color: var(--color-secondary); }
.main-menu ul li.current-menu-item>a { color: var(--color-secondary); font-weight: var(--fw-semibold); }
.main-menu ul li ul.sub-menu li a::before { opacity: 0; content: ""; width: 0%; height: 1px; position: absolute; bottom: 7px; border-radius: 10px; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); }
.main-menu ul li.menu-item-has-children a { opacity: 1; content: ""; width: 100%; }

.main-menu ul li ul.sub-menu li a::before { background-color: #FFFFFF !important; top: 55%; width: 0 !important; left: 0; border: 1px solid var(--color-accent); }
.main-menu ul li ul.sub-menu li a:hover::before { width: 20px !important; opacity: 1; }
.main-menu ul li ul.sub-menu li a:hover { padding-left: 30px; color: var(--color-accent) !important; }


.main-menu>ul>li>a:hover::after { border-color: var(--color-white) !important; }

/* .main-menu ul li.menu-item-has-children a:hover::after{ border-color: var(--color-white);} */
.main-menu ul li span { margin-left: 10px; }
.main-header.relative_header { background-color: #000000; }

/*------css for new dropdown sub-menu start--------*/
.main-menu ul li.menu-item-has-children a:after { -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); content: ""; position: absolute; top: 45%; box-sizing: border-box; height: 8px; width: 8px; border-style: solid; border-color: #231F20; border-width: 0px 1px 1px 0px; transform: rotate(45deg) translate(0, -50%); transition: border-width 150ms ease-in-out; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); right: 20px; margin: 0 auto; }
.main-menu ul li.menu-item-has-children a { padding-right: 34px; }
.main-menu ul.sub-menu li a:after { display: none !important; }
.main-menu ul { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; }
.main-menu ul li { display: flex; justify-content: center; align-items: center; position: relative; perspective: 1000px; z-index: 100; color: #FFFFFF; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); z-index: 0; }
.main-menu ul.sub-menu { position: absolute; width: 250px; display: block; margin-top: 0; padding: 6px 20px; border-radius: 10px; box-shadow: 0 15px 12px #0000005e; overflow: hidden; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease }
.main-menu ul.sub-menu li { margin: 0 !important; padding: 0 }
.main-menu ul li .sub-menu li a { color: #231F20 !important; padding: 8px 0; }
.main-menu ul li.out .sub-menu { opacity: 0; transform: scaleY(0) translateZ(0); visibility: hidden; }
.main-menu ul li.menu-item-has-children { z-index: 1; }
header .main-menu ul>li { position: relative; cursor: pointer }
header .main-menu ul .sub-menu { position: absolute; left: 0; top: 100%; transform-origin: 50% 0; transform: scaleY(0) translateZ(0); opacity: 0; transition: transform 0.3s, opacity 0.3s; width: 230px; overflow: hidden; padding: 0; box-shadow: none; opacity: 1; visibility: hidden; display: unset }
header .main-menu ul li ul::before { content: ""; width: 100%; height: 100%; position: absolute; top: -12px; left: 0; background-color: var(--color-accent); }
header .main-menu ul li:hover ul { padding-top: 5px; box-shadow: 0px 4px 10px 0px #00000014; opacity: 1; transform: scaleY(1) translateZ(0); visibility: visible; display: unset; transition: transform 0.3s, opacity 0.3s ease-out; }
header .main-menu ul .sub-menu li { display: block; position: relative; padding: 0px 20px; cursor: pointer; background-color: #FFFFFF; -webkit-transition: all .8s ease; -moz-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; transition: all .8s ease; }
header .main-menu ul .sub-menu li:first-child { padding-top: 10px; border-radius: 10px 10px 0 0; }
header .main-menu ul .sub-menu li:last-child { padding-bottom: 10px; }
.main-header .header-btn a:not(:last-child) { margin-right: 16px; }


/*------css for new dropdown sub-menu end--------*/
.main-header .logo { transform: scale(1); transform-origin: left center; width: 12%; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); }
.main-header .logo a { display: inline-block; }
.main-header .logo a img { width: auto; height: 100%; transition: var(--transition-common); }
.main-header.fixed .logo {transform: scale(0.8); -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); transform-origin: center left; }
.main-header .manu-part { width: calc(100% - 12%); }
.nav_btn { color: #FFFFFF; font-size: 22px; text-align: right; display: none; }
.nav_close { display: none; color: #FFFFFF; }
.main-header.fixed { position: fixed; width: 100%; transition: all 0.4s; -ms-transition: all 0.4s; -webkit-transition: all 0.4s; }
.main-header.fixed .container.header-row { padding: 10px 0; }

/*==========mobile menu=========*/
.main-header .hdr-rt { display: flex; align-items: center; justify-content: end; }
.main-header .hdr-rt.hdr-lt { gap: 50px; justify-content: flex-end; }
.main-header .user-sec { margin-left: 100px; display: flex; align-items: center; }
.menu-has-children.menu-has-children-open span img { transform: rotate(180deg); -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); }
.menu-has-children span img { transform: rotate(0deg); -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); }
.mobile-menu-container ul.sub-menu { position: relative; max-height: 0; overflow: hidden; transition: max-height 0.6s ease-out; }
.mobile-menu-container ul.sub-menu.sub-menu-open { transform: scaleY(1); max-height: 300px; }

/* ~~~~~~~~~~ mobile menu styling ~~~~~~~~~~ */
.mobile-menu-container { position: fixed; z-index: 1; top: 0; left: 0; right: 0; background: #263B79; height: calc(100vh + 40px); transform: translateX(-200%);-webkit-transition: all .35s ease-in-out; -moz-transition: all .35s ease-in-out; -o-transition: all .35s ease-in-out; transition: all .35s ease-in-out; display: none; z-index: -1; }

.mobile-menu-open .mobile-menu-container { top: 0;  transform: translateX(0); }
.mobile-menu-open .mobile-menu-container::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(90.08deg, #3565DC 0.08%, #34A2FF 30.47%, #34A2FF 42.86%, #3C85F1 73.84%, #4F79E2 99.33%); overflow: hidden; }
.mobile-menu-container .inner-container { padding-top: 160px; height: 100vh; overflow-y: auto; position: relative; }
.mobile-menu { max-width: 100%; padding-left: 25px; padding-right: 25px; padding-bottom: 50px; margin: 0 auto; text-align: center; }
.mobile-menu ul { margin: 0; padding: 0; list-style: none; }
.mobile-menu ul li { display: block; margin: 10px 0; }
.mobile-menu ul li a { display: block; font-size: 30px; color: #273B7A; padding: 4px 0; }
.mobile-menu ul li.current-menu-item a { color: var(--bs-white); font-weight: var(--fw-semibold); background: rgba(255, 255, 255, 0.2); padding: 7px 15px; border: 0; }
.mobile-menu>ul>li>a { border-bottom: 1px solid rgba(255, 255, 255, 0.3); }
.mobile-menu ul li.menu-item-has-children>a { padding-right: 15px; }
.main-header.mobile-menu-open .header-row { background-color: transparent; border: 0; box-shadow: inherit; backdrop-filter: inherit; padding: 12px 0 12px 10px !important;}
.main-header.mobile-menu-open.fixed .logo { transform: scale(1); }

/* ===== mobile menu animation ===== */
/* .mobile-menu ul li { opacity: 0; -webkit-transform: translateX(-150px); transform: translateX(-150px); -webkit-transition: -webkit-transform 0.4s, opacity 0.4s; transition: transform 0.4s, opacity 0.4s; }
.mobile-menu-open .mobile-menu ul li { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); }
.mobile-menu-open .mobile-menu ul li:nth-child(1) { -webkit-transition-delay: 0.16s; transition-delay: 0.16s; }
.mobile-menu-open .mobile-menu ul li:nth-child(2) { -webkit-transition-delay: 0.24s; transition-delay: 0.24s; }
.mobile-menu-open .mobile-menu ul li:nth-child(3) { -webkit-transition-delay: 0.32s; transition-delay: 0.32s; }
.mobile-menu-open .mobile-menu ul li:nth-child(4) { -webkit-transition-delay: 0.40s; transition-delay: 0.40s; }
.mobile-menu-open .mobile-menu ul li:nth-child(5) { -webkit-transition-delay: 0.48s; transition-delay: 0.48s; }
.mobile-menu-open .mobile-menu ul li:nth-child(6) { -webkit-transition-delay: 0.54s; transition-delay: 0.54s; }
.mobile-menu-open .mobile-menu ul li:nth-child(7) { -webkit-transition-delay: 0.60s; transition-delay: 0.60s; } */

/* ===== mobile menu animation ===== */

.mobile-menu-open .mobile-menu ul li.btn { margin: 0 auto; padding: 5px 5px; max-width: 150px; }
.mobile-menu-open .mobile-menu ul li.btn a { color: #FFFFFF; }

/*=========mobile menu===========*/

/*for header css*/

/* ~~~~~~~~~~ hamburger menu styling ~~~~~~~~~~ */
.hamburger-nav { display: none; }

/*when turns close icon*/
.ham { cursor: pointer; -webkit-tap-highlight-color: transparent; transition: transform 400ms; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; }
.hamRotate.active { transform: rotate(45deg); }
.hamRotate180.active { transform: rotate(180deg); }
.line { fill: none; transition: stroke-dasharray 400ms, stroke-dashoffset 400ms; stroke: var(--bs-white); stroke-width: 3.5; stroke-linecap: round; }

/* .main-header.fixed .line { stroke: #3C5180; } */
.ham6 .top { stroke-dasharray: 41 172; }
.ham6 .middle { stroke-dasharray: 41 111; transform: translateX(1px); }
.ham6 .bottom { stroke-dasharray: 41 172; transform: translateX(1px); }
.ham6.active .top { stroke-dashoffset: -132px; }
.ham6.active .middle { stroke-dashoffset: -71px; }
.ham6.active .bottom { stroke-dashoffset: -132px; }

/*when turns close icon*/

/* ~~~~~~~~~~ hamburger menu styling ~~~~~~~~~~ */


/* HOME PAGE START HERE ==========================*/

/* Banner Section */
.hero-section { height: 100vh; padding-top: 111px; }
.hero-section::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(76.45deg, #272A4B 0.44%, rgba(39, 42, 75, 0) 100%); }
.hero-section::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(35, 35, 35, 0.3); }
.hero-content h1:last-child { margin-bottom: 0; }
.subtitle { color: var(--color-secondary); padding-left: 27px; margin-bottom: 15px; position: relative; font-weight: var(--fw-medium);}
.subtitle.white-logo { color: var(--bs-white); }
.subtitle::before { content: ""; position: absolute; top: 0; left: 0; width: 17px; height: 20px; background: url(../images/small-scsg-logo.svg) no-repeat center center; background-size: 100% !important; }
.subtitle.white-logo::before { background: url(../images/small-scsg-white-logo.svg) no-repeat center center; }
.hero-content h1 { font-weight: var(--fw-semibold); color: var(--bs-white); }
.hero-content p { color: var(--bs-white); }

/*Main Section*/
.section-title { margin-bottom: 40px; }
.section-title h2 { font-weight: var(--fw-semibold); }

.what-we-do-item { padding: 60px 40px 54px; border: 1px solid #D9D9D9; border-radius: 15px; text-align: center; height: 100%; transition: var(--transition-common); background-color: var(--bs-white); position: relative; isolation: isolate; }
.what-we-do-item:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(97.63deg, #42A7FF 0%, #4C6CCF 100.17%); box-shadow: 0px -4px 4px 0px #00000033 inset; opacity: 0; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); z-index: -1; border-radius: 15px; }
.what-we-do-item:hover:after { opacity: 1; }
.what-we-do-item:hover { border: 1px solid var(--bs-white); }
.what-we-do-item .image-wraper { width: 88px; margin: 0 auto 32px; }
.what-we-do-item:hover .image-wraper img { filter: brightness(0) invert(1); }
.what-we-do-item h4 { max-width: 366px; margin-inline: auto; }
.what-we-do-item h4 span { color: var(--color-secondary); }
.what-we-do-item:hover h4, .what-we-do-item:hover p, .what-we-do-item:hover h4 span { color: var(--bs-white); }

.who-we-are-left-area { padding-right: 40px; }
.who-we-are-section .button-wrapper a.btn.border-btn { width: 100%; }
.who-we-are-section p { font-weight: var(--fw-medium); }
.who-we-are-section ul { background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 1); padding: 24px; border-radius: 15px; }
.who-we-are-section ul li { padding-left: 35px; position: relative; color: var(--bs-white); }
.who-we-are-section ul li:before { content: ""; position: absolute; top: 5px; left: 0; width: 25px; height: 25px; border-radius: 50%; background: url(../images/listing-arrow.svg) center center no-repeat; }
.who-we-are-section ul li:not(:last-child) { margin-bottom: 16px; }
.who-we-are-section .image-wrapper { padding-bottom: 103.5937%; position: relative; overflow: hidden; }
.right-img-wrapper.responsive-image-wrapper { padding-bottom: 33.154%; margin-top: 50px; }

.section-logo-img { position: absolute; right: -75px; top: 24px; z-index: -1; }
.what-we-offer-item { padding: 16px; border: 1px solid #D9D9D9; border-radius: 15px; height: 100%; /*background-color: var(--bs-white);*/ position: relative; display: flex; flex-direction: column; isolation: isolate; }
.what-we-offer-item .content-wrapper { flex: 1; display: flex; flex-direction: column; }
.what-we-offer-item .content-wrapper .content-wrapper-top { flex: 1; }
.what-we-offer-item .content-wrapper .content-wrapper-button { flex: 0 0 auto; margin-top: 24px;}

.what-we-offer-item .responsive-image-wrapper { padding-bottom: 67%; }


.what-we-support-section .row { margin-inline: -41px;}
.what-we-support-section .col-item { padding-inline: 41px; }
.support-listing ul li:not(:last-child) { margin-bottom: 30px; padding-bottom: 30px; border-bottom: 1px solid #4A76D733 }
.rounded-icon-wrapper { flex: 0 0 auto; width: 78px; height: 78px; background: linear-gradient(97.63deg, #42A7FF 0%, #4C6CCF 100.17%); box-shadow: 0px -4px 4px 0px #00000033 inset; border-radius: 15px; display: flex; align-items: center; justify-content: center; }
.support-listing ul li .content-wrapper { padding-left: 30px;}
.what-we-support-section .image-wrapper { height: 100%; }

.our-position-section .position-left-area { padding: 84px 40px 84px 60px; background: #F2FBFF; border: 1px solid #76D3FB; border-radius: 8px; height: 100%; overflow: hidden; }
.our-position-section .position-right-area h2 { color: var(--bs-white);}
.our-position-section .content-wrapper { padding: 30px; background: #DDF5FF; position: relative; z-index: 2;}
.our-position-section .content-wrapper p { color: #4A4848;}
.our-position-section .position-left-area .particles-img { position: absolute; bottom: 0; left: 0; right: 0; z-index: 1; opacity: 0.5; }
.our-position-section .position-right-area {padding: 84px 40px 28% 60px; border-radius: 8px; height: 100%; position: relative; }
.our-position-section .position-right-area:before { content: ""; position: absolute; inset: 0; width: 100%; height: 100%; background: linear-gradient(179.76deg, #34A2FF 2.43%, #4A76D8 35.26%, rgba(74, 118, 216, 0.7) 66.75%, rgba(120, 156, 242, 0.2) 85.72%, rgba(87, 132, 240, 0.4) 99.78%); z-index: 1;  border-radius: 8px; }
.our-position-section .position-right-area:after { content: ""; position: absolute; inset: 0; width: 100%; height: 100%; background: linear-gradient(90.08deg, #3565DC 0.08%, #34A2FF 30.47%, #34A2FF 42.86%, #3C85F1 73.84%, #4F79E2 99.33%);  mix-blend-mode: color;  border-radius: 8px; }
.our-position-section .position-right-area p { color: #E2E2E2;}


.home-contact-section:after { content: ""; position: absolute; top: 0; left: 0; width: 55.625%; height: 100%; background: #F5F7FF; border-radius: 0 4px 0 0; }
.home-contact-section .contact-left-area { padding-right: 40px;}
.contact-info { border: 1px solid #C2E1EE; border-radius: 10px; padding: 24px; }
.contact-info p { color: var(--color-primary); }
.contact-info p a { font-weight: var(--fw-medium); color: var(--color-secondary);}
.contact-form { background: #FFFFFF; border: 1px solid #D9D9D9; border-radius: 15px; padding: 40px; }
.contact-form .form-row input.wpcf7-form-control.wpcf7-phonetext { background-color: #E8F8FF !important; }



/* HOME PAGE END HERE ==========================*/

/* START INNER BANNER CSS ==========================*/

.hero-section.inner-banner { max-height: 600px; min-height: auto; }
.hero-section.inner-banner:before { background: linear-gradient(76.45deg, #272A4B 0.44%, rgba(39, 42, 75, 0) 100%); mix-blend-mode: multiply; }
.hero-section.inner-banner::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #2323234D; }

/* END INNER BANNER CSS ==========================*/

/* START ABOUT PAGE CSS ==========================*/

.data-centre-section.padding-common { padding-bottom: 74px;}
.data-centre-section .logo-shape { position: absolute; top: -70px; }
.about-who-we-are-section .responsive-image-wrapper { flex: 0 0 auto; width: calc(50% - 24px); padding-bottom: 64.656%; }
.about-who-we-are-section .image-wrapper-one { margin-bottom: 183px; }
.about-who-we-are-section .image-wrapper-two { margin-top: 183px; }
.particle-img-1 { position: absolute; top: -9vw; left: -20vw; transform: rotate(165deg); }
.particle-img-2 { position: absolute; bottom: -9vw; left: 22vw; transform: rotate(320deg); }
.story-item {border: 1px solid #CBD5FD; background: var(--bs-white); border-radius: 8px; padding: 22px 44px 22px 0; margin-left: 43px; height: 100%; }
.story-item.story-item-transparent {border: 1px solid var(--bs-white); background: rgba(255, 255, 255, 0.1); }
.story-item .icon-wrapper { background: linear-gradient(90.08deg, #3565DC 0.08%, #34A2FF 30.47%, #34A2FF 42.86%, #3C85F1 73.84%, #4F79E2 99.33%); box-shadow: 0px 4px 30px 0px #9CB4FF80, 4px 0px 4px 0px #00000040 inset; flex: 0 0 auto; width: 89px; height: 89px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-left: -43px; margin-right: 30px; }
.story-item.story-item-transparent .icon-wrapper { background: #FFFFFF;box-shadow: 0px -4px 4px 0px #00000033 inset; }
.story-item .icon-wrapper img { filter: brightness(0) invert(1); }
.story-item.story-item-transparent .icon-wrapper img { filter: none; }
.story-item.story-item-transparent h4 { color: var(--bs-white); margin-bottom: 0; white-space: normal; word-break: break-word;}
.story-item.story-item-transparent p { color: var(--bs-white);}
.story-info { background: #F5F7FF; border-bottom: 2px solid #5079E2; border-radius: 15px; margin-top: 50px; margin-bottom: -260px; text-align: center; padding: 50px; }
.story-info h6 { color: var(--color-quaternary); font-weight: normal; }
.story-info h6 strong { font-weight: var(--fw-semibold);}
.story-info p { color: var(--color-tertiary);}
.story-info .story-info-inner { background: rgba(255, 255, 255, 0.1); border: 1px solid #A9BAFF; border-radius: 15px; padding: 30px; max-width: 936px; margin-inline: auto;}
.story-info .story-info-inner p { margin-bottom: 5px;}
.gradient-text h4 { background: linear-gradient(90deg, #3E69ED 12.39%, #04C7F4 92.52%);
/* gradient */ -webkit-background-clip: text; /* clip background to text (WebKit) */ background-clip: text; /* clip background to text */ -webkit-text-fill-color: transparent; /* hide original text color */ color: transparent; /* fallback for some browsers */ }
.team-section.padding-common { padding-top: 250px; }
.team-item { background: #F2FBFF; border: 1px solid #B9E8FD; border-radius: 8px; text-align: center; height: 100%; }
.team-item a { display: block;  padding: 30px; }
.team-item .team-img-wrapper { width: 173px; height: 173px; border-radius: 50%; margin: 0 auto 30px; }
.team-item .team-img-wrapper img { border-radius: 50%; object-fit: cover;}
.mission-section { padding-block: 10%; }
.mission-section::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(89.96deg, #01103D 0.03%, rgba(1, 16, 61, 0.8) 49.04%, rgba(76, 108, 207, 0) 99.96%); z-index: 1; }
.mission-section p { max-width: 536px; }
.mission-section h2, .mission-section p { color: var(--bs-white); }
.experience-item { background: #F5F7FF; padding: 30px; position: relative; height: 100%;}
.experience-item .icon-wraper { position: absolute; top: 18px; right: 18px; max-width: 128px; }
.experience-item .content-wrapper span.number {font-size: var(--f-size-M); font-weight: var(--fw-semibold); padding: 10px; position: relative; margin-bottom: 34px; display: inline-block; }
.experience-item .content-wrapper span.number::before { content: ""; position: absolute; top: 0; left: 0; width: 1px; height: 100%; background: linear-gradient(180deg, #4C6CCF 0%, #6ADCF6 100%); }
.our-experience-section .col-lg-3 { margin-bottom: 40px;}
.our-experience-section .col-lg-3:nth-child(-n+4) { margin-bottom: 74px; }
.experience-info-text { max-width: 783px; margin-inline: auto; padding: 40px; text-align: center; background: #E6F6FD; position: relative; border-radius: 8px 8px 0 0;  }
.experience-info-text::before { content: ""; position: absolute; left: 0; right: 0; top: 0;  margin-inline: auto; width: 100%; height: 100%; border: 1px solid transparent; background: linear-gradient(180deg, #4C6CCF 0%, rgba(76, 108, 207, 0) 100%) border-box; -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0); -webkit-mask-composite: destination-out; mask-composite: exclude; border-radius: 8px 8px 0 0;  }
.features-container { padding-block: 70px; }
.features-container .story-item { margin-left: 0; padding: 22px 20px; background: rgba(255, 255, 255, 0.1);}
.features-container .story-item:not(:last-child) { margin-bottom: 26px; }
.features-container .story-item .icon-wrapper { margin-left: 0; margin-right: 16px;}
/* Center Circle */
.features-container .center-circle { display: flex; justify-content: center; align-items: center; }
.features-container .circle { width: 100%; aspect-ratio: 1 / 1; border-radius: 50%; background: rgba(255, 255, 255, 0.08); display: grid; place-items: center; position: relative; }
.features-container .circle:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 4px solid transparent; background: linear-gradient(90deg, #6ADCF6 0%, rgba(106, 220, 246, 0), #6ADCF6 100%) border-box; -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0); -webkit-mask-composite: destination-out; mask-composite: exclude; border-radius: 50%;}
.features-container .center-circle:after { content: ""; position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%) scale(1.3); margin-inline: auto; width: 100%; height: 100%; border-radius: 50%; background: rgba(255, 255, 255, 0.04); ;}
.features-container .center-circle:before { content: ""; position: absolute; left: 0; right: 0; top: 50%; transform: translateY(-50%) scale(1.3); margin-inline: auto; width: 100%; height: 100%; border: 4px solid transparent; background: linear-gradient(90deg, rgb(106 220 246 / 12%) 0%, rgba(106, 220, 246, 0), rgb(106 220 246 / 12%) 100%) border-box; -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0); -webkit-mask-composite: destination-out; mask-composite: exclude; border-radius: 50%; }
.shape-img-top { position: absolute; top: 0; left: 0; width: auto; max-width: 723px; height: auto; }
.shape-img-bottom { position: absolute; bottom: 0; right: 0; width: auto; max-width: 723px; height: auto; }
.our-position-section .position-right-area.global-commitment { padding: 84px 40px 52% 60px;}
.our-position-section .position-right-area.global-commitment:after { display: none;}
.our-position-section .position-right-area.global-commitment p { font-weight: var(--fw-semibold); color: var(--bs-white);}

/* END ABOUT PAGE CSS ==========================*/


/* START VENDOR SERVICES PAGE CSS ==========================*/

.shape-1 {  position: absolute; top: -8vw; right: 0;}
.high-performance-section .responsive-image-wrapper { padding-bottom: 78.125%; }
.high-performance-section .permomance-development { max-width: 741px; padding-left: 27px;}
.vendor-development-row { margin-top: 100px;}
.high-performance-section .position-left-area { background: linear-gradient(97.63deg, #42A7FF 0%, #4C6CCF 100.17%); border-radius: 15px; box-shadow: 0px -4px 4px 0px #00000033 inset; padding: 40px; height: 100%; }
.high-performance-section .position-left-area ul li { background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.2); padding: 10.5px 16px 10.5px 54px; width: fit-content; border-radius: 6px; color: var(--bs-white); position: relative; z-index: 2;}
.high-performance-section .position-left-area ul li:not(:last-child) { margin-bottom: 16px; }
.high-performance-section .position-left-area ul li::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 20px; width: 22px; height: 22px; background: url(../images/tick-img.svg) no-repeat center center; background-size: auto;  border: 1px solid var(--bs-white); border-radius: 50%; }
.high-performance-section .position-left-area .shape-2 { position: absolute; right: 0; bottom: 0; }
.high-performance-section .position-right-area.responsive-image-wrapper { padding-bottom: inherit; height: 100%; }
/* END VENDOR SERVICES PAGE CSS ==========================*/



/* START CONSULTANCY MODEL PAGE CSS ==========================*/

.center-title-styling { display: flex; justify-content: center; gap: 10px; align-items: center; margin-bottom: 40px; }
.center-title-left { border-top: 1px solid #3E69ED; flex: 1; margin-right: 15px; position: relative; }
.center-title-left::after { content: ""; position: absolute;top: -3px; right: -15px; width: 5px; height: 5px; border-radius: 50%; background: #3E69ED; }
.center-title-right { border-top: 1px solid #04C7F4; flex: 1;margin-left: 15px; position: relative; }
.center-title-right::after { content: ""; position: absolute;top: -3px; left: -15px; width: 5px; height: 5px; border-radius: 50%; background: #04C7F4; }
.consulting-approach-section .story-item { margin-left: 0; padding: 0 30px 30px; background: transparent; border:0; position: relative; isolation: isolate;}
.consulting-approach-section .story-item::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 89%; background: #F0F3FF; z-index: -1; border-radius: 8px; }
.consulting-approach-section .story-item .icon-wrapper { margin-left: -20px; margin-bottom: 20px; border: 4px solid #FFFFFF; box-shadow: inherit; }

.process-circle { width: 22.8%; aspect-ratio: 1 / 1; border-radius: 50%;display: grid; place-items: center; position: relative; border: 2px solid #4C6ED1; transition: var(--transition-common); }
.process-circle .img-circle { width: 100%; aspect-ratio: 1 / 1; border-radius: 50%; overflow: hidden;     position: absolute; inset: 0; transition: var(--transition-common); transform: scale(0);}
.process-circle .img-circle:after { content: ""; position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 50%; background: linear-gradient(89.96deg, rgba(1, 16, 61, 0.5) 0.03%, rgba(1, 16, 61, 0.4) 49.04%, rgba(76, 108, 207, 0) 99.96%); }
.process-circle .img-circle img { width: 100%; height: 100%; object-fit: cover; }
.process-circle h4 { background: linear-gradient(90deg, #3E69ED 12.39%, #04C7F4 92.52%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.process-circle:hover .img-circle { transform: scale(1.02); z-index: 2; }
.process-circle:hover h4 { position: relative; color: var(--bs-white); z-index: 3; -webkit-text-fill-color: inherit; background: none; }
.process-circle:not(:last-child) { margin-right: -50px; }

/* END CONSULTANCY MODEL PAGE CSS ==========================*/

/* START DATA CENTRE CLIENT SERVICES PAGE CSS ==========================*/
.compromise-section .image-wraper{ padding-bottom: 98%;}

.operational-support-card { isolation: isolate; padding: 0 30px 30px; height: 100%; transition: var(--transition-common);}
.operational-support-card::before{ content: ""; background: var(--color-white); box-shadow: 0px 7px 27px 0px #00000014; border-radius: 8px; width: 100%; height: calc(100% - 45px); position: absolute; z-index: -1; right: 0; bottom: 0; left: 0;}
.operational-support-card .card-icon{ width: 85px; height: 85px; background: linear-gradient(90.08deg, #3565DC 0.08%, #34A2FF 30.47%, #34A2FF 42.86%, #3C85F1 73.84%, #4F79E2 99.33%);
 border: 6px solid #F5F7FF; border-radius: 50%; margin-bottom: 20px; transition: var(--transition-common);}
.operational-support-card .card-icon img { transition: var(--transition-common); max-width: 50%; }
.operational-support-card .card-icon-title-box{ margin-bottom: 20px; min-height: 165px;}
.list-icon li:not(:last-child){ margin-bottom: 15px;}
.list-icon li{ position: relative; padding-left: 20px; color: var(--color-tertiary);}
.list-icon li::before{ content: ""; background: var(--color-tertiary); width: 10px; height: 10px; border-radius: 50%; position: absolute; z-index: 1; top: 8px; left: 0;}
.operational-support-card:hover{ transform: translateY(-10px);}
.operational-support-card:hover .card-icon img { transform: skew(5deg, 5deg) scaleX(-1); }

.insights-card { height: 100%; padding: 60px 60px 90px; overflow: hidden; isolation: isolate; background: #F2FBFF; border: 1px solid #76D3FB;}
.insights-card .bg-image { max-width: 50%; position: absolute; z-index: -1; right: 0; bottom: 20px; }
.insights-card .bg-image img{ width: 100%;}
.insights-card.insights-card-right { background: linear-gradient(90.08deg, #3565DC 0.08%, #34A2FF 30.47%, #34A2FF 42.86%, #3C85F1 73.84%, #4F79E2 99.33%); border-color: transparent; }
.insights-card.insights-card-right *:not(.btn){ color: var(--color-white);}
.insights-card.insights-card-right img{ filter: brightness(0) invert(1);}

.control-section::before{ content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(89.96deg, rgba(1, 16, 61, 0.8) 0.03%, rgba(1, 16, 61, 0.64) 49.04%, rgba(76, 108, 207, 0) 99.96%);}
.control-section *:not(.btn){ color: var(--color-white);}
.story-item-outer .row{ row-gap: var(--gap-40);}

.operators-section .section-title{ margin-bottom: calc( var(--gap-40) + var(--gap-40));}

.operators-card-outer .row{ row-gap: 50px;}

.operators-card { padding: 30px; isolation: isolate; border-radius: 15px;}
.operators-card::before{ content: ""; position: absolute; z-index: -1; inset: 0; margin: auto; width: 0; height: 0; border-radius: 15px; background: linear-gradient(97.63deg, #42A7FF 0%, #4C6CCF 100.17%); box-shadow: 0px -4px 4px 0px #00000033 inset; transition: var(--transition-common); }
.operators-card .operators-card-image-outer { max-width: 45%; margin-bottom: 30px;}
.operators-card .operators-card-image{ padding-bottom: 110%;}
.operators-card .operators-card-image img{ position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 10px; transition: var(--transition-common);}
.operators-card .card-bg{ max-width: 35%; position: absolute; z-index: 1; top: 20px; right: 20px; opacity: 0.8; transition: var(--transition-common); pointer-events: none;}
.operators-card .bottom-row{ gap: 20px;}
.operators-card .bottom-row .icon{ background: linear-gradient(90.08deg, #3565DC 0.08%, #34A2FF 30.47%, #34A2FF 42.86%, #3C85F1 73.84%, #4F79E2 99.33%);
 width: 85px; height: 85px; flex: 0 0 auto; border-radius: 50%; transition: var(--transition-common); isolation: isolate;}
 .operators-card .bottom-row .icon::before{ content: ""; background: var(--color-white); width: 0; height: 0; border-radius: 50%; box-shadow: 4px 0px 4px 0px #00000040 inset; position: absolute; z-index: -1; inset: 0; margin: auto; transition: var(--transition-common); pointer-events: none;}
.operators-card .bottom-row .icon img{ max-width: 50%; filter: brightness(0) invert(1); transition: var(--transition-common);}
.operators-card h4{ transition: var(--transition-common);}

.operators-card:hover::before{ width: 100%; height: 100%;}
.operators-card:hover .card-bg { opacity: 0.06; }
.operators-card:hover .operators-card-image img{ height: calc(100% + 70px);}
/* .operators-card:hover .bottom-row .icon{ background: transparent;} */
.operators-card:hover .bottom-row .icon::before{ width: 100%; height: 100%;}
.operators-card:hover .bottom-row .icon img{ filter: none; transform: scaleX(-1);}
.operators-card:hover h4{ color: var(--color-white);}

.disruption-card-box{ overflow: hidden;}
.disruption-card-box .row{ margin-right: 0; margin-left: 0;}
.disruption-card-box .row>*{ padding-right: 0; padding-left: 0;}
.disruption-card-box .info-outer { padding: 60px 80px 60px 60px; height: 100%; }
.disruption-card-box .info-outer .info-wraper{ width: 100%;}
.disruption-card-box .info-outer .info-wraper h2{ padding-right: 25px;}
.disruption-card-box .image-wraper { min-height: 100%; padding-bottom: 50%; }
.disruption-card-box .icon { width: 125px; height: 125px; background: linear-gradient(90.08deg, #3565DC 0.08%, #34A2FF 30.47%, #34A2FF 42.86%, #3C85F1 73.84%, #4F79E2 99.33%); border: 4px solid #F5F7FF; border-radius: 50%; position: absolute; z-index: 1; inset: 0; margin: auto; pointer-events: none; }

.support-stage{ background: linear-gradient(90.08deg, #3565DC 0.08%, #34A2FF 30.47%, #34A2FF 42.86%, #3C85F1 73.84%, #4F79E2 99.33%); }
.support-stage *:not(.btn){ color: var(--color-white);}
.support-stage .short-discription{ margin-left: 25%;}
/* END DATA CENTRE CLIENT SERVICES PAGE CSS ==========================*/


/* START VENDORBASE PLATFORM PAGE CSS ==========================*/
.compromise-section .info-wraper ul li { margin-bottom: 16px; color: var(--color-tertiary); padding-left: 16px; position: relative;}
.compromise-section .info-wraper ul li::before { content: ""; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 10px; height: 10px; border-radius: 50%; background: #020202;}
.compromise-section .info-wraper p strong { color: #020202;}
.stakeholder-card-outer .story-item { padding: 40px 50px 30px 30px; margin-left: 0; height: 100%;}
.stakeholder-card-outer .story-item .icon-wrapper { margin-left: 0; margin-right: 10px; width: 58px; height: 60px; padding: 10px;}
.stakeholder-card-outer .story-item h4 { color: var(--bs-white);}
.stakeholder-card-outer ul li {  padding-left:34px; width: fit-content; border-radius: 6px; color: var(--bs-white); position: relative;}
.stakeholder-card-outer ul li:not(:last-child) { margin-bottom: 16px; }
.stakeholder-card-outer ul li::before { content: ""; position: absolute; top: 0; left: 0; width: 22px; height: 22px; background: url(../images/tick-img.svg) no-repeat center center; background-size: auto; border: 1px solid var(--bs-white); border-radius: 50%; }
.what-we-support-section.vendor-tier-section.padding-common { padding-bottom: 170px; }
.overlaping-big-img { margin-left: 20%;}
.overlapping-img { position: absolute; left: 0; bottom: -73px; border: 5px solid #FFFFFF; border-radius: 8px; max-width: 300px; min-height: 329px; width: 100%;}
.overlapping-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.driving-performance-section .story-item { background: linear-gradient(90.08deg, #3565DC 0.08%, #34A2FF 30.47%, #34A2FF 42.86%, #3C85F1 73.84%, #4F79E2 99.33%); padding: 44px 20px; margin-left: 0; max-width: 392px; }
.driving-performance-section .story-item:not(:last-child) { margin-bottom: 60px; }
.driving-performance-section .story-item .icon-wrapper { margin-left: 0; margin-right: 16px; width: 78px; height: 78px; padding: 16px; background: #FFFFFF; box-shadow: 0px -4px 4px 0px #00000033 inset;}
.driving-performance-section .image-wrapper {  /* Mask */ -webkit-mask-image: url("../images/vendor-logo-shape.png"); -webkit-mask-repeat: no-repeat; -webkit-mask-size: contain; -webkit-mask-position: center; mask-image: url("../images/vendor-logo-shape.png"); mask-repeat: no-repeat; mask-size: contain; mask-position: center; width: 100%; height: 100%;}
.driving-performance-row .col-lg-4:last-child .story-item { margin-left: auto;}


/* END VENDORBASE PLATFORM PAGE CSS ==========================*/


/* START CONTACT PAGE CSS ==========================*/

.contact-left-wrapper { padding: 50px; height: 100%; border-radius: 8px; }
.contact-left-wrapper ul li .contact-info {background: rgba(255, 255, 255, 0.1);border: 1px solid rgba(255, 255, 255, 1); backdrop-filter: blur(8px); }
.contact-left-wrapper ul li:not(:last-child) .contact-info { margin-bottom: 24px; }
.contact-left-wrapper ul li .contact-info .contact-icon { background: rgba(255, 255, 255, 1);
box-shadow: 0px -4px 4px 0px rgba(0, 0, 0, 0.2) inset; flex: 0 0 auto; width: 58px; height: 60px; border-radius: 8px; display: flex; align-items: center; justify-content: center; margin-right: 16px;}
.contact-left-wrapper ul li .contact-info .content-wrapper h4 { color: var(--bs-white); font-size: var(--f-size-Body); font-weight: var(--fw-regular); margin-bottom: 6px;}
.contact-left-wrapper ul li .contact-info .content-wrapper p { color: var(--bs-white); font-size: var(--f-size-M); font-weight: var(--fw-semibold);}
.contact-left-wrapper ul li .contact-info .content-wrapper p a { color: var(--bs-white);}
.contact-wrapper .contact-form { padding: 100px 40px; background: #F5F7FF; border: 1px solid #D9D9D9; height: 100%; border-radius: 8px; }
.contact-wrapper .contact-form .form-control { background-color: var(--bs-white) !important; border: 1px solid #CBD5FD !important; }
.form-row input.wpcf7-form-control.wpcf7-phonetext { width: 100%; background: #fff !important; border: 1px solid #C2E1EE; border-radius: 8px; }
.form-row .selected-flag { border-radius: 8px 0 0 8px; }
/* END CONTACT PAGE CSS ==========================*/




 /* =================== FOOTER CSS ==================== */
.main-footer { position: relative; background: #000D58; padding: 100px 0 0; text-align: center; }
.footer-fw-text { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 100%; }
.logo-wrap { text-align: center; max-width: 345px; margin-inline: auto; margin-bottom: 40px; }
.main-footer .email-contact { display: inline-block; }
.email-contact a { white-space: normal; word-break: break-word; text-align: left; line-height: 1.2; margin-inline: auto;background: linear-gradient(97.65deg, #6ADCF6 3.81%, #3550E2 103.35%); box-shadow: 0px -4px 4px 0px #00000033 inset; padding: 16px 24px; border-radius: 8px; font-weight: var(--fw-medium); font-style: italic; color: var(--bs-white); display: flex; align-items: center; justify-content: center; gap: 16px; }
.footer-menu { border-top: 1px solid rgba(255, 255, 255, 0.5); border-bottom: 1px solid rgba(255, 255, 255, 0.5); padding-block: 8px; margin-top: 72px; margin-bottom: 40px; }
.footer-menu ul { padding-block: 20px; border-top: 1px solid rgba(255, 255, 255, 0.2); border-bottom: 1px solid rgba(255, 255, 255, 0.2); display: flex; align-items: center; justify-content: center;}
.footer-menu ul li a { color: #9DAACF;}
.footer-menu ul li:not(:first-child) a, .footer-menu ul li:not(:last-child) a { margin-inline: 40px;}
.footer-menu ul li a:hover { color:var(--color-secondary);}
.media-footer li { margin-inline: 4px;}
.media-footer li a { width: 48px; height: 48px; border: 1px solid rgba(255, 255, 255, 0.4); border-radius: 8px; display: flex; align-items: center; justify-content: center;}
.media-footer li a:hover { background: var(--bs-white);}
.bootom-footer { border-top: 1px solid rgba(255, 255, 255, 0.1); margin-top: 40px; padding: 24px 0; }
.bootom-footer p { color: rgba(255, 255, 255, 0.3);}


/* 404 Page */
.error404 .main-header .header-row { background: linear-gradient(97.63deg, #42A7FF 0%, #4C6CCF 100.17%); } /* Error page header */
.error404 .main-header .header-row .main-menu ul li a { color: var(--bs-white);}
.error404 .main-header .header-row .main-menu ul li a:hover { color: #6bdef9; }
.error-page-wrapper { padding: 9% 0 5%; }
.error-page-wrapper .inner-wrap { background-color: #F5F7FF; padding: 50px; max-width: 680px; margin-inline: auto; border-radius: 20px; }
.error-page-wrapper .inner-wrap h1 { font-size: clamp(3.125rem, 1.2546rem + 5.2045vw, 7.5rem); line-height: 1; }

/* CONTACT FORM 7 */
.wpcf7-spinner { position: absolute; right: 40px; z-index: 22; background-color: #32a2f9; }
.wpcf7-not-valid-tip { display: none;}
.wpcf7-not-valid { border: 1px solid #dc3232 !important; }
input.form-control.wpcf7-not-valid, textarea.form-control.wpcf7-not-valid, select.form-control.wpcf7-not-valid, .contact-wrapper .contact-form .form-control.wpcf7-not-valid {border: 1px solid #dc3232 !important; }
form.wpcf7-form .btn input[type="submit"] { position: absolute; inset: 0; opacity: 0; z-index: 3; }
form.wpcf7-form .btn span.input-text { color: var(--bs-white); font-weight: var(--fw-medium); font-size: clamp(1rem, 0.942rem + 0.154vw, 1.125rem) !important; }
form.wpcf7-form .btn:hover span.input-text { color: #4C6CCF;}
form.wpcf7-form .btn span.button-arrow { z-index: auto; }

/*Media Query css*/
@media only screen and (min-width:1599px) {}

@media only screen and (min-width:1441px) {

  .container { max-width: 1440px !important; }

}

@media only screen and (max-width:1601px) {
  :root {
    --f-size-Body: 16px;
  }
  /* HEADER PART */
  .main-header .header-row { margin-inline: -20px; padding: 22px 20px; }
  .main-header.fixed .header-row { padding: 12px 20px; }
  .main-header .logo { width: 12%; }
  .main-header .manu-part { width: calc(100% - 12%); }
  .main-header .main-menu { margin-right: 15px; }
  .main-header .manu-part .header-btn .btn { padding: 14px 60px 14px 25px; }
  .main-menu ul li a { padding: 10px; }
}



@media only screen and (max-width:1399px) {

  :root {
    /* Layout Adjustments */
    --margin-title: 0 0 20px 0;
    --margin-paragraph: 0 0 20px 0;
    --gap-50: 40px;
    --gap-40: 30px;
  }

  h1, h2, h3, h4, h5, h6 { margin: 0 0 20px; }
  p { margin: 0 0 20px; }
  .mb-50 { margin-bottom: 30px; }
  .mb-60 { margin-bottom: 50px; }
  .padding-common { padding-top: 80px; padding-bottom: 80px; }


  /* HEADER PART */
  
  .main-header .header-row { margin-inline: -80px; padding: 15px 20px; }
  .main-header.fixed .header-row { padding: 10px 20px; }
  .main-header .logo { width: 10%; }
  .main-header.fixed .logo {transform: scale(0.9);}
  .main-header .manu-part { width: calc(100% - 10%); }
  .main-menu ul li a { font-size: 14.5px;}
  .main-header .manu-part .header-btn .btn { font-size: 14.5px; padding: 11px 50px 11px 15px; }
  .main-header .manu-part .header-btn .btn span.button-arrow { width: 33px; height: 33px; right: 6px; }

  /* MAIN PART */
  .hero-section { padding-top: 82px; }
  .what-we-do-item { padding: 30px 25px;}
  .who-we-are-section ul { padding: 16px; }
  .section-logo-img { max-width: 340px;}
  .what-we-support-section .row { margin-inline: -20px; }
  .what-we-support-section .col-item { padding-inline: 20px; }
  .story-item .icon-wrapper { margin-right: 20px; }
  .our-position-section .position-left-area { padding: 50px 30px 84px 30px; }
  .our-position-section .position-right-area { padding: 50px 30px 32% 30px; }
  .contact-form { padding: 30px; }

  /* FOOTER PART */
  .main-footer { padding-top: 80px;}
  .footer-menu ul li:not(:first-child) a, .footer-menu ul li:not(:last-child) a { margin-inline: 2vw; }
  .logo-wrap { max-width: 245px; }


  /* INNER PAGES CSS */
  .features-container { padding-block: 0; }
  .our-position-section .position-right-area.global-commitment { padding: 50px 30px 52% 30px;}

  .vendor-development-row { margin-top: 80px;}

  .insights-card { padding: 50px 30px 50px; }

  .overlapping-img { max-width: 230px; min-height: 230px;}

  .contact-left-wrapper { padding: 40px; }
  .contact-wrapper .contact-form { padding: 60px 40px;}

  .what-we-support-section.vendor-tier-section.padding-common { padding-bottom: 130px; }


}
@media only screen and (max-width:1281px) {
  .main-header .header-row { margin-inline: -30px; }
}

@media only screen and (max-width: 1199px) {
  :root {
    /* Layout Adjustments */
    --gap-50: 28px;
    --gap-40: 25px;
  }


  .main-header .logo { width: 15%; }
  .main-header .manu-part { width: calc(100% - 15%); }
  .main-header .header-row {padding: 15px 0 15px 20px; margin-inline: 0;}
  .main-header.fixed .header-row { padding: 10px 0 10px 20px; }

  /*  ===========mobile nav==========  */
  .hamburger-nav { display: inline-block; }
  .ham { width: 50px; }
  .main-header.mobile-menu-open .header-btn a.btn { background: var(--bs-white); color: #3b7ee7; }
  .main-header.mobile-menu-open .manu-part .header-btn .btn span.button-arrow { background: #3b7ee7; }
  .main-header.mobile-menu-open .manu-part .header-btn .btn span.button-arrow img { filter: brightness(0) invert(1); }
  .main-header.mobile-menu-open .header-btn a.btn:hover span.button-arrow { background: var(--bs-white); }
  .main-header.mobile-menu-open .header-btn a.btn:hover span.button-arrow img { filter: none; }
  .mobile-menu ul li a.btn { display: inline-block; padding: 15px 20px; }
  .mobile-menu-container { display: block; }
  .header-section .right-panel { -ms-flex-pack: end !important; justify-content: flex-end !important; }
  .mobile-menu-logo { max-width: 50px; margin: 0 auto; text-align: center; display: none; }
  .mobile-menu ul li { padding: 0; }
  .mobile-menu ul li a, .mobile-menu ul li a, .mobile-menu ul li { font-size: 20px; color: #fff; text-align: left; text-transform: uppercase; }
  .mobile-menu ul li a:hover { color: var(--bs-white); font-weight: var(--fw-semibold); }
  .mobile-menu ul li ul.sub-menu li { margin: 11px 0; padding: 0 20px; }
  .mobile_menu_btn { margin-top: 30px; }
  .mobile_menu_btn a.btn.plbig { padding-left: 50px; }
  .contact_icon { width: 41px; height: 41px; top: 5px; left: 4px; font-size: 20px; }
  .mobile_menu_btn a.plbig { margin-right: 15px; }
  .common-padd-xl-top { padding-top: 140px; padding-bottom: 60px; }
  .mobile-menu ul li span { margin-left: 10px; }
  .main-menu, .main-header .hdr-rt.mob-hide { display: none; }
  .mobile-menu ul li.menu-item-has-children.menu-open:after { transform: rotate(225deg); transition: border-width 150ms ease-in-out; -webkit-transition: var(--transition-common); -moz-transition: var(--transition-common); -ms-transition: var(--transition-common); -o-transition: var(--transition-common); transition: var(--transition-common); top: 15px; }
  .mobile-menu ul li a { padding: 5px 0; }
  header.main-header.mobile-menu-open .logo img { filter: brightness(0) invert(1); }
  header.main-header.mobile-menu-open .line { stroke: var(--color-white); }
  header.main-header.mobile-menu-open .btn::before, header.main-header.mobile-menu-open a.btn::before { background: #fff; }
  header.main-header.mobile-menu-open .btn, header.main-header.mobile-menu-open a.btn { color: var(--color-white); }
  header .mobile-menu ul { max-width: 320px; margin: 0 auto; }
  header span.dropdown-icon-menu.active::before { transform: rotate(227deg); top: 17px; }
  header span.dropdown-icon-menu::before { content: ""; position: absolute; top: 12px; right: calc(50% - 6px); box-sizing: border-box; height: 12px; width: 12px; border-style: solid; border-color: #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); transition: border-width 150ms ease-in-out; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; margin: 0 auto; }
  header span.dropdown-icon-menu { margin-left: 10px; content: ""; position: absolute; top: -2px; box-sizing: border-box; height: 40px; width: 40px; transform: rotate(0deg); transition: border-width 150ms ease-in-out; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; left: unset; right: 0px; margin: 0 auto; z-index: 9999; display: flex; justify-content: center; align-items: center }
  .mobile-menu-container ul.sub-menu { position: relative; max-height: 0; overflow: hidden; transition: max-height .6s ease-out; box-shadow: 0 0 15px #1e346629; border-radius: 10px; margin-top: 20px; /* padding-bottom: 20px; */ /* background-color: #192c64;  */ background: linear-gradient(90deg, #AF5CFD 0.53%, #349CD7 100%); }
  .mobile-menu-container ul.sub-menu.sub-menu-open { transform: scaleY(1); max-height: 300px; }
  .mobile-menu ul li.menu-item-has-children>a { padding-right: 0; }

  /*  ===========mobile nav==========  */

  /*MAIN PART */
  .hero-section { padding-top: 80px; }
  .what-we-do-item { padding: 20px 15px; }
  .what-we-do-item .image-wraper { width: 68px; margin: 0 auto 22px; }
  .right-img-wrapper.responsive-image-wrapper { margin-top: 30px;}


  /*FOOTER PART */
  .footer-menu ul li:not(:first-child) a, .footer-menu ul li:not(:last-child) a { margin-inline: 1.5vw; }

  /*INNER PAGES CSS */
  .hero-section.inner-banner { max-height: 500px; }
  .hero-section.inner-banner .hero-content p { max-width: 500px; margin-inline: auto; }
  .story-item { padding: 18px 20px 20px 0; }
  .story-item .icon-wrapper { margin-right: 20px; }
  .experience-item { padding: 20px; }
  .experience-item .icon-wraper { max-width: 68px; }
  .our-experience-section .col-lg-3:nth-child(-n+4) { margin-bottom: 24px; }
  .experience-info-text { padding: 30px; }
  .center-circle .circle img { max-width: 180px; }
  .data-centre-section .logo-shape { max-width: 220px; }
  .shape-img-top, .shape-img-bottom { max-width: 420px; }
  .our-position-section .position-left-area .particles-img { position: relative; inset: inherit; max-width: max-content; margin-bottom: -11vw; margin-top: -10vw; transform: scale(1.1); }

  .high-performance-section .position-left-area {padding: 30px;}
  .high-performance-section .permomance-development { padding-left: 0; }
  .high-performance-section .responsive-image-wrapper { padding-bottom: 90%; }
  .high-performance-section .position-right-area.responsive-image-wrapper { padding-bottom: 60%; height: auto; margin-top: 24px; }
  .vendors-engage-section .mt-40 { margin-top: 20px !important; }


  .operational-support-card-outer .col-xl-3:nth-child(-n+2) { margin-bottom: 30px; }
  .operational-support-card .card-icon-title-box { min-height: auto;}
  .disruption-card-box .info-outer { padding: 50px 70px 50px 40px; }


  .consulting-approach-section .story-item { padding: 0 20px 20px; }
  .consulting-approach-section .story-item .icon-wrapper { margin-left: -10px;}
  .consulting-approach-section .story-item::after { height: 91%;}
  .process-circle { width: 21%; }
  .process-circle:not(:last-child) { margin-right: -30px; }

  .stakeholder-card-outer .story-item { padding: 30px 20px;}

  .contact-left-wrapper { padding: 30px; }
  .contact-wrapper .contact-form { padding: 40px 30px; }

  .what-we-support-section.vendor-tier-section.padding-common { padding-bottom: 80px; }

  .error-page-wrapper { padding: 12% 0 6%; }
  .error-page-wrapper .inner-wrap h1 { font-size: 80px;}

}

@media only screen and (max-width: 991px) {
 :root{
    --f-size-Body: 15px;
  }
  .mb-40 { margin-bottom: 30px !important; }
  .padding-common { padding-top: 60px; padding-bottom: 60px; }

  /* HEADER PART */
  .main-header .header-row { padding: 15px 10px 15px 20px; }
  .main-header.fixed .header-row {padding: 10px 10px 10px 20px;}


  /* MAIN PART */
  .section-title { margin-bottom: 30px; }
  .subtitle { font-size: var(--f-size-Body); padding-left: 20px; margin-bottom: 8px !important; }
  .subtitle::before { width: 15px; height: 17px;}
  .section-title h2 { margin-bottom: 20px; }

  .what-we-do-item { margin-top: 20px; height: auto; }
  .what-we-do-section .col-lg-4:first-child .what-we-do-item { margin-top: 0; }
  .who-we-are-left-area { padding-right: 0; margin-bottom: 30px; }
  .what-we-offer-item { margin-top: 20px; height: auto; }
  .what-we-support-section .image-wrapper { height: auto; margin-top: 30px; padding-bottom: 80%; position: relative; overflow: hidden; }
  .what-we-support-section .image-wrapper img {position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
  .what-we-support-section .row { margin-inline: -12px; }
  .what-we-support-section .col-item { padding-inline: 12px; }
  .home-contact-section:after { width: 100%; height: 50%; }
  .our-position-section .position-left-area { height: auto; margin-bottom: 20px; }
  .home-contact-section .contact-left-area { padding-right: 0; margin-bottom: 40px; }
  
  
  /*FOOTER PART */
  .main-footer { padding-top: 60px;}
  .footer-menu { margin-top: 28px; margin-bottom: 24px; }
  .footer-menu ul { flex-wrap: wrap; }
  .logo-wrap { max-width: 180px; margin-bottom: 20px; }
  .email-contact a { max-width: 295px; }
  .footer-bottom {margin-top: 28px; padding: 16px 0; }
  .footer-menu ul li { width: 100%; } 
  .footer-menu ul li:not(:first-child) a, .footer-menu ul li:not(:last-child) a { margin-inline: 0; margin-block: 4px; display: block; }
  .media-footer li a { width: 38px; height: 38px; }
  .media-footer li a img { height: 15px; }
  .bootom-footer { margin-top: 26px; padding: 16px 0; }


  /*INNER PAGES CSS */
  .about-who-we-are-section .responsive-image-wrapper { width: calc(50% - 12px); }
  .particle-img-2 { bottom: 40vw; left: -80px; transform: rotate(320deg); }
  .story-item .icon-wrapper { margin-right: 15px; }
  .story-info { margin-top: 40px; padding: 30px; }
  .story-info .story-info-inner { padding: 20px 15px; }
  .story-info .story-info-inner h4 { max-width: 470px; margin-inline: auto; }
  .team-section .col-lg-3:nth-child(-n+2) { margin-bottom: 24px; } 
  .mission-section p { max-width: 100%; }
  .our-experience-section .col-lg-3:nth-child(-n+6) { margin-bottom: 24px; }
  .features-container .circle { width: 60%; }
  .features-container .center-circle:after, .features-container .center-circle:before {transform: translateY(-50%) scale(1.2);width: 60%;}
  .shape-img-top, .shape-img-bottom { max-width: 350px; }
  .vendor-development-row { margin-top: 60px;}

  .compromise-section .image-wraper { padding-bottom: 60%; margin-top: 24px; }
  .operational-support-card { padding: 0 20px 20px; }
  .list-icon li:not(:last-child) { margin-bottom: 10px; }
  .insights-card .bg-image { max-width: 35%; bottom: 0; }
  .insights-card { height: auto; margin-bottom: 24px; }
  .disruption-card-box .info-outer { padding: 40px 40px 100px 40px; }
  .support-stage .short-discription { margin-left: 0; }

  .stakeholder-card-outer .col-lg-4 .story-item { height: auto;}
  .stakeholder-card-outer .col-lg-4:not(:first-child) .story-item { margin-top: 24px;}
  .overlaping-big-img { margin-left: 15vw; }
  .what-we-support-section.vendor-tier-section.padding-common { padding-bottom: 130px; }
  .driving-performance-section .story-item { max-width: 100%;}
  .driving-performance-section .image-wrapper { margin: 30px 0;}
  .driving-performance-section .image-wrapper img { width: 100%; }
  .driving-performance-section .story-item:not(:last-child) { margin-bottom: 24px; }
  .driving-performance-section .section-title h2 { max-width: 600px; margin-inline: auto; }

  .what-we-support-section.vendor-tier-section.padding-common { padding-bottom : 130px; }


  .contact-left-wrapper { height: auto; margin-bottom: 24px;}

}


@media only screen and (max-width: 767px) {

  .container { max-width: 95%;}
  .padding-common { padding-top: 50px; padding-bottom: 50px; }
  .form-row { margin-bottom: 15px; }
  .mt-40 { margin-top: 24px !important; }
  .mb-40 { margin-bottom: 24px !important; }
  .mb-24 { margin-bottom: 20px !important; }
  
  /* HEADER PART */
  .main-header .header-row { padding: 12px 0 12px 10px; }
  .main-header.fixed .header-row { padding: 5px 0 5px 10px; }
  .main-header .logo { width: 30%; }
  .main-header .manu-part { width: calc(100% - 30%); }
  .main-header .manu-part .header-btn .btn { font-size: 14px; padding: 10px 50px 10px 12px; border-radius: 8px; }
  .main-header .manu-part .header-btn .btn span.button-arrow { width: 30px; height: 30px; }
  .main-header .manu-part .header-btn .btn span.button-arrow img { width: 12px; }
  header .mobile-menu ul { max-width: 100%;}

 /* MAIN PART */
  .hero-section { padding-top: 95px; }
  .subtitle { margin-bottom: 6px !important; }
  .who-we-are-section ul { margin-top: 20px; }
  .right-img-wrapper.responsive-image-wrapper { padding-bottom: 42%;}
  .section-logo-img { max-width: 220px; }
  .support-listing ul li .content-wrapper { padding-left: 20px; }
  .support-listing ul { padding-block: 20px; }
  .our-position-section .position-left-area { padding: 30px 20px 120px 20px; }
  .our-position-section .content-wrapper { padding: 20px; }
  .who-we-are-left-area { margin-bottom: 30px; }
  .our-position-section .position-right-area { padding: 30px 20px 32% 20px; }
  .contact-info { padding: 18px; }
  .contact-form { padding: 30px 20px; }
  

  /*FOOTER PART */
  .main-footer { padding-top: 40px; }
  .email-contact a { max-width: 265px; padding: 14px 20px; }


  /* INNER PAGES CSS */
  .hero-section.inner-banner { max-height: 450px; }
  .data-centre-section.padding-common { padding-bottom: 50px; }
  .data-centre-section .logo-shape { max-width: 190px; top: -40px; }
  .data-centre-section .section-title { margin: 0; }
  .about-who-we-are-section .responsive-image-wrapper { width: 80%; padding-bottom: 100%; }
  .about-who-we-are-section .image-wrapper-one.responsive-image-wrapper { margin: 0; }
  .about-who-we-are-section .image-wrapper-two.responsive-image-wrapper { margin: -100px 0 30px auto; border: 5px solid var(--bs-white); border-radius: 8px;}
  .about-who-we-are-section .section-title { margin: 0; }
  .story-item .icon-wrapper { width: 75px; height: 75px; }
  .story-item.story-item-transparent .icon-wrapper img { max-height: 39px; }
  .story-info { padding: 30px 18px; }
  .team-section .col-lg-3:not(:last-child) { margin-bottom: 24px; }
  .mission-section { padding-block: 18%; }
  .features-container .center-circle { margin: 40px 0; }
  .features-container .circle { width: 95%; }
  .features-container .center-circle:after, .features-container .center-circle:before { width: 100%;}
  .our-position-section .position-right-area.global-commitment { padding: 30px 20px 52% 20px; }


  .vendor-development-row { margin-top: 40px; }
  .high-performance-section .permomance-development { margin-top: 30px; }
  .high-performance-section .position-left-area { padding: 30px 20px; }
  .high-performance-section .position-right-area.responsive-image-wrapper { margin-top: 24px;}
  .high-performance-section .position-left-area ul li { padding: 9px 15px 9px 40px; }
  .high-performance-section .position-left-area ul li::before { left: 10px; }
  .operational-support-card-outer .col-xl-3:not(:last-child) { margin-bottom: 24px; }
  .insights-card { padding: 30px 20px; }
  .operators-card-outer .row { row-gap: 24px; }
  .disruption-card-box .image-wraper { padding-bottom: 70%; }
  .disruption-card-box .info-outer { padding: 30px 20px; }
  .disruption-card-box .icon { width: 95px; height: 95px; position: relative;margin-bottom: -45px; }


  .compromise-section .info-wraper ul li { margin-bottom: 8px; padding-left: 13px; }
  .compromise-section .info-wraper ul li::before { width: 6px; height: 6px; }
  .what-we-support-section.vendor-tier-section.padding-common { padding-bottom: 115px; }
  .overlapping-img { max-width: 40vw; min-height: 40vw; }
  .support-listing ul li:not(:last-child) { margin-bottom: 20px; padding-bottom: 20px; }
  .rounded-icon-wrapper { width: 68px; height: 68px; }
  .rounded-icon-wrapper img { height: 34px; }
  .driving-performance-section .story-item .icon-wrapper { width: 68px; height: 68px; padding: 10px; }
  .driving-performance-section .story-item { padding: 25px 20px;}
  .operators-card .operators-card-image-outer { max-width: 70%;}
  
  .contact-left-wrapper, .contact-wrapper .contact-form { padding: 30px 20px; }
  .contact-left-wrapper ul li .contact-info a { white-space: normal; word-break: break-word; }

  .error-page-wrapper { padding: 90px 0 50px; }

}

@media only screen and (max-width: 575px) {


}

@media only screen and (max-width: 479px) {

  /*HEADER PART */
  .main-header .header-row { margin-inline: -8px; }
  .main-header .manu-part .header-btn .btn {padding: 8px 43px 8px 10px;}
  .main-header .manu-part .header-btn .btn span.button-arrow { width: 28px; height: 28px; right: 5px; }


  /*MAIN PART */
  .hero-section { padding-top: 75px; }
  
  /* INNER PAGES CSS */
  .section-title .justify-content-center h6.subtitle { max-width: 300px; }
  .shape-1 { max-width: 170px;}

  .error-page-wrapper { padding: 70px 0 50px; }
  .error-page-wrapper .inner-wrap { padding: 40px 20px; }
  .error-page-wrapper .inner-wrap p.lead { font-size: 16px; max-width: 300px; margin-inline: auto; }

  .what-we-support-section.vendor-tier-section.padding-common { padding-bottom: 120px; }

}