body, html{margin: 0;padding: 0;overflow-x: hidden;text-rendering: optimizeLegibility;}
a{text-decoration: none;}

@font-face{font-family: 'MicrogrammaNormal';src: url('../fonts/MicrogrammaNormal.woff') format('woff'),src: url('../fonts/MicrogrammaNormal.woff2') format('woff2'),}
@font-face{font-family: 'MicrogrammaBold';src: url('../fonts/Microgramma-D-Extended-Bold.otf') format('woff'),}
@font-face{font-family: 'CubeWebExpanLight';src: url('../fonts/cubeweb-expanlight-w03-regular.woff') format('woff'),src: url('../fonts/cubeweb-expanlight-w03-regular.woff2') format('woff2'),}

/*Floating-Header*/
body{margin-top: 80px;}

#header{position: fixed;top: 0;z-index: 999;transition: all 0.3s ease;-webkit-transition: all 0.3s ease;}
#header.shrink{padding: 10px 0;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);}

/*Header-Section*/
.headerSection{width: 100%;background-color: #ffffff;padding: 20px 0;}

.headerLogo a img{width: 200px;height: 40px;object-fit: contain;object-position: center;}

.MenuOption{list-style: none;margin: 0;padding: 7px 0;display: flex;justify-content: space-between;}
.MenuOption li a{font-family: MicrogrammaNormal;font-size: 18px;font-weight: 400;color: #212121;padding: 5px 0;}
.MenuOption li a:hover{border-bottom: 2px solid #212121;}
.MenuOption li .active{border-bottom: 2px solid #212121;}

/*Hamburger-Menu*/
.mobileMenu{display: none;text-align: right;align-content: center;}

.openbtn{font-family: MicrogrammaNormal;background: transparent;border: none;font-size: 30px;font-weight: 400;color: #212121;font-family: "Quicksand", Sans-serif;transition: all 0.5s;-webkit-transition: all 0.5s;}
.openbtn:hover{color: #000000;transition: all 0.5s;-webkit-transition: all 0.5s;}

.navLeftSidePanel{width: 0;position: fixed;z-index: 99;height: 100vh;top: 0;left: 0;background-color: #262626;overflow-x: hidden;padding-top: 60px;transition: all 0.5s;-webkit-transition: all 0.5s;}
.closeBtn{font-family: MicrogrammaNormal;padding: 10px 10px;text-decoration: none;font-size: 24px;font-weight: 500;color: #ffffff;display: block;font-family: "Quicksand", Sans-serif;transition: 0.3s;transition: all 0.5s;-webkit-transition: all 0.5s;}
.closeBtn:hover{transition: all 0.5s;-webkit-transition: all 0.5s;}

.mobileMenuOption{margin: 0;padding: 10px 0;text-align: left;}
.mobileMenuOption li{list-style: none;}
.mobileMenuOption li a{font-family: MicrogrammaNormal;padding: 10px 10px;text-decoration: none;font-size: 16px;font-weight: 400;color: #ffffff;display: block;transition: 0.3s;transition: all 0.5s;-webkit-transition: all 0.5s;}
.mobileMenuOption li a:hover{background-color: #c1c1c1;color: #212121;transition: all 0.5s;-webkit-transition: all 0.5s;}
.mobileMenuOption li .active{background-color: #c1c1c1;color: #212121;transition: all 0.5s;-webkit-transition: all 0.5s;}

.navLeftSidePanel .closeBtn{position: absolute;top: 0;right: 25px;font-size: 36px;}

/*Hero-Slider-Section*/
.heroSlider{position: relative;width: 100%;height: 70vh;overflow: hidden;}

.slide{position: absolute;width: 100%;height: 100%;background-repeat: no-repeat;background-size: cover;background-position: center;opacity: 0;transition: opacity 1s ease-in-out;display: flex;align-items: center;justify-content: center;padding: 20px;color: white;}
.slide::before{content: "";position: absolute;inset: 0;}
.slide.active{opacity: 1;z-index: 1;}

.slideOne{background-size: 300%;}

.slideContent{position: absolute;left: 75px;z-index: 2;}
.slideContent h2{font-family: MicrogrammaBold;font-size: 38px;font-weight: 800;color: #ffffff;text-transform: uppercase;text-shadow: 2px 3px 6px rgb(0, 0, 0);}

.slideThree{background-position: 70% 50%;}
.slideContentThree h2{color: #212121;text-shadow: 2px 3px 6px rgb(255, 255, 255);}

.mobileThreeOnw{background-image: url('../images/slides/mere-banner-3-full.jpg');}

.slideFour{background-position: 0% 50%;}

.navArrow{font-family: MicrogrammaNormal;position: absolute;top: 50%;transform: translateY(-50%);font-size: 40px;font-weight: 400;color: #212121;cursor: pointer;z-index: 3;user-select: none;background: transparent;transition: background 0.3s ease;}
.navArrow.left{left: 20px;}
.navArrow.right{right: 20px;}

.dots{display: none;text-align: center;position: absolute;bottom: 10px;width: 100%;z-index: 9;}
.dots span{display: inline-block;width: 10px;height: 10px;margin: 0 5px;background: #ffffff;border-radius: 50%;cursor: pointer;opacity: 0.5;transition: opacity 0.3s ease;}
.dots span.active{opacity: 1;}

/*Product-Category-Section*/
.productCategorySection{width: 100%;padding: 5% 0;}

.productPageCategorySection{width: 100%;padding: 75px 0;}

.homeProductTitleDiv{display: none;}
.homeProductTitle{margin-bottom: 25px;}
.homeProductTitle h1{font-family: MicrogrammaBold;font-size: 28px;font-weight: 800;color: #212121;text-transform: uppercase;}
.homeProductTitle p{font-family: 'CubeWebExpanLight';font-size: 16px;font-weight: 400;color: #212121;margin-bottom: 0;}

.pcsDiv{width: 100%;height: 325px;background-repeat: no-repeat;background-size: cover;background-position: center;display: flex;align-items: center;justify-content: center;text-align: center;padding: 15px;cursor: pointer;transition: all 0.5s;-webkit-transition: all 0.5s;}
.pcsDiv:hover{transition: all 0.5s;-webkit-transition: all 0.5s;}
.pcsDiv h3{font-family: 'CubeWebExpanLight';font-size: 32px;font-weight: 500;color: #212121;text-transform: uppercase;}

.cutRing, .bottomDots, .topDots, .spuirlRing{position: relative;}
.cutRing::before{content: '';width: 75px;height: 75px;background-image: url('../images/shapes/cut-ring-shape.png');background-repeat: no-repeat;background-size: contain;background-position: left;position: absolute;top: 0;left: 0;}
.bottomDots::after{content: '';width: 30px;height: 70px;background-image: url('../images/shapes/bottom-dots-shape.png');background-repeat: no-repeat;background-size: contain;background-position: left;position: absolute;bottom: 15px;left: 15px;}
.topDots::before{content: '';width: 67px;height: 30px;background-image: url('../images/shapes/top-dots-shape.png');background-repeat: no-repeat;background-size: contain;background-position: left;position: absolute;top: 15px;right: 15px;}
.spuirlRing::after{content: '';width: 61px;height: 61px;background-image: url('../images/shapes/bottom-squirl-shape.png');background-repeat: no-repeat;background-size: contain;background-position: left;position: absolute;bottom: 0;right: 0;}

.rotateBox1:hover{transform: translateY(-10px);box-shadow: 0 5px 25px rgb(80, 80, 80, 0.3);}

.homePCSDiv a{text-decoration: none;}

.productDivBorderRB{border-right: 1px solid #d9d9d9;border-bottom: 1px solid #d9d9d9;}
.productDivBorderB{border-bottom: 1px solid #d9d9d9;}
.productDivBorderR{border-right: 1px solid #d9d9d9;}

.zoomInEffect{position: relative;overflow: hidden;transition: background-size 0.5s ease;}
.zoomInEffect, .zoomInEffect h3{transition: all 0.5s;}
.zoomInEffect:hover h3{transform: scale(1.2);transition: all 0.5s;}

/*About-Us-Page*/
.missionSection{width: 100%;padding: 75px 0;}

.sectionHeading{text-align: center;}
.sectionHeading h2{font-family: MicrogrammaNormal;font-size: 30px;font-weight: 500;color: #212121;margin-bottom: 50px;}

.aboutText p{font-family: 'CubeWebExpanLight';font-size: 22px;font-weight: 400;color: #212121;}
.aboutImg{width: 100%;height: 100%}
.aboutImg img{width: 100%;height: 100%;object-fit: contain;object-position: center;border-radius: 10px;}

.animate-on-scroll{transition: opacity 0.6s ease;}

.approachSection{width: 100%;padding-bottom: 75px;}
.technologySection{width: 100%;padding-bottom: 75px;}

.featureList{list-style: none;padding-left: 0;margin: 0;}
.featureList li{position: relative;padding-left: 25px;margin-bottom: 15px;}
.featureList li::before{content: "";position: absolute;top: 11px;left: 0;width: 10px;height: 10px;background-color: #212121;}

/*News-Page*/
.newsSection{width: 100%;height: 100%;padding-bottom: 75px;}

.newsCarousel{position: relative;}
.carouselContainer{position: relative;max-width: 100%;margin: auto;}

.carouselSlide{height: auto;display: none;opacity: 0;transition: opacity 0.8s ease-in-out;-webkit-transition: opacity 0.8s ease-in-out;}
.carouselSlide.active{display: block;opacity: 1;}

.carouselSlideImg{padding: 75px 25px;background-repeat: no-repeat;background-size: cover;background-position: center;}
.carouselSlideOne{background-position: right;}
.carouselSlideTwo{background-position: left;}

.carouselSlide h2{width: 50%;height: 200px;font-family: MicrogrammaBold;font-size: 36px;font-weight: 400;color: #ffffff;margin-bottom: 0;}
.carouselSlideTwo h2{width: 100%;justify-content: center;}

.carouselArrow{color: rgba(128, 128, 128, 0.7);position: absolute;top: 50%;transform: translateY(-50%);font-size: 28px;cursor: pointer;padding: 10px;user-select: none;transition: color 0.3s ease;-webkit-transition: color 0.3s ease;}
.carouselArrow:hover{color: rgba(191, 191, 191, 1);}

.carouselArrow.left{left: 0;}
.carouselArrow.right{right: 0;}

.carouselDots{display: none;text-align: center;margin-top: 30px;}
.carouselDots span{display: inline-block;width: 12px;height: 12px;margin: 0 8px;background: transparent;border: 1px solid #212121;border-radius: 50%;cursor: pointer;transition: background 0.3s;-webkit-transition: background 0.3s;}
.carouselDots span.active{background: #212121;}

.listingSection{width: 100%;height: 100%;padding-bottom: 75px;}

.newsDiv a{text-decoration: none;}

.newsDivImg img{width: 100%;height: 100%;object-fit: contain;object-position: center;}
.newsDivTxt{border: 2px solid #212121;}
.newsDivTxtTop{padding: 15px 20px;text-align: right;}
.newsDivTxtTop p{font-family: CubeWebExpanLight;font-size: 16px;font-weight: 400;color: #212121;margin-bottom: 15px;text-align: justify;}
.newsDivTxtTop span{position: relative;font-family: CubeWebExpanLight;font-size: 16px;font-weight: 500;color: #212121;}
.newsDivTxtTop span::before{content: '';display: block;clear: both;width: 18px;height: 12px;background-image: url('../images/icons/arrow-icon.png');background-repeat: no-repeat;background-size: contain;background-position: center;position: absolute;top: 2px;left: -30px;}
.newsDivTxtTop span:hover{color: #000000;}

.newsDivTxtBot{border-top: 2px solid #212121;padding: 15px 20px;}
.newsDivTxtBot p{font-family: CubeWebExpanLight;font-size: 16px;font-weight: 400;color: #212121;margin-bottom: 0;}

/*News-Content-Page*/
.newsContentContainer{width: 100%;padding: 0 15px;}

.newsContentDate{width: 100%;margin-bottom: 25px;}
.newsContentDate h5{font-family: CubeWebExpanLight;width: 130px;color: #212121;font-size: 18px;font-weight: 500;border-bottom: 2px solid #212121;}

.newsContentDiv{margin: 0 auto;}

.newsContentText{width: 100%;margin-bottom: 60px;}
.newsContentText h3{font-family: MicrogrammaNormal;font-size: 24px;font-weight: 500;color: #212121;margin-bottom: 25px;}
.newsContentText p{font-family: CubeWebExpanLight;font-size: 19px;font-weight: 400;color: #212121;margin-bottom: 15px;text-align: justify;}
.newsContentText span{font-family: CubeWebExpanLight;font-size: 14px;font-weight: 400;color: #212121;margin-bottom: 0;}
.newsContentText figure{margin: 0;}
.newsContentText figure img{width: 100%;height: 100%;object-fit: contain;object-position: center;}

/*Contact-Us-Page*/
.headeingContaciner{width: 100%;padding: 75px 0;}

.headingText{text-align: center;}
.headingText h1{font-family: MicrogrammaBold;font-size: 24px;font-weight: 800;color: #212121;text-transform: uppercase;margin-bottom: 50px;}
.headingPara{padding: 0 75px;text-align: center;}
.headingPara p{font-size: 20px;font-weight: 400;color: #212121;font-family: CubeWebExpanLight;}

.contactInfoSection{width: 100%;padding-bottom: 75px;}

.contactInforPadd{padding-top: 23px;padding-bottom: 23px;}

.contactInforBLR{position: relative;}
.contactInforBLR::before{content: '';width: 1px;height: 230px;background-color: #212121;position: absolute;left: -12px;top: 0;}
.contactInforBLR::after{content: '';width: 1px;height: 230px;background-color: #212121;position: absolute;right: 12px;top: 0;}

.contactPageInfo{width: 280px;margin: 0 auto;}

.contactInfo h6{font-family: MicrogrammaNormal;font-size: 20px;font-weight: 500;color: #212121;margin-bottom: 15px;}
.contactInfo p{font-size: 17px;font-weight: 400;color: #212121;font-family: CubeWebExpanLight;}
.contactInfo p a{text-decoration: none;color: #212121;}
.contactInfo p a:hover{color: #000000;}

.contactPageInfoMap{width: 310px;margin: 0 auto;}
.map-placeholder iframe{width: 100%;}

.contactFormSection{width: 100%;padding-bottom: 75px;}

.formDiv{margin-bottom: 25px;}
.formDiv label{font-size: 14px;font-weight: 400;color: #212121;text-transform: capitalize;font-family: CubeWebExpanLight;}
.formDiv input, .formDiv textarea{width: 100%;font-size: 18px;font-weight: 400;color: #212121;padding: 12px;font-family: CubeWebExpanLight;}
.formDiv textarea#message{resize: none;height: auto;}
.formDiv button{width: 100%;background-color: #262626;border-style: none;color: #ffffff;font-size: 20px;font-weight: 400;text-transform: uppercase;padding: 15px;font-family: CubeWebExpanLight;}
.formDiv button:hover{background-color: #000000;}

.formDiv input::-webkit-outer-spin-button, .formDiv input::-webkit-inner-spin-button{-webkit-appearance: none;margin: 0;}
.formDiv input[type=number]{-moz-appearance: textfield;}

#form-success{padding: 15px;margin-top: 20px;background-color: #dff0d8;color: #3c763d;border: 1px solid #d6e9c6;border-radius: 5px;font-weight: bold;text-align: center;}
#form-success p{font-size: 20px;font-weight: 400;color: #212121;font-family: CubeWebExpanLight;}

/*Footer-Section*/
.footerSection{width: 100%;background-color: #262626;padding: 20px 0;}

.copyrightText{text-align: left;}
.devCom{text-align: right;}
.copyrightText p{font-size: 15px;font-weight: 400;color: #ffffff;margin: 0;font-family: CubeWebExpanLight;}
.devCom p{font-size: 15px;font-weight: 400;color: #ffffff;margin: 0;font-family: CubeWebExpanLight;}
.devCom p a{text-decoration: none;color: #ffffff;}

/*Social-Media-Section*/
.socialMediaContainer{width: 100%;padding: 20px 0;}

.ftrSocial{list-style: none;margin: 0;padding-left: 0;display: flex;justify-content: flex-end;align-items: center;}
.ftrSocial li a{text-decoration: none;transition: 0.5s all;-webkit-transition: 0.5s all;}
.ftrSocial li a i{display: flex;justify-content: center;align-items: center;width: 30px;height: 30px;font-size: 18px;color: #212121;border: 1px solid #212121;border-radius: 50px;transition: 0.5s all;-webkit-transition: 0.5s all;}
.ftrSocial li a:hover i{background-color: #212121;color: #ffffff;transition: 0.5s all;-webkit-transition: 0.5s all;}
.instagramIcon{margin: 0 10px;}

/*Comming-Soon-Page*/
.section404{width: 100%;height: auto;padding: 75px 0;}

.pageTitle404{text-align: center;}
.pageTitle404 h1{font-family: MicrogrammaBold;font-size: 36px;font-weight: 800;color: #212121;text-transform: uppercase;margin-bottom: 50px;}
.pageTitle404 p, .highlightText span{font-family: CubeWebExpanLight;font-size: 18px;font-weight: 400;color: #212121;}

.highlightText{display: flex;justify-content: center;flex-wrap: wrap;gap: 30px;align-items: center;margin: 30px 0;}
.bulletP{font-size: 24px;color: #212121;line-height: 1;display: inline-block;margin: 0 10px;}