/** Fonts Declaration Start **/

@import url('https://fonts.googleapis.com/css2?family=Roboto+Flex:opsz,wght@8..144,100..1000&display=swap');

@font-face {
    font-family: Noka-Light;
    src: url('../fonts/Noka_Light.otf');
    font-weight: normal;
    font-display: swap;
}

@font-face {
    font-family: Noka-Medium;
    src: url('../fonts/Noka_Medium.otf');
    font-weight: normal;
    font-display: swap;
}

@font-face {
    font-family: Noka-Semibold;
    src: url('../fonts/Noka_Semibold.otf');
    font-weight: normal;
    font-display: swap;
}

@font-face {
    font-family: Noka-Bold;
    src: url('../fonts/Noka_Bold.otf');
    font-weight: normal;
    font-display: swap;
}

@font-face {
    font-family: Noka-Black;
    src: url('../fonts/Noka_Black.otf');
    font-weight: normal;
    font-display: swap;
}

@font-face {
    font-family: Noka-Hairline;
    src: url('../fonts/Noka_Hairline.otf');
    font-weight: normal;
    font-display: swap;
}

/** Fonts Declaration End **/

/* Common styles start */

body {
    font-family: "Noka-Medium" !important;
    font-weight: normal;
    background-color: rgba(225, 214, 184, 0.39) !important;
    background-size: cover;
    background-position: top;
    position: relative;
}

body::before {
    content: '';
    /* background-color: rgba(225, 214, 184, 0.39) !important; */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

body.home {
    background-image: url('../images/body_bg.svg');
}

body.home::before {
    background: linear-gradient(0deg, rgba(225, 214, 184, 0.39) 0%, rgba(225, 214, 184, 0.39) 100%), #ffffffad;
}

body.page-template-content-about::before {
    background-image: url('../images/about_page_bg.svg');
    background-size: cover;
    background: linear-gradient(180deg, #ecf4f8c4 41.77%, #f6f1e5d9 59.84%)
}

body.brandDetailPage {
    background-color: white !important;
}

body.brandDetailPage::before {
    background-image: url('../images/brands/brand_detail_bg.png');
    max-height: 110vh;
}

body.menu-open {
    overflow: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Noka-Bold";
    font-weight: normal;
}

section {
    position: relative;
}

.container-inner {
    max-width: 82%;
    padding-right: 12px;
    padding-left: 12px;
    margin-right: auto;
    margin-left: auto;
}

.container-fluid {
    max-width: 97%;
    margin: auto;
}

.container-fluid.pl-0 {
    padding-left: 0px !important;
}

.container-full {
    max-width: 100%;
    width: 100%;
    padding-left: 12px;
    padding-right: 12px;
}

.mainTitle {
    font-size: 50px;
    font-family: Noka-Medium;
    font-weight: 500;
    line-height: normal;
}

.secTitle {
    font-family: Noka-semibold;
    font-size: 26px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 2.6px;
    text-transform: uppercase;
}

.largeTitle {
    font-size: 115px;
    font-weight: 400;
    line-height: 160%;
    letter-spacing: 2.3px;
}

.primary_color {
    color: #443F3B !important;
}

.primary_color_dark {
    color: #5D502D !important;
}

.ctaBtn a {
    font-family: "Roboto Flex", sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 1.8px;
    text-transform: uppercase;
    text-decoration: none;
}

.ctaPrimary {
    display: flex;
    align-items: flex-end;
    gap: 11px;
}

.ctaPrimary .circleArrow {
    width: max-content;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 3px;
}

.ctaPrimary .circleArrow img {
    max-width: 32px;
}

.ctaPrimary .circleArrow img:first-child {
    opacity: 0;
    visibility: hidden;
    transition: .4s ease-in-out;
}

.ctaPrimary:hover .circleArrow img:first-child {
    opacity: 1;
    visibility: visible;
}

.desc p {
    font-family: 'Noka-Light';
    font-size: 22px;
    font-weight: 300;
    line-height: 28px;
}

/* .imgArea img {
    width: 100%;
} */

.pt-lg {
    padding-top: 113px;
}

.pb-lg {
    padding-bottom: 113px;
}

img {
    max-width: 100%;
}

.pt_80 {
    padding-top: 80px;
}

.pt_70 {
    padding-top: 70px !important;
}

.flexTitle,
.partnerLogos,
.hsList {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Common styles end */

/* Header styles start */

.mainHeader {
    position: relative;
    width: 100%;
    z-index: 9;
    transition: all 0.4s ease;
    padding-bottom: 70px;
    /* height: 71px; */
    /* border-bottom: 1px solid rgba(255, 255, 255, 0.35); */
    /* position: relative; */
}

.mainHeader.absoluteHeader {
    position: absolute;
    top: 0px;
    left: 0;
    transform: translateY(0);
    padding-bottom: 0px;
}

/* body.menu-open .mainHeader {
    background-color: #000;
} */

.mainHeader::before {
    content: '';
    position: absolute;
    top: 71px;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: rgba(68, 63, 59, 0.35);
}

.mainHeader.absoluteHeader::before {
    background-color: rgba(255, 255, 255, 0.35);
}

.logo img {
    display: block;
    width: 150px;
    height: auto;
    object-fit: cover;
    margin-top: 20px;
}

.mainHeader img.logo_white {
    display: none;
}

.mainHeader.absoluteHeader img.logo_dark {
    display: none;
}

.mainHeader.absoluteHeader img.logo_white {
    display: block;
}

.navBar {
    /* padding-top: 20px; */
    display: flex;
    /* align-items: center; */
    justify-content: flex-end;
    /* gap: 29px; */
}

.mainNav {
    /* overflow: hidden; */
    /* max-height: 0; */
    transition: max-height 0.5s ease;
}

.mainNav ul,
.subNav ul {
    list-style-type: none;
    padding-left: 7px;
    margin-bottom: 0;
    /* padding-top: 22px; */
    display: flex;
    /* gap: 16px; */
}

.mainNav ul.submenu {
    display: none;
}

.mainNav ul li {
    padding: 23px 29px;
    border-left: 1px solid rgba(68, 63, 59, 0.35);
    border-right: 0px;
}

.mainHeader.absoluteHeader .mainNav ul li {
    border-left: 1px solid rgba(255, 255, 255, 0.35);
}

.bottomNav {
    float: right;
    padding-right: 8%;
}

.subNav ul {
    padding-top: 22px;
    gap: 26px;
    align-items: center;
}

.mainNav ul li a,
.headerSocial .hsItem a,
.subNav ul li a {
    color: #000;
    font-family: "Roboto Flex", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 1.6px;
    text-transform: uppercase;
    text-decoration: none;
}

.mainHeader.absoluteHeader .mainNav ul li a,
.mainHeader.absoluteHeader .subNav ul li a {
    color: #fff;
}

.subNav ul li a {
    text-transform: capitalize;
    font-family: "Roboto Flex", sans-serif;
    letter-spacing: normal;
    font-weight: 300;
}

.navToggler {
    padding: 29px 29px;
    border-left: 1px solid rgba(68, 63, 59, 0.35);
    display: flex;
    align-items: center;
}

.mainHeader.absoluteHeader .navToggler {
    border-left: 1px solid rgba(255, 255, 255, 0.35);
}

.toggleIcon {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 12px;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    z-index: 1001;
}

.toggleIcon span {
    display: block;
    height: 2px;
    background-color: #000;
    border-radius: 2px;
    transition: all 0.3s ease;
    width: 47px;
}

.mainHeader.absoluteHeader .toggleIcon span {
    background-color: #FFF;
}

.navBrandLogo {
    border-left: 1px solid rgba(68, 63, 59, 0.35);
    text-align: center;
    padding: 23px 29px;
    display: flex;
}

.navBrandLogo img {
    max-width: 77px;
}

.mainHeader.absoluteHeader .navBrandLogo {
    border-left: 1px solid rgba(255, 255, 255, 0.35);
}

.mainNav .backBtn {
    display: none;
}

/* Header styles end */

/* Home page styles start */

.bgCover {
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.bannerSec .bannerVid video {
    width: 100%;
    height: 105vh;
    object-fit: cover;
}

.bannerSec .bannerImg img {
    width: 100%;
    height: 100vh;
    object-fit: cover;
}

.bannerSec .bannerCta {
    position: absolute;
    bottom: 14%;
    left: 3%;
    background: rgba(0, 0, 0, 0.15);
    border-width: 0.65px;
    backdrop-filter: blur(10px);
    padding: 45px 50px;
    /* max-width: 58%; */
    border-top-right-radius: 20px;
    border-bottom-left-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.50);
}

.bannerSec .bannerCtaDet {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 100px;
}

/* .bannerSec .bannerCtaDet .mainTitle {
    flex: 0 0 65%;
} */

.bannerSec .bannerCtaDet .ctaBtn {
    padding-top: 35px;
}

.bannerSec .bannerCtaLinks {
    position: absolute;
    bottom: 9%;
    left: 7%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;
}

li.submenu a,
.ctaArrow a {
    position: relative;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.ctaArrow a::after,
li.submenu a::after {
    content: '';
    margin-top: 3px;
    box-sizing: border-box;
    height: 10px;
    width: 10px;
    border-style: solid;
    /* border-color: white; */
    border-width: 0px 2px 2px 0px;
    transform: rotate(45deg);
    transition: border-width 150ms ease-in-out;
}

.prodCatSec {
    padding-top: 140px;
    padding-bottom: 74px;
}

.prodCatSec .container-inner {
    margin-right: 0px;
    padding-left: 10px;
    max-width: 94%;
}

.prodCatSec .titleArea.absoluteTitle {
    position: absolute;
    top: 0;
    left: 10%;
    z-index: 99;
}

.prodCatDet {
    display: flex;
}

.swiper.prodCatSlider {
    padding-bottom: 36px;
}

.prodCatSlider .prodCatSlide .subTitle {
    color: #FFF;
    font-family: "Roboto Flex", sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 1.4px;
    margin-bottom: 0px;
}

.prodCatSlider .custom-swiper-prev.swiper-button-prev {
    left: 5%;
    justify-content: center;
}

.prodCatSlider .custom-swiper-next.swiper-button-next {
    right: 5%;
    justify-content: center;
}

.custom-swiper-next.swiper-button-next svg,
.custom-swiper-prev.swiper-button-prev svg {
    fill: transparent;
    width: 15px;
    height: 26px;
}

.prodCatSlider .swiper-scrollbar.custom-hor-scrollbar {
    bottom: 0px;
    left: 10%;
    background: #3d48563d;
}

.prodCatSlider .swiper-scrollbar.custom-hor-scrollbar .swiper-scrollbar-drag {
    background: #3D4856;
}

.prodCatSlider .prodCatSlide.flex-end {
    display: flex;
    align-items: flex-end;
}

.prodCatSlider.swiper {
    padding-left: 10%;
}

.prodCatSlide .prodCatCont .titleArea {
    position: absolute;
    bottom: 16px;
    left: 18px;
}

.prodCatInfo {
    background-color: white;
    border-radius: 6px;
    padding: 55px;
    transition: .3s ease-in-out;
    width: 100%;
}

.prodCatInfo .titleArea {
    border-bottom: 1px solid #000;
    padding-bottom: 60px;
    transition: .3s ease-in-out;
}

.prodCatInfo .titleArea .subTitle {
    color: #000;
    font-family: Noka-medium;
    font-size: 32px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: normal;
}

.prodCatInfo .catBrands {
    /* padding-top: 36px; */
    padding-bottom: 40px;
    display: flex;
    flex-direction: column;
    gap: 17px;
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    /* transform: translateY(-10px); */
    transition: all 0.4s ease;
}

.prodCatInfo .catBrands .catBrandItem {
    color: #FFF;
    font-family: Noka-light;
    font-size: 18px;
    font-weight: 300;
    line-height: normal;
    letter-spacing: 0.18px;
}

.prodCatInfo .ctaBtn {
    transition: .3s ease-in-out;
}

.prodCatInfo .ctaBtn a {
    color: #000;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1.4px;
    padding: 16px 18px;
    border-radius: 6px;
    display: block;
    width: max-content;
    padding-left: 0px;
    transition: .3s ease-in-out;
}

.prodCatSlider:hover .prodCatInfo {
    background-color: #242424;
}

.prodCatSlider:hover .catBrands {
    /* opacity: 1; */
    /* height: 100%; */
    padding-top: 36px;
    /* padding-bottom: 36px; */
    max-height: 200px;
    /* large enough to fit content */
    opacity: 1;
    /* transform: translateY(0); */
}

.prodCatSlider:hover .titleArea .subTitle,
.prodCatSlider:hover .ctaBtn a {
    color: white;
}

.prodCatSlider:hover .titleArea {
    border-color: #FFF;
}

.prodCatSlider:hover .ctaBtn a {
    border: 0.65px solid #F0EEEE;
    padding-left: 18px;
}

.prodCatSlider .prodCatSlide:nth-child(3) .imgArea img {
    /* height: 100%; */
    height: 322px;
    transition: height 0.3s ease;
    object-position: top;
}

.prodCatSlider .prodCatSlide:nth-child(3) .titleArea {
    top: 340px;
    transition: bottom 0.6s ease;
}

.prodCatSlider .prodCatSlide:nth-child(3) .titleArea .subTitle {
    color: #000;
}

.prodCatSlider:hover .prodCatSlide:nth-child(3) .imgArea img {
    height: 600px;
}

.prodCatSlider:hover .prodCatSlide:nth-child(3) .titleArea {
    top: auto;
}

.prodCatSlider:hover .prodCatSlide:nth-child(3) .titleArea .subTitle {
    color: white;
}

.prodCatCont .imgArea img {
    width: 100%;
    object-fit: cover;
    height: 600px;
    border-radius: 6px;
}

.partnerSec {
    padding-bottom: 160px;
    padding-top: 38px;
}

.partnerSec .titleArea p {
    font-size: 28px;
    font-weight: 500;
    line-height: 35px;
    flex: 0 0 35%;
}

.partnerLogos {
    flex-wrap: wrap;
    gap: 45px 12px;
}

.partnerLogo img {
    mix-blend-mode: multiply;
}

.faqSec {
    height: 100vh;
    background-position: center;
    background-size: cover;
    padding-top: 91px;
    padding-bottom: 150px;
}

.faqVidBg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.faqVidBg video {
    width: 100%;
    height: 100vh;
    object-fit: cover;
}

.faqSec .container-inner {
    height: 100%;
    position: relative;
}

.faqSec .container-inner .row {
    height: 100%;
    justify-content: space-between;
}

.faqCtaLinks {
    gap: 46px;
}

.faqList {
    max-width: 62%;
}

.faqItem {
    padding: 16px 34px;
    border-radius: 12px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.30) 0%, rgba(0, 0, 0, 0.30) 100%), url('../images/home/faq_pattern.svg') rgba(211, 211, 211, 0) 50% / cover no-repeat;
    backdrop-filter: blur(7.5px);
    position: relative;
}

.faqItem:hover {
    background: linear-gradient(0deg, rgb(255 255 255 / 74%) 0%, rgb(255 255 255 / 70%) 100%), url('../images/home/faq_pattern.svg') rgb(255 255 255 / 46%) 50% / cover no-repeat;
}

.faqItem:hover .faqnavIcon .plusIcon {
    filter: invert(1);
}

.gridContainer {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(2, auto);
    gap: 20px;
    transition: all 0.5s ease;
}

.gridCard {
    cursor: pointer;
    transition: all 0.5s ease;
}

.gridContainer.expanded {
    grid-template-columns: 2fr 1fr;
    grid-template-rows: repeat(5, auto);
    max-width: 100%;
    gap: 20px 6%;
}

.gridContainer.expanded .gridCard.main {
    grid-column: 1 / 2;
    grid-row: 1 / 6;
    background: #242424CC;
    transition: all 0.5s ease;
}

.gridContainer.expanded .gridCard.main::before {
    content: '';
    background: linear-gradient(0deg, rgb(255 255 255 / 74%) 0%, rgb(255 255 255 / 70%) 100%), url('../images/home/faq_pattern.svg') rgb(255 255 255 / 46%) 50% / cover no-repeat;
    position: absolute;
    top: 0;
    left: 0;
    width: 45%;
    height: 120px;
    border-radius: 10px 0px 0px 0px;
    z-index: -1;
}

.gridContainer.expanded .gridCard:not(.main) {
    grid-column: 2 / 3;
    grid-row: auto;
    width: 350px;
    margin-left: auto;
}

.gridCard.main .faqFront {
    max-width: 33%;
}

.faqFront .closeIcon,
.gridCard.main .faqFront .plusIcon {
    display: none;
}

.gridCard.main .faqFront .closeIcon {
    display: block;
}

.faqItem h5 {
    color: white;
    font-family: "Roboto Flex";
    font-size: 14px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    padding-bottom: 17px;
}

.faqItem h4 {
    color: white;
    font-family: "Roboto Flex";
    font-size: 22px;
    font-weight: 400;
    line-height: 28px;
}

.faqItem:hover h4,
.faqItem:hover h5,
.faqItem.main h5,
.faqItem.main h4 {
    color: black;
}

.faqItem .faqnavIcon {
    position: absolute;
    top: 12px;
    right: 11px;
}

.faqBack {
    opacity: 0;
    visibility: hidden;
    display: none;
    transition: all .4s ease-in-out;
}

.faqBack.active {
    opacity: 1;
    display: block;
    visibility: visible;
}

.faqBackInner {
    display: flex;
    flex-direction: column;
    gap: 54px;
    padding-top: 70px;
}

.faqBackInner .faqCta {
    padding-bottom: 54px;
    border-bottom: 1px solid #fff;
}

.reviewSec {
    padding-top: 128px;
    padding-bottom: 85px;
}

.reviewSlideContainer {
    padding-top: 35px;
    /* max-width: 90%; */
}

.reviewSlider.swiper {
    padding-bottom: 50px;
    padding-left: 5%;
}

.reviewSlider.swiper-wrapper {
    justify-content: center;
}

.reviewSlider .slider-active .swiper-wrapper {
    justify-content: normal;
}

.review-swiper-pagination {
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    max-width: 25%;
    margin: auto;
    display: block;
}

.review-swiper-pagination .swiper-pagination-bullet {
    background: #242424;
    width: 13px;
    height: 13px;
}

.reviewSec .reviewItem {
    display: flex;
    gap: 8px;
}

.reviewSec .reviewContBox {
    max-width: 400px;
    padding: 46px 56px;
    border-radius: 10px;
    border: 0.65px solid rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(7.5px);
    background: rgba(80, 63, 47, 0.20);
    transition: .3s ease-in-out;
}

.reviewSec .reviewContBox h2 {
    color: #3C3930;
    font-family: "Roboto Flex";
    font-size: 32px;
    font-weight: 400;
    line-height: normal;
    max-width: 90%;
    padding-bottom: 50px;
}

.reviewAuthor {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
}

.reviewAuthor::before {
    content: '';
    height: 2px;
    font-size: 22px;
    background: #3C3930;
    width: 13px;
    margin-top: -12px;
}

.reviewSec .reviewContBox .reviewAuthor p,
.reviewSec .reviewContBox .reviewCount,
.blogInfo .blogDate {
    color: #3C3930;
    font-family: "Roboto Flex";
    font-size: 14px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 1.4px;
    text-transform: uppercase;
}

.reviewSlider .swiper-slide {
    flex: 0 0 50%;
    transition: flex-basis 0.6s ease;
    display: flex;
}

.reviewSlider .swiper-slide.swiper-slide-active {
    flex: 0 0 70%;
}

.reviewImg {
    transition: width 0.6s ease;
    overflow: hidden;
    display: flex;
    justify-content: flex-end;
}

.reviewSlider .swiper-slide:hover .reviewContBox h2,
.reviewSlider .swiper-slide:hover .reviewContBox p,
.reviewSlider .swiper-slide:hover .reviewContBox span {
    color: white;
}

.reviewSlider .swiper-slide:hover .reviewAuthor::before {
    background-color: white;
}

/* .reviewSlider .swiper-slide:hover {
    flex-basis: 70%;
} */

.reviewSlider .swiper-slide.bgGreen:hover .reviewContBox {
    background: #7F8951;
    /* filter: invert(1); */
}

.reviewSlider .swiper-slide.bgBlue:hover .reviewContBox {
    background: #617DA2;
}

.reviewSlider .swiper-slide:hover .reviewImg {
    width: 100%;
}

.reviewItem:hover .reviewImg img {
    transform-origin: right center;
    transition: transform 0.6s ease;
}

.reviewSec .reviewImg {
    width: 100%;
    transition: .3s ease-in-out;
}

.reviewSec .reviewImg img {
    height: 440px;
    width: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.statsSec,
.brandPrevNextSec {
    padding-top: 114px;
    padding-bottom: 116px;
}

.darkDottedBg {
    background-image: url('../images/home/key_stats_bg.png');
    /* background-color: rgba(0, 0, 0, 0.5); */
    /* background-blend-mode: overlay; */
    background-position: center;
    background-size: cover;
}

.darkDottedBg::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: -1;
}

.statsRow {
    padding-bottom: 85px;
    border-bottom: 1px solid #EEEBE3;
}

.statsSec .pr-5 {
    padding-right: 5%;
}

.statsRow .desc {
    padding-top: 50px;
}

.statsList {
    display: flex;
    flex-wrap: wrap;
    gap: 62px 45px;
    padding-top: 28px;
    border-top: 1px solid #EEEBE3;
}

.statsItem {
    flex: 0 0 29%;
}

.statsList:not(:last-child) .statsItem {
    padding-bottom: 62px;
}

.statsItem .statsLabel {
    color: #EEEBE3;
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 0.9px;
    text-transform: uppercase;
}

.statsItem .statsValue {
    color: #EEEBE3;
    font-family: 'Noka-Light';
    font-size: 120px;
    font-weight: 300;
    line-height: normal;
    letter-spacing: -6px;
}

.blogsFull.container-fluid {
    max-width: 100%;
    margin-right: 0px;
}

.blogsRow {
    padding-top: 117px;
}

.blogsContainer {
    gap: 11px;
    position: relative;
}

/* .blogsContainer .blogsSlider .swiper-wrapper {
    margin-left: 31%;
} */

.blogsIntro {
    background-color: rgba(251, 241, 230, 0.78);
    background-image: url('../images/home/blog_intro_bg.svg');
    background-size: cover;
    background-position: center;
    border: 0.35px solid rgba(0, 0, 0, 0.50);
    backdrop-filter: blur(10px);
    max-width: 29%;
    flex: 0 0 30%;
    padding: 29px 35px;
    display: flex;
    flex-direction: column;
    min-height: 390px;
    border-radius: 10px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 99;
    margin-left: 7%;
}

.blogsIntro .desc p {
    font-family: "Roboto Flex", sans-serif;
}

.blogsIntro .ctaBtn {
    margin-top: auto;
    padding-bottom: 25px;
}

.blogSlide.swiper-slide {
    border-radius: 10px;
    height: 630px;
}

.blogSlide.swiper-slide:nth-child(2),
.blogSlide.swiper-slide:last-child {
    height: 700px;
}

.blogSlide .blogInfo {
    padding: 15px;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.blogSlide .blogInfo .imgArea {
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
    align-items: flex-start;
    max-width: 55%;
    margin-left: auto;
    transition: .5s ease-in-out;
    position: relative;
}

.blogSlide:hover .blogInfo .imgArea {
    max-width: 80%;
}

.blogSlide .blogInfo .imgArea img {
    width: 100%;
    object-fit: cover;
}

.blogInfo .blogDate {
    width: 50%;
    transition: all .3s ease-in-out;
    position: absolute;
    right: 22px;
    top: 405px;
}

.blogSlide:hover .blogInfo .blogDate {
    left: 30px;
}

.blogSlide .blogInfo .blogReadmore {
    position: absolute;
    bottom: 16px;
    left: 14px;
    /* top: 78%;
    left: 45%;
    transform: translate(-50%, -80%); */
    opacity: 0;
    transition: opacity .3s ease-in-out;
}

.blogSlide:hover .blogInfo .blogReadmore {
    opacity: 1;
}

.blogSlide .blogInfo .ctaBtn a {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 1.6px;
}

.blogSlide .blogInfo .titleArea {
    padding: 0px 20px;
    margin-top: auto;
}

.blogSlide .blogInfo .secTitle {
    font-family: "Roboto Flex", sans-serif;
    font-weight: 400;
    line-height: 34px;
    letter-spacing: normal;
    text-transform: none;
}

.blog-swiper-nav {
    display: flex;
    align-items: center;
    position: absolute;
    left: 7%;
    z-index: 999;
    top: 450px;
    gap: 20px;
}

.blog-swiper-nav .blog-swiper-prev,
.blog-swiper-nav .blog-swiper-next {
    position: relative;
    width: 58px;
    height: 58px;
}

.blog-swiper-prev svg,
.blog-swiper-next svg {
    fill: transparent !important;
    background: #C8BFB7;
    border-radius: 50%;
    padding: 12px;
}

.blog-swiper-next:not(.swiper-button-disabled) svg path,
.custom-swiper-next:not(.swiper-button-disabled) svg path {
    stroke-opacity: 1;
}

.projectSec {
    padding-top: 102px;
    padding-bottom: 88px;
}

.projectSec .titleArea .mainTitle {
    color: #000;
    font-family: Noka-medium;
    font-size: 36px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.72px;
}

.projCategList {
    position: absolute;
    top: 20px;
    left: 26px;
    display: flex;
    gap: 14px;
}

.projCategList .projCategItem {
    border-radius: 6px;
    background: #FFF;
    padding: 16px 20px;
    color: #000;
}

.projCategList .projCategItem:nth-child(even) {
    background-color: rgba(5, 5, 5, 0.15);
    backdrop-filter: blur(10px);
    color: #fff;
}

.projViewMore {
    position: absolute;
    bottom: 17px;
    right: 18px;
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
}

.projViewMore p {
    opacity: 0;
    transition: .5s ease-in-out;
    margin-bottom: 0px;
    font-family: "Roboto Flex", sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 1.8px;
    text-transform: uppercase;
}

.projViewMore .eyeIcon {
    background-color: rgba(5, 5, 5, 0.15);
    backdrop-filter: blur(10px);
    padding: 18px 17px 20px;
    border-radius: 10px;
}

.projectSlider .swiper-wrapper {
    margin-left: 10%;
}

.projectSlider {
    min-height: 75vh;
}

.projectSlider .projectSlide.swiper-slide {
    /* transform: scale(0.8);*/
    transition: all .5s ease-in-out;
    flex-basis: 21%;
}

.projectSlider .projectSlide.swiper-slide-active {
    flex-basis: 60%;
    /* transform: scale(1.5);
    opacity: 1; */
}

.projectSlide.swiper-slide-active .projViewMore p {
    opacity: 1;
}

.projectSlide .imgArea img {
    width: 100%;
    height: auto;
    min-height: 305px;
    object-fit: cover;
    border-radius: 12px;
    display: block;
}

.inspireSec {
    /* height: 100vh; */
    /* display: flex; */
    /* background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: fixed; */
    /* KEY for parallax */
}

.inspireSec .titleArea.absoluteTitle {
    position: absolute;
    left: 10%;
    top: 8%;
}

.inspireImgFixed {
    display: flex;
}

.inspireImgCol {
    height: 100vh;
    background-position: top right;
    background-repeat: no-repeat;
    background-attachment: fixed;
    width: 100%;
    flex: 0 0 50%;
}

.inspireImgCol.colLeft {
    background-position: top left;
}

.inspireImgCol.colRight {
    background-position: top right;
}

/*
.inspireFloatImg {
    position: absolute;
    top: 1%;
    left: 50%;
    transform: translate(-50%, 0%) scale(1);
    transition: transform 0.3s ease, width 0.3s ease, height 0.3s ease;
    width: 50%;
    height: auto;
    cursor: pointer;
    box-shadow: 0 4px 56.7px 46px rgba(0, 0, 0, 0.45);
}

.inspireFloatImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 0 0 12px 12px;
}

.inspireFloatImg {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
} */

.inspireImgFixed {
    position: relative;
}

.inspireFloatImg {
    position: absolute;
    top: 0%;
    left: 50%;
    width: 50%;
    height: auto;
    transform: translate(-50%, 0%) scale(1);
    transition: transform 0.4s ease, width 0.4s ease, height 0.4s ease;
    box-shadow: 0 4px 56.7px 46px rgba(0, 0, 0, 0.45);
}

.inspireFloatImg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 12px;
}

/* === States === */

/* Default (center) */
.inspireFloatImg.default {
    transform: translate(-50%, 0%) scale(1);
    width: 55%;
    height: auto;
}

/* Hover RIGHT column → move LEFT + small square */
.inspireFloatImg.on-right {
    transform: translate(-100%, 10%) scale(1);
    width: 40%;
    height: 80%;
}

/* Hover LEFT column → move RIGHT + tall vertical */
.inspireFloatImg.on-left {
    transform: translate(0%, 20%) scale(1);
    width: 50%;
    height: 70%;
}

/* Hover on itself → center but larger */
.inspireFloatImg.on-self {
    transform: translate(-50%, 10%) scale(1.2);
}

.inspireImgCol .imgArea img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Home page styles end */

/* About page styles start */

.abtBannerSec .titleArea .secTitle {
    font-size: 30px;
    padding-bottom: 20px;
}

.pr-23 {
    padding-right: 23px !important;
}

.pl-23 {
    padding-left: 23px !important;
}

.abtBannerCta .ctaBtn {
    position: absolute;
    bottom: 22px;
    left: 34px;
}

.abtBannerCta .imgArea img {
    border-radius: 6px;
}

.abtBannerCta .ctaBtn.right {
    right: 34px;
    left: auto;
}

.abtBgCont {
    border-radius: 6px;
    background: #A5C7DD;
    padding: 44px 54px;
    margin-top: 46px;
}

.abtBgCont .desc {
    padding-bottom: 80px;
    padding-right: 15px;
}

.abtBgCont .desc h4,
.abtStatsSec .desc p,
.ctaBanner .titleArea .mainTitle,
.contBannerSec .formCol .mainTitle,
.ctaFloatBox .titleArea .mainTitle {
    font-family: Noka-medium;
    font-size: 40px;
    font-weight: 500;
    line-height: 137%;
}

.abtBgCont .ctaBtn.right {
    right: 70px;
    bottom: 55px;
}

.abtStatsSec {
    padding-top: 150px;
    padding-bottom: 119px;
}

.abtStatsSec .statsList {
    justify-content: space-between;
    padding-left: 14%;
    border-top: 0px;
}

.abtStatsSec .statsList .statsItem {
    flex: auto;
}

.abtStatsSec .statsList .statsItem .statsLabel {
    font-size: 22px;
}

.abtStatsSec .statsList .statsItem .statsValue {
    color: #2A76A8;
}

.abtStatsSec .abtInfo {
    max-width: 95%;
    padding-left: 14%;
    padding-top: 46px;
}

.abtStatsSec .imgFloatLeft {
    margin-top: 138px;
    max-width: 90%;
    position: relative;
}

.abtStatsSec .imgFloatLeft img {
    max-height: 350px;
    width: 100%;
    object-fit: cover;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}

.abtStatsSec .imgFloatRight {
    float: right;
    position: relative;
}

.abtStatsSec .imgFloatRight::before,
.abtStatsSec .imgFloatLeft::before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    right: 0;
    left: auto;
    top: 0;
    background-color: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(10px);
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    transition: .6s ease-in-out;
}

.abtStatsSec .imgFloatLeft::before {
    left: 0;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.abtStatsSec:hover .imgFloatRight::before {
    width: 20%;
}

.abtStatsSec:hover .imgFloatLeft::before {
    width: 10%;
}

.abtStatsSec .imgFloatRight img {
    width: max-content;
    max-width: 531px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
}

.abtStatsSec .descWithCta {
    display: flex;
    align-items: flex-end;
    gap: 30px;
    justify-content: space-between;
    max-width: 50%;
    padding-top: 0px;
    padding-left: 0px;
    margin: auto;
}

.abtStatsSec .descWithCta p {
    flex: 0 0 75%;
    margin-bottom: 0px;
}

.abtStatsSec .descWithCta .ctaBtn {
    flex: 0 0 auto;
}

.certifSec {
    background-size: cover;
    background-position: center;
}

.statsSec .pr-6 {
    padding-right: 6%;
}

.certifSec .certifFullImg img {
    max-height: 740px;
}

.certifSec .titleArea .secTitle {
    padding-bottom: 40px;
}

.certifSec .container-inner {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 70px;
}

.certifSec .desc p {
    line-height: 145%;
}

.certifLogos {
    display: flex;
    align-items: flex-start;
    gap: 57px;
    justify-content: flex-end;
}

.certifLogos .certifItem p {
    margin-bottom: 0px;
    margin-top: 10px;
}

.abtBrandSec {
    padding-top: 123px;
    padding-bottom: 101px;
}

.abtBrandLogos {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 49px 0px;
}

.abtBrandLogos .abtBrandLogo {
    flex: 0 0 33%;
}

.abtBrandSec .brandDet {
    padding-left: 2%;
}

.abtBrandSec .brandDet .desc p {
    font-size: 28px;
    line-height: 153%;
}

.abtGroupSec .abtGrpCont {
    padding-top: 250px;
    padding-bottom: 15%;
}

.flex-1 {
    flex: 1;
}

.abtGroupSec .abtGrpCont p {
    line-height: 145%;
    color: #443F3B;
    font-family: 'Noka-medium';
}

.abtGroupSec.left .abtGrpImg img {
    border-radius: 6px 0 0 6px;
    display: flex;
    justify-content: flex-end;
}

.abtGroupSec.left .abtGrpImg {
    display: flex;
    justify-content: flex-end;
}

.abtGroupSec.right .abtGrpImg img {
    border-radius: 0px 6px 6px 0px;
}

.teamSec,
.seealsoSec {
    padding-top: 109px;
}

.desc.w-30 {
    max-width: 30%;
    display: block;
    margin: auto;
}

.teamSec .desc p {
    color: #443F3B;
}

.teamList .teamItem {
    border-right: 1px solid #3D4856;
    display: flex;
    justify-content: center;
    min-height: 400px;
}

.teamList .teamItem .teamInfo {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 13px;
    transition: .5s ease-in-out;
}

.teamList .teamItem:nth-child(even) .teamInfo {
    flex-direction: column-reverse;
}

.teamList .teamItem .imgArea {
    height: 65%;
    overflow: hidden;
    transition: .5s ease-in-out;
    border-radius: 6px;
}

.teamList .teamItem:hover .imgArea {
    height: 100%;
    filter: grayscale(1);
}

.teamList .swiper-wrapper {
    padding: 0px 3%;
}

.team-swiper-prev.swiper-button-disabled svg path,
.team-swiper-next.swiper-button-disabled svg path {
    fill: rgba(68, 63, 59, 0.50);
}

.team-swiper-prev,
.team-swiper-next {
    opacity: 1 !important;
}

.team-swiper-prev svg path,
.team-swiper-next svg path {
    fill: #B07241;
    fill-opacity: 1;
}

/* .teamList .teamItem:hover .teamInfo {
    gap: 0px;
} */

.teamList .teamItem .imgArea img {
    height: 100%;
    object-fit: cover;
    width: 100%;
    object-fit: cover;
    object-position: top;
    transition: .5s ease-in-out;
}

.teamList .membName,
.teamList .membDesig {
    color: #443F3B;
    font-family: 'Noka-medium';
    font-size: 22px;
    font-weight: 600;
    line-height: 32px;
}

.teamList .teamItem:hover .membName {
    color: #CF2727;
}

.teamList .membDesig {
    font-family: 'Noka-light';
    font-weight: 400;
}

.clientsSec {
    padding-top: 150px;
}

.clientsLogos {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 58px 0px;
}

.clientsLogos .clientItem {
    flex: 0 0 15%;
}

.clientsLogos .clientItem img {
    display: block;
    margin: auto;
}

.seealsoSec {
    padding-bottom: 120px;
}

.seealsoSec .container {
    width: 75%;
}

.titleBorder {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.titleBorder::before {
    content: '';
    background-color: #000;
    flex: 0 0 auto;
    height: 2px;
    display: block;
    width: 87%;
}

.titleBorder.whiteBorder::before {
    background-color: #fff;
}

.ctaBanner,
.awardsList {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ctaBanner {
    position: relative;
}

.ctaBanner .titleArea {
    flex: 0 0 20%;
}

.ctaBanner.leftBanner .titleArea .mainTitle {
    float: right;
}

.ctaBanner .imgArea {
    flex: 0 0 80%;
}

.ctaBanner .imgArea img {
    width: 100%;
    max-height: 170px;
    object-fit: cover;
    border-radius: 10px;
}

.ctaBanner::before {
    background: #C2CD94;
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    width: 0;
    height: 100%;
    border-radius: 10px;
    transform: translateX(-50%);
    transition: width 0.5s ease;
    z-index: -1;
}

.ctaBanner:hover::before {
    transform: scaleX(1.14) translateX(-45%);
    width: 100%;
}

.ctaBanner::after {
    content: "";
    position: absolute;
    top: 0px;
    left: 0%;
    width: 464px;
    height: 100%;
    background-image: url('../images/about/theme_icon.svg');
    background-size: cover;
    background-repeat: no-repeat;
    transition: .3s ease-in-out;
    opacity: 0;
}

.ctaBanner:hover:after {
    left: -10%;
    opacity: 1;
}

.ctaBanner.leftBanner::before {
    background: #A4BCD1;
}

.ctaBanner.leftBanner::after {
    right: 0%;
    left: auto;
}

.ctaBanner.leftBanner:hover:after {
    right: -10%;
}

/* About page styles end */

/* Contact page styles start */

.contBannerSec {
    /* padding-top: 150px; */
    padding-top: 9%;
    padding-bottom: 5.5%;
}

.formCol {
    background-color: rgba(0, 0, 0, 0.18);
    border: 0.65px solid rgba(255, 255, 255, 0.50);
    backdrop-filter: blur(10px);
    padding: 62px 76px 44px 73px;
    border-radius: 0px 20px 0px 30px;
    display: flex;
    flex-direction: column;
    gap: 110px;
}

.formCol .titleArea .secTitle {
    margin-bottom: 0px;
    padding-bottom: 30px;
}

.formArea form {
    display: grid;
    gap: 35px
}

/* Form styles start  */
.form-group {
    position: relative;
    height: auto;
}

.form-group input[type="text"],
.form-group input[type="email"],
.form-group input[type="password"],
.form-group textarea,
.form-group select {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    padding-bottom: 10px;
    border: 0;
    background: transparent;
    color: white;
    font-size: 20px;
    border-radius: 8px;
    outline: none;
}

.form-group textarea {
    height: 72px;
    resize: vertical
}

.form-group label {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    font-size: 20px;
    color: white;
    transform-origin: left top;
    transition: transform .3s ease-in-out;
    background: transparent;
}

.form-group .bar {
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    height: 1px;
    background: rgba(255, 255, 255, 0.562);
    border-radius: 2px;
    overflow: hidden;
}

.form-group .bar::after {
    content: '';
    position: absolute;
    left: 50%;
    transform: translateX(-50%) scaleX(0);
    top: 0;
    bottom: 0;
    width: 100%;
    height: 2px;
    background: rgb(255, 255, 255);
    transform-origin: center;
    transition: transform .3s ease-in-out
}

.form-group input:focus+label,
.form-group input.filled+label,
.form-group textarea:focus+label,
.form-group textarea.filled+label,
.form-group select:focus+label,
.form-group select:focus+label,
.form-group select.filled+label {
    transform: translateY(-20px) scale(0.7);
}

.form-group input:focus~.bar::after,
.form-group textarea:focus~.bar::after,
.form-group select:focus~.bar::after {
    transform: translateX(-50%) scaleX(1);
}

.form-group select::after {
    content: '';
    position: absolute;
    pointer-events: none;
}

.form-dropdown::after {
    content: '';
    position: absolute;
    right: 0px;
    top: 50%;
    width: 10px;
    height: 10px;
    border-right: 2px solid #443F3B;
    border-bottom: 2px solid #443F3B;
    transform: translateY(-50%) rotate(45deg);
}

.circleArrow.inverted img {
    filter: invert(1);
}

.form-submit {
    justify-content: flex-end;
}

.submitBtn {
    background-color: transparent;
    color: white;
    font-family: Noka-medium;
    font-size: 14px;
    letter-spacing: 1.4px;
    border: 0;
    cursor: pointer;
    font-weight: 600;
    text-transform: uppercase;
}

/* Form styles end */

.bannerNav .bannerNavList {
    list-style-type: none;
    display: inline-block;
    align-items: center;
    background-color: rgba(0, 0, 0, 0.15);
    border: 0.65px solid rgba(255, 255, 255, 0.50);
    backdrop-filter: blur(10px);
    padding-left: 0px;
    margin-left: 0px;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 12px 0px 12px 0px;
    margin-bottom: 0px;
}

.bannerNav .bannerNavList .bannerNavItem {
    padding: 20px 24px;
    border-right: 0.65px solid rgba(255, 255, 255, 0.50);
    display: inline-block;
}

.bannerNav .bannerNavList .bannerNavItem:last-child {
    border-right: 0px;
}

.bannerNav .bannerNavItem a {
    color: white;
    text-decoration: none;
    font-family: Noka-medium;
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 1.8px;
    text-transform: uppercase;
}

.showRoomSec .stickyCol {
    padding-top: 60px;
}

.showRoomInfo .desc p {
    font-size: 24px;
    line-height: 145%;
    font-family: 'Noka-medium';
    color: #443F3B;
}

.showRoomInfo .ctaBtn a {
    font-size: 14px;
    font-family: "Roboto Flex", sans-serif;
    font-weight: 500;
}

.formDark .form-group label,
.formDark .form-group input[type="text"],
.formDark .form-group input[type="email"],
.formDark .form-group input[type="password"],
.formDark .form-group textarea,
.formDark .form-group select {
    color: #443F3B;
}

.formDark .form-group .bar {
    background-color: #bfafa2;
}

.formDark .form-group .bar::after {
    background-color: #443F3B;
}

/* .formDark .form-submit.ctaPrimary .circleArrow img {
    filter: none;
} */

.formTabsArea .nav-tabs {
    border-bottom: 0px !important;
    gap: 60px;
    padding-bottom: 56px;
}

.formTabsArea li .nav-link {
    color: #000;
    font-family: Noka-Light;
    font-size: 26px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 2.6px;
    text-transform: uppercase;
    background-color: transparent !important;
    border: none;
    padding: 0px;
}

.formTabsArea li .nav-link.active {
    color: #443F3B;
    font-family: Noka-medium;
}

.launchlearnSec {
    padding-top: 108px;
    /* padding-bottom: 130px; */
}

.launchlearnSec .imgArea img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 10px;
}

.ctaFloatBox {
    position: absolute;
    top: 7%;
    right: 28%;
    width: 25%;
    background-color: rgba(0, 0, 0, 0.20);
    border: 0.65px solid rgba(255, 255, 255, 0.50);
    backdrop-filter: blur(10px);
    padding: 51px 32px 80px 44px;
    border-radius: 0px 12px 0px 12px;
}

.launchlearnSec .container-full .ctaFloatBox {
    width: 20%;
    right: 32%;
    top: 10%;
}

.launchlearnSec .container-full .imgArea img {
    max-height: 600px;
    object-position: center;
}

.ctaFloatBox,
.ctaFloatBox .titleArea {
    display: flex;
    flex-direction: column;
    gap: 50px;
}

.ctaFloatBox .ctaBtn {
    justify-content: flex-end;
}

.ctaFloatBox .ctaBtn a,
.brandBannerCta .ctaBtn a {
    font-size: 14px;
}

/* Contact page styles end */

/* Brands page styles start */

.brandsBannerSec {
    padding-bottom: 51px;
}

.brandsBannerSec .flexTitle .secTitle {
    flex: 0 0 30%;
    font-size: 30px;
}

.brandsBannerSec .flexTitle .desc {
    flex: 0 0 65%;
    padding-top: 60px;
}

.brandsBannerSec .flexTitle .desc p {
    font-family: Noka-medium;
    font-size: 40px;
    line-height: 137%;
}

.brandsCtaSec.bgCover {
    min-height: 560px;
    padding-top: 7%;
}

.brandBannerCta {
    max-width: 40%;
    border-radius: 6px;
    background: #F1EDE1;
    padding: 34px 45px 25px;
}

.brandBannerCta .imgArea img {
    padding-bottom: 35px;
    width: 180px;
}

.brandBannerCta .desc p,
.otherPartnersSec .desc p {
    font-family: Noka-medium;
}

.brandBannerCta .ctaBtn {
    padding-top: 20px;
}

.brandBannerCta .ctaBtn a {
    font-weight: 600;
}

.brandBannerCta .titleArea .mainTitle {
    font-size: 40px;
}

.partnerBrandsSec {
    background: white;
    padding-bottom: 111px;
}

.partnerBrandsSec .container-fluid {
    max-width: 92%;
    padding-top: 55px;
}

.partnerBrandsSec .filterArea,
.otherPartnersSec .filterArea {
    display: flex;
    align-items: center;
    gap: 11px;
    flex: 0 0 auto;
}

.partnerBrandsSec .filterArea span,
.otherPartnersSec .filterArea span {
    color: #000;
    text-align: right;
    font-size: 14px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 1.4px;
    font-family: "Roboto Flex", sans-serif;
    text-transform: uppercase;
}

.partBrandList,
.otherBrandsList {
    display: flex;
    align-items: flex-start;
    gap: 17px;
    flex-wrap: wrap;
}

.partBrandList .partBrandItem {
    border-radius: 10px;
    background: #F1EDE1;
    flex: 0 0 32%;
    width: 32%;
    position: relative;
    height: 77vh;
}

.partBrandItem .brandLogo {
    position: absolute;
    top: 56px;
    left: 0;
    right: 0;
    max-width: 60%;
    margin: auto;
    border-radius: 6px;
    /* background: rgba(255, 255, 255, 0.20); */
    backdrop-filter: blur(10px);
    padding: 35px 0px;
    transition: .3s ease-in-out;
}

.partBrandItem .brandLogo img {
    display: block;
    margin: auto;
}

.partBrandItem .brandFeatImg {
    transition: .3s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
}

.brandFeatImg img {
    margin: auto;
    display: block;
    max-width: 380px;
    border-radius: 10px;
    transition: .3s ease-in-out;
    margin-bottom: 40px;
}

.partBrandItem .ctaBtn {
    position: absolute;
    bottom: 0px;
    left: 0;
    right: 0;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: .3s ease-in-out;
}

.partBrandItem:hover .brandLogo {
    background: rgba(255, 255, 255, 0.20);
}

.partBrandItem:hover .ctaBtn {
    opacity: 1;
    visibility: visible;
    bottom: 35px;
}

.partBrandItem:hover .brandFeatImg img {
    width: 100%;
    max-width: 100%;
    margin-bottom: 0px;
    height: auto;
    object-fit: cover;
}

.otherPartnersSec {
    border-radius: 20px 20px 0 0;
    background: #ECF4F8;
    padding-bottom: 111px;
}

.otherPartnersSec .titleArea .desc {
    max-width: 50%;
}

.otherPartnersSec .titleArea .desc p {
    font-size: 24px;
    line-height: 145%;
}

.otherBrandsList {
    gap: 50px;
    /* justify-content: space-between; */
    padding-top: 36px;
}

.z99 {
    z-index: 99;
    position: relative;
}

.otherBrandsList .otherBrandsItem {
    flex: 0 0 150px;
    border-radius: 6px;
    border: 0.65px solid #C8BFB7;
    min-height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 150px;
    transition: 0.5s ease-in-out;
}

.otherBrandsList .otherBrandsItem:hover {
    background: #F1EDE1;
}

.otherBrandsItem img {
    mix-blend-mode: multiply;
}

/* Brands page styles end */

/* Brand detail page styles start */

.brandDetBanSec {
    z-index: 3;
}

.brandBreadcrumb a {
    letter-spacing: normal;
    display: flex;
    align-items: center;
    gap: 9px;
    color: #6D6D6D;
    text-transform: none;
    font-family: Noka-medium;
    font-weight: 600;
}

.brandInfoBox {
    border-radius: 6px;
    background: #FFF;
    padding: 70px 51px 59px 45px;
    height: 100%;
}

.brandInfoBox .brandDetail {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%;
}

.brandDetail .brandLogo img {
    width: 180px;
}

.brandDetail .desc {
    max-width: 89%;
}

.brandDetail .desc p {
    font-weight: 600;
    color: #443F3B;
    line-height: 145%;
}

.brandDetail .ctaBtn a {
    color: #214938;
    font-size: 20px;
    font-family: Noka-semibold;
}

.brandImgBox img {
    max-height: 70vh;
    width: 100%;
    object-fit: cover;
}

.brandInnerNav {
    border-bottom: 0.65px solid #443F3B;
    padding-bottom: 23px;
    padding-top: 52px;
}

.brandInnerNav .brandNavList {
    display: flex;
    align-items: center;
    gap: 77px;
    max-width: 82%;
    margin: auto;
}

.brandInnerNav .brandNavItem {
    position: relative;
}

.brandInnerNav .brandNavItem:nth-child(4) {
    margin-left: auto;
}

.brandInnerNav .brandNavItem a {
    color: #686664;
    font-family: Noka-Medium;
    font-size: 26px;
    font-weight: 600;
    line-height: 32px;
    letter-spacing: 2.6px;
    text-decoration: none;
    text-transform: uppercase;
}

.brandInnerNav .brandNavItem::before {
    content: '';
    background-color: #000;
    position: absolute;
    bottom: -23px;
    left: 0;
    width: 0%;
    height: 2px;
    transition: .3s ease-in-out;
}

.brandInnerNav .brandNavItem.active::before,
.brandInnerNav .brandNavItem:hover::before {
    width: 100%;
}

.brandInnerNav .brandNavItem.active a {
    color: #000;
}

.brandOverview::before {
    content: '';
    position: absolute;
    top: -56px;
    left: 0;
    width: 100%;
    height: 230px;
    background: linear-gradient(360deg, #FFF 0%, rgba(255, 255, 255, 0.00) 100%);
    z-index: -1;
}

.overviewCont {
    padding-top: 51px;
}

.overviewCont .desc p {
    line-height: 145%;
}

.collectionSec,
.catalogueSec {
    padding-bottom: 100px;
}

.collectionList {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: 20px;
    /* justify-content: center; */
}

.collectionItem {
    flex: 0 0 49%;
}

.collectionItem .imgArea img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.collectionItem .collectionInfo h4 {
    color: #FFF;
    font-family: Noka-semibold;
    font-size: 30px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: -0.6px;
    padding-bottom: 24px;
    /* transition: .3s ease-in-out; */
}

.collectionItem .collectionInfo {
    position: absolute;
    bottom: 25px;
    left: 28px;
    background-color: rgba(0, 0, 0, 0.30);
    backdrop-filter: blur(10px);
    padding: 21px 24px;
    border-radius: 6px;
    width: 75%;
    max-height: 80px;
    transition: max-height .3s ease-in-out;
}

.collectionItem .collectionCont {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.3s ease;
    /* margin-top: 10px; */
    height: 0;
    visibility: hidden;
    /* padding-top: 14px; */
}

.collectionItem .collectionCont p {
    padding-bottom: 20px;
}

.collectionItem:hover .collectionCont {
    opacity: 1;
    transform: translateY(0);
    height: 100%;
    visibility: visible;
}

.collectionItem:hover .collectionInfo {
    max-height: 200px;
}

.awardsCatSec {
    padding-top: 90px;
    padding-bottom: 160px;
    border-radius: 20px 20px 0 0;
}

.awardsList .awardItem {
    background: #F1EDE1;
}

.awardsList .awardItem img {
    mix-blend-mode: multiply;
    filter: grayscale(1);
    transition: .3s ease-in-out;
}

.awardsList .awardItem:hover img {
    filter: none;
}

.catalogueSec .container-inner.extendRight {
    max-width: 90%;
    margin-right: 0;
    padding-left: 10px;
}

/* .catalogueSlider .swiper-wrapper {
    align-items: flex-end;
}

.catalogueSlide.swiper-slide {
    max-width: max-content;
    transition: .3s ease-in-out;
    margin-right: 27px;
}

.catalogueSlide.swiper-slide-active {
    max-width: 26%;
    transition: .3s ease-in-out;
    margin-right: 5%;
}

.catalogueSlide.swiper-slide-active img {
    width: 90%;
    height: 100%;
    object-fit: cover;
} */

/* catalogues slider */
.slideInner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    max-width: 60%;
}

/* Detail / main slider */
.catalDetailSlider {
    width: 600px;
    height: 400px;
    margin: auto;
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
    /* background: #000; */
}

.catalDetailSlider .swiper-slide {
    position: relative;
    width: 100%;
    height: 100%;
}

.catalDetailSlider img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: none;
}

.slide-info {
    /* position: absolute; */
    /* bottom: 0; */
    /* left: 0; */
    width: 100%;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    padding: 20px;
    box-sizing: border-box;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.4s ease, transform 0.4s ease;
}

/* When the slide is active, show its info */
.catalDetailSlider .swiper-slide-active .slide-info {
    opacity: 1;
    transform: translateY(0);
}

.slide-info h3 {
    margin: 0;
    font-size: 20px;
}

.slide-info p {
    font-size: 14px;
    margin-top: 8px;
}

/* Thumbnail / thumbs slider */
.catalogueSlider {
    width: 60%;
}

.catalogueSlider .swiper-wrapper {
    align-items: flex-end;
    min-height: 600px;
}

.catalogueSlider .swiper-slide {
    flex: 0 0 14%;
    height: 200px;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
    opacity: 0.6;
}

.catalogueSlider .swiper-slide-active {
    /*   transform: scale(1.5); */
    opacity: 1;
    flex: 0 0 23%;
    height: 600px;
}

.catalogueSlider .swiper-slide img {
    width: 100%;
    height: 100%;
    display: block;
    border-radius: 6px;
}

.catalogueInfo {
    position: absolute;
    top: 0;
    left: 30%;
    max-width: 36%;
    z-index: 9;
}

.catalogueInfo .titleArea,
.catalogueInfo .desc,
.catalogueInfo .ctaBtn {
    opacity: 0;
    transform: translateY(100px);
    transition: transform 0.5s ease, opacity 0.5s ease;
}

.catalogueInfo .titleArea .secTitle {
    font-family: "Roboto Flex", sans-serif;
    font-size: 30px;
    line-height: normal;
    letter-spacing: -0.6px;
    text-transform: none;
}

.catalogueInfo.show .titleArea {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.1s;
}

.catalogueInfo.show .desc {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.3s;
}

.catalogueInfo.show .ctaBtn {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 0.5s;
}


/* catalogues slider */

.blogsSec {
    padding-bottom: 105px;
}

.brandPagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    position: relative;
}

.brandPagination .brandPrev,
.brandPagination .brandNext {
    flex: 0 0 50%;
}

.brandPrev,
.brandAll,
.brandNext {
    text-decoration: none;
}

.brandPrev .secTitle,
.brandNext .secTitle {
    padding-bottom: 34px;
    margin-bottom: 0px;
}

.brandPrev .imgArea,
.brandNext .imgArea {
    border-radius: 6px;
    background: #F1EDE1;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 200px;
}

.brandPrev .imgArea img,
.brandNext .imgArea img {
    width: 190px;
    height: 100%;
    object-fit: cover;
    mix-blend-mode: multiply;
}

.brandNext .secTitle {
    text-align: right;
}

.brandAll {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    width: max-content;
    display: block;
    margin: auto;
}

/* gallery styles */
.gallerySec {
    padding-bottom: 60px;
}

.galleryWrapper .galSlider {
    padding-top: 41px;
}

.galSlider {
    width: 100%;
    height: 100%;
    position: relative;
}

.galSlide {
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    overflow: hidden;
    transition: transform 0.6s ease, opacity 0.6s ease;
}

.galSlide img,
.solutionsList .solutionItem img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 6px;
}

.galSlide.swiper-slide-active {
    transform: translateX(0) scale(1);
    z-index: 5;
}

.galSlide.swiper-slide-next {
    transform: translateX(25%) translateY(5%) scale(1);
    z-index: 4;
    filter: grayscale(1);
}

.galSlide.swiper-slide-next+.galSlide.swiper-slide {
    transform: translateX(40%) scale(1);
    z-index: 3;
}

.galSlide.swiper-slide-next+.galSlide.swiper-slide+.galSlide.swiper-slide {
    transform: translateX(50%) scale(1);
    z-index: 2;
}

.galSlider .galSlide.swiper-slide-prev {
    transform: translateX(0%) translateY(5%) scale(0.9);
    z-index: 4;
    filter: grayscale(1);
}

.galSlide.swiper-slide-prev~.galSlide.swiper-slide {
    transform: translateX(-18%) scale(1);
}

.galSlide.swiper-slide-prev~.galSlide.swiper-slide~.galSlide.swiper-slide {
    transform: translateX(-60%) translateY(5%) scale(0.9);
}

.galSlide.swiper-slide {
    opacity: 0.4;
    height: auto;
    width: auto;
}

.galSlide.swiper-slide-active,
.galSlide.swiper-slide-next,
.galSlide.swiper-slide-next+.galSlide.swiper-slide,
.galSlide.swiper-slide-next+.galSlide.swiper-slide+.galSlide.swiper-slide,
.galSlide.swiper-slide-prev,
.galSlide.swiper-slide-prev~.galSlide.swiper-slide,
.galSlide.swiper-slide-prev~.galSlide.swiper-slide~.galSlide.swiper-slide {
    opacity: 1;
}

.galSlider .gal-button-next.swiper-button-next,
.galSlider .gal-button-prev.swiper-button-prev {
    color: #000;
    right: 0;
    left: auto;
    top: 41px;
    background-color: white;
    border-radius: 50px;
}

.galSlider .gal-button-prev.swiper-button-prev {
    right: 60px;
}

.galSlider .gal-button-next.swiper-button-next svg,
.galSlider .gal-button-prev.swiper-button-prev svg {
    width: 10px;
}

/* gallery styles */

/* Brand detail page styles end */

/* Solutions page styles start */

.solBannerCta {
    position: absolute;
    bottom: 73px;
    right: 9%;
    background-color: rgba(0, 0, 0, 0.15);
    backdrop-filter: blur(10px);
    border-radius: 6px;
    padding: 42px 57px;
}

.solBannerCta .secTitle {
    font-family: 'Noka-light';
    line-height: 138%;
    font-size: 40px;
    text-transform: none;
    letter-spacing: 1px;
}

.solutionsList {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 26px 21px;
    flex-wrap: wrap;
    padding-bottom: 40px;
}

.solutionsList .solutionItem {
    flex: 0 0 23%;
    /* flex: 1; */
}

.solutionsList .solutionInfo {
    padding-top: 18px;
}

.solutionsList .solutionInfo .subTitle {
    color: #000;
    font-family: Noka-semibold;
    font-size: 20px;
    font-weight: 600;
    line-height: 160%;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.solutionsList .solutionInfo .desc p {
    color: #000;
    font-family: Noka-medium;
    font-size: 20px;
    font-weight: 500;
    line-height: 130%;
    margin-bottom: 0px;
    padding-bottom: 18px;
}

.solutionsList .solutionInfo .ctaBtn a {
    color: #CF2727;
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 1.6px;
    text-transform: uppercase;
}

.solutionsList .solutionInfo .desc,
.solutionsList .solutionInfo .ctaBtn {
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.4s ease;
    margin-top: 10px;
}

.solutionsList .solutionItem:hover .desc,
.solutionsList .solutionItem:hover .ctaBtn {
    opacity: 1;
    transform: translateY(0);
}

.solDetBanSec .solDetail {
    justify-content: center;
    gap: 80px;
}

.solDetBanSec .solDetail .secTitle {
    font-size: 30px;
}

.solDetail .desc {
    max-width: 75%;
}

.solDetail .desc p {
    font-size: 20px;
}

.solImgBox img {
    max-height: 550px;
    width: 100%;
    object-fit: cover;
    min-height: 500px;
}

.solDescSec {
    padding-top: 95px;
    padding-bottom: 113px;
}

.solDesc .desc p {
    font-size: 24px;
    text-align: justify;
    line-height: 145%;
    font-family: Noka-medium;
    padding-top: 15px;
}

.solDesc {
    padding-top: 60px;
}

.mt-auto .solDesc {
    padding-bottom: 60px;
}

/* Solutions page styles end */

/* Footer styles start */

.mainFooter {
    padding-top: 70px;
    background-size: cover;
    background-position: center;
    height: 100vh;
    min-height: 100vh;
    position: relative;
    background-image: url('../images/ofis_footer_bg_1.png');
}

.mainFooter::before {
    content: '';
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 26.7%, #000 69.42%);
    width: 100%;
    height: 90%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.mainFooter .container-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    margin-top: auto;
    position: relative;
    justify-content: flex-end;
    z-index: 9;
}

.mainFooter .container-inner .row:first-child {
    margin-bottom: auto;
}

.footCont .titleArea {
    display: flex;
    justify-content: flex-end;
}

.footCont .titleArea .mainTitle {
    max-width: 35%;
    text-align: right;
    font-size: 56px;
    font-family: Noka-light;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: #FFF;
    font-weight: 300;
}

.footerTop {
    display: flex;
    /* align-items: flex-start; */
    justify-content: space-between;
}

.footTopCol {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-direction: column;
    flex: 0 0 20%;
}

.footNl {
    /* flex: 0 0 30%; */
    width: 100%;
}

.footNl h5 {
    margin-bottom: 0px;
    padding-bottom: 12px;
}

.footNl h5,
.footNl form .es-form-field-container .gjs-cell .es-email,
.footNl form .form_control[type="email"] {
    color: #fff;
    font-size: 12px;
    font-family: "Roboto Flex", sans-serif;
    font-weight: 600;
    line-height: normal;
    /* letter-spacing: 0.7px; */
    text-transform: none;
}

.footNl .es_subscription_message.success {
    display: block;
    margin: auto;
    text-align: center;
}

.footNl .es_spinner_image {
    position: absolute;
    top: 0;
    right: -46px;
}

.footNl form {
    position: relative;
}

.footNl form .tnp-field-email label {
    display: none;
}

.footNl form .es-form-field-container .gjs-cell .es-email:focus,
.footNl form .form_control[type="email"]:focus,
.footNl form input[type="submit"]:focus {
    outline: none;
}

.footNl form .tnp-field .tnp-email,
.footNl form .es-form-field-container .gjs-cell .es-email,
.footNl form .form_control[type="email"] {
    border-bottom: 1px solid #fff !important;
    padding-left: 0px;
    width: 100%;
    padding-bottom: 14px;
    border: none;
}

.footNl form .tnp-field .tnp-email,
.footNl form .form_control[type="email"],
.footNl form input[type="submit"] {
    background-color: transparent;
    border: none;
    border-radius: 0px;
}

.footNl form .tnp-field-button,
.footNl form .es-form-field-container .gjs-row:last-child {
    position: absolute;
    top: 0px;
    right: 0;
}

.footNl form .es-form-field-container .gjs-row {
    margin-bottom: 0px !important;
}

.footNl form .es-form-field-container .gjs-row label {
    font-family: '"Roboto Flex", sans-serif' !important;
    position: relative;
}

.footNl form .es-form-field-container .gjs-row label span {
    margin-left: 34px;
}

.footNl form input[type="submit"] {
    position: absolute;
    background-image: url('../images/submit_arrow.svg');
    width: 15px;
    height: 15px;
    background-size: cover;
    bottom: 14px;
    right: 0;
}

.footNl form .es-form-field-container .gjs-row .gjs-cell input[type="checkbox"] {
    accent-color: #d2b87b;
    display: inline-block;
    height: 22px;
    width: 22px !important;
    margin-right: 15px !important;
    position: absolute;
    left: 0;
    top: 0;
}

.footNavCol {
    display: flex;
    flex: 0 0 54%;
}

.footNavCol .navList {
    flex: 0 0 22%;
}

.footNavCol .navList ul,
.footTerms ul {
    padding-left: 0px;
    margin-left: 0px;
    list-style-type: none;
    margin-bottom: 0px;
    display: flex;
    flex-direction: column;
    gap: 13px;
}

.footNavCol .navList h6 {
    font-size: 12px;
    font-family: "Roboto Flex", sans-serif;
    font-weight: 700;
    margin-bottom: 13px;
    color: #fff;
}

.footTopCol .adrsInfo p,
.footNavCol .navList li a,
.footTerms li a,
.socialList .socialItem a,
.footCopy p {
    color: #fff;
    font-size: 14px;
    font-family: "Roboto Flex", sans-serif;
    font-weight: 400;
    text-decoration: none;
}

.footerCompany {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 50px;
    padding-bottom: 25px;
}

.socialList {
    gap: 16px;
}

.footCopy {
    gap: 40px;
}

.footTerms ul {
    flex-direction: row;
    gap: 40px;
}

.footerBottom {
    padding-top: 35px;
    padding-bottom: 25px;
    border-top: 1px solid #fff;
}

/* Footer styles end */

/* Hassan Css Start*/
.maianBoxWhite {
    border-radius: 6px;
    background: #FFF;
    padding: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 96%;
    padding-right: 0;
}

.boxContentLeft {
    width: 30%;
    padding: 0 30px;
}

.boxContentRight {
    width: calc(70% + 4%);
    position: relative;
    right: -3%;
}
.boxRightslider .swiper-slide {
    max-width: calc(33.3% - 6px);
}
.boxRightslider .swiper-slide.col-2-slide {
    max-width: 66.6%;
}
.imgBoxsec img {
    border-radius: 8px;
    overflow: hidden;
}
.container-has-Sector {
    max-width: 91%;
    margin: 30px auto 80px;
}
.container-has-Sector .row:nth-child(2n) .maianBoxWhite {
    flex-direction: row-reverse;
    padding-right: 30px;
    padding-left: 0;
}

.container-has-Sector .row:nth-child(2n) .col-md-12 {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.container-has-Sector .row+.row {
    margin-top: 20px;
}

.container-has-Sector .row:nth-child(2n) .maianBoxWhite .boxContentRight {
    right: 0;
    left: -3%;
}
section.statsSec.darkDottedBg.noblogcss {
    padding-bottom: 0;
}

section.statsSec.darkDottedBg.noblogcss .statsRow {
    border: none;
}
.footNavCol .navList:last-child {
    flex: 0 0 13%;
}
.footNavCol {
    justify-content: flex-end;
}
h1.page-title.wp-block-heading {
    font-family: Noka-semibold;
    font-size: 36px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 2.6px;
    text-transform: uppercase;
}

.content-wrapper h2 {
    font-family: Noka-semibold;
    font-size: 26px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 2.6px;
    text-transform: uppercase;
    margin-top: 30px;
}

.content-wrapper p a {
    color: #000;
}

.content-wrapper {
    padding-bottom: 80px;
}
.partBrandItem .ctaBtn.ctaPrimary {
    display: none;
}
body .es-form-2 form {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    border-bottom: 1px solid #fff !important;
    padding-left: 0px;
    width: 100%;
    padding-bottom: 14px;
    border-radius: 0 !important;
}
body  .es-form-2 label {
    width: 100%;
    font-size: 0;
}

body  label.es-field-label input {
    font-size: 16px !important;
    width: 100% !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    color: #fff !important;
    outline: none !important;
}

body .es-form-2 .es_subscription_form_submit {
    position: absolute;
    background: transparent !important;
    background-image: url('../images/submit_arrow.svg') !important;
    width: 16px !important;
    height: 16px !important;
    background-size: cover !important;;
    bottom: 14px;
    right: 0;
    padding: 0 !important;
    font-size: 0 !important;
    transition:0.3s !important;
}

body .es-form-2 .es_subscription_form_submit:hover {
        
background: transparent !important;
    
position: absolute !important;
    
background-image: url('../images/submit_arrow.svg') !important;
    
width: 15px;
    
height: 15px;
    
background-size: cover;
    
bottom: 14px;
    
right: 5px;
}

.es_spinner_image {
    position: absolute;
    top: 15px;
    left: 99%;
    display: inline-block;
    background-color: #23282d;
    opacity: 0.75;
    width: 24px;
    height: 24px;
    border: none;
    border-radius: 100%;
    padding: 0;
    margin: 0 24px;
    background: #cf2727 !important;
}

.es_spinner_image:before {
    content: '';
    position: absolute;
    background-color: #fbfbfc;
    top: 4px;
    left: 4px;
    width: 6px;
    height: 6px;
    border: none;
    border-radius: 100%;
    transform-origin: 8px 8px;
    animation-name: spin;
    animation-duration: 1000ms;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.es_spinner_image img {
    display: none !important;
}

.footNl .es_spinner_image {
    position: absolute;
    top: 9px;
    right: -46px;
}
.es_subscription_message.error {
    font-size: 12px !important;
}
h1.cookie-policy-h1 {
    font-family: Noka-semibold;
    font-size: 36px;
    font-weight: 600;
    line-height: normal;
    letter-spacing: 2.6px;
    text-transform: uppercase;
}
.boxContentLeft .ctaBtn.ctaPrimary {
    display: none !important;
}
.form-group p {
    margin: 0;
}
.solutionInfo .ctaBtn {
    display: none !important;
}
.solutionsList .solutionInfo .desc p {
    font-size: 16px;
}
.wpcf7 form.sent .wpcf7-response-output {
    color: #fff;
    border: none;
    margin: 0;
    padding: 0;
    color: #46b450;
    margin-top: 15px;
}
.wpcf7-not-valid-tip {
    position: absolute;
    font-size: 12px !important;
    right:0px;
    margin-top: 3px;
}

.wpcf7-not-valid {
    border-bottom: 1px solid #dc3232 !important;
}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {
    color: #fff;
    margin: 0;
    padding: 0;
    border: none;
    margin-top: 20px;
    color: red;
}
.form-group input[type="text"], .form-group input[type="email"], .form-group input[type="password"], .form-group textarea, .form-group select
{
    border-radius: 0 !important;
}
.form-group.active label{
    transform: translateY(-20px) scale(0.7);
}

.form-group.active .bar::after {
    transform: translateX(-50%) scaleX(1);
}
.wpcf7 form .wpcf7-response-output {
    margin-top: 0 !important;
}
body .wpcf7-spinner {
    margin: 0;
    margin-right: -40px;
    position: relative;
    right: -10px;
    top: 6px;
}
.home section.bannerSec {
    height: 100vh;
    overflow: hidden;
}
.prodCatSlider .prodCatSlide .subTitle a {
    color: #fff;
    text-decoration: none;
}
.ctaText a:after,
.navList a:after,
.footTerms a:after,
.socialItem a:after{
    content: "";
    background: #000;
    width: 0;
    height: 1px;
    position: absolute;
    left: 0;
    bottom: -7px;
    transition: 0.3s;
}
.navList a:after,
.footTerms a:after,
.socialItem a:after
{
     background: #fff;
}
.ctaText a,
.footTerms a,
.socialItem a,
.navList a{
    position: relative;
}

.ctaText a:hover:after,
.footTerms a:hover:after,
.socialItem a:hover:after,
.navList a:hover:after{
    width: 100%;
}
.mainNav ul li a:hover,
.subNav ul li a:hover{
        font-weight: 600;
}
.prodCatInfo .ctaBtn a:hover {
    background: #fff;
    color: #000;
}
body .es-form-2 .es-field-wrap {
    margin-bottom: 7px !important;
}
.faqVidBg {
    height: 100vh;
}
.footCopy p a{
    color: #fff;
    font-size: 12px;
    font-family: "Roboto Flex", sans-serif;
    font-weight: 400;
    text-decoration: none;
}
@media (min-width:767px)
{
    .navToggler.navWithborder {
    display: none;
}
}
@media (max-width:767px)
{
    .maianBoxWhite {
    width: 100%;
    padding: 20px;
    flex-direction: column;
}

.boxContentLeft {
    width: 100%;
    padding: 0;
}

.boxContentLeft .stockCont {
    padding: 10px 0 0;
}

.boxContentRight {
    width: 100%;
    right: 0;
}

.container-has-Sector .row:nth-child(2n) .maianBoxWhite {
    flex-direction: column;
    padding: 20px;
}
.hsList+.hsList {
    margin-top: 12px;
}
    .footerCompany .socialList, .footerCompany .adrsInfo {
        gap: 25px;
    }
}
a.cky-banner-element {
    background: #000;
    color: #fff !important;
    text-decoration: none;
    padding: 12px 30px;
    display: inline-block;
    cursor: pointer;
    transition: 0.3s;
    border: 1px solid #000;
}

a.cky-banner-element:hover {
    background: transparent;
    color: #000 !important;
}
.titleArea a {
    text-decoration: none;
    color:#000;
}
.solutionsList .solutionItem {
    flex: 0 0 23.6%;
}
.solutionsList {
    align-items: flex-start;
    justify-content: flex-start;
}
header.mainHeader.absoluteHeader:after {
    content: "";
    background-color: rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(10px);
    width: 100%;
    height: 71px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9;
}

.mainHeader.absoluteHeader .container-fluid {
    position: relative;
    z-index: 99;
}
.home header.mainHeader.absoluteHeader:after
{
    display:none;
}
.cky-revisit-bottom-left {
    opacity: 0;
    visibility: hidden;
}
.grecaptcha-badge {
    visibility: hidden;
    opacity: 0;
}
/* Hassan Css End*/
/* Responsive design start */

@media (max-width: 1680px) {

    .pt_80 {
        padding-top: 60px;
    }

    .mainTitle {
        font-size: 45px;
    }

    .secTitle,
    .formTabsArea li .nav-link {
        font-size: 22px;
    }

    .desc p,
    .showRoomInfo .desc p {
        font-size: 18px;
    }

    .formCol {
        padding: 52px 60px 34px 60px;
        gap: 70px;
    }

    .formCol .titleArea .secTitle {
        padding-bottom: 25px;
    }

    .abtBgCont .desc h4,
    .abtStatsSec .desc p,
    .ctaBanner .titleArea .mainTitle,
    .contBannerSec .formCol .mainTitle,
    .ctaFloatBox .titleArea .mainTitle {
        font-size: 30px;
    }

    .formArea form {
        gap: 25px;
    }

    .form-group input[type="text"],
    .form-group input[type="email"],
    .form-group input[type="password"],
    .form-group textarea,
    .form-group select,
    .form-group label {
        font-size: 18px;
    }

    .statsItem .statsLabel {
        font-size: 16px;
    }

    .statsItem .statsValue {
        font-size: 90px;
    }

    .statsList {
        gap: 42px 35px;
    }

    .statsList:not(:last-child) .statsItem {
        padding-bottom: 50px;
    }

    .blogsRow {
        padding-top: 100px;
    }

    .blogSlide.swiper-slide {
        height: 530px;
    }

    .blogSlide.swiper-slide:nth-child(2),
    .blogSlide.swiper-slide:last-child {
        height: 600px;
    }

    .blogSlide .blogInfo .imgArea {
        max-width: 48%;
    }

    .blogSlide:hover .blogInfo .imgArea {
        max-width: 70%;
    }

    .blogInfo .blogDate {
        top: 305px;
        right: -8px;
    }

    .blogsIntro {
        max-width: 27%;
        flex: 0 0 27%;
        min-height: 370px;
    }

    .blog-swiper-nav .blog-swiper-prev,
    .blog-swiper-nav .blog-swiper-next {
        width: 50px;
        height: 50px;
    }

    /* About page styles */
    .abtBannerSec .titleArea .secTitle {
        font-size: 26px;
    }

    .abtBgCont {
        padding: 34px 38px;
        margin-top: 35px;
    }

    .pl-23 {
        padding-left: 15px !important;
    }

    .pr-23 {
        padding-right: 15px !important;
    }

    .abtStatsSec .statsList {
        gap: 42px 12px;
    }

    .abtStatsSec .statsList .statsItem .statsLabel {
        font-size: 18px;
    }

    .abtStatsSec .statsItem .statsValue {
        font-size: 80px;
    }

    .abtStatsSec .imgFloatRight img {
        width: 100%;
        max-width: 450px;
    }

    .certifItem {
        text-align: center;
    }

    .certifItem .certifImg {
        width: 80%;
        height: 100%;
        object-fit: cover;
    }

    .certifLogos {
        gap: 45px;
    }

    .abtBrandSec .brandDet .desc p {
        font-size: 22px;
    }

    .abtGroupSec .abtGrpCont {
        padding-top: 150px;
    }

    /* About page styles */

    /* contact page styles */

    .bannerNav .bannerNavList .bannerNavItem {
        padding: 16px 20px;
    }

    .bannerNav .bannerNavItem a {
        font-size: 16px;
    }

    .formTabsArea .nav-tabs {
        gap: 50px;
    }

    .ctaFloatBox {
        padding: 45px 32px 70px 44px;
    }

    .ctaFloatBox,
    .ctaFloatBox .titleArea {
        gap: 40px;
    }

    /* contact page styles */

    /* brands page styles */

    body.brandDetailPage::before {
        max-height: 105vh;
    }

    .brandsBannerSec .flexTitle .desc p {
        font-size: 34px;
    }

    .brandBannerCta .titleArea .mainTitle {
        font-size: 35px;
    }

    .otherPartnersSec .titleArea .desc p {
        font-size: 22px;
    }

    .brandDetail .ctaBtn a {
        font-size: 18px;
    }

    .brandInnerNav {
        padding-bottom: 16px;
    }

    .brandInnerNav .brandNavList {
        gap: 60px;
    }

    .brandInnerNav .brandNavItem a {
        font-size: 20px;
    }

    .brandInnerNav .brandNavItem::before {
        bottom: -16px;
    }

    .collectionItem .collectionInfo h4 {
        font-size: 24px;
    }

    .brandPrev .imgArea,
    .brandNext .imgArea {
        min-height: 180px;
    }

    .gallerySec {
        padding-bottom: 30px;
    }

    .galSlide.swiper-slide-prev~.galSlide.swiper-slide {
        transform: translateX(-10%) scale(1);
    }

    .galSlide.swiper-slide-prev~.galSlide.swiper-slide~.galSlide.swiper-slide {
        transform: translateX(-70%) translateY(5%) scale(0.9);
    }

    /* brands page styles */

    /* solutions page styles */

    .solutionsList .solutionInfo .subTitle {
        font-size: 18px;
    }

    .solutionsList .solutionInfo .desc p {
        font-size: 16px;
        padding-bottom: 10px;
    }

    .solutionsList .solutionInfo .ctaBtn a {
        font-size: 14px;
    }

    /* solutions page styles */

    .footCont .titleArea .mainTitle {
        font-size: 46px;
    }
}

@media (max-width: 1440px) {
    .mainHeader::before {
        top: 64px;
    }

    .logo img {
        margin-top: 16px;
    }

    .mainNav ul li,
    .navBrandLogo,
    .navToggler {
        padding: 20px 25px;
    }

    .ctaBtn a {
        font-size: 16px;
    }

    .mainNav ul li a,
    .subNav ul li a {
        font-size: 14px;
    }

    .mainTitle {
        font-size: 40px;
    }

    .prodCatInfo {
        padding: 35px;
    }

    .prodCatInfo .titleArea .subTitle {
        font-size: 24px;
    }

    .prodCatCont .imgArea img,
    .prodCatSlider:hover .prodCatSlide:nth-child(3) .imgArea img {
        height: 500px;
    }

    .prodCatInfo .ctaBtn a {
        font-size: 12px;
        padding-left: 14px;
        padding: 14px 10px;
    }

    .prodCatSlider:hover .catBrands {
        padding-top: 25px;
    }

    .prodCatInfo .catBrands {
        gap: 14px;
        padding-bottom: 30px;
    }

    .prodCatInfo .titleArea {
        padding-bottom: 40px;
    }

    .faqSec {
        padding-top: 71px;
        min-height: 100vh;
        /* height: auto; */
        padding-bottom: 100px;
    }

    .faqVidBg {
        height: 100%;
    }

    .faqList {
        max-width: 80%;
    }

    .faqItem {
        padding: 14px 26px;
    }

    .faqItem h4 {
        font-size: 18px;
    }

    .faqItem h5 {
        font-size: 12px;
    }

    .faqBackInner {
        gap: 48px;
        padding-top: 60px;
    }

    .faqBackInner .faqCta {
        padding-bottom: 48px;
    }

    .reviewSec .reviewContBox {
        max-width: 330px;
        padding: 35px 40px;
    }

    .reviewSec .reviewContBox h2 {
        font-size: 28px;
    }

    .reviewSec .reviewImg img {
        height: 370px;
    }

    /* contact page styles */

    .contBannerSec {
        padding-top: 10%;
    }

    .formCol {
        padding-top: 45px;
        gap: 60px;
    }

    .bannerNav .bannerNavList .bannerNavItem {
        padding: 14px 18px;
    }

    .bannerNav .bannerNavItem a {
        font-size: 12px;
    }

    .form-group input[type="text"],
    .form-group input[type="email"],
    .form-group input[type="password"],
    .form-group textarea,
    .form-group select,
    .form-group label {
        font-size: 16px;
    }

    .launchlearnSec .imgArea img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        min-height: 450px;
    }

    .ctaFloatBox {
        width: 28%;
        right: 25%;
    }

    /* contact page styles */

    /* Brands page styles */

    .brandsBannerSec .flexTitle .desc p,
    .brandBannerCta .titleArea .mainTitle,
    .solBannerCta .secTitle {
        font-size: 30px;
    }

    .brandBannerCta {
        max-width: 45%;
    }

    .brandBannerCta .imgArea img,
    .brandDetail .brandLogo img {
        width: 150px;
    }

    .partBrandList .partBrandItem {
        height: 73vh;
    }

    .brandFeatImg img {
        max-width: 280px;
    }

    .otherPartnersSec .titleArea .desc {
        max-width: 57%;
    }

    .otherPartnersSec .titleArea .desc p {
        font-size: 20px;
    }

    .otherBrandsList {
        gap: 40px;
    }

    .otherBrandsList .otherBrandsItem {
        flex: 0 0 130px;
        min-height: 130px;
        max-width: 130px;
    }

    .brandInfoBox {
        padding: 55px 45px 45px 40px;
    }

    .brandDetail .ctaBtn a {
        font-size: 15px;
    }

    .brandPrev .imgArea,
    .brandNext .imgArea {
        min-height: 160px;
    }

    .brandPrev .imgArea img,
    .brandNext .imgArea img {
        width: 170px;
    }

    .launchlearnSec .container-full .ctaFloatBox {
        width: 22%;
    }

    .galSlider .galSlide.swiper-slide-prev {
        transform: translateX(15%) translateY(5%) scale(0.9);
    }

    .galSlide.swiper-slide-prev~.galSlide.swiper-slide {
        transform: translateX(-4%) scale(1);
    }

    .galSlide img {
        width: 90%;
    }

    /* Brands page styles */

    /* Solutions page styles */

    .solutionsList .solutionInfo .subTitle {
        font-size: 16px;
    }

    .formTabsArea.inContainer .nav-tabs {
        padding-bottom: 40px;
    }

    .formTabsArea.inContainer li .nav-link {
        font-size: 18px;
    }

    /* Solutions page styles */

    .footCont .titleArea .mainTitle {
        font-size: 42px;
    }
}

@media (max-width: 1200px) {}

@media (min-width: 991px) {

    .headerSocial {
        display: none;
    }

    .abtGroupSec .container-inner {
        padding-left: 10px;
        max-width: 91%;
    }

    .abtGroupSec .stickyCol {
        position: sticky;
        top: 20px;
    }

    .solDetBanSec .flextextCol {
        flex: 0 0 auto;
        width: 38%;
    }

    .solDetBanSec .fleximgCol {
        flex: 0 0 auto;
        width: 62%;
    }
}

@media (max-width: 991px) {

    .pt_80 {
        padding-top: 50px;
    }

    .container-inner {
        max-width: 94%;
    }

    .mainTitle {
        font-size: 30px;
    }

    .flexTitle {
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
    }

    .ctaBtn a {
        font-size: 14px;
    }

    /* Header styles */

    .mainHeader.absoluteHeader {
        padding-bottom: 7px;
    }

    body.menu-open .mainHeader::after {
        content: '';
        min-height: 100vh;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0.5;
        background: #242424;
        backdrop-filter: blur(7.5px);
        z-index: -1;
    }

    .mainNav,
    .navBrandLogo {
        display: none;
    }

    /* .mainHeader.absoluteHeader .navToggler {
        border: none;
        margin-top: 6px;
    } */
    .navToggler,
    .mainHeader.absoluteHeader .navToggler {
        padding: 26px 25px;
        border: none;
    }

    .mainHeader .mainNav.open {
        position: fixed;
        top: 59px;
        left: 0;
        right: 0;
        width: 95%;
        min-height: calc(100vh - 80px);
        height: 100%;
        background: #242424;
        backdrop-filter: blur(7.5px);
        display: block;
        padding: 43px 0px;
        /* padding-top: 43px; */
        margin: 20px auto;
        overflow-y: scroll;
    }

    /* .mainHeader .mainNav::before {
        content: '';
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        background-color: rgba(0, 0, 0, 0.514);
        z-index: -1;
    } */

    .navHead {
        font-size: 32px;
        color: white;
        text-transform: uppercase;
        padding: 0px 32px;
        position: relative;
    }

    .navHead h3 {
        position: relative;
        margin-bottom: 0px;
        font-family: 'Noka-Semibold';
    }

    .navHead h3::before {
        content: '';
        width: 10px;
        height: 11px;
        /* background-color: white; */
        position: absolute;
        bottom: -15px;
        left: 30px;
        background-image: url('../images/close_curve_icon.svg');
        background-position: center;
        background-size: cover;
    }

    .navClose {
        background-color: transparent;
        border: none;
        color: white;
        text-transform: uppercase;
        font-size: 11px;
        position: absolute;
        bottom: -22px;
        left: 70px;
    }

    .mainHeader .mainNav.open ul.mainMenu {
        flex-direction: column;
        border-bottom: 0.65px solid rgba(255, 255, 255, 0.20);
        padding-bottom: 30px;
        padding-top: 30px;
    }

    .mainNav.open ul li {
        border: none !important;
    }

    .mainNav.open ul.mainMenu li {
        padding-bottom: 0px;
        transition: .3s ease-in-out;
    }

    .mainNav.open ul.mainMenu li a {
        position: relative;
        font-size: 22px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        color: white;
    }

    .mainNav.open ul.mainMenu>li .backBtn {
        display: none;
        left: 0;
        bottom: 15px;
    }

    .mainNav.open ul.mainMenu>li .backBtn::before {
        content: '';
        width: 18px;
        height: 10px;
        background-image: url(../images/back-arrow.svg);
        background-size: cover;
    }

    .mainNav.open ul.mainMenu li ul.submenu a {
        color: #F6F1E5;
        font-family: "Roboto Flex";
        font-size: 15px;
        line-height: 41px;
        text-transform: uppercase;
    }

    .mainNav.open ul.mainMenu li ul.submenu a::before,
    .subNavFixed a::before {
        display: none;
    }

    .mainNav.open ul.mainMenu li ul.submenu li {
        padding: 0px;
    }

    .mainNav.open li.subNavFixed {
        position: fixed;
        top: 0;
        left: 0;
        background: black;
        z-index: 9;
        right: 0;
        padding-bottom: 40px;
    }

    .mainNav.open ul.mainMenu li.subNavFixed .backBtn {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
    }

    .mainNav.open li.subNavFixed>a {
        font-size: 32px;
        font-family: 'Noka-Semibold';
        padding-bottom: 40px;
    }

    .mainNav.open ul li a::before {
        top: 0 !important;
    }

    .mainNav.open .bottomNav {
        padding-right: 0px;
        float: none;
    }

    .mainNav.open .subNav ul {
        flex-wrap: wrap;
        gap: 3px;
        align-items: center;
        padding-left: 30px;
    }

    .mainNav.open .subNav ul li {
        padding: 8px 6px;
        flex: 0 0 30%;
    }

    .mainNav.open .subNav ul li a {
        font-size: 16px;
        color: white;
    }

    .mainNav.open .headerSocial {
        padding-top: 40px;
        padding-left: 30px;
        padding-right: 30px;
    }

    .mainNav.open .headerSocial hr {
        width: 100%;
        background: white;
        opacity: 1;
        border: 1px solid #fff;
        margin: 0px 15px;
    }

    .mainNav.open .headerSocial a {
        text-transform: none;
        letter-spacing: normal;
    }

    /* Header styles */

    .bannerSec .bannerCta {
        padding: 31px 30px;
        max-width: 68%;
        bottom: 20%;
    }

    .bannerSec .bannerCtaDet,
    .bannerSec .bannerCtaLinks {
        flex-direction: column;
        gap: 26px;
    }

    .bannerSec .bannerCtaLinks {
        align-items: flex-start;
        left: 11%;
    }

    .bannerSec .bannerCtaDet .ctaBtn {
        padding-top: 0px;
    }

    .prodCatSec,
    .statsSec,
    .blogsRow,
    .projectSec,
    .abtBrandSec,
    .teamSec,
    .clientsSec,
    .seealsoSec,
    .abtStatsSec,
    .showRoomSec,
    .launchlearnSec,
    .partnerBrandsSec,
    .otherPartnersSec,
    .stockListSec,
    .pt-lg,
    .solDescSec {
        padding-top: 82px;
    }

    .statsSec,
    .faqSec,
    .partnerSec,
    .abtStatsSec,
    .abtBrandSec,
    .seealsoSec,
    .launchlearnSec,
    .partnerBrandsSec,
    .otherPartnersSec,
    .reqForm,
    .solDescSec {
        padding-bottom: 80px;
    }

    .prodCatSec .container-inner {
        max-width: 98%;
    }

    .prodCatSlider.swiper {
        padding-left: 25px;
        padding-bottom: 75px;
    }

    .prodCatInfo .titleArea,
    .statsList:not(:last-child) .statsItem,
    .statsRow,
    .blogsSlider.swiper {
        padding-bottom: 30px;
    }

    .prodCatInfo .titleArea .subTitle {
        font-size: 18px;
    }

    .prodCatInfo .catBrands {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .prodCatInfo .catBrands .catBrandItem,
    .seealsoSec .titleBorder .secTitle {
        font-size: 16px;
    }

    .prodCatSlider:hover .ctaBtn a {
        padding: 12px 10px;
        font-size: 10px;
    }

    .prodCatCont .imgArea img,
    .prodCatSlider:hover .prodCatSlide:nth-child(3) .imgArea img {
        height: 400px;
    }

    .prodCatSlider .swiper-scrollbar.custom-hor-scrollbar,
    .prodCatSec .titleArea.absoluteTitle {
        left: 25px;
    }

    .prodCatSlider .swiper-scrollbar.custom-hor-scrollbar {
        bottom: 40px;
    }

    .prodCatSlider .custom-swiper-next.swiper-button-next,
    .prodCatSlider .custom-swiper-prev.swiper-button-prev {
        right: 5%;
        justify-content: center;
        bottom: -15px;
        top: auto;
    }

    .prodCatSlider .custom-swiper-prev.swiper-button-prev {
        right: 15%;
        left: auto;
    }

    .custom-swiper-next.swiper-button-next svg,
    .custom-swiper-prev.swiper-button-prev svg {
        width: 10px;
        height: 20px;
    }

    .partnerLogos .partnerLogo {
        flex: 0 0 27%;
    }

    .inspireImgCol {
        height: auto;
    }

    .faqSec .titleArea {
        padding-left: 25px;
    }

    .faqList {
        max-width: 100%;
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(3, auto);
        overflow-x: auto;
        padding-bottom: 30px;
        margin-left: 25px;
    }

    .gridContainer.expanded {
        /* margin-right: 25px; */
        grid-template-rows: repeat(2, auto);
    }

    .gridContainer .gridCard:not(.main) {
        min-width: 250px;
    }

    .gridContainer.expanded .gridCard:not(.main) {
        min-width: 100%;
    }

    .gridContainer.expanded .gridCard:not(.main) h4 {
        display: none;
    }

    .gridContainer.expanded .gridCard.main {
        order: 2;
        grid-column: 1 / 3;
        grid-row: auto;
        width: 100%;
        height: auto;
        position: sticky;
        bottom: 0;
        left: 0;
        margin-right: 25px;
    }

    .gridContainer.expanded .gridCard:not(.main) {
        grid-column: auto;
        grid-row: 1;
        width: 170px;
    }

    .gridContainer.expanded .gridCard.main::before {
        width: 70%;
    }

    .gridCard.main .faqFront {
        max-width: 75%;
    }

    .gridCard .faqFront h5 {
        padding-bottom: 5px;
        padding-top: 5px;
    }

    .faqBackInner .faqCta {
        padding-bottom: 28px;
    }

    .faqBackInner {
        padding-bottom: 30px;
        gap: 28px;
    }

    .faqList::-webkit-scrollbar,
    .formTabsArea .nav-tabs::-webkit-scrollbar {
        width: 5px;
        height: 4px;
        background-color: #fff;
        border-radius: 6px;
    }

    .faqList::-webkit-scrollbar-thumb,
    .formTabsArea .nav-tabs::-webkit-scrollbar-thumb {
        border-radius: 6px;
        background: #3D4856;
    }

    .reviewSlider .swiper-slide,
    .reviewSlider .swiper-slide.swiper-slide-active {
        flex: 0 0 80%;
    }

    .reviewImg {
        display: none;
    }

    .statsRow .desc {
        padding-top: 30px;
        padding-bottom: 20px;
    }

    .statsList {
        gap: 35px 0px;
    }

    .statsItem .statsValue {
        font-size: 60px;
    }

    .statsItem .statsLabel {
        font-size: 11px;
    }

    .statsList .statsItem {
        flex: 0 0 33%;
    }

    .blogsIntro {
        max-width: 75%;
        flex: 0 0 75%;
        min-height: 325px;
        padding: 29px 15px;
    }

    .blogSlide.swiper-slide:nth-child(2) {
        height: 600px;
    }

    .blogSlide.swiper-slide:first-child {
        height: 325px;
    }

    .blog-swiper-nav {
        bottom: 0;
        top: auto;
    }

    .blog-swiper-nav .blog-swiper-prev,
    .blog-swiper-nav .blog-swiper-next {
        width: 40px;
        height: 40px;
    }

    .projectSec .titleArea .mainTitle {
        font-size: 26px;
    }

    .projectSlider .swiper-wrapper {
        margin-left: 25px;
    }

    .projectSlider .projectSlide.swiper-slide-active,
    .projectSlider .projectSlide.swiper-slide {
        flex-basis: auto;
    }

    .projectSlider {
        min-height: auto;
    }

    .desc.w-30 {
        max-width: 100%;
    }

    .teamList .swiper-wrapper {
        padding: 0px 0px;
    }

    .teamList.swiper .team-swiper-prev {
        left: -14px;
    }

    .teamList.swiper .team-swiper-next {
        right: -14px;
    }

    .clientsLogos {
        gap: 40px 0px;
    }

    .clientsLogos .clientItem {
        flex: 0 0 50%;
    }

    .footCont .titleArea .mainTitle,
    .brandBannerCta {
        max-width: 100%;
    }

    /* Footer styles */

    .mainFooter {
        height: auto;
        background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0.7%, #000 32.63%);
        /* background-image: none !important; */
        padding-top: 30px;
    }

    .mainFooter::before {
        content: '';
        background: none;
        height: 50%;
        top: 0;
        background-image: url(../images/ofis_footer_bg_1.png);
        background-size: cover;
        background-position: center;
        z-index: -1;
    }

    .footerTop,
    .collectionList,
    .footNavCol,
    .footerCompany {
        flex-direction: column;
    }

    .footerTop {
        padding-top: 140px;
        padding-bottom: 30px;
    }

    .footerTop,
    .footerBottom {
        padding-left: 25px !important;
        padding-right: 25px !important;
    }

    .footNavCol,
    .footNavCol .navList,
    .footTopCol {
        flex: auto;
    }

    .footCont .titleArea {
        max-width: 75%;
        margin-left: auto;
        padding-right: 13px;
    }

    .footNl h5 {
        font-size: 16px;
        padding-bottom: 24px;
    }

    .footNavCol {
        padding-top: 20px;
    }

    .footNavCol .navList h6 {
        font-size: 14px;
        position: relative;
        transition: .3s ease-in-out;
        padding-top: 26px;
        margin-bottom: 0px;
    }

    /* .mainNav.open ul.mainMenu li a::before  */
    .footNavCol .navList h6::before {
        content: '';
        position: absolute;
        top: 26px;
        right: 0;
        width: 14px;
        height: 14px;
        background-image: url('../images/arrow_up.svg');
        background-position: center;
        background-size: contain;
        background-repeat: no-repeat;
        transform: rotate(180deg);
        transition: .3s ease-in-out;
    }

    .footNavCol .navList ul {
        display: none;
        padding-top: 26px;
    }

    /* .footNavCol .navList ul.show {
        display: flex;
    } */

    /* .footNavCol .navList ul li {
        padding-bottom: 12px;
    } */

    .footNavCol .navList h6.show::before {
        transform: none;
    }

    .footerCompany {
        align-items: flex-start;
        padding: 0px !important;
        padding-top: 30px !important;
        border-top: 1px solid rgba(255, 255, 255, 0.60);
    }

    .footerCompany .socialList,
    .footerCompany .adrsInfo {
        padding-bottom: 30px;
        padding-left: 25px;
        padding-right: 25px;
        gap: 43px;
    }

    .footerCompany .adrsInfo p,
    .footNl form .form_control[type="email"] {
        font-size: 14px;
    }

    .footLogo {
        display: flex;
        /* align-items: center; */
        justify-content: space-between;
        width: 100%;
        border-top: 0.5px solid #fff;
    }

    .footLogo img {
        flex: 1;
        /* border: 0.5px solid #fff; */
        width: 150px;
        padding: 20px;
    }

    .footLogo img:first-child {
        border-right: 0.5px solid #fff;
    }

    .footerBottom {
        padding-top: 17px;
    }

    .footerBottom.justify-content-between {
        justify-content: center !important;
        align-items: flex-start;
    }

    .footerBottom .footCopy,
    .footerBottom .footTerms ul li:first-child {
        border-right: 1px solid #fff;
        padding-right: 12px;
    }

    .footerBottom .footTerms {
        padding-left: 12px;
    }

    .footerBottom .footTerms ul {
        gap: 12px;
    }

    .footerBottom .footTerms ul li {
        line-height: 1;
    }

    /* Footer styles */

    .mob-container-full {
        max-width: 100%;
        /* margin-left: 15px;
        margin-right: 15px; */
        margin: auto;
        padding-left: 12px;
        padding-right: 12px;
    }

    /* About page styles */

    .fullCol .abtBannerCta,
    .fullCol .abtBannerCta .imgArea,
    .fullCol .abtBannerCta .imgArea img,
    .abtStatsSec .imgFloatRight,
    .abtStatsSec .imgFloatRight img {
        width: 100%;
        height: 100%;
    }

    .abtBannerCta .imgArea img,
    .abtStatsSec .imgFloatRight img {
        object-fit: cover;
    }

    .abtBgCont {
        padding: 27px 25px;
        margin-top: 10px;
    }

    .abtBgCont .desc {
        padding-right: 0px;
        padding-bottom: 50px;
    }

    .abtBgCont .desc h4 {
        font-size: 15px;
    }

    .abtBgCont .ctaBtn.right,
    .abtBannerCta .ctaBtn.right {
        right: 20px;
        bottom: 30px;
    }

    .abtBgCont .ctaBtn a,
    .abtBannerCta .ctaBtn a {
        font-size: 13px;
    }

    .pl-23 {
        padding-left: 0px !important;
    }

    .abtBannerCta.right .imgArea img {
        min-height: 150px;
    }

    .abtStatsSec .statsList .statsItem .statsLabel {
        font-size: 12px;
    }

    .abtStatsSec .statsItem .statsValue {
        font-size: 70px;
    }

    .abtStatsSec .desc p,
    .contBannerSec .formCol .mainTitle {
        font-size: 22px;
    }

    .abtStatsSec .statsList,
    .abtStatsSec .abtInfo {
        padding-left: 25px;
        gap: 25px 12px;
    }

    .abtStatsSec .statsList .statsItem {
        flex: 0 0 33%;
    }

    .abtStatsSec .imgFloatLeft {
        margin-top: 50px;
    }

    .abtStatsSec .imgFloatLeft img {
        height: 180px;
    }

    .abtStatsSec .descWithCta {
        flex-direction: column;
        max-width: 100%;
        align-items: flex-start;
        padding-top: 57px;
    }

    .certifSec .certifFullImg img {
        height: 580px;
        object-fit: cover;
        object-position: 33%;
    }

    .certifSec .container-inner {
        bottom: 30px;
    }

    .certifSec .titleArea .secTitle {
        padding-bottom: 25px;
    }

    .certifLogos {
        padding-top: 50px;
    }

    .abtBrandLogos {
        gap: 49px 30px;
    }

    .abtBrandSec .row {
        flex-direction: column-reverse;
        gap: 10px;
    }

    .abtGroupSec .abtGrpCont {
        padding-top: 49px;
        padding-left: 13px;
        padding-right: 13px;
        padding-bottom: 0px;
    }

    .abtGroupSec .stickyCol {
        order: 2;
    }

    /* About page styles */

    /* Contact page styles */

    .contBannerSec {
        display: flex;
        align-items: flex-end;
    }

    .contBannerSec .row {
        gap: 25px;
    }

    .contBannerSec .col-12.px-lg-0 {
        padding-left: 25px;
        padding-right: 25px;
    }

    /* .contBannerSec .bannerNav {
        position: absolute;
        bottom: 25px;
        left: 0;
        padding-left: 25px;
    } */

    .contBannerSec .bannerNav .bannerNavList {
        display: flex;
        overflow-x: auto;
        margin-left: 25px;
        border-bottom-right-radius: 0px;
    }

    .bannerNav .bannerNavList .bannerNavItem {
        flex: 0 0 auto;
        min-width: max-content;
        scroll-snap-align: start;
    }

    .abtGroupSec.reqForm {
        padding-bottom: 0px;
    }

    .formCol {
        padding: 41px 28px 38px 28px;
        margin-bottom: 0px;
        gap: 38px;
    }

    .formTabsArea {
        padding-top: 50px;
        padding-left: 13px;
    }

    .formTabsArea .nav-tabs {
        flex-wrap: nowrap;
        overflow-x: scroll;
        padding-bottom: 30px;
    }

    .formTabsArea .nav-tabs::-webkit-scrollbar {
        background-color: #d1d1d1;
    }

    .formTabsArea .nav-tabs .nav-item {
        flex: 0 0 auto;
    }

    .formTabsArea .tab-content {
        padding-top: 50px;
    }

    /* Contact page styles */

    /* Brands page styles */

    .brandsBannerSec {
        padding-bottom: 40px;
    }

    .brandsBannerSec .flexTitle .secTitle,
    .brandsBannerSec .flexTitle .desc p {
        font-size: 26px;
    }

    .brandsBannerSec .flexTitle {
        gap: 20px;
    }

    .brandsBannerSec .flexTitle .desc,
    .solDesc {
        padding-top: 0px;
    }

    .brandsCtaSec.bgCover {
        display: flex;
        align-items: flex-end;
        padding-bottom: 50px;
    }

    .partnerBrandsSec .titleArea {
        max-width: 65%;
    }

    .partBrandList .partBrandItem {
        height: 493px;
        width: 100%;
        flex: 0 0 auto;
    }

    .partBrandItem .brandLogo {
        top: 30px;
        padding: 20px 0px;
    }

    .partBrandItem .brandFeatImg img {
        max-width: 250px;
    }

    .otherPartnersSec .titleArea .desc {
        max-width: 100%;
        padding-top: 10px;
    }

    .otherPartnersSec .align-items-start {
        align-items: flex-end !important;
        padding-right: 25px;
    }

    .brandPagination {
        flex-direction: column;
        align-items: normal;
        gap: 50px;
    }

    .brandPrev .secTitle,
    .brandNext .secTitle {
        padding-bottom: 20px;
    }

    .brandAll {
        position: relative;
    }

    .awardsList {
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 10px;
        padding-top: 43px;
    }

    .awardsList .awardItem {
        flex: 0 0 31%;
    }

    .awardsList .awardItem img {
        width: 90px;
    }

    /* .launchlearnSec .container-full .ctaFloatBox { */
    .ctaFloatBox {
        width: 80% !important;
        top: 50% !important;
        bottom: 5%;
        padding: 40px 32px 50px 44px;
        left: 50%;
        transform: translate(-50%, -50%);
        height: max-content;
    }

    .ctaFloatBox .titleArea .secTitle {
        font-size: 18px;
    }

    .ctaFloatBox .titleArea .mainTitle {
        font-size: 26px;
    }

    /* Brands page styles */

    /* Solutions page styles */

    .solutionsCtaSec .imgArea img {
        min-height: 500px;
        width: 100%;
        object-fit: cover;
    }

    .solBannerCta {
        right: 3%;
        padding: 35px 20px;
        max-width: 94%;
    }

    .solBannerCta .secTitle,
    .footCont .titleArea .mainTitle {
        font-size: 30px;
    }

    .formTabsArea.inContainer .nav-tabs {
        padding-bottom: 20px;
    }

    .solutionsList .solutionInfo .desc,
    .solutionsList .solutionInfo .ctaBtn {
        opacity: 1;
        transform: none;
    }

    .otherBrandsList {
        gap: 10px;
        justify-content: space-between;
    }

    .otherBrandsList .otherBrandsItem {
        flex: 0 0 125px;
    }

    .row-mob-reverse {
        flex-direction: column-reverse;
    }

    .stockCont,
    .formTabsArea.inContainer {
        padding-top: 50px;
    }

    .ctaBanner {
        gap: 18px;
    }

    .ctaBanner::after,
    .ctaBanner::before {
        display: none;
    }

    .ctaBanner .imgArea img {
        height: 130px;
    }

    .ctaBanner .titleArea .mainTitle,
    .solDetBanSec .solDetail .secTitle,
    .solDetail .desc p {
        font-size: 26px;
    }

    .ctaBanner .imgArea {
        flex: auto;
    }

    .seealsoSec .container {
        width: 100%;
    }

    .titleBorder::before {
        flex: auto;
        width: auto;
    }

    .solutionsList {
        flex-direction: column;
    }

    .flextextCol {
        padding: 0px 25px !important;
        margin-bottom: -45%;
        z-index: 2;
    }

    .fleximgCol {
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .solDetBanSec .solDetail {
        gap: 30px;
    }

    .solDetBanSec .solDetail .desc {
        max-width: 100% !important;
    }

    .solDetBanSec .brandInfoBox {
        padding: 37px 35px 35px 32px;
    }

    .brandBreadcrumb {
        padding: 0px 25px;
        padding-bottom: 20px;
    }

    .solImgBox img {
        min-height: 590px;
    }

    .solDesc .desc p {
        font-size: 16px;
        padding-top: 0px;
    }

    .solDescSec .row {
        gap: 30px;
    }

    .solDescSec .titleArea .secTitle {
        padding-bottom: 15px;
    }

    .mt-auto .solDesc {
        padding-bottom: 0px;
    }

    .collectionItem .collectionInfo {
        width: 75%;
    }

    .collectionItem .collectionInfo h4 {
        font-size: 18px;
        padding-bottom: 0px;
    }

    .collectionItem:hover .collectionInfo {
        max-height: max-content;
        display: flex;
        flex-direction: column;
        gap: 20px;
    }

    .otherSolSec .solutionsList {
        padding-bottom: 0px;
    }

    /* Solutions page styles */
    /*Hassan css start*/
    .navToggler, .mainHeader.absoluteHeader .navToggler {
        padding-right: 0;
    }
    .mainHeader .mainNav.open {
    height: auto !important;
    min-height: auto;
}
.desc.d-flex.justify-content-between.align-items-center {
    flex-direction: column;
    align-items: start !important;
    justify-content: start;
}
.abtStatsSec .imgFloatRight::before, .abtStatsSec .imgFloatLeft::before
{
    display:none !important;
}
    .otherBrandsList .otherBrandsItem {
        flex: 0 0 31.3%;
    }
    /*Hassan css start end*/
}

@media (max-width: 600px) {}

@media (max-width: 380px) {
    .statsItem .statsValue {
        font-size: 50px;
    }

    .blogSlide.swiper-slide:nth-child(2),
    .blogSlide.swiper-slide:last-child {
        height: 500px;
    }

    .blogSlide.swiper-slide {
        height: 450px;
    }

    .clientsLogos .clientItem img {
        width: 50%;
    }

    .footCont .titleArea {
        max-width: 85%;
    }

    .solDetail .desc p {
        font-size: 22px;
    }

    .solBannerCta .secTitle {
        font-size: 26px;
    }

    .otherBrandsList .otherBrandsItem {
        flex: 0 0 105px;
        padding: 10px;
        min-height: 105px;
    }
}

/* Responsive design end */