@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');

body,html,p{margin:0px; padding:0px; font-family: "DM Sans", sans-serif;}
*{margin:0;padding:0;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;}
aside, details, figcaption, figure, ins, summary, small, mark, title, video, footer, header, hgroup, nav, section, article {display:block;}
.clear{padding:0; margin:0; line-height:0; height:0; font-size:0; clear:both; width:100%; display:block;}
h1, h2, h3, h4, h5, h6 { padding:0; margin:0; font-weight:normal;}
html, body {height:100%; width:100%; padding:0; margin:0;}
body *{box-sizing:border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box;}
ul li{list-style:none;}
input,button{outline:none; border:none;}
a, a:hover, a:focus{text-decoration:none; outline:none;}
a:active,a:hover {outline: 0;}
button{transition:all .5s;}
:focus{outline:none;}
img{border:none;}

/********Main Css********/

.h1{font-size:45px; font-weight:700;}
.h2{font-size:40px; font-weight:700;}
.h3{font-size:36px; font-weight:700;}
.h4{font-size:30px; font-weight:600;}
.h5{font-size:25px; font-weight:600;}
.h6{font-size:20px; font-weight:500;}

.fw500{font-weight:500;}
.fw600{font-weight:600;}
.fw700{font-weight:700;}

.p14{font-size:14px;}
.p15{font-size:15px;}
.p16{font-size:16px;}
.p18{font-size:18px;}
.p20{font-size:20px;}
.p22{font-size:22px;}


header{padding:20px 50px; position:fixed; top:0px; z-index:9; width:100%; transition:all 0.5s;}
header .topLogo img{max-height:55px;}
header.scrolled{padding:8px 0; background:#FFF; box-shadow:0 0 5px #bbb;}

header .topMenu{display:flex; align-items:center; justify-content:end;}
header .topMenu ul{padding:0; margin:0; display:flex; align-items:center; justify-content:center; margin:0px; padding:0px;}
header .topMenu ul li{position:relative;}
header .topMenu ul li .subMenu{position:absolute; top:100%; left:0px; background:#FFF; padding:10px 0; box-shadow:0 0 5px #bbb; border-radius:8px; display:none; min-width:290px; z-index:99;}
header .topMenu ul li:hover .subMenu{display:block;}
header .topMenu ul .subMenu li a{padding:10px 20px;}
header .topMenu ul .subMenu li a:hover{background:#0097E6; color:#FFF;}
header .topMenu ul li a{color:#000; font-size:16px; font-weight:600; padding:12px 20px; display:block;}

header .menuNumber{font-size:18px; font-weight:600; color:#000;}

header .topMenu .responsiveMenu{background:#0097E6; color:#FFF; padding:13px; font-weight:bold; border:none; cursor:pointer; height:40px; width:50px; display:none; align-items:center; justify-content:center; border-radius:8px;}
header .transParentBtn{color:#000; border:1px solid #0097E6; background:#FFF;}
header .transParentBtn:hover{color:#000;}


.homeBanner{padding:150px 0 0; background: #88DAFF;
background: linear-gradient(330deg, rgba(136, 218, 255, 1) 0%, rgba(255, 255, 255, 1) 58%, rgba(240, 250, 255, 1) 100%);}

.homeBannerText p{font-size:18px; font-weight:600; color:#000;}
.homeBannerText h3{font-size:46px; font-weight:700; color:#000; margin-bottom:30px;}
.homeBanner img.img-fluid{margin-bottom:-40px;}

.innerBanner{padding:150px 0 50px; background:#E3F4FC;}

.exampleBox{background: #d9f2ff; border-left: 4px solid #0097e6; padding: 1rem 1.25rem; border-radius: .75rem;}

ul.listBullet li{list-style:disc;}

.yourBusioness{background:#F5F5F5; padding:100px 0;}
.yourBusioness h2{font-size:30px; font-weight:700; color:#000; text-align:center;}

.itemsGrid3{display:grid; grid-template-columns:repeat(3, 1fr); gap:30px; margin-top:50px;}
.itemsGrid3 .itemBox{background:#FFF; border:1px solid #7D7B7B; padding:20px 30px; border-radius:5px; display:flex; align-items:center; gap:20px; font-size:17px; font-weight:500;}
.itemsGrid3 .itemBox:nth-child(even){background:#EBF7FF; border:1px solid #0B75C7;}

.mobileApp{padding:80px 0 0; color:#FFF; background: #0097E6;
background: linear-gradient(180deg, rgba(0, 151, 230, 1) 0%, rgba(12, 125, 184, 1) 100%);}
.mobileApp h3{font-size:35px; font-weight:700;}

.whyDialGrid{padding:100px 0 70px;}
.whyDialGrid h3{font-size:30px; font-weight:700; color:#000; text-align:center;}
.whyDialGrid h4{font-size:22px; font-weight:700; margin-bottom:10px;}
.whyDialGrid .customeTab{border-bottom:1px solid #BCBCBC; justify-content:space-around; margin-bottom:35px; flex-wrap:nowrap; overflow:auto;}
.whyDialGrid .customeTab li{border:0px;}
.whyDialGrid .customeTab li a{font-size:17px; color:#555; font-weight:600; border:0px; margin:0px; padding:20px; position:relative; white-space:nowrap;}
.whyDialGrid .customeTab li a.active{color:#0886C8;}
.whyDialGrid .customeTab li a.active::after{content:""; position:absolute; bottom:0px; left:0px; height:3px; width:100%; background:#0097E6;}

.whyDialGrid .featureList{list-style:none; padding-left:0; margin-bottom:30px;}
.whyDialGrid .featureList li{margin-bottom:12px; display:flex; align-items:flex-start;}
.whyDialGrid .featureList img{margin-right:8px; margin-top:7px;}


.customerService{text-align:center; padding:80px 0; background: #88DAFF;
background: linear-gradient(330deg, rgba(136, 218, 255, 1) 0%, rgba(255, 255, 255, 1) 58%, rgba(240, 250, 255, 1) 100%);}

.customerService h2{font-size:30px; font-weight:700; color:#000; margin-bottom:10px;}
.customerService p{font-size:16px; color:#000;}
.customerService h3{font-size:19px; font-weight:600; color:#000; margin-bottom:30px;}

.customerService .serviceIcons{display:flex; justify-content:center; gap:30px; margin:30px 0; padding:0px;}
.customerService .serviceIcons li span{display:inline-flex; align-items:center; justify-content:center; height:130px; width:130px; border-radius:15px; background:#EBF7FF; border:1px solid #0B75C7;}
.customerService .serviceIcons li:nth-child(even) span{background:#FFF; border-color:#9F9F9F;}
.customerService .serviceIcons li p{font-size:16px; font-weight:600; color:#000; margin-top:10px;}


.aiAgentAssist{background: #0097E6; color:#FFF; display:flex; justify-content:center; 
background: linear-gradient(180deg, rgba(0, 151, 230, 1) 0%, rgba(12, 125, 184, 1) 100%);}
.aiAgentAssist h3{font-size:30px; font-weight:600; margin-bottom:15px;}
.aiAgentAssist p{font-size:16px; margin-bottom:30px;}

.contentItems{flex:1; display:flex; align-items:center; justify-content:center; min-width:650px; padding:0 30px;}
.contentItems .sizeBox{max-width:800px;}

.keyFeatures{display:grid; grid-template-columns:repeat(2, 1fr); gap:30px;}
.keyFeatures .itemsBox{background:#FFF; color:#000; padding:20px 30px; border-radius:5px; box-shadow:1px 2px 4px #02020240;}
.keyFeatures h4{font-size:17px; color:#000; font-weight:600; margin-bottom:8px;}
.keyFeatures ul{margin:0px;}
.keyFeatures ul li{list-style:disc; font-size:16px;}



.aiAgentAssist.withBgWhite{background:#FFF; color:#000;}
.withBgWhite .keyFeatures .itemsBox{background:#FFF; color:#000; padding:20px 30px; border-radius:5px; border:1px solid #DDD; box-shadow:none;}

.nowService{background:#F3F4F4; text-align:center; padding:80px 0;}
.nowService h3{font-size:25px; font-family:600; color:#000;}


.contentForm{border-radius:30px; box-shadow:0 0 20px #DCDCDC;}
.contentForm h3{font-weight:600;}
.contentForm .form-control{height:48px;border-radius:8px;}
.contentForm .form-label{font-weight:600; margin-bottom:5px;}


footer{padding:50px 0; border-top:1px solid #efefef; background: rgba(136, 218, 255, 5.6);
background: linear-gradient(0deg, rgba(136, 218, 255, 0.5) 0%, rgba(255, 255, 255, 1) 70%);}

footer .footLink img{height:55px;}

footer .socalIcon{display:flex; align-items:center; gap:20px; margin:35px 0 25px; padding:0px;}
footer .socalIcon li{margin:0px; padding:0px;}
footer .copyRight{font-size:16px;}
footer h4{font-size:18px; font-weight:600; margin-bottom:10px;}
footer .futLinks{margin:0px; padding:0px;}
footer .futLinks li a{display:block; color:#000; font-size:16px; padding:8px 0;}
footer .futLinks.li2{display:flex; flex-wrap:wrap;}
footer .futLinks.li2 li{flex:0 0 50%;}

footer address p{padding:8px 0 8px 8px; margin-bottom:10px; display:flex; align-items:flex-start; gap:10px;}
footer address p img{}
footer address p a{color:#000; font-size:16px;}


.homeComanBtn{background:#0097E6; font-size:16px; font-weight:600; min-width:120px; color:#FFF; border-radius:40px; padding:10px;}
.homeComanBtn:hover{color:#FFF;}
.transParentBtn{background:none; text-align:center; font-size:16px; font-weight:600; min-width:120px; color:#FFF; border-radius:40px; padding:10px; border:1px solid #FFF;}
.transParentBtn:hover{color:#FFF;}

.blackBtn{background:#000; font-size:16px; font-weight:600; min-width:120px; color:#FFF; border-radius:40px; padding:10px; border:1px solid #000;}
.blackBtn:hover{color:#FFF;}

.bgGradient{background:#FFE5E5;
background:linear-gradient(90deg, rgba(255, 229, 229, 1) 0%, rgba(245, 255, 254, 1) 27%, rgba(252, 243, 255, 1) 55%, rgba(255, 244, 229, 1) 100%);}

.scrollTopBtn{display:none; height:50px; width:50px; position:fixed; bottom:50px; right:50px; background:#000; color:#fff; border:none; border-radius:50%; cursor:pointer; font-size:18px; z-index:999; transition:opacity 0.3s ease;}
.scrollTopBtn.show{display:block; opacity:1;}


.whatsAppChat{position:fixed; bottom:50px; right:50px; width:80px; height:80px; padding:6px; overflow:hidden; border-radius:100%; background:#1bd741; box-shadow:0 0 30px #555; cursor:pointer; z-index:9999;}



@media (max-width:1400px) {
    header .topMenu ul li a{padding:10px 15px;}
    header{padding:20px;}
}



@media (max-width:1199px) {
    header{padding:20px 0;}
    header .topMenu ul li a{padding:10px 8px;}
    .itemsGrid3{grid-template-columns:repeat(2, 1fr);}
    .contentItems{padding:30px;}
    footer .futLinks.li2 li{flex:0 0 100%;}
}



@media (max-width:991px) {

    header.scrolled{border-bottom:1px solid #333;}
    header .topMenu{position:relative;}
    header .topMenu ul li a{color:#FFF;}
    header .topMenu ul.responsiveMenuUl.main{display:block;}
    header .topMenu ul.responsiveMenuUl{display:none; position:absolute; top:100%; background:#0097e6; margin-top:10px; right:0; width:320px; padding:10px 20px; border-radius:20px;}
    header .topMenu .responsiveMenu{display:flex;}
    header .topMenu ul .subMenu li a{padding:6px 20px;}
    header .topMenu ul.responsiveMenuUl .subMenu{display:block; background:rgba(255,255,255,0.1); box-shadow:none; padding:0; position:relative; min-width:auto;}

    .homeBanner{text-align:center;}
    .homeBannerText{margin-bottom:60px;}
    .homeBannerText h3{font-size:40px; margin:10px 0 20px;}

    .mobileApp{text-align:center; padding:50px 0 0;}
    .aiAgentAssist{text-align:center;}
    .keyFeatures .itemsBox{text-align:left;}

    footer{text-align:center;}
    footer h4{margin:30px 0 10px;}
    footer .footLink{display:inline-block;}
    footer .futLinks li a{padding:4px 0;}
    footer .socalIcon{justify-content:center;}
    footer address p{justify-content:center; margin:0px;}
}



@media (max-width:767px) {

    header{text-align:center;}
    header .topMenu{justify-content:center; border-bottom:1px solid #DDD; padding:0 0 10px; margin:0 0 10px;}
    /* header a.topLogo{} */
    header .topMenu ul li a{padding:10px 20px;}
    .homeBanner{padding:180px 0 0;}
    .itemsGrid3{grid-template-columns:repeat(1, 1fr);}
    .aiAgentAssist{padding:20px;}
    .contentItems{padding:0; min-width:auto;}
    .keyFeatures .itemsBox{padding:20px;}
    footer .footLink{display:none;}

}


@media (max-width:575px) {

    .itemsGrid3 .itemBox{padding:20px;}
    .yourBusioness{padding:100px 0 50px;}
    .scrollTopBtn{height:40px; width:40px; bottom:10px; right:10px;}
    
    header .transParentBtn{min-width:90px; padding:6px; font-size:16px;}
    header .homeComanBtn{min-width:90px; padding:8px; font-size:16px;}
    header .menuNumber{font-size:17px;}
    .homeBanner{padding:200px 0 0;}

    .whatsAppChat{position:fixed; bottom:30px; right:30px; width:60px; height:60px;}
    
}


@media (max-width:480px) {
    

    .homeBannerText h3{font-size:28px; margin:10px 0 20px;}

    .customerService .serviceIcons{gap:15px;}
    .customerService .serviceIcons li span{height:110px; width:110px;}
    .keyFeatures{grid-template-columns:repeat(1, 1fr);}
    .itemsGrid3{margin-top:30px; gap:15px;}
    .itemsGrid3 .itemBox{padding:10px; gap:10px; font-size:16px;}


}