.feature-stack {
  display: flex;
  flex-direction: column;
  gap: 15px;
  max-width: 1000px;
  margin: 0 auto;
  padding-top: 30px;
}

.feature-item {
  display: flex;
  align-items: flex-start;
  gap: 25px;
  padding: 5px;
  border-radius: 12px;
}

.feature-item img {
  width: 50px;
  height: 50px;
  flex-shrink: 0;
}

.feature-text h3 {
  margin: 0 0 8px;
    font-size: 24px;
}
.contents { width: calc((100vw - 40%) /2); }
.left .contents { margin-left: auto; }
.right .contents { margin-right: auto; }
.right img.dashboard, .left img.dashboard { border-radius: 12px; margin: auto; max-width: 88%; display: block;}

.screen1 {z-index: 1;width: 75%;top: -20%;border-radius: 12px;right: 2%;height: 308px;object-position: left;}
.screen2 {z-index: 2;width: 75%;bottom: -20%;border-radius: 12px;left: -5%;height: 308px;object-position: left;}
.left > .imag_wrapper .screen1 {top: -20%;right: -2%;}
.left > .imag_wrapper .screen2 {bottom: -20%;left: -2%;}


.ASL_feature { margin: 80px 0;}
.ASL_feature .row { gap: 30px; }
.ASL_feature .row .col { flex: 0 0 calc((100% / 3) - 30px); padding: 0; }
.ASL_feature .feature_box {   text-align: center; border: 1px solid #efefef;padding: 20px; border-radius: 90px; background: linear-gradient(to right, #02B4E4, #c10ad7); background: -webkit-linear-gradient(0deg, #02B4E4, #c10ad7);  color: #fff; }

.ASL_why_it_works .nav-item .nav-link {  color: #000; background: #fff; text-align: center; border: 1px solid #c2c2c2;padding: 15px 30px; border-radius: 90px; margin-right: 30px; }
.ASL_why_it_works .nav-item .nav-link.active { border-color: #fff; color: #fff; background: linear-gradient(to right, #02B4E4, #c10ad7); background: -webkit-linear-gradient(0deg, #02B4E4, #c10ad7); }
.ASL_why_it_works .tab-content {  padding:  20px;  background: #f8f8f8; border-radius: 20px; }
.ASL_why_it_works .tab-content ul li:not(:last-child) {  margin-bottom: 12px; }

.br-40 { border-radius: 40px;}
#counter{
  background: rgba(black, .05);
  width: 90%;
  max-width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
    list-style: none; 
    padding-left: 0;margin: auto;
    margin-top: 30px;
}
#counter li {  flex: 1; text-align: center; font-size: 18px; }
#counter li span {  font-size: 80px; }
#counter span.percent:after {   content: "%";  display: inline-block; }
#counter span.ex:after { content: "x"; display: inline-block; }

.cta-sec {  background-color: #0b0a33; }
.accordion-item {
    border: 0;
    margin-bottom: 25px;
    border-radius: 12px !important;
    box-shadow: 0 0 20px #eeeeee;
    overflow: hidden;
}
.accordion-button { padding: 30px 20px; font-size: 20px;}
.accordion-button:not(.collapsed) {
    box-shadow: none;
    background: #f1fcff; color: #02B4E4; font-weight: 600; padding: 30px 20px 10px;
}
.accordion-collapse {  background: #f1fcff; }
.accordion-button:not(.collapsed) span {
        background: linear-gradient(to right, #02B4E4, #c10ad7);
    background: -webkit-linear-gradient(0deg, #02B4E4, #c10ad7);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
table.table th, table.table tbody td:first-child { background: #f8f8f8;}
table.table th, table.table td { padding: 15px; }

@media (max-width: 768px) {
    h2 br, .right img.dashboard, .left img.dashboard { display: none; }
    .contents { width: 100%; padding: 0 12px; }
    .feature-stack { padding-top: 10px; }
    .feature-item { gap: 15px; }
    .feature-item img { width: 38px; height: 38px; }
    .feature-text h3 { font-size: 18px;}
    .col-md-6.ps-5 {  padding-left: calc(var(--bs-gutter-x) * .5) !important; }
    img.ms-4 { margin-left: 0rem !important; }
    .screen1.position-absolute, .screen2.position-absolute { position: static !important; height: auto; margin: 15px 4% !important; width: 92%; border-radius: 8px; }

    #counter { flex-direction: column; }
    #counter li { font-size: 15px; }
    #counter li span {font-size: 45px;}
    .br-40 {border-radius: 20px; }
    .mt-md-5{margin-top: 40px;}
    .mb-md-5{margin-bottom: 40px;}
    .accordion-button { font-size: 16px; padding: 20px;}
    .ASL_feature  { margin: 50px 0; }
    .ASL_feature .row { gap: 10px; }
    .ASL_feature .row .col { flex: 0 0 90%; margin: auto;}
    .ASL_why_it_works .nav-item .nav-link { margin-right: 12px; padding: 15px 25px; }
    ul#pills-tab { margin-top: 40px; }
}