:root{
    --theme-primary: #7C2CDD;
    --theme58525B : #58525B;
    --theme-text: #060308;
    --theme-gray: #C3C2C5;
    --themeADAAAF: #ADAAAF;
    --themeF6F6F6 :#F6F6F6;
    --black-box-bg: rgba(255, 255, 255, 10%);
    --white: #ffffff;
    --black : #000000;

    --theme-transition: all 0.2s ease-in-out;
    --drop-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;;
  }
  
  * {
  margin: 0px; padding: 0;
    box-sizing:border-box;
    -webkit-box-sizing:
    border-box;
    -moz-box-sizing:border-box;
    -o-box-sizing:border-box;
    -ms-box-sizing:border-box;
  }
  
  body{font-family: "Inter", sans-serif; font-size: 16px; line-height: 30px; background-color: var(--white);}
  html{scroll-behavior: smooth;}
  ::-webkit-scrollbar {width: 8px; } 
  ::-webkit-scrollbar-track { background-color: var(--theme-gray); }
  ::-webkit-scrollbar-thumb { background-color:var(--theme-primary); border-radius: 5px; }

  img {
    vertical-align:top;
    max-width:100%;
    height:auto;
    border:none;
    width: fit-content;
  }
  svg{max-width: 100%; width: fit-content;}
  
  iframe {
    max-width:100%;
    border:none;
  }
  .fl {
    float:left;
  }
  .fr {
    float:right;
  }
  .clr,
  .cl,
  .clear {
    clear:both;
  }
  
  .clearfix:after {
    clear:both;
    display:block;
    visibility:hidden;
    content:"";
  }
  
  input:focus,
  textarea:focus,
  select:focus,
  button:focus {
    outline:none;
  }

  /*textarea,input:not(input[type="submit"], input[type="checkbox"], input[type="radio"]) { border:1px solid transparent; background:#F5F5F5; padding:0 30px; box-shadow:none; height:50px; max-width:100%; border-radius:0px; width:100%; font-family: 'Urbanist';color: var(--theme-text); }
  
  input[type="search"] {-webkit-appearance:none;}
   textarea:focus,input:focus:not(input[type="submit"]):focus
  {
  background:#F5F5F5;
  } */
  
  input,
  select,
  textarea {
    font-size:14px;
    font-family: 'Urbanist';
    outline: 0px !important;
  }

  input[type="image"],
  input[type="submit"],
  input[type="button"],
  button {
  background:var(--theme-primary);
  border: medium none;
  border-radius: 0px;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 16px;
  transition: all 0.3s ease-in-out 0s;
  font-weight:500;
  appearance:normal;
  -webkit-appearance:none;
  max-width:100%;
  }
  input[type="image"],
  input[type="submit"],
  input[type="button"]{height:50px}
  
  textarea {
  resize:none;
  min-height:110px;
  line-height:normal;
  padding:11px;
  width:100%;
  height: 120px;
  padding: 15px 30px;
  }
  input[type="image"]:hover,
  input[type="submit"]:hover,
  input[type="button"]:hover,
  button:hover {
  background-color:var(--theme-primary);
  }

  input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } 
  input[type=number] { -moz-appearance: textfield; }
  
  input[type="submit"], input[type="button"], button:not(ul.slick-dots li button){display: inline-block; font-size: 16px; font-weight: 500;color: #fff; text-transform: uppercase;  border-radius: 5px; padding: 14px 35px; border: 2px solid var(--theme-primary) !important; background-image: linear-gradient(to right, #fff 50% , var(--theme-primary) 50%) !important; transition: 0.3s !important; background-size: 210% !important; background-position: calc(100% + 2px) center; width:fit-content;}
  input[type="submit"]:hover, input[type="button"]:hover, button:hover{ background-position: -2px center !important; color: var(--theme-primary) !important; }
  

  a{color: var(--theme-primary); text-decoration: none;}
  a:hover{color: var(--theme-text);}
  img{max-width: 100%;}
  .wrapper{max-width: 1280px; padding: 0px 50px; margin-inline:auto;}
  .small-wrapper{max-width:1030px;padding-inline: 50px; margin-inline: auto;}
  

/* ================link button css ================ */
.a_btn{display: inline-block; vertical-align: middle; padding:10px 30px; border-radius: 4px; color: var(--white); background-color: var(--theme-primary); border: 2px solid var(--theme-primary); transition: var(--theme-transition); font-weight: 500;}
.a_btn:hover{background-color: var(--white); color: var(--theme-primary);}
.a_btn.secondry-btn{color: var(--theme-primary); border-color: var(--white); background-color: var(--white);}  
.a_btn.secondry-btn:hover{color: var(--white); background-color: var(--theme-primary); border-color: var(--theme-primary);}
.a_btn.size-small{padding: 10px 18px; font-size: 14px;}
.btn-arrow{padding-left: 10px; display: inline-block; vertical-align: middle; transition: 0.2s transform ease-in;}
.a_btn:hover .btn-arrow{transform: translateX(6px);}

li{margin-bottom: 5px;}
.list-icons li{list-style-type: none; padding-left: 40px; position: relative;}
.list-icons li::before{content:''; position: absolute; left: 0; top: 5px; width: 25px; height: 25px; background: url('../bin/index/list-icon.svg'); color: var(--theme-primary); background-size: 100%;}
.list-icons-image li{list-style-image: url('../bin/index/list-icon.svg'); margin-left: 30px;}
.text-center{text-align: center;}



/* ================ row col css ========== */
.row{display: flex; flex-wrap: wrap; margin-inline: -15px;}
.row>div{padding: 15px;}
.col_1{width:100%;}
.col_2{width:50%;}
.col_3{width:33.33%;}
.col_4{width:25%;}
.col_5{width:20%;}
.col_inr{height: 100%; display: block;}

.w_40{width: 40%;}
.w_20, .col_20{width: 20%;}
.w_60, .col_60{width: 60%;}
.col-inr{height: 100%;}

.justify-center{justify-content: center;}
.align-center{align-items: center;}

/* =======================font-size=================  */

h1, .heading-1{font-size: 54px; line-height: 65px; font-weight: 600; color: var(--theme-text);}
h2, .heading-2{font-size: 36px; line-height: 46px; font-weight: 600; color: var(--theme-text);}
h3, .heading-3{font-size: 32px; line-height: 42px; font-weight: 600; color: var(--theme-text);}
h4, .heading-4{font-size: 30px; line-height: 35px; font-weight: 600; color: var(--theme-text);}
h5, .heading-5{font-size: 27px; line-height: 30px; font-weight: 600; color: var(--theme-text);}
h6, .heading-6{font-size: 20px; line-height: 30px; font-weight: 600; color: var(--theme-text);}
.font-18{font-size: 18px; line-height: 30px;}
p{font-size: 16px; line-height: 30px;}


/*====================== section padding============ */
.p_tb_80{padding-block: 80px;}
.p_t_80{padding-top: 80px;}
.p_b_80{padding-bottom: 80px;}

.p_tb_70{padding-block: 70px;}

.p_tb_60{padding-block:60px;}
.p_t_60{padding-top:60px;}
.p_tb_40{padding-block: 40px;}
.p_b_40{padding-bottom: 40px;}
.p_tb_30{padding-block: 30px;}
.p_t_30{padding-top: 30px;}



.mb_child_10 >*{margin-bottom: 10px;}
.mb_child_10 >*:last-child{margin-bottom: 0px;}
.mb_child_15 >*{margin-bottom: 15px;}
.mb_child_15 >*:last-child{margin-bottom: 0px;}
.mb_child_20 >*{margin-bottom: 20px;}
.mb_child_20 >*:last-child{margin-bottom: 0px;}
.mb_child_30 >*{margin-bottom: 30px;}
.mb_child_30 >*:last-child{margin-bottom: 0px;}





.padding-inline-50{ padding-inline: 50px;}
.header-sticky{position: sticky;z-index: 10; top: 0; background-color: var(--white);box-shadow: var(--drop-shadow);}
.header-row{justify-content: space-between; align-items: center;}
.logo{ max-width: 225px; }
.logo a{display: inline-block;}
.logo img{width: 100%;}
.navbar{width: calc(100% - 475px);}
.header-btn{max-width: 250px;}
.header-btn a:not(:first-child){margin-left: 10px;}

/* menu css  */
.menu nav li{list-style: none; font-weight: 500;}
.menu nav li a{color: var(--theme-text); transition: var(--theme-transition); font-size: 14px;}
.menu .otr-menu>li{display: inline-block;}
.menu .otr-menu>li:not(:last-child){ margin-right: 45px;}
.menu .otr-menu>li>a:hover{color: var(--theme-primary);}

.menu-icon, .menu-close{display: none;}

/* ===========banner css ========== */
.banner-text p{font-size: 20px; line-height: 30px;}
.banner-text-inr{text-align: center;}

/* ===============info card css =============== */
.info-card{border: 1px solid var(--theme-gray); border-radius: 10px; position: relative; --card-padding: 40px;}
.info-card .title{padding: var(--card-padding) 0 8px; margin-bottom: 0;}
.info-card .card-txt{padding: 8px var(--card-padding) var(--card-padding);}
.info-card .title .text-heading{position: relative; padding-inline: var(--card-padding);}
.info-card .title .text-heading>*{ max-width: 294px;}
.info-card .title .text-heading::after{content: ''; position: absolute; left:0px; top:0; width:4px; height: 100%; background-color: var(--theme-primary); transition: var(--theme-transition);}
.info-card:hover .text-heading::after{width: 100%; opacity: 0.20;}
.info-card .info-list li{font-size: 15px; line-height: 24px; list-style-type: none;}
.info-card .info-list.list-icons li{border: 2px solid var(--theme-primary); border-radius: 10px; padding: 20px 20px 20px 60px;}
.info-card .info-list.list-icons li::before{left: 20px; top: 20px;}
.info-card .info-list strong{display: block; color: var(--theme-text);}
.info-card .info-list p{color: var(--theme58525B);}
.info-card .info-list.icons-list li{display: flex; flex-wrap: wrap; align-items: center;}
.info-card .info-list.icons-list li .icon{width: 50px;}
.info-card .info-list.icons-list li .text{width: calc(100% - 50px); padding-left: 15px;}


/* ==========black-box ==========*/
.black-box{background-color: var(--black); border-radius: 10px; padding-inline: 30px;}
.text-white *{color: var(--white);}

.title{margin-bottom: 15px;}
.title .icon{max-width: 60px; margin-inline: auto;}
.black-box .title p{color: var(--themeADAAAF);}
.black-box-cards{padding: 35px; border-radius: 10px; background-color: var(--black-box-bg);} 
.black-box-cards .icon{max-width:80px;}
.black-box .button-box{display: table; width: fit-content; margin-inline: auto; margin-top:30px;}
.black-box .button-box a:not(:first-child){margin-left: 15px; display: inline-block; vertical-align: middle;}
.black-box .a_btn{background-color: var(--black); border-color: var(--white);} 
.black-box .a_btn:hover{background-color: var(--white); color: var(--black);}
.black-box .a_btn:hover .btn-arrow i{color: var(--black);}
.black-box a:not(.a_btn){text-decoration: underline;}
.black-box a:not(.a_btn):hover{color: var(--theme-primary); }


/* =================best-service slider ================= */

.best-service{border :1px solid var(--black);box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; border-left: none; border-right: none;}
.best-service-slider{margin-left: 10%; max-width: 1900px;}
.best-service-col{padding: 15px;}
.best-service{background-color: var(--themeF6F6F6);}
.best-service-card{background-color: var(--white); border-radius: 10px; overflow: hidden; display: flex; flex-wrap: wrap;}
.best-service-card .image .col-inr{width: 100%; height: 100%;}
.best-service-card .image img{ object-fit: cover; width: 100%; height: 100%;}
.best-service-card .text{padding: 30px;}
.best-service-card .text .list-icons li::before{top: 50%; transform: translateY(-50%);}
.best-service .slick-track { display: flex !important; }
.best-service .slick-slide { height: inherit !important; }
.best-service .slick-list.draggable{padding-right: 40% !important;}

/* ================pricing card ========== */
.pricing-card{padding: 30px; border: 1px solid #C3C2C5; border-radius: 10px;}
.pricing-card li{list-style-type: none;}
.small-card.pricing-card{border-color: var(--theme-primary); display: flex; flex-wrap: wrap; flex-direction: column; justify-content: space-between; gap: 8px; background-color:var(--white);}
.big-card.pricing-card{padding: 40px 50px;}
.pricing-card small{font-size: 16px; font-weight: 400;}
.pricing-card.small-card.bg-theme{background-color: var(--theme-primary);}
.pricing-card.small-card.bg-theme *:not(.a_btn){color: var(--white);}
.pricing-card.small-card.bg-theme .a_btn{background-color: var(--white); border-color: var(--white); color: var(--theme-primary);}
.pricing-card.small-card.bg-theme .a_btn:hover{background-color: var(--theme-primary);color: var(--white); }
.theme-color{color: var(--theme-primary);}


/* =====================upcoming-feature  ===========*/
.black-bg{ background-color: var(--black);}
.upcoming-box .image img{width: 100%; border-radius: 10px; position: relative; z-index: 1;}
.upcoming-box .image{position: relative; padding: 30px 30px 0 30px;}
.upcoming-box .image::after{content: ''; position: absolute; width: 70%; height:75%; left: 0; top: 0; border: 1px solid var(--white);  border-radius: 10px;}
/* .upcoming-box .image img{width: 100%;} */
.upcoming-box .text:not(:last-child){border-bottom: 1px solid var(--theme58525B);}
.upcoming-box .text{padding-block: 15px;}


/* ================== FAQ section =================== */
.faq-section{--faq-padding : 25px}
.faq-section .faq{padding-top: var(--faq-padding);}
.faq-col{padding-inline: var(--faq-padding); border: 1px solid #C3C2C5; border-radius: 10px;}
.faq-title{padding-block: var(--faq-padding); position: relative; padding-right: 30px;}
.faq-title::after{content: '+'; color: var(--theme-primary); position: absolute; right: 0; top:50%; transform: translateY(-50%); font-size: 30px;}
.faq-title.active::after{content: '-';}
.faq-details{padding-bottom: var(--faq-padding);}
.faq-col:not(:first-child) .faq-details{display: none;}

/* =============footer =========== */

.footer .social-list{margin-left: auto;}
.follow-us{margin-left: auto;}
.follow-us p{display: inline-block; vertical-align: middle; margin-right: 10px;}
.social-list{display: inline-flex; flex-wrap: wrap; align-items: center; list-style-type: none;}
.social-list li:not(:first-child){margin-left: 10px;}
.social-list li{margin-bottom: 10px;}
.social-list li a{display:flex; align-items: center; justify-content: center; border-radius: 50%; border: 1px solid var(--themeADAAAF); padding: 5px; width:38px; height: 38px;}
.social-list li a:hover{background-color: var(--theme-primary); transition: var(--theme-transition);}
.social-list li a img{transition: var(--theme-transition);}
.social-list li a:hover img{filter: brightness(0) invert(1) ;}