html {
  -webkit-text-size-adjust: auto !important;
}


html, body {
  overflow-x: hidden;
}

* {
  box-sizing: border-box;
}

.font-ooredoo{
  font-family: "Ooredoo-Heavy", "Arial";
}

p {
  margin-bottom: 0px;
}

.header-tittle {
  margin-bottom: 0px;
}

.text-section-intro {
  text-align: center;
  font-size: 24px;
  margin-bottom: 2rem !important;
  font-family: 'Noto Sans', sans-serif;
}

.text-gradient-purple {
  background: linear-gradient(45deg, #ED1C24, #7D83F7);
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

.bg-gradient-basic {
  background: rgb(237, 28, 36);
  background: linear-gradient(36deg, rgba(237, 28, 36, 1) 0%, rgba(255, 203, 5, 1) 100%);
  padding: 0px;
  border-radius: 12px;
}

.bg-gradient-primary {
  border-radius: 12px;
  border-bottom-right-radius: 0px;
  background: rgb(255, 255, 255);
  background: linear-gradient(156deg, rgba(255, 255, 255, 1) 14%, rgba(255, 250, 230, 1) 44%, rgba(255, 220, 221, 1) 100%);
}
.ornament-1{
  right: 19rem; top: 3rem
}
.ornament-2{
  left: 12rem; top: 7rem
}
.ornament-3{
  top: 11rem; right: 7rem
}
.ornament-4{
  bottom: 0;left: 45%;
}
.ornament-5{
  top: 27rem; left: 1rem
}
.ornament-6{
  left: 2rem; top: 14rem
}
.ornament-7{
  top: 34rem; right: 9rem
}
#section_intro {
  padding: 150px 0px 150px 0px !important;
}

.container-section-buy-now {
  background-image: 'https://myim3banner.kloc.co/assets/uploads/section_5_1740933948.png';
  height: 50rem;
  background-color: #cccccc;

}

.ornament {
  background: rgb(237, 28, 36);
  background: radial-gradient(circle, rgba(237, 28, 36, 0.19931722689075626) 0%, rgba(232, 232, 232, 0) 42%);
}

.font-family-ooredoo {
  font-family: "Ooredoo-Heavy", sans-serif !important;
}

.ornament-green {
  background: rgb(50, 188, 173);
  background: radial-gradient(circle, rgba(50, 188, 173, 0.45702030812324934) 0%, rgba(232, 232, 232, 0) 63%);
}

.ornament-yellow {
  background: rgb(255, 213, 0);
  background: radial-gradient(circle, rgba(255, 213, 0, 0.365983893557423) 0%, rgba(232, 232, 232, 0) 38%);
}

.container-head-benefit {
  margin-top: 6rem;
}

.container-feature-benefit {
  margin-top: -129px;
}

.text-feature-benefit {
  font-size: 24px;
  padding: 22px;
  line-height: 31px;
}

.container-card-benefit{
  background: white;
  border-radius: 14px;
  padding: 0px;
  display: grid;
  align-content: space-between;
  height: 24rem;
}
.img-cta{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.container-buy-now{
  padding: 56px 26px;
}
.img-bg-buy{
  width: 100%;inset: 0;
}
.bg-img-container{
  background-color: rgba(255, 255, 255, 0.5);
  z-index: 100;
  position: absolute;
  border-radius: 26px;
  top: 148px;
  right: 0;
  left: 0;
}
.text-desc-buy{
  font-size: 20px;
}
.btn-buy{
  text-transform: none;
  width: fit-content;
}

.ornament{
    position: absolute;
    height: 50rem;
    left: -14rem;
    z-index: 84;
    width: 50rem;
    top: 33rem;
}
.ornament-yellow{
    position: absolute;
    height: 50rem;
    right: 12rem;
    z-index: 84;
    width: 50rem;
    top: 14rem;
}

.ornament-green{
    position: absolute;
    height: 50rem;
    right: -11rem;
    z-index: 84;
    width: 50rem;
    top: 31rem;
}

.modal-header{
  padding: 0px;
}

.comp-benefit .sub-title{
  font-family: "Ooredoo-Heavy", "Arial";
    font-size: 14px;
    color: #898989;
    margin-bottom: 6px;
}
.comp-benefit ul {
  padding: 0px;
}
.comp-benefit ul li{
  font-size: 14px;
  border-bottom: #F9F9F9 1px solid;
  margin: 6px 0px;
  padding-bottom: 4px;
}
.comp-price .sub-title{
  font-family: "Ooredoo-Heavy", "Arial";
    font-size: 14px;
    color: #898989;
}

.comp-price .text-price{
    font-size: 24px;
    color: #ED1C24;
}


.comp-notes {
  background-color: #f9f9f9;
  border-radius: 5px;
  padding: 8px;
}

.comp-notes ul li {
  font-size: 12px;
  padding-bottom: 4px;
  list-style-type: disc;
}

.comp-notes ul  {
  padding-left: 24px;
  margin-top: 2px;
  margin-bottom: 0px !important;
}
.comp-notes .text-notes{
  font-family: "Ooredoo-Heavy", sans-serif !important;
  font-size: 12px;
}
.btn-arrow-red{
  background : #ED1C24;
  height: min-content;
  padding: 4px;
  border-radius: 50px;
  margin-left:4px ;
}
.comp-summary .text-desc .sub-title{
  color: #898989;
  font-size: 12px;
}
.comp-summary .text-desc .title{
  font-size: 12px;
  font-family: "Ooredoo-Heavy", sans-serif;
  
}
.comp-summary .text-desc .title span{
  color: #ED1C24;
  
}
.comp-summary {
  background-color: #f9f9f9;
  margin-top: 24px;
  padding: 10px 0px;
  border-radius: 15px;
  border: #ED1C24 1px solid;
}

.button-buy{
    width: 100%;
    background: #ED1C24;
    outline: none;
    border: none;
    border-radius: 20px;
    color: white;
    padding: 8px;
}
.package-close{
  background-color: white !important;
  border-radius: 25px;
}
@media (max-width: 767px) {
  .ornament-1, .ornament-2, .ornament-3, .ornament-4, .ornament-5, .ornament-6, .ornament-7 {
    display: none;
  }

  .btn-buy{
    text-transform: none;
    width: 100%;
  }
  .text-desc-buy{
    font-size: 16px;
  }
  .text-section-intro {
    font-size: 16px;
    font-family: 'Noto Sans', sans-serif;
  }
  .bg-img-container{
    background: none !important;
    top: 90px !important;
   
  }
  .img-bg-buy{
    width: 100%;inset: 0;
    height: 45rem;
    object-fit: cover;
  }
  .img-cta{
    position: relative;
    top: auto;
    transform: none;
  }
  .container-buy-now{
    padding: 0;
  }
  .container-card-benefit{
    height: 18rem;
  }


  .container-head-benefit {
    margin-top: 0rem;
  }
  .text-feature-benefit {
    font-size: 16px;
    line-height: 21px;
  }

  .container-feature-benefit {
    margin-top: -60px;
  }

  .text-section-intro p {
    margin-bottom: 10px;
  }

  .header-tittle {
    text-align: center !important;
    font-size: 20px;
  }

  .heading_container h3 {
    font-size: 16px !important;
  }

  #section_intro {
    padding: 24px 0px 24px 0px !important;
  }

  h5 {
    font-size: 16px !important;
  }

  h1 {
    font-size: 24px !important;
  }


}