@import url('https://fonts.googleapis.com/css2?family=Urbanist:ital,wght@0,100..900;1,100..900&display=swap');

@import url('https://fonts.cdnfonts.com/css/neo-sans-arabic');

:root {
   /* Colors: */
   --main: #2A4B80;
   --main-darker: #0D1626;
   --secondry: #20A3DB;
   --nav-link: #192D4D;
   --dark: #181818;
   --gray: #4D4D4D;
   --muted-text: #434343;
   --input: #FAFAFA;
   --white: #fff;
   --black: #000;

   /* Layout */
   --gutter-x: 5.5rem;

   /* opacity */
   --mainOp: 42, 75, 128;
   --secOp: 32, 163, 219;
   --whiteOp: 255, 255, 255;
   --blackOp: 0, 0, 0;
   --dir-multiplier: 1;
}

[dir="rtl"] {
   --dir-multiplier: -1;
}


.container-fluid {
   --bs-gutter-x: calc(var(--gutter-x) * 2) !important;
}

::-webkit-scrollbar {
   height: 0.5rem;
   width: 0.6rem;
}

::-webkit-scrollbar-thumb {
   background-color: var(--secondry);
}

* {
   font-family: 'Urbanist', sans-serif;
   margin: 0;
   padding: 0;
   box-sizing: border-box;
   outline: none;
   border: none;
   text-decoration: none;
   transition: .2s linear;
}


[dir="rtl"] *:not([class*="fa-"]):not([class*="fa "]):not(.fab):not(.fas):not(.far):not(.fal):not(.fad):not(.fa) {
    font-family: 'Neo Sans Arabic', sans-serif;
}

[dir="ltr"] * {
   text-transform: capitalize;
}

p {
   margin: 0;
}

html {
   overflow-x: hidden;
   scroll-behavior: smooth;
   background-color: var(--main-darker);
}

body {
   overflow-x: hidden;
   border-radius: 1.5rem;
   -webkit-border-radius: 1.5rem;
   -moz-border-radius: 1.5rem;
   -ms-border-radius: 1.5rem;
   -o-border-radius: 1.5rem;
}


a {
   text-decoration: none;
   color: inherit;
}

ol,
ul {
   padding-inline-start: 0rem !important;
   list-style: none;
   margin: 0;
}

ol li::marker {
   content: "";
}


/* width */
::-webkit-scrollbar {
   width: 4px;
}

/* Track */
::-webkit-scrollbar-track {
   box-shadow: inset 0 0 5px rgba(128, 128, 128, 0.63);
}

/* Handle */
::-webkit-scrollbar-thumb {
   background: var(--gray);
   border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
   background: var(--main);
}

::selection {
   color: #fff;
   background-color: var(--secondry);
}

.dropdown-toggle::after {
   vertical-align: 0.155em;
   border-top-color: var(--secondry);
}


/* ------------- global --------------- */
[dir=rtl] [type=email],
[type=number],
[type=tel],
[type=url] {
   direction: rtl;
}

[dir=rtl] i[class*="fa-arrow-left"],
[dir=rtl] i[class*="fa-chevron-left"] {
   transform: rotate(180deg);
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   -ms-transform: rotate(180deg);
   -o-transform: rotate(180deg);
}

#loading {
   position: fixed;
   top: 0;
   inset-inline-end: 0;
   width: 100%;
   height: 100%;
   z-index: 999999;
   background-color: var(--white);
   display: flex;
   justify-content: center;
   align-items: center;
}

.loader {
   position: relative;
   width: 100px;
   letter-spacing: 2px;
   display: inline-block;
   box-sizing: border-box;
   animation: floating 1s ease-out infinite alternate;
}

.loader img {
   width: 90px;
}

.loader::after {
   content: '';
   width: 80%;
   height: 20px;
   background: rgba(var(--black), 0.424);
   position: absolute;
   inset-inline-end: 10%;
   top: 110%;
   filter: blur(4px);
   border-radius: 50%;
   box-sizing: border-box;
   animation: animloader 1s ease-out infinite alternate;
}

@keyframes floating {
   0% {
      transform: translateY(0);
   }

   100% {
      transform: translateY(-25px);
   }
}

@keyframes animloader {
   0% {
      transform: scale(0.8);
   }

   100% {
      transform: scale(1.2);
   }
}

.dark-bg {
   color: var(--white);
   background-color: var(--main-darker) !important;
}

.secName {
   font-size: 1.25rem;
   display: flex;
   align-items: center;
   gap: .3rem;
}

.secName::before {
   content: '';
   display: inline-flex;
   width: 1.5rem;
   height: .75rem;
   background: var(--main);
   border-radius: 3rem;
   -webkit-border-radius: 3rem;
   -moz-border-radius: 3rem;
   -ms-border-radius: 3rem;
   -o-border-radius: 3rem;
}

.secTitle {
   font-size: 2.8rem;
   font-weight: bold;
   text-wrap: balance;
   margin-block: .4rem;
}

.more {
   display: flex;
   align-items: center;
   gap: 10px;
   font-size: 1.2rem;
   font-weight: bold;
   color: var(--white) !important;
   margin-block: 1rem;
}

.overlay {
   position: absolute;
   inset: 0;
   background-color: rgba(var(--blackOp), 0.6);
   z-index: 3;
   color: var(--white);
}


img {
   max-width: 100%;
   object-fit: cover;
}

.form-control {
   padding-block: .55rem;
   width: 100%;
   font-size: 1rem;
   font-weight: 400;
   border: 1px solid rgba(var(--blackOp), 0.2);
   border-radius: 70px;
   background: transparent !important;
   transition: .15s ease-in-out;
   box-shadow: none !important;
   -webkit-border-radius: 70px;
   -moz-border-radius: 70px;
   -ms-border-radius: 70px;
   -o-border-radius: 70px;
}

textarea.form-control {
   border-radius: .95rem;
   -webkit-border-radius: .95rem;
   -moz-border-radius: .95rem;
   -ms-border-radius: .95rem;
   -o-border-radius: .95rem;
}


.select2-dropdown {
   background-color: var(--white) !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container .select2-selection--single {
   height: 48.4px;
   color: var(--black);
   line-height: 48.4px;
   font-size: .9rem;
   font-weight: 300;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
   background: var(--light);
   color: var(--black);
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
   inset-inline-end: 8px !important;
   height: 48.4px;
}

.select2-container .select2-dropdown--below {
   background: var(--black);
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
   border-color: transparent transparent var(--black) transparent;
}

.select2-container .select2-selection--single .select2-selection__arrow b {
   border-color: var(--black) transparent transparent transparent;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
   background: var(--main);
}

.select2-results__option {
   font-size: .9rem;
   font-weight: 300;
}



.accordion-button:not(.collapsed)::after {
   filter: brightness(0);
}

.accordion-button::after {
   margin-inline-end: unset;
   margin-inline-start: auto;
}

.link {
   position: absolute;
   inset: 0;
   z-index: 1;
}

.scrollUp {
   position: fixed;
   bottom: 35px;
   inset-inline-start: calc(var(--gutter-x) * .75);
   z-index: 9999;
}

.scrollUp a i {
   display: flex;
   align-items: center;
   justify-content: center;
   color: var(--main-darker);
   background: var(--white);
   border-radius: 50%;
   box-shadow: 0 2px 6px 0 rgb(0 0 0 / 30%);
   transition: .5s;
   font-size: 1rem;
   width: 2.4rem;
   aspect-ratio: 1 / 1;
}

.Stars {
   --percent: calc(var(--rating) / 5 * 100%);
   font-size: 1.125rem;
   transform: rotateY(calc((180deg) * var(--dir-multiplier)));
   -webkit-transform: rotateY(calc((180deg) * var(--dir-multiplier)));
   -moz-transform: rotateY(calc((180deg) * var(--dir-multiplier)));
   -ms-transform: rotateY(calc((180deg) * var(--dir-multiplier)));
   -o-transform: rotateY(calc((180deg) * var(--dir-multiplier)));
}

.Stars::before {
   content: "\f005 \f005 \f005 \f005 \f005";
   font-family: fontAwesome;
   background: linear-gradient(-90deg, #fbf30e var(--percent), #e6e6e6 var(--percent));
   -webkit-background-clip: text;
   -webkit-text-fill-color: transparent;
}

.breadcrumb-wrapper {
   position: relative;
   color: #fff !important;
   --bs-breadcrumb-divider: '/';
   background: url(../images/line-pattern.png);
   background-size: cover;
   background-position: center;
   padding-block: 3rem 6rem;
   border-radius: 1.4rem;
   -webkit-border-radius: 1.4rem;
   margin-bottom: 14rem;
   text-align: center;
}

.breadcrumb-title {
   font-size: 2.4rem;
   font-weight: bold;
   position: relative;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: .75rem;
}

.breadcrumb-title::before {
   content: '';
   width: .8rem;
   height: .8rem;
   background: var(--secondry);
   display: flex;
}

.breadcrumb {
   text-align: center;
   position: relative;
   margin: 0;
   margin-block: 1.4rem 4.4rem;
   font-size: 1rem;
   display: flex;
   align-items: center;
   justify-content: center;
}

.breadcrumb .breadcrumb-item a {
   color: #fff;
   font-weight: 300;
}

.breadcrumb .breadcrumb-item.active {
   color: #fff;
}

.breadcrumb-item+.breadcrumb-item::before {
   color: #fff;
}

.breadcrumb-img {
   aspect-ratio: 11/5;
   object-fit: cover;
   border-radius: 1.4rem;
   -webkit-border-radius: 1.4rem;
   -moz-border-radius: 1.4rem;
   -ms-border-radius: 1.4rem;
   -o-border-radius: 1.4rem;
   margin-bottom: -25%;
   width: 90%;
}

.main-btn,
.main-outline-btn {
   background: var(--main);
   color: var(--white);
   text-align: center;
   overflow: hidden;
   position: relative;
   padding: .5rem 1.2rem;
   font-weight: 500;
   border-radius: 70px;
   -webkit-border-radius: 70px;
   -moz-border-radius: 70px;
   -ms-border-radius: 70px;
   -o-border-radius: 70px;
   box-shadow: unset !important;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: .4rem;
   width: fit-content;
   min-width: 169px;
}

.main-outline-btn {
   background: transparent;
   border: 1px solid var(--main);
   color: var(--main) !important;
}

.main-btn i,
.main-outline-btn i {
   font-size: .75rem;
}

.main-outline:hover,
.main-outline-btn:hover {
   border-color: var(--main) !important;
}

.social-icons {
   display: flex;
   align-items: center;
   gap: .5rem;
}

.social-icons i {
   width: 2rem;
   aspect-ratio: 1/1;
   border-radius: 50%;
   background-color: var(--white);
   display: flex;
   justify-content: center;
   line-height: 0;
   align-items: center;
   color: var(--main-darker) !important;
   font-size: .9rem;
   transition: .4s;
   -webkit-transition: .4s;
   -moz-transition: .4s;
   -ms-transition: .4s;
   -o-transition: .4s;
}

.social-icons i:hover {
   background-color: var(--main);
   color: var(--white) !important;
}

@keyframes shake {
   0% {
      transform: translateX(4%);
      -webkit-transform: translateX(4%);
      -moz-transform: translateX(4%);
      -ms-transform: translateX(4%);
      -o-transform: translateX(4%);
   }

   60% {
      transform: translateX(6%);
      -webkit-transform: translateX(6%);
      -moz-transform: translateX(6%);
      -ms-transform: translateX(6%);
      -o-transform: translateX(6%);
   }

   80% {
      transform: translateX(8%);
      -webkit-transform: translateX(8%);
      -moz-transform: translateX(8%);
      -ms-transform: translateX(8%);
      -o-transform: translateX(8%);
   }

   100% {
      transform: translateX(0);
      -webkit-transform: translateX(0);
      -moz-transform: translateX(0);
      -ms-transform: translateX(0);
      -o-transform: translateX(0);
   }
}

@keyframes showAnimation {
   0% {
      transform: scaleY(0.1);
   }

   40% {
      transform: scaleY(1.04);
   }

   60% {
      transform: scaleY(0.98);
   }

   80% {
      transform: scaleY(1.04);
   }

   100% {
      transform: scaleY(0.98);
   }

   80% {
      transform: scaleY(1.02);
   }

   100% {
      transform: scaleY(1);
   }
}

/* ------ owl-carousels section ------  */
.owl-carousel .owl-stage-outer {
   position: relative;
}

.owl-carousel .owl-stage {
   display: flex;
   /* align-items: center; */
}

/* ------------- navbar ------------ */
nav.navbar {
   padding: 0;
   width: 100%;
   z-index: 999;
}

.navbar-nav {
   justify-content: space-evenly;
   margin: 0 auto;
   gap: 1.5rem;
}

.navbar-brand {
   margin: .5rem 0;
}

.navbar-brand img {
   width: 4.5rem;
   object-fit: contain;
   overflow: initial;
}

.navbar a.nav-link {
   color: var(--nav-link);
   font-weight: 600;
}

.navbar .nav-link.active {
   color: var(--secondry);
   font-weight: 900;
}

/* ======================= home page ======================= */

/* ------------- .hero-sec -------------- */
.hero-sec {
   z-index: 4;
   position: relative;
   background: url('../images/line-pattern.png');
   background-size: cover;
}

.hero-sec .hero-text {
   color: var(--gray);
   font-weight: 500;
}

.hero-sec .hero-img {
   width: 100%;
   height: 100%;
   object-fit: cover;
   z-index: -2;
   border-radius: 1.6rem;
   -webkit-border-radius: 1.6rem;
   -moz-border-radius: 1.6rem;
   -ms-border-radius: 1.6rem;
   -o-border-radius: 1.6rem;
   aspect-ratio: 6/3;
}

.hero-sec .header-content {
   width: 100%;
   height: 100%;
   position: relative;
   z-index: 99;
   display: flex;
   flex-direction: column;
   padding-block: 3rem;
}

.hero-sec .header-content .content {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: space-between;
   flex-grow: 1;
   padding: .25rem;
   margin-bottom: 1.5rem;
   gap: .25rem;
}

.hero-sec .header-content .content .Ftitle {
   font-size: 4rem;
   font-weight: 900;
   text-align: center;
}

.hero-sec .header-content .content .Ftitle * {
   text-transform: uppercase;
}

.hero-sec .header-content .content .Ftitle .siteName {
   color: var(--main);

}

.hero-sec .header-content .content .Ftitle img {
   width: 3.8rem;
   height: auto;
   margin-bottom: .75rem;

}

[dir='rtl'] .more i {
   transform: rotateY(calc(180deg * var(--dir-multiplier))) !important;
   -webkit-transform: rotateY(calc(180deg * var(--dir-multiplier))) !important;
   -moz-transform: rotateY(calc(180deg * var(--dir-multiplier))) !important;
   -ms-transform: rotateY(calc(180deg * var(--dir-multiplier))) !important;
   -o-transform: rotateY(calc(180deg * var(--dir-multiplier))) !important;
}


/* ------------- about --------------- */
.about {
   position: relative;
   z-index: 4;
   padding-block: 6rem;
   color: var(--white);
   background-image: url('../images/half-circle-pattern.png');
   background-size: 40%;
   background-repeat: no-repeat;
   background-position: 10% 160%;
   border-radius: 1.6rem;
   -webkit-border-radius: 1.6rem;
   -moz-border-radius: 1.6rem;
   -ms-border-radius: 1.6rem;
   -o-border-radius: 1.6rem;
}

.about .about-content {
   font-weight: 300;
   color: #d3d3d3;
   line-height: 1.5;
   font-size: .9rem;
   margin-block: 1.4rem;
}

.about small {
   color: #d3d3d3;
}

.scroll-text span {
   color: #626262;
   font-size: 2.2rem;
   font-weight: bold;
   text-transform: uppercase;
   transition: color 0.2s linear;
   -webkit-transition: color 0.2s linear;
   -moz-transition: color 0.2s linear;
   -ms-transition: color 0.2s linear;
   -o-transition: color 0.2s linear;
}

.scroll-text span.active {
   color: var(--white);
}

.services .title p,
.about-txt li,
.about-feature p {
   color: #4D4D4D;
}

.services .title p,
.about-txt li {
   border-inline-start: 3px solid rgba(var(--secOp), .5);
   padding-inline-start: 1rem;
   margin-block: 1.35rem;
   line-height: 1.8;
}


.counters .col:not(:last-child) {
   border-inline-end: 2px solid rgba(156, 163, 175, 0.50);
   ;
}

.counters .counter {
   margin: .5rem;
   font-size: 2.2rem;
   font-style: normal;
   font-weight: 700;
   color: var(--secondry);
}

.counters .counterName {
   margin-bottom: .75rem;
}


/* ------------- projects sections --------------- */
.projects .row:nth-child(even) {
   flex-direction: row-reverse;
}

.projects .proj-details {
   display: flex;
   padding: 2.4rem 3rem 2.6rem 3rem;
   flex-direction: column;
   align-items: flex-start;
   gap: .7rem;
   border-radius: 24px;
   background: #ECF1F9;
   margin-inline: -20px;
   z-index: 0;
   position: relative;
}

.projects .proj-details .proj-num {
   display: flex;
   width: 2rem;
   aspect-ratio: 1/1;
   font-size: 1.1rem;
   font-weight: bold;
   justify-content: center;
   align-items: center;
   background: #D9E2F2;
   color: var(--main);
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
}

.projects .proj-details .proj-desc {
   color: #434343;
   font-size: .85rem;
}

.projects .proj-img {
   position: relative;
   border-radius: 1.5rem;
   -webkit-border-radius: 1.5rem;
   -moz-border-radius: 1.5rem;
   -ms-border-radius: 1.5rem;
   -o-border-radius: 1.5rem;
   overflow: hidden;
}

.projects .proj-img img {
   width: 100%;
   aspect-ratio: 8 / 5;
   object-position: center;
}

.projects .proj-img img {
   aspect-ratio: 8 / 5;
   object-position: center;
}

.projects .proj-img:hover img {
   transform: scale(1.1);
   -webkit-transform: scale(1.1);
   -moz-transform: scale(1.1);
   -ms-transform: scale(1.1);
   -o-transform: scale(1.1);
}

/* ------------- careers sections --------------- */
.career-filter {
   padding: 32px;
   justify-content: center;
   align-items: center;
   border-radius: 24px;
   border: 1px solid #E6E6E6;
   background: #ECF1F9;
}


.select2-container--default .select2-selection--single,
.career-filter .form-control {
   background: var(--white) !important;
   border-radius: 12px !important;
   -webkit-border-radius: 12px !important;
   -moz-border-radius: 12px !important;
   -ms-border-radius: 12px !important;
   -o-border-radius: 12px !important;
   border: 1px solid #E6E6E6;
}

.talent .select2-container--default .select2-selection--single{
   border: 1px solid rgba(var(--blackOp), 0.2);
   border-radius: 70px !important;
   -webkit-border-radius: 70px !important;
   -moz-border-radius: 70px !important;
   -ms-border-radius: 70px !important;
   -o-border-radius: 70px !important;
}

.career-filter .filter_search {
   background: var(--main) !important;
   color: var(--white);
}

.career p {
   color: #666;
   font-size: .9rem;
}

.career .apply-btn {
   background: var(--main);
   color: var(--white);
   display: flex;
   padding: .6rem 1.2rem;
   border-radius: 12px;
   align-items: center;
   -webkit-border-radius: 12px;
   -moz-border-radius: 12px;
   -ms-border-radius: 12px;
   -o-border-radius: 12px;
}

.file-input.form-control {
   border-radius: 32px;
   border: 1px dashed rgba(0, 0, 0, 0.20);
}

.file-input {
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   padding: 2rem;
   gap: .5rem;
}

.file-input i {
   background: #ECF1F9;
   color: var(--main);
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   width: 2.25em;
   aspect-ratio: 1/1;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
}

.file-input>[type='file'] {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   opacity: 0;
   z-index: 10;
   cursor: pointer;
}


.talent-slider .card-img-top {
    border-radius: 22px;
    -webkit-border-radius: 22px;
    -moz-border-radius: 22px;
    -ms-border-radius: 22px;
    -o-border-radius: 22px;
    overflow: hidden;
}
.talent-slider .card-img-top img {
    aspect-ratio: 10 / 12;
}


/* ------------- industries sections --------------- */
.counters,
.industries {
   background: url('../images/line-pattern.png');
   background-size: cover;
   background-position: center;
   padding-block: 6rem;
   border-radius: 1.4rem;
   -webkit-border-radius: 1.4rem;
   -moz-border-radius: 1.4rem;
   -ms-border-radius: 1.4rem;
   -o-border-radius: 1.4rem;
}

.industries .owl-marquee .item {
   display: flex;
   align-items: center;
   height: 100%;
   justify-content: center;
   padding: 1.6rem .5rem;
   border: 1px solid rgba(var(--whiteOp), 0.2);
   border-radius: 1.2rem;
   -webkit-border-radius: 1.2rem;
   -moz-border-radius: 1.2rem;
   -ms-border-radius: 1.2rem;
   -o-border-radius: 1.2rem;
   font-weight: bold;
   font-size: 1.1rem;
}

.industries .owl-marquee .item:hover {
   background: rgba(var(--mainOp), .5);
   border: 1px solid rgba(var(--mainOp), .5);
}

/* force linear timing for smooth continuous motion */
.industries .owl-marquee .owl-stage {
   transition-timing-function: linear !important;
}


/* ------------- banner sections --------------- */
.banner {
   background: url('../images/welcome-img.jpg') rgba(var(--blackOp), 0.6);
   background-size: cover;
   background-position: center;
   padding: 3rem 2rem;
   border-radius: 1.5rem;
   -webkit-border-radius: 1.5rem;
   -moz-border-radius: 1.5rem;
   -ms-border-radius: 1.5rem;
   -o-border-radius: 1.5rem;
   overflow: hidden;
   text-align: center;
}

.banner .banner-content {
   color: var(--white);
}

.banner .banner-content .banner-title {
   font-size: 2.85rem !important;
}

.banner .banner-content img {
   filter: brightness(0) invert(1);
   -webkit-filter: brightness(0) invert(1);
}

.banner .banner-content p {
   font-size: 2rem;
   font-weight: 500;
   line-height: 1.25;
   margin: .85rem 0;
}

/* ------------- services sections --------------- */
.card {
   height: 100%;
   border: unset;
   background: transparent;
}

.services {
   padding-block: 4rem;
   counter-reset: item;
}

.services ol {
   list-style: unset !important;
}


.services .serv {
   border-bottom: 1px solid #DCDCDC;
   padding-block: 1.8rem;
}

.services .serv-num::before {
   counter-increment: item;
   content: counter(item, decimal-leading-zero);
   color: #181818;
   font-weight: bold;
   width: 2rem;
   aspect-ratio: 1/1;
   font-size: .9rem;
   display: flex;
   justify-content: center;
   align-items: center;
   background: #F2F2F2;
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
   margin-bottom: 1rem;
}

.services .serv .serv-title {
   font-weight: bold;
   font-size: 1.8rem;
   text-wrap-style: balance;
}

.services .serv .serv-desc {
   display: flex;
   align-items: center;
   gap: 1rem;

}

.services .serv .serv-desc p {
   font-weight: 500;
   line-height: 1.5;
   color: #666;
   width: calc(100% - 4.2rem);
}

.services .serv .serv-desc .show {
   width: 3rem;
   height: 3rem;
   font-size: 1.5rem;
   display: flex;
   justify-content: center;
   align-items: center;
   background: #F2F2F2;
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
}

.services .serv:hover .show {
   background: var(--main);
   color: var(--white);
   transform: rotate(-40deg);
   -webkit-transform: rotate(-40deg);
   -moz-transform: rotate(-40deg);
   -ms-transform: rotate(-40deg);
   -o-transform: rotate(-40deg);
}

.career,
.about-feature,
.serv-feature {
   position: relative;
   display: flex;
   height: 100%;
   padding: 2.4rem 1.4rem;
   flex-direction: column;
   align-items: flex-start;
   gap: .75rem;
   flex: 1 0 0;
   align-self: stretch;
   border-radius: 32px;
   border: 1px solid var(--Black-Opacity-20, rgba(0, 0, 0, 0.20));
}

.serv-feature::before {
   content: '';
   background: url('../images/folder-check-fill.svg');
   display: flex;
   width: 2.4rem;
   aspect-ratio: 1/1;
   background-size: 100%;
}

.candidates li {
   border-inline-start: 3px solid var(--secondry);
   padding-inline-start: 1rem;
   margin-block: 1.35rem;
}

.serv-img img {
   aspect-ratio: 3 / 2;
   border-radius: 20px;
   filter: brightness(.6);
   -webkit-filter: brightness(.6);
}

.serv_features .card::before {
   content: '';
   position: absolute;
   top: 1.5rem;
   inset-inline-start: 3.9rem;
   width: calc(100% - 2.8rem);
   border-bottom: 2px solid var(--white);
}

.serv_features .card .feature-desc {
   color: #B7B8BB;
}

/* ------------- contact --------------- */
.contact-data .contact-info {
   position: relative;
   height: 100%;
}

.contact-data .contact-wrapper {
   padding: 1.5rem 1.2rem;
   border: 1px solid rgba(var(--blackOp), 0.24);
   height: 100%;
   border-radius: 1.4rem;
   -webkit-border-radius: 1.4rem;
   -moz-border-radius: 1.4rem;
   -ms-border-radius: 1.4rem;
   -o-border-radius: 1.4rem;
}

.contact-data .contact-info .d-flex a {
   font-size: .85rem;
   font-weight: 600;
}

.contact-data .contact-info .d-flex a:not(:last-child) {
   border-inline-end: 1px solid rgba(var(--blackOp), 0.7);
   padding-inline-end: .5rem;
}

.contact-data .contact-info i {
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: .7rem;
   aspect-ratio: 1/1;
   width: 2rem;
   color: #181818;
   border: 1px solid rgba(var(--blackOp), 0.2);
   border-radius: 50%;
   -webkit-border-radius: 50%;
   -moz-border-radius: 50%;
   -ms-border-radius: 50%;
   -o-border-radius: 50%;
}

.contact-us label {
   color: rgba(var(--blackOp), 0.424);
   margin-bottom: .5rem;
}


.FQA .accordion-item {
   margin-bottom: 1rem;
   border: 1px solid #E6E6E6 !important;
   border-radius: 1.1rem;
   overflow: hidden;
   -webkit-border-radius: 1.1rem;
   -moz-border-radius: 1.1rem;
   -ms-border-radius: 1.1rem;
   -o-border-radius: 1.1rem;
}

.FQA .accordion-item:has(.accordion-button:not(.collapsed)) {
   background: var(--main);
}

.FQA .accordion-item .accordion-body {
   background: transparent;
   color: var(--white);
   padding: 0rem 1.65rem 1.25rem 1.65rem;
}

.FQA .accordion-item .accordion-header {
   border-radius: 15px;
}

.FQA .accordion-button {
   font-weight: 500;
   box-shadow: unset !important;
   background-color: transparent !important;
   padding: 1.5rem 1.85rem !important;
}

.FQA .accordion-button:not(.collapsed) {
   color: var(--white) !important;
}

.FQA .accordion-button::after {
   --size: .9rem;
   width: var(--size);
   height: var(--size);
   background-image: url('../images/plus.svg');
   background-size: var(--size);
}

.FQA .accordion-button:not(.collapsed)::after {
   filter: brightness(0) invert(1);
   transform: rotate(-135deg);
}

/* ------------- footer --------------- */
footer {
   position: relative;
   background: var(--main-darker);
   border-radius: 1.4rem;
   -webkit-border-radius: 1.4rem;
   -moz-border-radius: 1.4rem;
   -ms-border-radius: 1.4rem;
   -o-border-radius: 1.4rem;
   color: var(--white);
}

.footer-nav .navbar-brand img {
   width: 3.3rem;
}

.footer-nav .navbar-brand span {
   color: var(--white) !important;
   font-weight: 600;
   font-size: .92rem;
}

.footer-nav .navbar .navbar-nav {
   flex-direction: column;
   gap: 0rem;
   justify-content: flex-start;
}

.footer-nav .navbar .navbar-nav .nav-link {
   color: var(--white) !important;
   padding: .152rem 0;
   font-weight: 300;
   font-size: .85rem;
}


footer .sub-footer {
   overflow: hidden;
}

footer .sub-footer a {
   position: relative;
   color: #fff;
   font-size: .85rem;
}


footer .sub-footer .nav-link {
   padding: .5rem;
}

footer .sub-footer img {
   width: 50%;
   margin-bottom: -8%;
   filter: brightness(0) invert(1);
   opacity: .1;
   -webkit-filter: brightness(0) invert(1);
}

footer .navbar a {
   color: var(--main) !important;
}

/* -------- media -------- */
.policy li ul {
   padding-block: .5rem;
   color: #4D4D4D;
   list-style: disc;
   padding-inline-start: 2rem !important;
}

/* -------- media -------- */
@media (min-width: 768px) {
   html {
      font-size: 18px;
   }
}

@media (min-width: 1200px) {
   html {
      font-size: 18px;
   }

}

@media (min-width: 1800px) {
   html {
      font-size: 20px;
   }
}

@media (min-width: 2400px) {
   html {
      font-size: 33px;
   }
}


@media(max-width: 1200px) {}

@media(max-width: 992px) {
   :root {
      --gutter-x: 1.5rem;
   }

   nav.navbar>.container-fluid {
      flex-direction: row-reverse;
   }

   nav .navbar-nav {
      gap: 0.5rem;
   }

   .navbar-collapse {
      margin-bottom: 1rem;
   }

   .navbar-toggler {
      padding: 0;
      border: unset;
      box-shadow: unset !important;
   }

   .hero-sec .header-content .content .Ftitle {
      font-size: 3rem;
   }

   footer .navbar-nav {
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: center;
      gap: .5rem 1.5rem;
   }

   footer .navbar a {
      margin: auto !important;
   }
}

@media(max-width: 576px) {
   :root {
      --gutter-x: .5rem;
   }

   footer .sub-footer .container-fluid {
      flex-wrap: wrap;
      justify-content: center;
      text-align: center;
   }

   footer .sub-footer .container-fluid a {
      display: flex;
      align-items: center;
      font-size: 12px;
   }

   footer .sub-footer img {
      width: 98px;
      margin: 0px 6px;
   }

   .breadcrumb {
      margin-block: 1.4rem 0.4rem;
   }

   .breadcrumb-img {
      aspect-ratio: 6 / 5;
      border-radius: 1.4rem;
      margin-bottom: -95%;
   }

}