.bannerBox{background:#F5F5F5;height:550px;position:relative;overflow:hidden}
.bannerBox .coverBg{width:100%;height:100%;position:absolute;top:0;left:0}
.bannerBox .coverBg img{width:100%;height:100%;object-fit:cover}
.bannerBox .container{display:flex;align-items:center;height:100%;position:relative;z-index:1}
.bannerBox .contentBox{display:flex;flex-direction:column}
.bannerBox .contentBox span{font-size:16px;font-weight:500;color:#2b5ba7;display:block}
.bannerBox .contentBox h1{margin-top:10px;font-size:50px;font-weight:700;color:#2b5ba7;line-height:50px;display:block}
.bannerBox .contentBox strong{margin-top:10px;font-size:28px;font-weight:600;color:#2b5ba7;line-height:30px;display:block}
.bannerBox .contentBox .btnBox{gap:15px}
.heroBanner{position:absolute;top:0;right:0;height:100%;width:50%;z-index:2}
.heroBanner img{width:100%;height:100%;object-fit:cover;border-radius:1000px 0 0 1000px;border-left:#fff solid 10px;box-shadow:0 2px 6px #0000001a}
.heroBanner em{padding:8px;position:absolute;width:90px;height:90px;background-image:linear-gradient(285deg,#2b5ba7,#2d385e);bottom:50px;left:40px;display:flex;align-items:center;justify-content:center;border:#fff solid 5px;border-radius:100px;font-size:35px;color:#fff;box-shadow:0 2px 6px #0000001a;cursor:pointer;transition:.3s}
.heroBanner em:hover{background-image:linear-gradient(285deg,#2d385e,#2b5ba7);font-size:40px;transition:.3s}
.heroBanner video{width:100%;height:100%;object-fit:cover;border-radius:1000px 0 0 1000px;border-left:#fff solid 10px;box-shadow:0 2px 6px #0000001a;overflow:hidden}
.heroBanner em.icon-pause:after{content:'';padding:15px;width:100%;height:100%;background:url(../images/icon/pause-button.svg) no-repeat center center;background-size:100%}
.certificationsSection{padding:0;margin:20px 0;display:block}
.certificationsBanner{padding:10px;display:flex;align-items:center;justify-content:space-between;border-radius:100px;background-image:linear-gradient(285deg,#2b5ba7,#2d385e);position:relative}
.certificationsBanner h2{padding-left:40px;text-shadow:0 3px 6px rgba(0,0,0,0.16);font-size:26px;font-weight:600;font-style:italic;color:#f7f9fb}
.certificationsBanner figure{padding:10px;background:#ffffff30;border-radius:150px;display:flex;gap:10px}
.certificationsBanner figure a{width:100px;height:100px;border-radius:100px;overflow:hidden}
.certificationsBanner figure a img{transition:.5s}
.certificationsBanner figure a:hover img{transform:scale(1.1);transition:.5s}
.uspSection{display:block;background:#2D385E}
.uspBox{margin-top:35px;display:flex;gap:20px;flex-wrap:wrap}
.uspItem{padding:20px;width:calc(33.3% - 20px);min-height:150px;border-radius:30px;background:#fff;position:relative;overflow:hidden}
.uspItem::before{content:'';position:absolute;right:0;top:0;background:#2d385ee6;width:55px;height:60px;border-radius:0 0 30px 30px;transform:rotate(45deg);transition:.3s}
.uspItem figure{display:flex;gap:15px;align-items:center;height:50px}
.uspItem figure img{width:45px;transition:.3s}
.uspItem figcaption{font-size:20px;font-weight:600;color:#2b5ba7}
.uspItem p{padding-top:10px;margin-top:10px;color:#666;border-top:#7070703d solid 1px}
.uspItem span{padding:20px;position:absolute;right:0;top:0;font-size:20px;color:#fff;display:flex;align-items:center;justify-content:center}
.uspItem:hover::before{background:#2b5ba7;transition:.3s;transform:scale(1.2)}
.uspItem:hover figure img{transform:scale(1.1);transition:.3s}
.aboutSection{display:block;position:relative}
.aboutSection .whiteArrow{position:absolute;top:50%;left:0;width:50%;height:160px;margin:-80px 0 0;z-index:2;font-size:26px;line-height:30px;font-weight:500;display:flex;align-items:center;justify-content:flex-end}
.aboutSection .whiteArrow:before{content:'';position:absolute;top:0;left:0;width:calc(100% - 220px);height:100%;background:#fff;box-shadow:0 2px 6px #0000001a;border-radius:0 100px 100px 0}
.aboutSection .whiteArrow .punchLineBox{padding:40px 315px 40px 0;color:#2B5BA7;position:relative;font-weight:600}
.aboutSection .whiteArrow .tagBox{padding:10px 25px 10px 15px;background:#FF7F00;position:absolute;bottom:-45px;right:290px;border-radius:15px 5px 50px 15px;display:flex;align-items:center;gap:10px;color:#fff}
.aboutSection .whiteArrow .tagBox span{color:#fff;font-size:10px;font-weight:400;line-height:13px;padding-left:10px;border-left:#F7A201 solid 1px}
.aboutBox{display:flex;gap:20px;align-items:center}
.aboutBox .box{width:50%}
.aboutBox .box h2{font-size:35px;line-height:40px;font-weight:700;color:#2B5BA7}
.aboutBox .box p{color:#2B5BA7}
.aboutInfo{display:flex;align-items:center;justify-content:flex-end}
.aboutInfo figure{height:400px;border-radius:30px;overflow:hidden}
.aboutDetails{display:flex;flex-direction:column;justify-content:center}
.aboutDetails p{margin-top:10px;color:#666!important}
.aboutContactBox{padding-top:15px;margin-top:30px;border-top:#d8d8d8 solid 1px;display:flex;align-items:center;justify-content:space-between}
.aboutContactBox .contactCard{display:flex;gap:10px}
.aboutContactBox .contactCard strong{display:flex;flex-direction:column;font-weight:600;line-height:20px;justify-content:center;color:#2b5ba7}
.aboutContactBox .contactCard strong span{font-weight:400;color:#666;font-size:10px}
.aboutContactBox .contactCard em{width:40px;height:40px;background:#2b5ba7;border-radius:100px;font-size:18px;color:#fff;display:flex;align-items:center;justify-content:center}
.productRangeSection{display:block;overflow:hidden}
.productRangeSection .headingSection h2{color:#2B5BA7}
.productRangeSection .headingSection span{color:#666}
.productRangeBox{margin-top:35px;display:flex;gap:20px;position:relative}
.productSlider{display:flex}
.productCard{display:flex;flex-direction:column;border-radius:30px;border:solid 1px #2d385e1c;background:#F4F6F8;width:350px;overflow:hidden}
.productCard figure{height:205px;overflow:hidden}
.productCard figure img{width:100%;height:100%;object-fit:cover;transition:.3s}
.productDetails{padding:20px;display:flex;flex-direction:column;gap:10px}
.productDetails h3{font-size:22px;font-weight:600;color:#2B5BA7}
.productDetails p{color:#666;min-height:100px}
.productDetails .btn{width:fit-content}
.productCard:hover figure img{transform:scale(1.2) rotate(10deg);transition:.3s}
.clientsTrustSection{display:block;overflow:hidden}
.clientsTrustSection .headingSection h2{color:#2B5BA7}
.clientsTrustSection .headingSection span{color:#666}
.clientsTrustBox{margin-top:35px;position:relative}
.clientsTrustSlider{display:flex}
.clientsTrustCard{padding:20px;display:flex;flex-direction:column;gap:10px;border-radius:30px;border:solid 1px #2d385e1c;background:#F4F6F8;width:350px;overflow:hidden;position:relative;transition:.3s}
.clientsTrustCard figure{padding:40px;position:absolute;left:0;top:0;width:100%;height:100%;display:flex;align-items:center;justify-content:flex-end;pointer-events:none;opacity:.04}
.clientsTrustCard figure img{height:100%;object-fit:contain;transition:.3s}
.clientsTrustCard em{height:50px;transition:.3s}
.clientsTrustCard h3{font-size:22px;line-height:28px;font-weight:600;color:#2B5BA7;transition:.3s}
.clientsTrustCard p{color:#666;transition:.3s}
.clientsTrustCard:hover{background:#2B5BA7;transition:.3s}
.clientsTrustCard:hover img{filter:brightness(0) invert(1);transition:.3s}
.clientsTrustCard:hover h3,.clientsTrustCard:hover p{color:#fff;transition:.3s}
.ourNumbersSection{display:block;overflow:hidden;position:relative}
.ourNumbersBg{position:absolute;top:0;left:0;width:100%;height:100%}
.ourNumbersBg img{width:100%;height:100%;object-fit:cover}
.ourNumbersBg::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;opacity:.85;background-image:linear-gradient(295deg,#f20000,#2b5ba7)}
.ourNumbersBox{margin-top:35px;position:relative;display:flex}
.ourNumbersBox .item{padding:30px 40px;width:20%;display:flex;gap:20px;justify-content:center;flex-direction:column;height:300px;background:url(../images/pipe.svg) center left no-repeat}
.ourNumbersBox .item:first-child{background:none}
.ourNumbersBox .item figure{height:50px}
.ourNumbersBox .item h3{margin-top:20px;font-size:50px;color:#fff}
.ourNumbersBox .item span{font-size:14px;color:#fff}
@media screen and (max-width:1024px) {
.bannerBox .contentBox h1{font-size:45px}
.aboutSection .whiteArrow{font-size:18px;line-height:22px}
.aboutSection .whiteArrow .punchLineBox{padding:40px 280px 40px 0}
.ourNumbersBox .item h3{font-size:40px}
}
@media screen and (max-width:768px) {
.heroBanner{right:-140px}
.bannerBox{height:400px}
.heroBanner em{padding:8px;width:65px;height:65px;left:10px;font-size:20px}
.certificationsBanner h2{font-size:20px}
.uspItem{width:calc(50% - 10px)}
.aboutSection .whiteArrow:before{width:95%}
.aboutSection .whiteArrow .punchLineBox{padding:15px 35px 15px 20px}
.aboutSection .whiteArrow .punchLineBox br{display:none}
.aboutSection .whiteArrow{height:70px;top:initial;bottom:110px}
.aboutSection .whiteArrow .tagBox{left:20px;right:inherit;bottom:-40px}
.ourNumbersBox{flex-wrap:wrap;gap:15px}
.ourNumbersBox .item{width:calc(33.3% - 10px);background:none;border:#ffffff33 solid 1px;padding:20px;height:auto;gap:15px;border-radius:30px}
.ourNumbersBox .item h3{margin-top:10px}
}
@media screen and (max-width:540px) {
.bannerBox .container{align-items:flex-end}
.bannerBox .contentBox{padding-bottom:20px;width:100%}
.bannerBox .contentBox h1{font-size:32px;line-height:35px;color:#fff;}
.bannerBox .contentBox span{font-size:14px;color:#fff;}
.bannerBox .contentBox strong{margin-top:0;font-size:18px;line-height:30px;color:#fff;}
.bannerBox .contentBox .btnBox{gap:10px;flex-direction:column;margin-top:15px}
.bannerBox .contentBox .btnBox .btn{width:100%}
.bannerBox .contentBox .btnBox .btn-default{background:#fff;}
.heroBanner{position:absolute;top:0;left:0;right:inherit;height:100%;width:100%;border:0;border-radius:0;z-index:1}
.heroBanner::after{content:'';height:100%;border-radius:0;background:linear-gradient(180deg,#00000063 0,#000000c9 100%);position:absolute;left:0;bottom:0;right:0}
.heroBanner video{border-radius:0;border:0}
.heroBanner em{display:none}
.certificationsBanner{padding:20px 15px 15px;border-radius:15px;flex-direction:column;align-items:baseline}
.certificationsBanner h2{padding:0 0 15px;font-size:22px;line-height:30px;font-style:normal}
.certificationsBanner figure{flex-wrap:wrap;border-radius:10px;background:none;padding:0}
.certificationsBanner figure a{padding:10px;border-radius:5px;width:calc(50% - 5px);background:#fff;display:flex;align-items:center;justify-content:center;height:auto}
.uspBox{margin-top:20px;gap:15px}
.uspItem{border-radius:15px;width:100%}
.uspItem::before{right:-5px;top:-5px}
.uspItem span{padding:15px}
.aboutBox{flex-direction:column}
.aboutSection .whiteArrow{margin:0;position:absolute;width:100%;height:auto;top:-90px;left:15px}
.aboutSection .whiteArrow:before{display:none}
.aboutSection .whiteArrow .tagBox{position:initial;width:fit-content;margin-top:10px}
.aboutSection .whiteArrow .punchLineBox{padding:0 20px;color:#fff;left:0;width:calc(100% - 30px);position:absolute}
.aboutBox .box{width:100%}
.aboutInfo figure{height:auto}
.aboutBox .box h2{font-size:22px;line-height:30px}
.aboutContactBox{flex-direction:column;gap:10px;align-items:baseline}
.ourNumbersBox .item{width:calc(50% - 8px)}
.ourNumbersBox .item:nth-child(3){width:100%}
.aboutInfo figure,.productCard{border-radius:15px}
.clientsTrustCard,.ourNumbersBox .item{border-radius:15px}
}