*,
::after,
::before {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
    color: inherit;
}

/* ===== HEADER ===== */
.header {
    position: absolute;
    width: 100%;
    padding: 20px;
    z-index: 99;
}

.header::after {
    content: "";
    display: block;
    background: linear-gradient(180deg, rgba(10, 39, 79, 1) 0%, rgba(10, 39, 79, 0) 100%);
    height: 19vh;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    backdrop-filter: blur(5px);
}

.header-row {
    width: 96%;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 2%;
    z-index: 9;
    position: relative;
}

.header .item-left {
    flex: 0 0 17%;
}

.header .item-center {
    flex: 1;
}

.header .item-right {
    flex: 0 0 17%;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 7%;
}

.header .logo a {
    width: 16.8vw;
}

.header .logo a img {
    max-width: 100%;
}


.header .item-right img {
    width: 1.05vw;
    height: 1.05vw;
}

.theme-light {
    display: none;
}

html.light .theme-dark {
    display: inline-block;
}

html.light .theme-light {
    display: none;
}

html.dark .theme-light {
    display: inline-block;
}

html.dark .theme-dark {
    display: none;
}

/* ===== DESKTOP MENU ===== */

.menu-main {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 3%;
}

.header .menu > ul > li {
    display: inline-block;
}

.header .menu > ul > li > a {
    font-size: var(--font-size-18);
    font-family: var(--font-SemiBold);
    color: #fff;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.header .menu > ul > li:has(.sub-menu) > a::after {
    content: '';
    display: inline-block;
    background-image: url(../images/nav-arrow-down.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    width: 0.85vw;
    height: 0.5vw;
    transition: all 0.2s ease;
}

.header .menu > ul > li:hover a::after {
    transform: rotate(180deg);
    transition: all 0.2s ease;

}

/* ===== MEGA MENU (DESKTOP) ===== */
.header .menu > ul > li .sub-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    box-shadow: -2px 2px 70px -25px rgba(0, 0, 0, 0.3);
    visibility: hidden;
    opacity: 0;
    transition: 0.3s ease;
    z-index: 500;
}

.header .menu > ul > li:hover .sub-menu {
    visibility: visible;
    opacity: 1;
}

.mobile-menu-head,
.mobile-menu-trigger {
    display: none;
}

.sub-menu.mega-menu {
    max-width: 100%;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    min-height: 29vw;
    border-radius: 0 0 1.8vw 1.8vw;
    overflow: hidden;
}

/* ===== MOBILE MENU TRIGGER ===== */
.mobile-menu-trigger {
    display: none;
    width: 30px;
    height: 30px;
    cursor: pointer;
    align-items: center;
    justify-content: center;
}

.mobile-menu-trigger span {
    height: 2px;
    width: 24px;
    background: #fff;
    position: relative;
}

.mobile-menu-trigger span::before,
.mobile-menu-trigger span::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #fff;
    left: 0;
}

.mobile-menu-trigger span::before {
    top: -8px;
}

.mobile-menu-trigger span::after {
    top: 8px;
}

/* ===== ANIMATIONS ===== */
@keyframes slideLeft {
    from {
        transform: translateX(100%);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideRight {
    from {
        transform: translateX(0);
        opacity: 1;
    }

    to {
        transform: translateX(100%);
        opacity: 0;
    }
}


.mega-menu-sec {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
}

.mega-menu-cont {
    flex: 1;
    padding: 2vw 3vw;
    display: flex;
    flex-wrap: wrap;
    gap: 6%;
    position: relative;
}

.mega-menu-cont::after {
    content: '';
    display: inline-block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(../images/mm-bg.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom 30% left 0vw;
    mix-blend-mode: exclusion;
    z-index: -1;
}

.mega-menu-cont-links {
    flex: 1;
}

.mega-menu-cont-links h4 {
    font-size: var(--font-size-40);
    font-family: var(--font-SemiBold);
    margin-bottom: 1vw;
}

.mega-menu-cont-links ul {
    display: flex;
    flex-wrap: wrap;
    gap: 15px 2%;
}

.mega-menu-cont-links ul li {
    width: 49%;
}

.mega-menu-cont-links ul li a {
    font-size: var(--font-size-22);
}

.mega-menu-cont-info {
    flex: 1;
}

.mega-menu-cont-info h6 {
    font-size: var(--font-size-36);
    font-family: var(--font-ExtraLight);
    margin-top: 1vw;
    margin-bottom: 0.5vw;
    padding-right: 1vw;
}

.mega-menu-cont-info p {
    font-size: var(--font-size-24);
    margin-bottom: 1.5vw;
}

.mega-menu-image {
    width: 21vw;
}

.mega-menu-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.rm-link {
    padding: 5px 15px;
    font-size: var(--font-size-22);
    font-family: var(--font-Medium);
    border: 1px solid #8BB4F5;
    border-radius: 2.6vw;
    min-width: 11.8vw;
    min-height: 3vw;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.rm-link:hover {
    background-color: #8BB4F5;
    color: #fff;
}

.custom-carousel {
    position: relative;
    width: 100%;
    height: 100vh;
    max-height: 991px;
    overflow: hidden;
}

.carousel-track {
    position: relative;
    width: 100%;
    height: 100%;
}

.carousel-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.8s ease-in-out;
    pointer-events: none;
    z-index: 0;
}

.carousel-slide.active {
    opacity: 1;
    pointer-events: auto;
    z-index: 5;
}

.carousel-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.carousel-content {
    position: absolute;
    left: 10%;
    bottom: 20%;
    color: #fff;
    max-width: 50%;
    z-index: 6;
}

.carousel-content h2 {
    font-size: var(--font-size-120);
    font-family: var(--font-ExtraBold);
    line-height: 1.2;
}

.carousel-content p {
    font-size: var(--font-size-48);
    font-family: var(--font-Medium);
    margin-bottom: 2vw;
}

.carousel-btn {
    display: inline-block;
    padding: 0.8vw 1.2vw;
    font-size: var(--font-size-22);
    font-family: var(--font-Medium);
    border-radius: 1.56vw;
    box-shadow: 1px 1px 0px #ffffff, -1px -1px 1px #ffffff, 1px 1px 0px #ffffff;
    transition: 0.3s;
}

.carousel-btn:hover {
    background: #fff;
    color: #000;
}

.carousel-nav {
    position: absolute;
    bottom: 30px;
    right: 30px;
    display: flex;
    align-items: center;
    gap: 14px;
    z-index: 10;
}

.carousel-nav button {
    background-color: transparent;
    border: none;
    cursor: pointer;
}

.carousel-nav button img {
    width: 1.2vw;
    height: 1vw;
    vertical-align: bottom;
}

.carousel-dots {
    display: flex;
    gap: 3px;
}

.carousel-dots span {
    width: 0.3vw;
    height: 0.72vw;
    border-radius: 1vw;
    background: #fff;
    cursor: pointer;
    transition: 0.3s;
}

.carousel-dots span.active {
    background: #46C2EE;
}

.carousel-slide:nth-of-type(4) .carousel-content {
    max-width: 80%;
}

.carousel-slide:nth-of-type(4) .carousel-content p {
    max-width: 60%;
}

.container {
    width: 88.5vw;
    margin: auto;
}

.secbg {
    position: relative;
}

.secbg::after {
    content: '';
    display: inline-block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(../images/sec1-bg.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: bottom center;
    mix-blend-mode: exclusion;
    z-index: -1;
}

.secbg.sec-2::after {
    background-image: url(../images/sec2-bg.png);
    height: 66vw;
}

.secbg.sec-3::after {
    background-image: url(../images/sec3-bg.png);
    height: 57vw;
    background-position: left 0vw bottom -30vw;
    background-size: 70%;
}

.secbg.sec-4::after {
    background-image: none;
}

.secbg.sec-5::after {
    background-image: url(../images/sec4-bg.png);
    height: 57vw;
    background-position: right 0 bottom -30vw;
    background-size: 70%;
}

.secbg.sec-6::after {
    background-image: url(../images/sec5-bg.png);
    background-position: left 0 bottom 9vw;
    background-size: 75% 100%;
    height: 62vw;
}

.ourHistory {
    text-align: center;
    padding: 4vw 3vw;
}

.ourHistory h1 {
    font-size: var(--font-size-88);
    font-family: var(--font-Bold);
    margin-bottom: 5px;
}

.ourHistory h5 {
    font-size: var(--font-size-32);
    font-family: var(--font-Bold);
    margin-bottom: 10px;
}

.ourHistory p {
    font-size: var(--font-size-24);
    font-family: var(--font-Light);
    margin-bottom: 15px;
}

.ourHistoryInfoSec {
    margin-top: 4vw;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-start;
    gap: 4%;
    padding-bottom: 3vw;
}

.ourHistoryInfo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 1.5vw 1.2vw;
    border-radius: 1.3vw;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 1px 1px 0px #ffffff, -1px -1px 1px #ffffff, 0px 0px 0px #ffffff;
    min-height: 10.5vw;
    min-width: 13vw;
}

.ourHistoryInfo h6,
.ourHistoryInfo h6 span {
    font-size: var(--font-size-65);
    font-family: var(--font-Bold);
    background: linear-gradient(96.97deg, rgba(19, 100, 127, 1) 0%, rgba(0, 0, 0, 1) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    line-height: 1;
}

.ourHistoryInfo h6 {
    display: inline-flex;
    align-items: center;
    margin-bottom: 6px;
}

.ourHistoryInfo p {
    font-size: var(--font-size-15);
    font-family: var(--font-Medium);
    margin-bottom: 0;
}

.ourHistoryInfoSec .ourHistoryInfo:nth-child(2),
.ourHistoryInfoSec .ourHistoryInfo:nth-child(4) {
    margin-top: 3.75vw;
}

.ourHistoryInfoSec .ourHistoryInfo:nth-child(1),
.ourHistoryInfoSec .ourHistoryInfo:nth-child(5) {
    margin-top: 7.5vw;
}

.ourSolutions {
    padding-bottom: 4vw;
}

.ourSolutions h3,
.newsInfo h3,
.successStory h3,
.linkedinPosts h3,
.gitSec h3,
.titleSec h3 {
    font-size: var(--font-size-63);
    font-family: var(--font-Bold);
}

.ourSolutions h5,
.newsInfo h5,
.successStory h5,
.linkedinPosts h5,
.gitSec h5,
.titleSec h5 {
    font-size: var(--font-size-36);
    font-family: var(--font-Regular);
    font-weight: normal;
    margin-bottom: 20px;
    line-height: 1.4;
}

.ourSolutionsList {
    padding: 1vw 0 3vw;
    display: flex;
    flex-wrap: wrap;
    gap: 25px 2%;
}

.solutionCard {
    position: relative;
    width: 23.5%;
    height: 28.5vw;
    border-radius: 28px;
    overflow: hidden;
    cursor: pointer;
    background: #0d1f33;
}

.solutionCardImg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.4s ease;
}

.solutionCard::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(111, 146, 216, 0.5) 0%, rgba(10, 39, 79, 1) 100%);
    transition: 0.4s ease-in-out;
    z-index: 1;
}

.solutionCardContent {
    position: absolute;
    bottom: 30px;
    left: 8%;
    right: 8%;
    z-index: 2;
    color: #fff;
}

.solutionCardContent img {
    width: 3.5vw;
    margin-bottom: 6px;
}

.solutionCardContent h3 {
    font-size: var(--font-size-41);
    font-family: var(--font-Bold);
    line-height: 1.2;
    margin: 0 0 8px;
}

.solutionCardContent .desc {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    font-size: var(--font-size-18);
    line-height: 1.4;
    transition: all 1s ease;
}

.arrow {
    display: inline-block;
    margin-top: 12px;
    transition: all 1s ease;
}

.arrow img {
    height: auto;
    width: 1.2vw;
}

.solutionCard:hover .solutionCardImg {
    transform: scale(1.15);
}

.solutionCard:hover .desc {
    opacity: 1;
    max-height: 200px;
    transition: all 1s ease;
}

.solutionCard:hover .arrow {
    opacity: 1;
    transform: translateY(10px);
    transition: all 1s ease;
}

.btn-outline {
    padding: 0.6vw 3vw;
    font-size: var(--font-size-22);
    font-family: var(--font-Medium);
    border: 2px solid #46C2EE;
    border-radius: 50px;
    background-color: transparent;
    cursor: pointer;
    box-shadow: inset 1px 2px 6px rgb(0 0 0 / 7%);
}

.btn-outline:hover {
    color: #fff;
    background-color: #46C2EE;
    box-shadow: none;
}

.newsSec {
    padding: 3vw 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6%;
}

.newsInfo {
    position: relative;
    border-radius: 2.3vw 9vw 2.9vw 2.9vw;
    background: #f6f7f8;
    width: 35%;
    height: 36vw;
    padding: 6px;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
    overflow: hidden;
}

.newsInfo::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 4px;
    background: linear-gradient(213deg, #8a4cef 0%, #00aae1 80%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.newsInfo {
    font-size: var(--font-size-22);
    padding: 5vw 3vw;
}

.newsInfo p {
    margin-bottom: 8%;
}

.newsCarousel {
    width: 59%;
}

.newsItem {
    display: block;
}

.nmi {
    width: 100%;
    height: 12vw;
    object-fit: cover;
    border-radius: 14px;
    margin-bottom: 10px;
}

.newsType {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 5px;
}

.newsType .date {
    color: #808080;
    font-size: var(--font-size-12);
}

.newsType .eve {
    font-size: var(--font-size-12);
    background-color: #F2D992;
    padding: 2px 8px 0;
    border-radius: 3px;
}

.newsType .news {
    font-size: var(--font-size-12);
    background-color: #B9E5FB;
    padding: 2px 8px 0;
    border-radius: 3px;
}

.newsItem p {
    font-size: var(--font-size-24);
    font-family: var(--font-Medium);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    margin-bottom: 2vw;
}

.newsItem .readMore {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    color: #0A274F;
    font-size: var(--font-size-20);
    font-family: var(--font-Medium);
}

.newsItem .readMore img {
    height: 1vw;
    width: auto;
}

.owl-dots {
    display: flex;
    gap: 3px;
}

.owl-dots .owl-dot span {
    display: inline-block;
    width: 0.3vw;
    height: 0.72vw;
    border-radius: 1vw;
    background: #000000;
    cursor: pointer;
    transition: 0.3s;
}

.owl-dots .owl-dot.active span,
.owl-dots .owl-dot:hover span {
    background: #46C2EE;
}

.owl-controls-wrap .owl-prev,
.owl-controls-wrap .owl-next {
    width: 1.2vw;
    height: 1vw;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    font-size: 0;
    filter: brightness(0);
    cursor: pointer;
}

.owl-controls-wrap .owl-prev {
    background-image: url("../images/arrow-left.svg");
}

.owl-controls-wrap .owl-next {
    background-image: url("../images/arrow-right.svg");
}

.owl-controls-wrap {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 5px;
    margin-top: 15px;
}

.owl-nav .owl-prev,
.owl-nav .owl-next {
    pointer-events: auto;
}

.successStory {
    padding-top: 4vw;
    padding-bottom: 4vw;
}

.ssCarousel {
    padding: 2vw 0 2vw;
    display: flex;
    flex-wrap: wrap;
    gap: 2%;
}

.successStoryCard {
    position: relative;
    width: 100%;
    height: 28.5vw;
    border-radius: 2vw;
    overflow: hidden;
    background: #0d1f33;
}

.successStoryCardImg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.4s ease;
}

.successStoryCard::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgb(23 89 181 / 0%) 0%, #0A274F 100%);
    transition: 0.4s ease-in-out;
    z-index: 1;
    opacity: 0.8;
}

.successStoryCardContent {
    position: absolute;
    bottom: 30px;
    left: 8%;
    right: 8%;
    z-index: 2;
    color: #fff;
}


.successStoryCardContent h3 {
    font-size: var(--font-size-36);
    font-family: var(--font-SemiBold);
    line-height: 1.5;
    margin: 0 0 8px;
    min-height: 5vw;
}

.ssCarousel .owl-controls-wrap {
    position: absolute;
    right: 0;
    bottom: -4vw;
}

.linkedinPosts {
    padding-top: 2vw;
    padding-bottom: 4vw;
}

.lpSec {
    width: 93%;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 20px 4%;
    padding: 1.5vw 0;
}

.lpItem {
    width: 30.6%;
    padding: 1.35vw;
    border: 1px solid #cacbd0;
    border-radius: 1.25vw;
    box-shadow: 0px 4px 14px 0px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    background-color: #fff;
}

.lpHead {
    display: flex;
    gap: 10px;
}

.lphLogo {
    width: 2.8vw;
    height: 2.8vw;
    padding: 0.2vw;
    border: 1px solid #D9D9D9;
    border-radius: 50%;
    overflow: hidden;
}

.lphLogo img {
    max-width: 100%;
    max-height: 100%;
}

.lphInfo {
    flex: 1;
}

.lphInfo h6 {
    font-size: var(--font-size-22);
    font-family: var(--font-Bold);
}

.lphInfo span {
    color: #C0B7B7;
    font-size: var(--font-size-16);
    font-family: var(--font-SemiBold);
}

.lphLogoLi img {
    width: 1.9vw;
}

.lpImage {
    margin-top: 1vw;
    margin-bottom: 1vw;
}

.lpImage img {
    width: 100%;
    height: 13vw;
    object-fit: cover;
}

.lpBody p {
    font-size: var(--font-size-20);
    margin-bottom: 2vw;
}

.gitSec {
    width: 61%;
    margin: auto;
}

.text-center {
    text-align: center;
}

.gitForm {
    padding: 5vw 0 10vw;
}

.gitFormRow {
    display: flex;
    flex-wrap: wrap;
    gap: 20px 8%;
}

.oneColumn {
    flex: 0 0 100%;
}

.twoColumn {
    flex: 0 0 46%;
}

.gitFormRow input,
.gitFormRow select {
    width: 100%;
    min-height: 45px;
    border: 0;
    border-bottom: 2px solid #000;
    background-color: transparent;
    font-size: var(--font-size-22);
    color: #000;
}

.gitmn {
    display: flex;
    gap: 15px;
}

.gitmn select {
    width: auto;
}

.gitFormRow input::placeholder {
    color: #000;
}

.gitFormRow .btn-outline {
    margin-top: 1.5rem;
    min-width: 14vw;
}

.gitFormRow input:focus-visible {
    outline: 0;
}

.footer {
    color: #fff;
    position: relative;
    background: linear-gradient(84.77deg, rgba(15, 33, 58, 1) 0%, rgba(2, 81, 191, 1) 100%);
}

.footer::after {
    content: '';
    display: inline-block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(../images/footer-bg.png);
    background-size: 70% 50vw;
    background-repeat: no-repeat;
    background-position: right 0 bottom 0;
    mix-blend-mode: exclusion;
}

.footerSec {
    padding: 2.5vw 3vw 4vw;
    display: flex;
    flex-wrap: wrap;
    gap: 30px 3%;
    z-index: 1;
    position: relative;
}

.footerCi {
    width: 20%;
    padding-right: 2%;
    border-right: 1px solid #455A75;
}

.footerLinksSec {
    flex: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 20px 5%;
}

.footerSm {
    width: 20%;
}

.fci-logo {
    width: 14.8vw;
    margin-bottom: 23px;
}

.cci {
    display: flex;
    gap: 12px;
    margin-top: 20px;
}

.cci-icon {
    width: 1.87vw;
}

.cci-icon img {
    width: 100%;
    height: auto;
}

.cci-info {
    flex: 1;
}

.cci-info h6 {
    font-size: var(--font-size-22);
    font-family: var(--font-SemiBold);
    line-height: 1;
    margin-bottom: 5px;
}

.cci-info p {
    font-size: var(--font-size-16);
    margin-bottom: 7px;
}

.footerLinksBlock {
    width: 30%;
}

.footerLinksBlock h6 {
    font-size: var(--font-size-20);
    font-family: var(--font-SemiBold);
    margin-bottom: 6px;
}

.footerLinksBlock ul li a {
    font-size: var(--font-size-16);
    display: inline-block;
    margin-bottom: 6px;
}

.boldLinks a {
    font-size: var(--font-size-20);
    font-family: var(--font-SemiBold);
}

.footerSm h6 {
    font-size: var(--font-size-22);
    font-family: var(--font-SemiBold);
    margin-bottom: 12px;
}

.footerSm ul {
    display: flex;
    align-items: center;
    gap: 15px;
}


.footerSm ul li a {
    display: inline-block;
}

.footerSm ul li a img {
    width: 1.8vw;
    height: 1.8vw;
}

.copyrightSec {
    padding: 1.5vw 3vw;
    border-top: 1px solid #5E7595;
    position: relative;
    z-index: 1;
}

.copyrightSec p {
    font-size: var(--font-size-18);
    font-family: var(--font-Medium);
}


/* Styles starts on 19-01-2026 */

.pageBannerSec {
    position: relative;
    min-height: 50vw;
}

.pageBannerSec::after {
    content: '';
    display: block;
    width: 100%;
    height: 17vw;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
}

.pageBannerSec::before {
    background-color: rgb(10 39 79 / 53%);
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
}

.pageBannerSec img {
    width: 100%;
    height: auto;
}

.pageBannerCont {
    position: absolute;
    top: 20vw;
    right: 0;
    left: 0;
    margin: auto;
    text-align: center;
    color: #fff;
}

.pageBannerCont h4 {
    font-size: var(--font-size-88);
    font-family: var(--font-Bold);
    line-height: 1.2;
}

.pageBannerCont p {
    font-size: var(--font-size-26);
    margin-bottom: 5px;
}


ul.breadcrumb li {
    display: inline;
    color: #B8C6DB;
}

ul.breadcrumb li + li:before {
    padding: 2px;
    content: "/\00a0";
}

ul.breadcrumb li a {
    text-decoration: none;
}

ul.breadcrumb li a:hover {
    text-decoration: underline;
}

.ovHistory {
    max-width: 81vw;
    margin: auto;
    text-align: center;
    font-size: var(--font-size-26);
}

.pageBannerSecInfo {
    margin-top: -9vw;
}

.ovHistory h5 {
    color: #0A274F;
    font-size: var(--font-size-58);
    font-family: var(--font-Bold);
    margin-bottom: 15px;
}

.ovHistory p {
    margin-bottom: 1.5vw;
}

.wrBg {
    padding-bottom: 5vw;
}

.secbg.sec-3.wrBg::after {
    transform: rotate(180deg) scale(1, -1);
    background-position: left -14vw bottom -25vw;
    background-size: 80%;
}

.ovmSec {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 2vw;
    padding-bottom: 5vw;
}

.ovmCont {
    width: 40.6vw;
}

.ovmImg {
    width: 23.5vw;
    border-radius: 4.6vw;
    overflow: hidden;
}

.ovmImg img {
    width: 100%;
    height: 100%;
}

.ovmContInfo h4 {
    color: #0A274F;
    font-size: var(--font-size-58);
    font-family: var(--font-Bold);
    margin-bottom: 12px;
}

.ovmContInfo p {
    font-size: var(--font-size-20);
    font-family: var(--font-Light);
}

.ovmLine {
    position: relative;
    height: 1px;
    width: 100%;
    background-color: #B4B4B4;
    margin: 24px 0 16px 0;
}

.ovmLine::before,
.ovmLine::after {
    content: "";
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #B4B4B4;
    position: absolute;
    left: 0;
    top: -2.5px;
    bottom: 0;
}

.ovmLine::after {
    right: 0;
    left: auto;
}

.secbg.sec-3.ovmBg::after {
    transform: rotate(21.5deg) scale(1, -1);
    background-position: left -5vw bottom -6vw;
    margin-left: -13vw;
}

.ovsSec,
.ovsInfoSec {
    width: 60vw;
    text-align: center;
    margin: auto;
}

.ovsSec h4,
.ohSec h4 {
    font-size: var(--font-size-58);
    font-family: var(--font-Bold);
}

.ovsSec p,
.ohSec p {
    font-size: var(--font-size-26);
    margin-bottom: 15px;
}

.ovsInfoSec {
    padding: 4vw 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 3vw 6vw;
}

.ovsInfo {
    width: 15.5vw;
}

.ovsInfo img {
    width: 4.85vw;
    height: 4.85vw;
}

.ovsInfo h6 {
    font-size: var(--font-size-36);
    font-family: var(--font-Bold);
    line-height: 1.4;
}

.ovsInfo p {
    color: #888888;
    font-size: var(--font-size-20);
}

.ovsInfoSec .ovsInfo:nth-child(5) {
    width: 20.5vw;
}

.secbg.sec-3.ovsBg::after {
    transform: rotate(170deg) scale(1, -1);
    background-position: left -20vw bottom -30vw;
    height: 68vw;
}

.ohBg {
    background: linear-gradient(0deg, rgba(246, 248, 251, 1) 0%, rgba(246, 248, 251, 1) 49.03846085071564%, rgba(232, 234, 237, 0) 100%);
    min-height: 64vw;
}

.ohSec {
    text-align: center;
    padding: 5vw 0;
}

.ourHistorySec {
    position: relative;
    width: 88.5vw;
    margin: auto;
}

.ourHistorySec::after {
    content: '';
    display: block;
    position: absolute;
    width: 100vw;
    height: 100%;
    background-image: url(../images/history-curve.svg);
    background-size: 100%;
    background-repeat: no-repeat;
    right: 5.75vw;
    left: -5.75vw;
    top: 5.3vw;
}

.ohInfo {
    display: flex;
    flex-wrap: wrap;
    gap: 30px 5%;
}

.ohCont {
    width: 30%;
    text-align: center;
}

.ohCont h4 {
    color: #00AAE1;
    font-size: var(--font-size-50);
    font-family: var(--font-Bold);
}

.ohDot {
    width: 0.83vw;
    height: 0.83vw;
    border-radius: 50%;
    background-color: #00AAE1;
    display: inline-block;
    margin: 1vw 0;
    z-index: 1;
    position: relative;
}

.ohCont h5 {
    font-size: var(--font-size-35);
    font-family: var(--font-Bold);
    margin-bottom: 1vw;
}

.ohCont p {
    font-size: var(--font-size-20);
    margin-bottom: 0.5vw;
}

.solutionCardsSec {
    display: flex;
    flex-wrap: wrap;
    gap: 3vw 4%;
}

.solutionsCard {
    width: 48%;
    height: 25vw;
    border-radius: 3.12vw;
    overflow: hidden;
    position: relative;
}

.solutionsCard::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(0deg, rgba(3, 35, 46, 1) 0%, rgba(63, 127, 149, 0) 100%);
    opacity: 0.78;
}

.scImg {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: 0.4s ease-in-out;
}

.solutionsCard:hover .scImg {
    transform: scale(1.15);
}

.solutionsCardHeader {
    position: absolute;
    top: 10%;
    left: 10%;
    display: flex;
    align-items: center;
    gap: 10px;
    z-index: 1;
}

.solutionsCardHeader img {
    height: 2vw;
    width: 2vw;
}

.solutionsCardBody {
    position: absolute;
    bottom: 10%;
    left: 10%;
    right: 10%;
    z-index: 1;
}

.scbLogo {
    height: 3.3vw;
    margin-bottom: 10px;
}

.scbHighlights {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 10px;
}

.scbHighlights span {
    font-size: var(--font-size-12);
    padding: 2px 10px;
    background-color: #F5F9FC;
    border-radius: 3px;
}

.scbHighlights span.yellow {
    background-color: #F2D992;
}

.scbHighlights span.purple {
    background-color: #D6B9FD;
}

.scbHighlights span.blue {
    background-color: #61CFF3;
}

.scbHighlights span.lblue {
    background-color: #B9E5FB;
}

.scbHighlights span.green {
    background-color: #95FE91;
}

.scbHighlights span.lgreen {
    background-color: #91FEF3;
}

.solutionsCardBody p {
    font-size: var(--font-size-40);
    color: #fff;
    line-height: 1.2;
}

.solutionsCardBody p span {
    font-family: var(--font-Bold);
}

.osCarousel {
    padding-top: 15px;
}

.owl-carousel .solutionCard {
    width: 100%;
}

.owl-carousel .solutionCardContent img {
    width: 3.5vw;
}

.secbg.sec-3.osBg::after {
    transform: rotate(21.5deg) scale(1, -1);
    background-position: left -15vw top 4vw;
    margin-left: -20vw;
}

.owl-carousel .arrow img {
    width: 1.2vw;
}

.osCarousel {
    padding-bottom: 5vw;
}

.osCarousel.sec-3::after {
    transform: rotate(320deg) scale(-1, -1);
    background-position: bottom right 27vw;
    margin-left: 30vw;
    height: 40vw;
    background-size: 50%;
}

.secbg.sec-2.naiBg::after {
    transform: rotate(157deg);
    margin-left: 10vw;
    margin-top: 5vw;
}

.nebrasAiSec {
    text-align: center;
    position: relative;
}

.naisht {
    width: 79vw;
    z-index: 1;
    position: relative;
}

.nebras-ai {
    background: linear-gradient(89.57deg, rgba(150, 220, 255, 1) 0%, rgba(206, 242, 255, 1) 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 18vw;
    opacity: 0.5;
    font-family: var(--font-Bold);
    position: absolute;
    top: 8vw;
    right: -5.75vw;
    left: -5.75vw;
    margin: auto;
}

.ovsInfoSec.kfs .ovsInfo:nth-child(5) {
    width: min-content;
}

.secbg.sec-3.kfsBg::after {
    transform: rotate(21.5deg) scale(1, -1);
    background-position: left -5vw bottom -10vw;
    margin-left: -13vw;
}

.nebrasFeaturesSec {
    display: flex;
    flex-wrap: wrap;
    gap: 2vw;
    margin-top: 5vw;
}

.nebrasFeaturesInfo {
    width: 48vw;
}

.nebrasFeaturesInfo h4 {
    font-size: var(--font-size-63);
    font-family: var(--font-Bold);
}

.nebrasFeaturesInfo p {
    font-size: var(--font-size-20);
    font-family: var(--font-Light);
    margin-bottom: 12px;
}

.nebrasFeaturesImage {
    width: 38vw;
    position: relative;
}

.nebrasFeaturesImage img {
    width: 42.25vw;
    height: 41.25vw;
    position: absolute;
    top: -8vw;
    right: -5.75vw;
}

.nfior {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.aioBg {
    min-height: 45vw;
}

.secbg.sec-1.aioBg::after {
    transform: rotate(10deg) scale(-1, 1);
    margin-left: -30vw;
    height: 58vw;
    width: 135vw;
    background-position: left 0 bottom 17vw;
}

.aioBg .nebras-ai {
    line-height: 1;
    top: 3vw;
    opacity: 0.7;
}

.aioBg .naisht {
    width: 55vw;
}

.ooreddoBusinessSec {
    padding: 3vw 0;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.5vw;
}

.ooreddoBusinessLogo img {
    height: 3.65vw;
    width: auto;
}

.ooreddoBusinessInfo {
    border-left: 1px solid #000;
    padding-left: 1.5vw;
    display: flex;
    flex-wrap: wrap;
    gap: 4vw;
}

.ooreddoBusinessInfo p {
    font-size: var(--font-size-22);
    font-family: var(--font-Medium);
    text-align: center;
}

.ooreddoBusinessInfo p span {
    display: block;
    font-size: var(--font-size-26);
    font-family: var(--font-SemiBold);
    margin-top: 5px;
}

.ooreddoBusinessScreenshot {
    text-align: center;
    padding-bottom: 5vw;
}

.ooreddoBusinessScreenshot img {
    width: 69.5vw;
}

.secbg.sec-3.pscBg::after {
    transform: rotate(21.5deg) scale(1, -1);
    background-position: left -5vw top -8vw;
    margin-left: -22vw;
}

.pscSec {
    display: flex;
    flex-wrap: wrap;
    gap: 25px 2%;
}

.pscInfo,
.pscList,
.pscImage {
    width: 30%;
}

.pscList {
    width: 34%;
}

.pscInfo h4,
.uiSolutionsInfo h4 {
    font-size: var(--font-size-63);
    font-family: var(--font-Bold);
    line-height: 1.1;
    margin-bottom: 1.5vw;
}

.pscInfo p,
.uiSolutionsInfo p {
    font-size: var(--font-size-20);
    font-family: var(--font-Light);
}

.pscImage img {
    max-width: 100%;
}

.pscList {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    gap: 10px;
}

.pscListItem {
    width: 21vw;
    border: 1px solid #B7B7B7;
    border-radius: 17px;
    padding: 6px 16px;
    font-family: var(--font-Medium);
    display: flex;
    align-items: center;
}

.pscListItem h6 {
    color: #E3DFDF;
    font-size: var(--font-size-34);
    font-family: var(--font-Bold);
    padding-right: 10px;
    margin-right: 10px;
    border-right: 1px solid #CBCBCB;
}

.aiTransSec {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 3vw;
    text-align: center;
    margin-top: 4%;
    margin-bottom: 6%;
}

.aiTransService {
    max-width: 13vw;
}

.aiTransService img {
    height: 3vw;
    max-width: 10vw;
    object-fit: contain;
}

.aiTransService p {
    color: #756969;
    font-size: var(--font-size-14);
    font-family: var(--font-Medium);
    margin-top: 5px;
}

.osPartnersSec {
    margin-top: 4vw;
    margin-bottom: 12vw;
}

.osPartnersSec .ovsSec h4 {
    font-size: var(--font-size-63);
}

.osPartnersList {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 3vw;
}

.osPartnersList {
    margin-top: 3%;
}

.osPartnersList img {
    height: 3vw;
}

.nebrasFeaturesInfo h6 {
    font-size: var(--font-size-20);
    font-family: var(--font-SemiBold);
    margin-bottom: 5px;
}

.nebrasFeaturesSec {
    min-height: 38vw;
}

.phonePosture {
    text-align: center;
    margin-top: 3vw;
    margin-bottom: 8vw;
}

.phonePosture img {
    width: 53vw;
}

.secbg.spBg::after {
    background-position: top -12vw center;
    background-size: contain;
}

.uiSolutionsSec {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 4%;
}

.uiSolutionsInfo {
    width: 30%;
    margin-top: 5%;
}

.uiSolutionsImage {
    flex: 1;
    text-align: right;
}

.uiSolutionsImage img {
    max-width: 42vw;
}

.ob2b {
    width: 36.5vw;
    z-index: 1;
    position: relative;
}

.ooredoob2bSec {
    text-align: center;
    margin: 3vw 0;
}

.ooredoob2bSec img {
    width: 80vw;
}

.secbg.sec-1.aioBg.b2bBg::after {
    background-position: left 0 bottom 7vw;
    height: 66.5vw;
    width: 130vw;
    margin-left: -20vw;
}

.contactInfoSec {
    padding: 2vw 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 25px 4vw;
}

.contactInfo {
    text-align: center;
}

.contactInfo h6 {
    font-size: var(--font-size-35);
    font-family: var(--font-SemiBold);
}

.contactInfo p {
    font-size: var(--font-size-26);
    font-family: var(--font-Medium);
}

.ogpSec {
    padding: 4vw 0;
}

.ogpSec .ovsSec h4 {
    color: #0A274F;
}

.ogpSec .ovsSec p {
    color: #848282;
    font-size: var(--font-size-32);
}

.secbg.sec-3.cgitBg::after {
    transform: rotate(21.5deg) scale(1, -1);
    background-position: left -5vw top -30vw;
    margin-left: -22vw;
    height: 45vw;
}

.countryMapSec {
    padding-top: 4vw;
    display: flex;
    flex-wrap: wrap;
    gap: 25px 0%;
}

.countryMap {
    position: relative;
    min-height: 20vw;
}

.countryMapInfo {
    padding-left: 1vw;
    border-left: 2px solid #32AB45;
    padding-bottom: 1vw;
    position: relative;
    margin-left: 3.25vw;
    z-index: 9;
}

.countryMapInfo::after {
    content: "";
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #32AB45;
    position: absolute;
    bottom: 0;
    left: -5px;
}

.countryMapInfo h6 {
    font-size: var(--font-size-38);
    font-family: var(--font-SemiBold);
    line-height: 1;
    margin-bottom: 6px;
}

.countryMapInfo p {
    color: #868585;
    font-size: var(--font-size-16);
    font-family: var(--font-Medium);
}

.countryMapLinks {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.countryMapLinks a {
    color: #000088;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 5px;
}

.countryMapLinks a img {
    width: 1.15vw;
    height: 1.15vw;
    object-fit: contain;
}

.countryMapImage {
    width: 13.2vw;
    position: absolute;
}

.locationImage {
    width: 5vw;
    position: absolute;
    top: 40%;
    left: 5%;
}

.countryMapSec .countryMap:nth-child(even) {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-end;
}

.countryMapSec .countryMap:nth-child(even) .countryMapInfo::after {
    top: 0;
    bottom: auto;
}

.countryMapSec .countryMap:nth-child(2) .countryMapInfo {
    border-color: #46C2EE;
}

.countryMapSec .countryMap:nth-child(2) .countryMapInfo::after {
    background-color: #46C2EE;
}

.countryMapSec .countryMap:nth-child(3) .countryMapInfo {
    border-color: #000088;
}

.countryMapSec .countryMap:nth-child(3) .countryMapInfo::after {
    background-color: #000088;
}

.countryMapSec .countryMap:nth-child(4) .countryMapInfo {
    border-color: #C9BE4F;
}

.countryMapSec .countryMap:nth-child(4) .countryMapInfo::after {
    background-color: #C9BE4F;
}

.countryMapSec .countryMap:nth-child(5) .countryMapInfo {
    border-color: #D50237;
}

.countryMapSec .countryMap:nth-child(5) .countryMapInfo::after {
    background-color: #D50237;
}

.countryMapSec .countryMap:nth-child(6) .countryMapInfo {
    border-color: #C9BE4F;
}

.countryMapSec .countryMap:nth-child(6) .countryMapInfo::after {
    background-color: #C9BE4F;
}

.oman .countryMapImage {
    width: 8.8vw;
    top: 27%;
    left: -5%;
}

.oman .locationImage {
    top: 42.5%;
}

.kuwait .countryMapImage {
    width: 9.85vw;
    left: 5%;
    top: 34%;
}

.uae .countryMapImage {
    width: 8.85vw;
    left: -3%;
    top: 26%;
}

.qatar .countryMapImage {
    width: 4.46vw;
    left: 18%;
}

.india .countryMapImage {
    width: 9.3vw;
    left: 1%;
    top: 21%;
}

.secbg.sec-3.ogpBg::after {
    transform: rotate(180deg) scale(1, -1);
    background-position: left -8vw bottom -16vw;
    background-size: 76%;
}


/* Styles starts on 06-02-2026 */

.countryMapSec {
    justify-content: center;
    gap: 50px 0%;
}

.countryMapSec .countryMap:nth-child(7) .countryMapInfo {
    border-color: #000088;
}

.countryMapSec .countryMap:nth-child(7) .countryMapInfo::after {
    background-color: #000088;
}

.countryMapSec .countryMap:nth-child(8) .countryMapInfo {
    border-color: #46C2EE;
}

.countryMapSec .countryMap:nth-child(8) .countryMapInfo::after {
    background-color: #46C2EE;
}

.tunisia .countryMapImage {
    width: 9.3vw;
    left: 6%;
    top: 34%;
}

.bahrain .countryMapImage {
    width: 8.8vw;
    top: 27%;
    left: -5%;
}

.countryMap.bahrain {
    margin-left: 3vw;
}

.naeFilters {
    padding: 2vw 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 20px 2%;
}

.naeFilters a {
    font-size: var(--font-size-26);
    font-family: var(--font-SemiBold);
}

.naeFilters a.active {
    color: #00AAE1;
}

.naeFilters a img {
    width: 1.25vw;
    vertical-align: middle;
}

.naeSec {
    padding-top: 1vw;
    padding-bottom: 5vw;
    display: flex;
    flex-wrap: wrap;
    gap: 5vw 5%;
}

.naeSec .newsItem {
    width: 30%;
}

.ooreddoBusinessSec:not(:has(.ooreddoBusinessLogo)) .ooreddoBusinessInfo {
    border: 0;
    padding: 0;
}

.img-fluid {
    max-width: 100%;
}

.newsDescription {
    text-align: center;
    font-size: var(--font-size-20);
    font-family: var(--font-Light);
}

.newsDescription p {
    margin-bottom: 25px;
}

p.newsDescImgInfo {
    font-size: var(--font-size-16);
    max-width: 60vw;
    margin: auto;
    margin-top: 15px;
    margin-bottom: 50px;
}

.secbg.sec-3.khpBg::after {
    transform: rotate(21.5deg) scale(1, -1);
    background-position: left -5vw top -8vw;
    margin-left: -22vw;
    margin-top: -15vw;
}

.khopSec {
    padding: 2vw 0 4vw;
    font-size: var(--font-size-20);
    font-family: var(--font-Light);
}

.khopSec p {
    padding-left: 15px;
    border-left: 5px solid #00AAE1;
    margin-bottom: 20px;
}

.pgCarousel {
    padding: 3vw 0 5vw;
}

.pgImg {
    width: 100%;
    height: 28.5vw;
    border-radius: 2vw;
}

.rsBg {
    padding: 3vw 0 4vw;
    background-color: #F6F8FB;
}


.secbg.sec-3.wrBg.keyFacts::after {
    background-image: url(../images/gradiant_shade.png);
    transform: rotate(180deg) scale(1, 1);
    background-position: left -10vw bottom 2vw;
    background-size: 70%;
    mix-blend-mode: unset;
}

.secbg.sec-3.wrBg.keyFacts.sec-2-bg::after {
    transform: rotate(180deg) scale(-1, -1);
    background-position: left -10vw bottom -4vw;
    background-size: 55%;
}

.keyFacts .ourHistoryInfo:nth-child(2),
.keyFacts .ourHistoryInfo:nth-child(3) {
    margin-top: 0;
}

.keyFacts .ourHistoryInfo:nth-child(1),
.keyFacts .ourHistoryInfo:nth-child(4) {
    margin-top: 3.75vw;
}

.titleSec.solutions-title {
    margin-bottom: 64px;
}

.titleSec.solutions-title h3 {
    line-height: var(--font-size-63);
    margin-bottom: 16px;
}

.solutionsCardBody span.desc {
    font-size: var(--font-size-26);
    font-family: var(--font-Regular);
    color: #fff;
}

.telco .solutionsCardBody {
    z-index: 2;
}

.solutionsCard.telco::after {
    background: linear-gradient(to top, #03232E 27.81%, rgba(63, 127, 149, 0) 83.96%);
    opacity: 1;
    z-index: 1;
}

.solutionsCard.telco .go-to-details {
    position: absolute;
    top: 50px;
    right: 50px;
    width: 3.333vw;
    height: 3.333vw;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 1px solid #fff;
    z-index: 2;
    cursor: pointer;
}


.pageBannerCont .btn-outline {
    color: #fff;
    margin-top: 16px;
}

.chat-btn {
    position: fixed;
    bottom: 3vw;
    right: 0.9vw;
    background: linear-gradient(214.31deg, #00ADEE 41.99%, #1399C4 229.81%);
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #fff;
    font-size: var(--font-size-18);
    line-height: var(--font-size-18);
    font-family: var(--font-Medium);
    border-radius: 30px 30px 30px 0;
    border: none;
    width: 4.844vw;
    height: 6.719vw;
    padding: 8px;
    cursor: pointer;
}

.chat-btn img {
    width: 1.927vw;
}

.clients-sec {
    margin-top: 60px;
}

.steps-container {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 0.313vw;
    max-width: 68.75vw;
    margin: auto;
}

.step {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 8px;
    position: relative;
    flex: 1 1 0;
    min-width: 0;
}

.step h6 {
    background-color: #00ADEE;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    width: 5.833vw;
    height: 5.833vw;
    font-size: var(--font-size-58);
    font-family: var(--font-Bold);
}

.step p {
    font-size: var(--font-size-36);
    color: #000000;
    font-family: var(--font-Bold);
}

.step span {
    text-align: center;
    font-size: var(--font-size-20);
}

.steps-container .arrow {
    margin-top: 2.91vw;
    width: 5.833vw;
}

.whySection {
    margin-top: 6.667vw;
}

.whySectionContainer {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 6.563vw;
    max-width: 68.75vw;
    margin: auto;
}

.whySectionContainer .ovsInfo {
    width: calc(50% - 3.29vw);
    display: flex;
    align-items: flex-start;
    gap: 2.604vw;
}

.whySectionContainer .ovsInfo img {
    width: 3.906vw;
    height: auto;
}

.servicesCardsSec {
    display: flex;
    align-items: stretch;
    gap: 1.875vw;
    flex-wrap: wrap;
}

.serviceCard {
    width: calc(50% - 0.94vw);
    position: relative;
    border-radius: 44px 117px 55px 56px;
    background-color: #FAFCFF;
    padding: 3.646vw 3.125vw;
}

.serviceCard::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 4px;
    background: linear-gradient(213deg, #8a4cef 0%, #00aae1 80%);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}

.serviceCard h6 {
    font-size: var(--font-size-46);
    font-family: var(--font-Bold);
    color: #03232E;
}

.serviceCard p {
    font-size: var(--font-size-26);
    color: #03232E;
}

.my-5 {
    margin: 2.5rem 0;
}

.service-parallax-section {
    margin-top: 6.667vw;
    height: 41.51vw;
    background-image: url(../images/managed-telecom-services-parallax.png);
    background-size: 100%;
    background-attachment: fixed;
}

.service-parallax-section >div {
    width: 47%;
    margin-left: auto;
    height: 100%;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column; 
    padding-right: 16px;
}

.service-parallax-section h6 {
   font-size: var(--font-size-60); 
   color: #fff;
   font-family: var(--font-Light);
   font-weight: 300;
   margin-bottom: 16px;
}

.service-parallax-section h5 {
   font-size: var(--font-size-99); 
   color: #fff;
   font-family: var(--font-ExtraLight);
   font-weight: 200;
   line-height: var(--font-size-99);
   margin-bottom: 32px;
}

.service-parallax-section button {
    color: #fff;
}

.steps.dark-box {
    background-color: #0A274F;
    color: #fff;
    border-radius: 120px;
    padding: 90px 60px 160px 90px;
    background-image: url(../images/dark-box-background.png);
    background-position: right;
    background-size: 100%;
}

.steps.dark-box h5,
.steps.dark-box p {
    color: #fff;
}