@import url('https://fonts.googleapis.com/css2?family=Sora:wght@100..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

@font-face{
    src : url('../fonts/mograch.otf');
    font-family:'mograch';
}
@font-face{
  src : url('../fonts/CalSans-SemiBold.ttf');
  font-family:'cal';
}
html{
  overflow-x: hidden;
}
body{
    background: #0B0B0B;
    overflow-x: hidden;
 
}
.btn-top{
  opacity: 0;
}
.navbar{
  background: rgb(96 249 154 / 0%);
  backdrop-filter: blur(6px);
  border: 2px solid rgb(255 255 255 / 8%);
  opacity: 0;
  position: fixed;
  z-index: 2;
  width:100%;
}
label{
  margin-bottom:0;
}
a:focus{
    outline:none;
}
a:hover{
  outline:none;
  text-decoration: none;
  color:white;
}
button:focus{
  outline:none;
}
.navbar-nav{
  border-radius: 23px;
  padding-block: 4px;
}
.navbar-dark .navbar-nav .nav-link{
    font-family: "Sora", sans-serif;
    font-optical-sizing: auto;
    font-weight:400;
    font-size:14px;
    color:#cbcbcb
    
}
.navbar-brand{
  font-weight: 500;
  font-family:'mograch';
  width:147px;
}

.nav-item{
    border-radius: 23px;
    padding-inline: 12px;
    margin-left: 6px !important;
    margin-right: 6px !important;
    
}
.nav-item.active{
  color:white;
}

.hero-bg-wrapper{
    background: url(../img/bg-header.png);
    background-size: 70%;
    background-repeat: no-repeat;
    background-position: top center;
    overflow-y: hidden;
    padding-bottom:20rem;
}


.main-title {
  position: absolute;
  top: 44%;
  left: 45%;
}
.main-title h1 {
  font-size: 48px;
}
.round-arrow{
    padding: -1px;
    padding-inline: 5px;
    border-radius: 50%;
}

.head_hero{
  color:white;
  font-family: 'mograch';
  font-optical-sizing: auto;
  font-size: 75px;
  text-shadow:  0px 0px 40px rgb(0 0 0 / 46%);
  overflow: hidden;
  margin-bottom:3rem !important
}
.head_hero span{
    display: inline-block;
    transform: translateY(100%);
    
}
.head_hero2{
  background: -webkit-linear-gradient(43deg, #a820ff 43%, #3f88ff 68%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-family: 'mograch';
  font-optical-sizing: auto;
  font-size: 75px;
  margin-top: -10px;
  text-shadow:  0px 0px 40px rgb(0 0 0 / 46%);
  overflow: hidden;
}
.head_hero2 span{
  display: inline-block;
  transform: translateY(90%);
  background: -webkit-linear-gradient(43deg, #a820ff 43%, #3f88ff 68%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.para_hero span{
  font-family: 'Poppins';
  display: inline-block;
  transform: translateY(90%);
  font-optical-sizing: auto;
  font-weight: 400;
  font-size:small;
  margin-bottom:3rem;
}
  
  .section-pricing h1{
    color:white;
    font-family:'mograch';
  }
  .section-pricing{
    margin-top:10rem;
  }
  .plans{
    margin-top:2rem
  }

  .pricing-tag{
    display: block;
    background: #07051b;
    box-shadow: inset 0px 0px 11px #753de4;
    padding: 4px 1px;
    width: 146px;
    color: white;
    font-size: 10px;
    border: 2px solid rgb(255 255 255 / 25%);
    border-radius: 32px;
    margin: 0 auto;
    text-transform: uppercase;
    font-family: "Sora", sans-serif;
  }
  .HeroAnnouncement_announcementContainer__hJe_K {
    display: flex;
    justify-content: center;
    padding-top: var(--spacing-3)
  }
  
  
  
  .HeroAnnouncement_announcementOuter__T5qC1 {
    padding: 1px;
    border-radius: 43px;
    transition: all .2s ease;
    transform: translateZ(0);
    width: 290px;
    margin: 0 auto;
    opacity:0
  }
  .HeroAnnouncement_announcementOuter__T5qC1 span{
    margin: 0 auto;
  }
  
  
  .new-bg{
    background: linear-gradient(to right,#06C56D,#177248);
    padding-inline: 14px;
    border-radius: 25px;
    font-size: 11px;
    padding-block: 3px;
    margin-left: 3px;
  }
  .tag-text{
    font-size: 13px;
    margin-top: 2px !important;
   color:white;
  font-family: 'mograch';
  }
  .HeroAnnouncement_announcement__TOQds {
    margin-top:5rem;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 15px;
    height: 30px;
    padding: 4px 0px;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .2px;
    background: #ffffff24;
    border-radius: 1000px;
    text-decoration: none;
    color: white;
    
  }
  
  .HeroAnnouncement_announcement__TOQds .HeroAnnouncement_muted__SLMsc {
    position: relative;
    display: flex;
    flex-wrap: nowrap;
    gap: var(--spacing-0-5);
    color: var(--grey-200);
    white-space: nowrap
  }
  
 
  
  .HeroAnnouncement_announcement__TOQds .HeroAnnouncement_muted__SLMsc>svg {
    width: 16px
  }
.btn-nav {
  font-size: 1em;
    padding: 1.5em 3.5em;
    border-radius: 45px;
    border: none;
    background: linear-gradient(to right, #06C56D, #177248);
    color: #fff;
    cursor: pointer;
    font-family: 'Poppins';
    display:block;
    -webkit-transition: all .15s ease-in-out;
  transition: all .15s ease-in-out;
}
.btn-nav:hover {
  box-shadow: 0 0 10px 0 #3effa5 inset, 0 0 20px 2px #3effa5;
}
@keyframes pulse {
  0% {
    transform: scale(1);
  }
  70% {
    transform: scale(.9);
  }
    100% {
    transform: scale(1);
  }
}
.btn-nav-alt {
  font-size: 1em;
  padding: 0.8em 1.7em;
  border-radius: 45px;
  border: 1.7px solid #4e4e4e;
  box-shadow: inset 0px 0px 18px #ffffff36;
  background: #0000002e;
  color: #fff;
  cursor: pointer;
  font-family: 'Poppins';
  display: block;
}
.btn-features {
  font-size: 1em;
    padding: 1em 2.5em;
    border-radius: 45px;
    color: #fff;
    cursor: pointer;
    font-family: 'Poppins';
    display:block;
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border: none;
    position: relative;
    background: #171717;
    -webkit-transition: all .15s ease-in-out;
  transition: all .15s ease-in-out;
    
}
.btn-features::before {
  content: '';
  display: block;
  position: absolute;
  border-radius: 1000px;
  top: -0.1em;
  bottom: -0.1em;
  right: -0.1em;
  left: -0.1em;
  z-index: -1;
  background: linear-gradient(60deg, #ffffff 0%, #171717 50%);
  
}
.btn-features:hover {
  box-shadow: 0 0 10px 0 #ffffff inset, 0 0 20px 2px #ffffff;
}

.sec-features p{
  font-family: 'Poppins';
  margin-bottom: 5rem;
}
.wcm-main{
  margin-top: 15rem;
    margin-bottom: 8rem;
    padding-top: 7rem;
}
.sec-wcm{
  position: relative;
  
}
.wcm-inner{
  background:#0B0B0B;
  margin-top: -7rem;
}

.sec-wcm .glow-circle{
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: -315px;
  z-index: -1;
}
.feat-wrapper{
    
  background: linear-gradient(180deg, #0E0E0E 45%, #07C471 100%);
    border-radius: 21px;
    padding: 5rem;
    border:1.5px solid #545454
}
.feat-content{
  font-family:'Poppins';
  width: 80%;
  margin:0 auto;
  margin-bottom:4rem;
}
.feat-content-alt{
  font-family:'Poppins';
  width: 60%;
  margin:0 auto;
  margin-bottom:4rem;
  padding-top:5rem;
}
.img-holder{
  border-radius: 21px;
    overflow: hidden;
    margin-bottom: 1rem;
    justify-content: center;
    display: grid;

}
.img-holder img{
  border-radius: 21px;

}
.sec-counters{
    background: url('../img/poly-bg-element.png');
    background-size: 1200px;
    background-repeat: no-repeat;
    background-position: center;
    padding-top: 10rem;
    padding-bottom: 1rem;
    background-position-y: -2rem;
    
}
.sec-counters > div{
  margin-top:7rem;
}
.counter-content{
  font-family: 'Poppins';
}
.counter-content h1{
  font-size:95px;
  font-weight:bold;
}
.discount-tag{
  display: block;
    background: linear-gradient(to right, #06C56D, #177248);
    width: 130px;
    color: white;
    text-align: center;
    border-radius: 23px;
}
.footer-elemnt{
  position: absolute;
  left: 0;
  right: 0;
}
.square-logo{
  padding:2rem;
  background: linear-gradient(to right, #06C56D, #177248);
  border-radius:23px;
  
}
.square-logo img{
  position: absolute;
    width: 500px;
    left: 0;
    margin: 0 auto;
    right: 0;
    top: 8px;
}
.wcm-box{
  border:1px solid #3E3E3E;
  padding:1rem ;
}
.square-logo-wrapper{
  border:1px solid #3E3E3E;
  padding: 3rem;
}
.wcm-head{
  font-family:'mograch';
}
.wcm-p{
  font-family: 'Poppins';
}
.divider{
  margin-top:10rem;
  margin-bottom:10rem;
}
.divider div hr{
  background: #3E3E3E;
}
.discount-tag h6{
  padding-block: 4px;
    text-transform: uppercase;
    white-space: nowrap;
}
.pr-hr{
  background: white;
  opacity: .3;
  width: 70%;
  margin: 0;
  margin-block: 35px;
}
.back-glow{
  position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: -20rem;
}
.footer{
  padding:2rem;
  font-family:'Poppins';
}
.footer-links li{
  color:white;
  margin-left:3rem;
  margin-right:3rem;
  list-style-type: none;
}
#stars {
  width: 1px;
  height: 1px;
  background: transparent;
  box-shadow: 483px 450px #FFF , 1995px 525px #FFF , 755px 1459px #FFF , 610px 1246px #FFF , 764px 1850px #FFF , 1274px 1697px #FFF , 1227px 37px #FFF , 1090px 506px #FFF , 341px 1005px #FFF , 1002px 755px #FFF , 693px 1497px #FFF , 1797px 1626px #FFF , 1838px 793px #FFF , 802px 881px #FFF , 1117px 1983px #FFF , 352px 1465px #FFF , 1526px 852px #FFF , 1559px 526px #FFF , 517px 516px #FFF , 1380px 244px #FFF , 662px 1531px #FFF , 1544px 518px #FFF , 253px 879px #FFF , 774px 1629px #FFF , 752px 994px #FFF , 1129px 726px #FFF , 232px 1050px #FFF , 1766px 290px #FFF , 1976px 842px #FFF , 662px 1535px #FFF , 257px 1016px #FFF , 665px 708px #FFF , 1476px 1772px #FFF , 261px 498px #FFF , 719px 1459px #FFF , 469px 438px #FFF , 994px 474px #FFF , 744px 808px #FFF , 1609px 1741px #FFF , 898px 260px #FFF , 1978px 1436px #FFF , 904px 1244px #FFF , 123px 773px #FFF , 6px 923px #FFF , 1973px 1778px #FFF , 1470px 1861px #FFF , 1037px 156px #FFF , 554px 1905px #FFF , 1508px 849px #FFF , 1213px 1603px #FFF , 87px 1907px #FFF , 492px 527px #FFF , 91px 213px #FFF , 492px 15px #FFF , 1357px 1157px #FFF , 637px 240px #FFF , 1515px 281px #FFF , 1757px 682px #FFF , 1035px 1298px #FFF , 1019px 1233px #FFF , 25px 162px #FFF , 262px 884px #FFF , 1328px 965px #FFF , 984px 879px #FFF , 1213px 689px #FFF , 623px 1091px #FFF , 1227px 422px #FFF , 1977px 1025px #FFF , 620px 474px #FFF , 528px 1525px #FFF;
  animation: animStar 50s linear infinite;
}

#stars:after {
  content: " ";
  position: absolute;
  top: 2000px;
  width: 1px;
  height: 1px;
  background: transparent;
  box-shadow: 483px 450px #FFF , 1995px 525px #FFF , 755px 1459px #FFF , 610px 1246px #FFF , 764px 1850px #FFF , 1274px 1697px #FFF , 1227px 37px #FFF , 1090px 506px #FFF , 341px 1005px #FFF , 1002px 755px #FFF , 693px 1497px #FFF , 1797px 1626px #FFF , 1838px 793px #FFF , 802px 881px #FFF , 1117px 1983px #FFF , 352px 1465px #FFF , 1526px 852px #FFF , 1559px 526px #FFF , 517px 516px #FFF , 1380px 244px #FFF , 662px 1531px #FFF , 1544px 518px #FFF , 253px 879px #FFF , 774px 1629px #FFF , 752px 994px #FFF , 1129px 726px #FFF , 232px 1050px #FFF , 1766px 290px #FFF , 1976px 842px #FFF , 662px 1535px #FFF , 257px 1016px #FFF , 665px 708px #FFF , 1476px 1772px #FFF , 261px 498px #FFF , 719px 1459px #FFF , 469px 438px #FFF , 994px 474px #FFF , 744px 808px #FFF , 1609px 1741px #FFF , 898px 260px #FFF , 1978px 1436px #FFF , 904px 1244px #FFF , 123px 773px #FFF , 6px 923px #FFF , 1973px 1778px #FFF , 1470px 1861px #FFF , 1037px 156px #FFF , 554px 1905px #FFF , 1508px 849px #FFF , 1213px 1603px #FFF , 87px 1907px #FFF , 492px 527px #FFF , 91px 213px #FFF , 492px 15px #FFF , 1357px 1157px #FFF , 637px 240px #FFF , 1515px 281px #FFF , 1757px 682px #FFF , 1035px 1298px #FFF , 1019px 1233px #FFF , 25px 162px #FFF , 262px 884px #FFF , 1328px 965px #FFF , 984px 879px #FFF , 1213px 689px #FFF , 623px 1091px #FFF , 1227px 422px #FFF , 1977px 1025px #FFF , 620px 474px #FFF , 528px 1525px #FFF;
}

#stars2 {
  width: 2px;
  height: 2px;
  background: transparent;
  box-shadow: 1585px 315px #FFF , 1750px 858px #FFF , 502px 1184px #FFF , 1482px 150px #FFF , 870px 93px #FFF , 1401px 1976px #FFF , 494px 1549px #FFF , 1607px 1894px #FFF , 1029px 1466px #FFF , 1931px 1390px #FFF , 819px 1431px #FFF , 521px 1062px #FFF , 1754px 574px #FFF , 577px 943px #FFF , 850px 1377px #FFF , 445px 1835px #FFF , 1658px 1675px #FFF , 521px 1144px #FFF , 560px 1624px #FFF , 1329px 1778px #FFF;
  animation: animStar 100s linear infinite;
}
#stars2:after {
  content: " ";
  position: absolute;
  top: 2000px;
  width: 2px;
  height: 2px;
  background: transparent;
  box-shadow: 1585px 315px #FFF , 1750px 858px #FFF , 502px 1184px #FFF , 1482px 150px #FFF , 870px 93px #FFF , 1401px 1976px #FFF , 494px 1549px #FFF , 1607px 1894px #FFF , 1029px 1466px #FFF , 1931px 1390px #FFF , 819px 1431px #FFF , 521px 1062px #FFF , 1754px 574px #FFF , 577px 943px #FFF , 850px 1377px #FFF , 445px 1835px #FFF , 1658px 1675px #FFF , 521px 1144px #FFF , 560px 1624px #FFF , 1329px 1778px #FFF;
}

#stars3 {
  width: 3px;
  height: 3px;
  background: transparent;
  box-shadow: 91px 409px #FFF , 1886px 728px #FFF , 1294px 970px #FFF , 720px 1215px #FFF , 796px 1431px #FFF , 834px 1217px #FFF , 1926px 1164px #FFF , 1803px 310px #FFF , 1532px 1421px #FFF , 1680px 232px #FFF;
  animation: animStar 150s linear infinite;
}
#stars3:after {
  content: " ";
  position: absolute;
  top: 2000px;
  width: 3px;
  height: 3px;
  background: transparent;
  box-shadow: 91px 409px #FFF , 1886px 728px #FFF , 1294px 970px #FFF , 720px 1215px #FFF , 796px 1431px #FFF , 834px 1217px #FFF , 1926px 1164px #FFF , 1803px 310px #FFF , 1532px 1421px #FFF , 1680px 232px #FFF;
}


@keyframes animStar {
  from {
    transform: translateY(0px);
  }
  to {
    transform: translateY(-2000px);
  }
}
@-webkit-keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-250px * 7));
  }
}

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-250px * 7));
  }
}
.slider {
  background: transparent;
  height: 100px;
  margin: auto;
  overflow: hidden;
  position: relative;
  width: 960px;
  mask-image:linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 22.5%, rgb(0, 0, 0) 77.5%, rgba(0, 0, 0, 0) 100%) ;
  margin-top:10rem;
}
.slider::before, .slider::after {
  background: linear-gradient(to right, transparent 0%, rgba(255, 255, 255, 0) 100%);
  content: "";
  height: 100px;
  position: absolute;
  width: 200px;
  z-index: 2;
}
.slider::after {
  right: 0;
  top: 0;
  transform: rotateZ(180deg);
}
.slider::before {
  left: 0;
  top: 0;
}
.slider .slide-track {
  -webkit-animation: scroll 40s linear infinite;
          animation: scroll 40s linear infinite;
  display: flex;
  width: calc(250px * 14);
  align-items: center;
  gap:90px
}
.slider .slide {
  width: 250px;
}
.section-hiw{
  margin-top:10rem;
}
p{
  font-family: 'Poppins';
}
.hiw_head{
  font-family: 'mograch';
  font-size:50px;
  
}

.hiw_p{
  font-family: 'mograch';
  font-size:20px;
  width: 80%;
  color: #a394be;
  margin-bottom:3rem;
}
.hiw_ul{
  list-style-type: none;
  padding: 0;
  margin-bottom:4rem;
}
.hiw_ul li{
  font-family: 'mograch';
  color:white;
  margin-bottom:1rem;
  font-size:20px
}
.hiw_ul li svg{
  margin-right:5px
}
.grad_highlight{
  background: -webkit-linear-gradient(43deg, #a820ff 43%, #3f88ff 68%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.section-hiw .hiw_parent{
  background-image: radial-gradient(46.99% 43.05% at 2.58% 100%, rgb(46 48 56 / 0%) 0, transparent 100%), radial-gradient(55.18% 55.16% at 12.42% -3.42%, rgb(44 31 66) 0, #110c1a 100%);
  border-radius: 23px;
  padding-inline:3rem;
  padding-block:3rem
}
.section-hiw-badge {
  background: rgba(255, 255, 255, .04);
  border: 1px solid rgba(255, 255, 255, .04);
  border-radius: 999px;
  padding: 4px 14px;
  width: -moz-max-content;
  width: max-content;
  color:white;
  text-transform: uppercase;
  font-size:small;
  margin-bottom:1rem;
}
.section-hiw .hiw_parent::before{
  border-radius: 23px;
  content: '';
  background-image: linear-gradient(129deg, #8e50ff 0%, #110c1a 15%);
  top: -1px;
  left: -1px;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;
}
.box {
  box-sizing: border-box;
  border: 14px solid transparent;
  background-clip: padding-box !important;
}
.linear-border{
  background: linear-gradient(215deg, #3f88ff, #3f88ff40 8% 18%, #7f7f7f00 46%, #b400ff33 89%, #7f7f7f1a);
  
}
.linear-border2{
  background: linear-gradient(215deg, #191227, #191227 8% 18%, #191227 46%, #191227 89%, #191227);
  
}
.card {
  width: 100%;
  height: auto;
  background:transparent;
  overflow: hidden;
  border: 0;
  border-radius:0;
}
.cardhead{
  font-family:'mograch';
  color:#fff;
}
.cardhead2{
  font-family:'mograch';
  color:#fff;
  font-size:25px
}
.choosepara{
  font-family:'mograch';
  color:#fff;
}
.inner-wrapper{
  background: rgb(25 18 39);
  padding: 2rem;
  border-radius: 16px;
}
.card:hover::before {
  opacity: 1;
}

.card::before,
.card::after {
  border-radius: inherit;
  content: "";
  height: 100%;
  left: 0px;
  opacity: 0;
  position: absolute;
  top: 0px;
  transition: opacity 500ms;
  width: 100%;
}

.card::before {
  background: radial-gradient(
    800px circle at var(--mouse-x) var(--mouse-y), 
    rgba(255, 255, 255, 0.06),
    transparent 40%
  );
  z-index: 3;
}

.card::after {  
  background: radial-gradient(
    600px circle at var(--mouse-x) var(--mouse-y), 
    rgba(255, 255, 255, 0.4),
    transparent 40%
  );
  z-index: 1;
}
.indus-row{
  gap:16px;
}
.section-industries{
  margin-bottom:10rem
}
.logo-box{
  background: linear-gradient(180deg, rgba(243, 244, 251, .08) 0%, rgba(243, 244, 251, .02) 100%);
    border-radius: 20px;
    display: flex;
    flex: none;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 16px;
    height: min-content;
    justify-content: flex-start;
    overflow: hidden;
    padding: 76px 28px;
    position: relative;
    width: 251px;
}

:root {
  --color-text: navy;
  --color-bg: papayawhip;
  --color-bg-accent: #181125;
  --size: clamp(10rem, 1rem + 40vmin, 30rem);
  --gap: calc(var(--size) / 14);
  --duration: 60s;
  --scroll-start: 0;
  --scroll-end: calc(-100% - var(--gap));
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-text: papayawhip;
    --color-bg: navy;
    --color-bg-accent: #181125;
  }
}



.marquee {
  display: flex;
  overflow: hidden;
  user-select: none;
  gap: var(--gap);
  mask-image: linear-gradient(
    var(--mask-direction, to right),
    hsl(0 0% 0% / 0),
    hsl(0 0% 0% / 1) 20%,
    hsl(0 0% 0% / 1) 80%,
    hsl(0 0% 0% / 0)
  );
}

.marquee__group {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: var(--gap);
  min-width: 100%;
  animation: scroll-x var(--duration) linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  .marquee__group {
    animation-play-state: paused;
  }
}

.marquee--vertical {
  --mask-direction: to bottom;
}

.marquee--vertical,
.marquee--vertical .marquee__group {
  flex-direction: column;
}

.marquee--vertical .marquee__group {
  animation-name: scroll-y;
}

.marquee--reverse .marquee__group {
  animation-direction: reverse;
  animation-delay: -3s;
}

@keyframes scroll-x {
  from {
    transform: translateX(var(--scroll-start));
  }
  to {
    transform: translateX(var(--scroll-end));
  }
}


/* Element styles */
.marquee .test-card {
  display: grid;
  width: var(--size);
  fill: var(--color-text);
  background: var(--color-bg-accent);
  aspect-ratio: 16/9;
  padding: calc(var(--size) / 15);
  border-radius: 0.5rem;
  border:1px solid #372754;
}

.marquee--vertical svg {
  aspect-ratio: 1;
  width: calc(var(--size) / 1.5);
  padding: calc(var(--size) / 6);
}
.test-card svg{
  position: relative;
  width: 142px;
  height: 29px;
}
/* Parent wrapper */
.wrapper {
  display: flex;
  flex-direction: column;
  gap: var(--gap);
  margin: auto;
  max-width: 100vw;
}



@keyframes fade {
  to {
    opacity: 0;
    visibility: hidden;
  }
}
.pricing-card{
  background: #0B0B0B;
  padding-inline: 4rem;
  padding-block: 2rem;
  border-radius: 29px;
  border: 1px solid #07C471;
}
.message{
  background: #0B0B0B;
  padding-inline: 10px;
  padding-block: 7px;
    border-radius: 29px;
    border: 1px solid #07C471;
}
.message i{
  color:#07C471;
  font-size:35px;
}
.message h5{
  font-size:25px;
  font-weight:400;
  margin-bottom: 3px;
  font-family: 'Poppins';

}
.message h5 span{
  vertical-align: text-top;
  font-size: 20px;
}
.pricing-features h5{
  margin-bottom:1.7rem;
  font-weight: 400;
  font-family: 'Poppins';
}
.pricing-features h5 i{
  color: #06C56D
}
.avatar {
  width: 100px;
  height: 100px;
  background: linear-gradient(359deg, #191126 50%, #352553);
  border-radius: 50%;
  justify-content: center;
  display: flex;
  align-items: center;
  font-size: 50px;
  border: 2px solid #432f68;
}
.icon-holder {
  width: 70px;
    height: 70px;
    background: linear-gradient(359deg, #191126 50%, #352553);
    border-radius: 50%;
    justify-content: center;
    display: flex;
    align-items: center;
    margin: 0;
    font-size: 50px;
    border: 2px solid #432f68;
}
.icon-holder i{
  font-size:30px
}
.pricing-card p{
  font-family:'Poppins';
}
.pricing-card h1{
  font-family:'mograch';
  font-size:60px;
}
.pricing-card h4{
  font-family:'mograch';
}
.features-text h5{
  font-family:'mograch';
  font-size:20px
}
.features-text h6{
  font-family:'mograch';
  font-size:18px;
  color:#9378c6 
}
/* From Uiverse.io by MuhammadHasann */ 
.button_pricing {
  --black-700: hsl(261deg 65.73% 38.86%);
  --border_radius: 9999px;
  --transtion: 0.3s ease-in-out;
  --offset: 2px;

  cursor: pointer;
  position: relative;

  display: flex;
  align-items: center;
  gap: 0.5rem;

  transform-origin: center;

  padding: 1rem 2rem;
  background-color: transparent;

  border: none;
  border-radius: var(--border_radius);
  transform: scale(calc(1 + (var(--active, 0) * 0.1)));

  transition: transform var(--transtion);
}
.button_pricing:focus{
  outline:none;
}
.button_pricing::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: 100%;
  height: 100%;
  background-color: var(--black-700);

  border-radius: var(--border_radius);

  transition: all var(--transtion);
  z-index: 0;
}

.button_pricing::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: 100%;
  height: 100%;

  background-position: top;

  opacity: var(--active, 0);
  border-radius: var(--border_radius);
  transition: opacity var(--transtion);
  z-index: 2;
}

.button_pricing:is(:hover, :focus-visible) {
  --active: 1;
}
.button_pricing:active {
  transform: scale(1);
}

.button_pricing .dots_border {
  --size_border: calc(100% + 2px);

  overflow: hidden;

  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: var(--size_border);
  height: var(--size_border);
  background-color: transparent;

  border-radius: var(--border_radius);
  z-index: -10;
}

.button_pricing .dots_border::before {
  content: "";
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translate(-50%, -50%);
  transform-origin: left;
  transform: rotate(0deg);

  width: 100%;
  height: 2rem;
  background-color: white;

  mask: linear-gradient(transparent 0%, white 120%);
  animation: rotate 2s linear infinite;
}

@keyframes rotate {
  to {
    transform: rotate(360deg);
  }
}

.button_pricing .sparkle {
  position: relative;
  z-index: 10;

  width: 1.75rem;
}

.button_pricing .sparkle .path {
  fill: currentColor;
  stroke: currentColor;

  transform-origin: center;

  color: hsl(0, 0%, 100%);
}

.button_pricing:is(:hover, :focus) .sparkle .path {
  animation: path 1.5s linear 0.5s infinite;
}

.button_pricing .sparkle .path:nth-child(1) {
  --scale_path_1: 1.2;
}
.button_pricing .sparkle .path:nth-child(2) {
  --scale_path_2: 1.2;
}
.button_pricing .sparkle .path:nth-child(3) {
  --scale_path_3: 1.2;
}

@keyframes path {
  0%,
  34%,
  71%,
  100% {
    transform: scale(1);
  }
  17% {
    transform: scale(var(--scale_path_1, 1));
  }
  49% {
    transform: scale(var(--scale_path_2, 1));
  }
  83% {
    transform: scale(var(--scale_path_3, 1));
  }
}

.button_pricing .text_button {
  position: relative;
  z-index: 10;

  background-image: linear-gradient(
    90deg,
    hsla(0 0% 100% / 1) 0%,
    hsla(0 0% 100% / var(--active, 0)) 120%
  );
  background-clip: text;

  font-size: 1rem;
  color: transparent;
}
.plan-tag{
  font-size: 15px;
    background: #37255a;
    border: 2px solid #7e3aff;
    padding-inline: 17px;
    padding-block: 5px;
    border-radius: 23px;
    vertical-align: middle;
}
.pro{
  border: 2px solid #702bed;
}
.avatar i{
  font-size:40px;
}
/* From Uiverse.io by iZOXVL */ 
.boton-elegante {
  padding: 15px 30px;
  border: 2px solid #2c2c2c;
  background: linear-gradient(360deg, #110c1a 70%, #6c49ab);
  color: #ffffff;
  font-size: 1.2rem;
  cursor: pointer;
  border-radius: 30px;
  transition: all 0.4s ease;
  outline: none;
  position: relative;
  overflow: hidden;
  font-weight: bold;
}

.boton-elegante::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: radial-gradient(
    circle,
    #6b49ab68 0%,
    #110c1a54 70%
  );
  transform: scale(0);
  transition: transform 0.5s ease;
}

.boton-elegante:hover::after {
  transform: scale(4);
}

.boton-elegante:hover {
  border-color: #666666;
  background: #292929;
}
.accordion .item {
  border: none;
  margin-bottom: 20px;
  color: #6c43b6;
  border-radius: 10px;
  border: 1px solid;
  border-radius: 10px;
overflow: hidden;
  
}
.t-p{
  background: #211136;
color: #fff;
opacity: 1;
padding: 0px 30px 20px 30px;
font-family: "Sora", sans-serif;
font-size: 13px;
}
.accordion .item .item-header h2 button.btn.btn-link {
  background: #211136;
  color: #fff;
  border-radius: 0px;
  font-family: "Sora", sans-serif;
  font-size: 15px;
  line-height: 2.5;
  text-decoration: none;

}
.accordion .item .item-header h2 button.btn.btn-link span {
  line-height:3px;
  border-bottom: 2px solid white;
}


.accordion .item .item-header {
  border-bottom: none;
  background: transparent;
  padding: 0px;
  color: black;

}

.accordion .item .item-header h2 button {
  color: white;
  font-size: 20px;
  padding: 15px;
  display: block;
  width: 100%;
  text-align: left;
}

.accordion .item .item-header h2 i {
  float: right;
  font-size: 15px;
  color: #fff;
  width: 60px;
  height: 40px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
}
.curve{
  width: 100%;
  height: 200px;
  position: relative;
  overflow: hidden;
}

.curve:after {
  content: "";
  position: absolute;
  width: 100%;
  bottom: -10%;
  height: 50%;
  background-color: transparent;
  border-top-left-radius: 50%;
  border-top-right-radius: 50%;
  border-top: 4px solid #720ef7;
  box-shadow: 0px 0px 40px #720ef7;
}
.button-curve {
  position: relative;
  transition: all 0.3s ease-in-out;
  padding-block: 0.5rem;
  padding-inline: 2.25rem;
  background: -webkit-linear-gradient(43deg, #a820ff 43%, #3f88ff 68%);
  border-radius: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #ffff;
  gap: 10px;
  font-weight: 500;
  outline: none;
  overflow: hidden;
  font-size: 15px;
  border: 0;
  font-family: "Sora", sans-serif;
  white-space: nowrap;
  margin: 0 auto;
    margin-top: 6rem;
    z-index: 1;
    padding-block: 0.8rem;
    border-radius: 30px;
    font-size: 20px;
}

.icon {
  width: 24px;
  height: 24px;
  transition: all 0.3s ease-in-out;
}

.button-curve:hover {
  transform: scale(1.05);
}

.button-curve:hover .icon {
  transform: translate(4px);
}

.button-curve:hover::before {
  animation: shine 1.5s ease-out infinite;
}

.button-curve::before {
  content: "";
  position: absolute;
  width: 100px;
  height: 100%;
  background-image: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0) 30%,
    rgba(255, 255, 255, 0.8),
    rgba(255, 255, 255, 0) 70%
  );
  top: 0;
  left: -100px;
  opacity: 0.6;
}

@keyframes shine {
  0% {
    left: -100px;
  }

  60% {
    left: 100%;
  }

  to {
    left: 100%;
  }
}

.reveal {
  opacity: 0;
  transform: translate3d(0, 100px, 0);
  transition: opacity 0.8s, transform 0.8s;
}
.reveal_visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}