.hero-wrap {
    background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/res-banner-bk.jpg/public");
    background-repeat: no-repeat;
    background-size: cover;
    padding: 60px 0 0px;
    border-radius: 0 0 70px 70px;
}
.container
{
         max-width: 1150px;
         margin: 0 auto;
}
.tp-3d-icon-wrapper {
    display: none;
}
.video-colg video {
    width: 100%;
}
span.span-titlenew {
  background: #00ad4f;
  color: #fff;
  padding: 10px 20px;
  display: inline-block;
  border-radius: 4px;
  font-size: 23px;
  margin: 15px 0 0;
}
.paypal-wrap h1 {
  color: #fff;
  font-size: 35px;
  max-width: 900px;
  margin: 0 auto 14px;
  font-weight: 700;
}
.proof-grid-images img {
    width: 100%;
}
p.real-tok {
  color: #fff;
  font-size: 19px;
  padding: 0 30px;
}
p.real-tok span
{
  color: #ff1f8c;
  font-weight: 700;
}
span.main-tok-ai {
  width: auto;
  color: #ff1f8c;
  font-size: 60px;
  border: 2px solid;
  margin: 0 auto 20px;
  display: table;
  padding: 8px 30px;
  border-radius: 12px;
}
section.launch-timeline h1 {
  text-align: center;
  color: #6d44ff;
}
section.prelaunc-lead {
  background: rgb(135,86,255);
  background: -moz-linear-gradient(45deg, rgba(135,86,255,1) 0%, rgba(112,52,255,1) 100%);
  background: -webkit-linear-gradient(45deg, rgba(135,86,255,1) 0%,rgba(112,52,255,1) 100%);
  background: linear-gradient(45deg, rgba(135,86,255,1) 0%,rgba(112,52,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8756ff', endColorstr='#7034ff',GradientType=1 );
  padding: 60px 0;
}
section.launch-timeline h6 {
  text-align: center;
  font-size: 18px;
}
.arrow {
  text-align: center;
}
.bounce {
  -moz-animation: bounce 2s infinite;
  -webkit-animation: bounce 2s infinite;
  animation: bounce 2s infinite;
}
img.arrow.bounce {
    position: relative;
    top: 30px;
}
.tp-showcase__image video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 15px;
}
.tp-showcase__image {
    margin-bottom: 16px;
}
.down-arrow span {
    text-align: center;
    width: 100%;
    display: table;
}

.paypal-wrap {
    background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/res-pink-bg.jpg/public");
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 50px;
    padding: 35px 20px;
    background-position: center bottom;

}
.mf-demo-play video, .imgf-demo-play video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
section.paypal-btn.section-wrap {
    padding: 50px 0;
}
.reality-wrap {
    background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/res-pink-bg.jpg/public");
    background-repeat: no-repeat;
    background-size: cover;
}
span#mfDemoPlaceholder {
    display: none;
}
.launch-speed {
    text-align: center;
    width: 100%;
    padding: 29px 0 0;
}

.launch-speed p {
    font-size: 24px;
    text-align: center;
}
.tp-footer-row a {
    margin: 0 auto;
}

.oto-cards {
    text-align: center;
    width: 100%;
}
.oto-cards p.pay-down {
    font-size: 22px;
    margin: 19px 0 31px;
}
span.use-code {
    width: 100%;
    display: table;
    text-align: center;
    font-size: 20px;
    margin: 18px 0 7px;
}
.dx-capsule-shimmer {
    pointer-events: none;
    position: absolute;
    top: -60%;
    left: -40%;
    width: 60%;
    height: 220%;
    background: linear-gradient(
      120deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0.8) 45%,
      rgba(255, 255, 255, 0) 90%
    );
    transform: translateX(-130%) skewX(-18deg);
    opacity: 0;
    mix-blend-mode: screen;
    animation: dxCapsuleSweep 9s ease-in-out infinite;
}
.grad-bk {
    position: relative;
    max-width: 980px;
    padding: 18px 26px;
    border-radius: 999px;
    background: radial-gradient(circle at top left, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.85));
    border: 1px solid rgba(252, 211, 77, 0.9);
    box-shadow: 0 0 0 2px rgba(253, 224, 71, 0.2),
      0 18px 55px rgba(15, 23, 42, 0.9),
      inset 0 1px 0 rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(20px);
    overflow: hidden;
    transition: transform 0.35s ease, box-shadow 0.35s ease;
    margin: 0 auto 16px;
}
.dx-glow-separator {
    width: 260px;
    height: 4px;
    border-radius: 999px;
    margin: 20px auto 32px;
    background: radial-gradient(circle, #ec4899 0%, #3b82f6 35%, transparent 70%);
    box-shadow: 0 0 18px rgba(227, 21, 250, 0.95),
      0 0 40px rgba(183, 36, 251, 0.75);
    opacity: 0.98;
}

a.cta-button-main span:nth-child(1) {
    top: 0;
    left: 0;
    width: 100%;
    height: 10px;
    background: linear-gradient(90deg, transparent, #d09500);
    animation: animate1 1s linear infinite;
       position: absolute;
    display: block;
}

a.cta-button-main span:nth-child(2) {
    top: -100%;
    right: 0;
    width: 10px;
    height: 100%;
    background: linear-gradient(180deg, transparent, #d09500);
    animation: animate2 1s linear infinite;
    animation-delay: 0.25s;
       position: absolute;
    display: block;
}
a.cta-button-main span:nth-child(3) {
    bottom: 0;
    right: 0;
    width: 100%;
    height: 10px;
    background: linear-gradient(270deg, transparent, #ffbd17);
    animation: animate3 1s linear infinite;
       position: absolute;
    display: block;
    animation-delay: 0.5s;
}.down-arrow.oposit-error {
    margin-top: -50px;
}
section.tp-showcase .grad-bk {
    margin-top: 30px;
    margin-bottom: 30px;
}
.image-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 16px;
}
.tiktok-attention__headline span {
    color: #00baff;
    border: 2px solid;
    padding: 4px 20px;
    border-radius: 10px;
    display: inline-block;
    position: relative;
    top: 10px;
    font-size: 32px;
}
.video-colg {
    position: relative;
}
.video-colg img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    transform: translateY(-50%);
}
a.cta-button-main span:nth-child(4) {
    bottom: -100%;
    left: 0;
    width: 10px;
    height: 100%;
    background: linear-gradient(360deg, transparent, #ffbd17);
    animation: animate4 1s linear infinite;
    animation-delay: 0.75s;
       position: absolute;
    display: block;
}

section.prelaunc-lead h2 {
  text-align: center;
  color: #fff;
  font-size: 60px;
  text-shadow: 1px 1px 1px #000;
  font-weight: 800;
}
section#prizes h2 span {
  color: #FEDC01;
}
.launch-date {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 30px 0 33px;
}
.launch-date h5 {
  background: #300560;
  color: #fff;
  font-size: 29px;
  text-transform: uppercase;
  padding: 8px 20px;
  border-radius: 10px;
  display: flex;
  align-items: center;
}
.launch-date h5 img {
  margin-right: 11px;
}
.launch-date h5 img:last-child {
  margin-left: 23px;
}
.launch-date span {
  color: #fff;
  font-size: 27px;
  background: transparent;
  border-radius: 100px;
  width: 54px;
  height: 54px;
  margin: 0 19px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 10px 1px #dddddd4f;
  padding-top: 6px;
}
.prelaunc-lead-left ul li {
  list-style: none;
  background: #fff;
  margin-bottom: 24px;
  border-radius: 10px;
  overflow: hidden;
  padding: 14px 22px;
  display: flex;
  align-items: center;
}
.prelaunc-lead-left ul li h5 {
  font-size: 38px;
  margin: 10px 110px 0 41px;
  color: #20253D;
  min-width: 234px;
}
.prelaunc-lead-left ul li span {
  font-size: 38px;
  margin: 11px 0 0;
  background: -webkit-linear-gradient(#b190ff, #7034FF);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 700;
}
.prelaunc-lead-right {
  background: #fff;
  padding: 30px 30px 8px;
  border-radius: 8px;
}
.prelaunc-lead-right h4 {
  text-align: center;
  font-size: 36px;
}
section.prelaunc-lead .prelaunc-lead-right p {
  color: #20253D;
  font-size: 18px;
  line-height: 27px;
  text-align: left;
  margin-bottom: 23px;
}
section.launch-cup {
  padding: 50px 0 50px;
  position: relative;
  background-image: url(../images/trofy-bk.png);
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: cover;
}
section.launch-cup h2 {
  color: #003957;
  font-size: 75px;
  text-align: center;
  margin: 0 auto 55px;
  display: table;
  position: relative;
}
.launc-des {
  padding-bottom: 20px;
}
.launc-des {
  text-align: center;
}
.launc-des h3 {
  font-size: 46px;
  color: #3518B4;
  font-weight: 600;
}
  .launc-des p {
    font-size: 24px;
    line-height: 32px;
    text-transform: uppercase;
    padding: 0 100px;
}
.launc-des-cup ul {
  padding: 0;
}
section.launch-cup h2::before {
  content: "";
  width: 100%;
  height: 9px;
  border-radius: 10px;
  background: #FF5050;
  position: absolute;
  bottom: 0;
}
.launc-des-cup ul li {
  list-style: none;
  background: #fff;
  background: -moz-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,251,238,1) 100%);
  background: -webkit-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,251,238,1) 100%);
  background: linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(255,251,238,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff',endColorstr='#fffbee',GradientType=0 );
  border: 3px solid #fec301;
  border-radius: 10px;
  margin-bottom: 31px;
  box-shadow: 3px 4px 1px 1px #fec301;
  display: flex;
  padding: 15px 0;
  align-items: center;
}
.launc-des-cup ul li img {
  max-width: 79px;
}
.launc-des-cup li h4 {
  color: #2C3C47;
  font-size: 38px;
  margin: 6px 0 0;
  padding-left: 23px;
  min-width: 310px;
}
.launc-des-cup ul li:first-child img {
  max-width: 123px;
  position: relative;
  margin-top: -55px;
  left: -16px;
}
.launc-des-cup li:first-child h4 {
  padding: 0;
  margin-left: -15px;
}
.launc-des-cup li span {
  font-size: 35px;
  color: #2C3C47;
  margin: 8px 0 0;
  font-weight: 600;
}
.launc-des-cup ul li:first-child span {
  color: #E3335B;
  margin-left: -29px;
}
.launc-des-cup ul li:nth-child(2) span {
  color: #003FBC;
}
.launc-des-cup ul li:nth-child(3) span {
  color: #30AF6E;
}
section.launch-cup h6 {
  font-size: 26px;
  color: #E3335B;
  text-align: center;
}
.launc-des-cup.pr-3 p {
  font-size: 14px;
  text-align: center;
}

.launc-des-cup ul li:nth-child(2) {
  border-color: #08CCFE;
  box-shadow: 3px 4px 1px 1px #08CCFE;
  background: rgb(255,255,255);
  background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,250,255,1) 100%);
  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,250,255,1) 100%);
  background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,250,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5faff',GradientType=0 );
}
.launc-des-cup ul li:nth-child(3) {
  border-color: #49CA88;
  box-shadow: 3px 4px 1px 1px #49CA88;
  background: rgb(255,255,255);
  background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(241,255,248,1) 100%);
  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(241,255,248,1) 100%);
  background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(241,255,248,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f1fff8',GradientType=0 );
}
.launc-des-cup ul li:nth-child(4), .launc-des-cup ul li:last-child {
  border-color: #D6D6D6;
  box-shadow: 3px 4px 1px 1px #D6D6D6;
  background: rgb(255,255,255);
  background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(239,239,239,1) 100%);
  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%);
  background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 );
}
section.promoter-sec {
  padding: 50px 0;
  background-image: url(../images/jai-bk.png);
  background-repeat: no-repeat;
  background-size: cover;
}
section.promoter-sec h2 {
  text-align: center;
  margin-bottom: 70px;
  font-size: 55px;
}
section.new-agrigat {
    background: #faeffe;
    padding: 60px 0;
    text-align:center;
}
.my-partner-outer img.absolute:nth-child(2) {
    position: absolute;
    right: -70px;
    top: 50px;
}
.my-partner-outer img.absolute:first-child {
    position: absolute;
    left: -60px;
    top: 60px;
}
.my-partner h4 {
    font-size: 30px;
    margin-bottom: 22px;
}
.my-partner button {
    width: 27%;
    background: transparent;
    border: 0;
    color: #000;
    margin: 8px 0;
    text-align: left;
}
.my-partner button a {
    color: #000;
    text-decoration: none;
    font-size: 17px;
}
section.meet-agricator div {
    text-align: center;
}
.my-partner-outer {
    background-color: #E8A1FF;
    border-radius: 20px;
    position: relative;
    margin-top: 30px;
    padding: 33px 0;
}
section.meet-agricator {
    background-color: #36074E;
    padding: 70px 0;
}
section.meet-agricator h3 {
    font-size: 58px;
    font-weight: 700;
}
section.meet-agricator p {
    font-size: 23px;
}
section.new-agrigat img {
    margin: 20px 0;
}
.promoter-sec-left img {
    position: relative;
    left: -204px;
    top: -23px;
}
.promoter-sec-right {
  display: flex;
}
.promoter-sec-right-col {
  width: 50%;
  padding: 0 11px;
}
.pro-sec-blog {
  background: #DBF7FE;
  border: 1px solid #78DBF5;
  padding: 20px 10px;
  border-radius: 5px;
  margin-bottom: 30px;
  box-shadow: 0px 6px 2px 0px #AAD7EF;
} 
.pro-sec-blog h4 {
  position: relative;
  font-size: 18px;
  line-height: 27px;
  padding-left: 44px;
  color: #2C3C47;
  margin-bottom: 0;
}

.pro-sec-blog h4 img {
  position: absolute;
  left: -8px;
}
.pro-sec-blog p {
  padding-left: 43px;
  font-size: 17px;
  color: #2C3C47;
  line-height: 25px;
  margin-top: 9px;
  margin-bottom: 16px;
}
.pro-sec-blog.pro-fr-jv {
  background: #E7FEE7;
  border-color: #84F8BD;
  box-shadow: 0px 6px 2px 0px #BDF3BD;
}.pro-sec-blog.pro-fv-jv {
  background: #F9F6FF;
  border-color: #C6B1F8;
  box-shadow: 0px 6px 2px 0px #E1D2FF;
}.pro-sec-blog.pro-sx-jv {
  background: #FFECF1;
  border-color: #FFC9D6;
  box-shadow: 0px 6px 2px 0px #F9D2FF;
}
.pro-sec-blog.pro-gr-jv {
  background: #E7FEE7;
  border-color: #84F8BD;
  box-shadow: 0px 6px 2px 0px #BDF3BD;
}
.pro-sec-blog.pro-sec-jv {
  background: #FFFAE8;
  border-color: #FEC301;
  box-shadow: 0px 6px 2px 0px #F9D99D;
}
.pro-sec-blog.pro-thr-jv {
  background: #F9F6FF;
  border-color: #C6B1F8;
  box-shadow: 0px 6px 2px 0px #E1D2FF;
}
section.track-records h2 {
  font-size: 46px;
  color: #3518B4;
  text-align: center;
  border-top: 1px dashed #ddd;
  padding-top: 50px;
  font-weight: 700;
}
section.track-records p {
  font-size: 29px;
  text-align: center;
  margin-bottom: 70px;
}

section.track-records ul {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}
section.track-records ul li {
  list-style: none;
  width: 18.7%;
  margin: 0 7px;
  background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,255,255,0.83) 73%, rgba(230,245,255,0.77) 100%);
  background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 1%,rgba(255,255,255,0.83) 73%,rgba(230,245,255,0.77) 100%);
  background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 1%,rgba(255,255,255,0.83) 73%,rgba(230,245,255,0.77) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#c4e6f5ff',GradientType=1 );
  border: 1px solid #10BEFE;
  border-radius: 4px;
  padding: 0 13px 14px;
  text-align: center;
  margin-bottom: 60px;
  box-shadow: 1px 2px 6px 3px #A8DBF6;
}
section.track-records ul li h5 {
  font-size: 26px;
  color: #fff;  
  background: #00A8FF;
  margin: -17px auto 13px;
  display: table;
  padding: 1px 20px;
  border-radius: 2px;
  font-weight: 700;
  box-shadow: 0px 2px 1px 1px #0099FF;
}
section.track-records ul li img {
  max-width: 93%;
} 
section.receplotae {
  padding-top: 22px;
  padding-bottom: 90px;
}
section.receplotae h2 {
  border-top: 1px dashed #ddd;
  padding-top: 50px;
  text-align: center;
  color: #1B2E4E;
  font-size: 63px;
  font-weight: 700;
}
section.receplotae p {
  text-align: center;
  font-size: 28px;
  margin-bottom: 5px;
  color: #2B446E;
}
section.receplotae h4 {
  text-align: center;
  width: 100%;
  margin-bottom: 55px;
}
section.receplotae h4 u {
  font-size: 28px;
  text-decoration: underline;
  color: #0099FF;
}
.receplotae-inner {
  border: 1px solid #dcf1ff;
  border-radius: 9px;
  text-align: center;
  padding: -1px 0 40px;
  min-height: 138px;
  margin-bottom: 16px;
  overflow: hidden;
  background: #1aa8ff;
}
.receplotae-inner span {
  font-size: 20px;
  text-align: center;
  width: 100%;
  float: left;
  color: #62667a;
  margin-bottom: 20px;
  font-size: 14px;
  text-align: center;
  width: 100%;
  float: left;
  color: #083580;
  margin-bottom: 20px;
  background: #c9edff;
  padding: 10px 0;
}
.receplotae-inner img {
  max-height: 35px;
  object-fit: contain;
  max-height: 58px;
  object-fit: contain;
  max-width: 180px;
}
section.receplotae .col-md-4 {
  padding: 0 8px;
  width: 20%;
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  max-width: 20%;
}
section.welcm-introduction {
  background: -moz-linear-gradient(45deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 41%, rgba(255,255,255,0.76) 49%, rgba(125,185,232,0.51) 100%);
  background: -webkit-linear-gradient(45deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0.8) 41%,rgba(255,255,255,0.76) 49%,rgba(125,185,232,0.51) 100%);
  background: linear-gradient(45deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0.8) 41%,rgba(255,255,255,0.76) 49%,rgba(125,185,232,0.51) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#827db9e8',GradientType=1 );
  padding: 70px 0;
  background-image: url(../images/author-bk.png);
  background-repeat: no-repeat;
  background-size: cover;
}

section.jv-get-touch h2 {
  text-align: center;
  margin: 0 auto;
  display: table;
  padding: 0 20px;
  position: relative;
  font-size: 48px;
font-weight: 700;
}
section.jv-get-touch h2 img {
  margin-right: 14px;
}

.welcm-introduction-left ul {
  margin: 0;
  padding: 0;
}
.welcm-introduction-left ul li {
  font-size: 24px;
  border-bottom: 1px solid #ddd;
  width: 100%;
  float: left;
  padding: 13px 0;
  line-height: 41px;
  list-style: none;
  position: relative;
  padding-left: 60px;
  font-size: 23px;
}
.welcm-introduction-left ul li img {
  position: absolute;
  left: 0;
  top: 7px;
}
.welcm-introduction-right img {
  position: relative;
  left: 30px;
}
section.jv-brands h2 img {
  margin-left: 16px;
}
section.jv-brands p {
  font-size: 28px;
  text-align: center;
  margin-bottom: 30px;
}
.fobes img {
  width: 100%;
}
section.jv-brands {
  padding: 50px 0 90px;
}
section.jv-brands h2 {
  text-align: center;
  font-size: 47px;
  font-weight: 700;
}
section.jv-brands p span {
  border-bottom: 4px solid #0099FF;
  padding-bottom: 5px;
}
img.brand-logo {
  width: 100%;
  margin-bottom: 90px;
}
.jv-brand-own {
  background-image: url(../images/yop-bk.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding: 0px 0 0;
  text-align: center;
  background-position: center;
}
.payment-jv-left img {
  width: 100%;
}
.payment-jv-right::before {
  width: 190px;
  height: 310px;
  background-image: url(../images/lapi.png);
  background-repeat: no-repeat;
  content: "";
  position: absolute;
  right: -133px;
  bottom: -20px;
} 
.payment-jv-right h3 {
  font-size: 28px;
  text-align: center;
font-weight: 700;
  color: #083580;
  margin-bottom: 15px;
}
.payment-data {
  background: #a2d8ff40;
  border: 1px solid #a2d8ff40;
  border-radius: 6px;
  padding: 21px;
  max-width: 91%;
  margin: 0 auto;
}
.payment-data a {
  background: #4291F8;
  width: 100%;
  display: table;
  max-width: 425px;
  margin: 0 auto 15px;
  height: 70px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  font-size: 27px;
  color: #fff;
  padding: 0 9px;
  box-shadow: 1px 4px 1px 1px #0153BB;
  position: relative;
  padding-left: 75px;
  text-decoration: none;
}
.payment-data a span {
  position: absolute;
  left: 0;
  top: 0;
  border-right: 1px solid #dddddd42;
  height: 100%;
  bottom: 0;
  display: flex;
  align-items: center;
  padding: 0px 10px;
  width: 56px;
  justify-content: center;
  text-align: center;
}
.payment-data a:last-child {
  background: #00BAFF;
  box-shadow: 1px 4px 1px 1px #0C96CB;
}

.payment-data h5 {
  font-size: 26px;
  line-height: 34px;
  color: #394271;
font-weight: 700;
  text-align: center;
  margin-bottom: 18px;
  text-transform: uppercase;
}

@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  60% {
    transform: translateY(-15px);
  }
}

@keyframes dxCapsuleSweep {
        0% {
            transform: translateX(-140%) skewX(-18deg);
            opacity: 0;
        }

        20% {
            opacity: 0.85;
        }

        55% {
            transform: translateX(160%) skewX(-18deg);
            opacity: 0.9;
        }

        100% {
            transform: translateX(200%) skewX(-18deg);
            opacity: 0;
        }
    }

    @keyframes animate1 {
  0% {
    left: -100%;
  }
  50%,
  100% {
    left: 100%;
  }
}

@keyframes animate2 {
  0% {
    top: -100%;
  }
  50%,
  100% {
    top: 100%;
  }
}
@keyframes animate3 {
  0% {
    right: -100%;
  }
  50%,
  100% {
    right: 100%;
  }
}
@keyframes animate4 {
  0% {
    bottom: -100%;
  }
  50%,
  100% {
    bottom: 100%;
  }
}

/* Number Calculations Section */
.number-calculations-section {
  position: relative;
  padding: 50px 20px;
  background: linear-gradient(135deg, 
    rgba(15, 23, 42, 0.98) 0%, 
    rgba(30, 41, 59, 0.95) 50%,
    rgba(15, 23, 42, 0.98) 100%);
  overflow: hidden;
}

.number-calculations-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: 
    radial-gradient(circle at 20% 30%, rgba(255, 31, 140, 0.15) 0%, transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(122, 60, 255, 0.15) 0%, transparent 50%),
    radial-gradient(circle at 50% 50%, rgba(250, 204, 21, 0.1) 0%, transparent 60%);
  pointer-events: none;
  z-index: 0;
}

.calculations-container {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.calculations-header {
  text-align: center;
  margin-bottom: 40px;
}

.calculations-title {
  font-size: 42px;
  font-weight: 900;
  margin-bottom: 20px;
  line-height: 1.2;
}

.gradient-text-yellow {
  color: #000;
  display: inline-block;
}
.calculations-proposition {
  font-size: 22px;
  color: #e2e8f0;
  margin-bottom: 15px;
  line-height: 1.5;
}

.calculations-proposition strong {
  color: #facc15;
  font-weight: 700;
}

.price-highlight {
  color: #facc15;
  font-size: 26px;
  font-weight: 900;
  text-shadow: 0 0 20px rgba(250, 204, 21, 0.6);
}
.calculations-intro {
  font-size: 21px;
  color: #000;
  max-width: 900px;
  margin: 0 auto;
  line-height: 1.6;
}
.calculations-intro strong {
  color: #facc15;
  font-weight: 600;
}

.calculations-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-bottom: 40px;
}

.calculation-card {
  position: relative;
  padding: 28px 24px;
  border-radius: 24px;
  background: linear-gradient(135deg, 
    rgba(255, 255, 255, 0.08) 0%, 
    rgba(255, 255, 255, 0.03) 100%);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: 
    0 20px 60px rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow 0.4s ease;
  overflow: hidden;
  opacity: 0;
  transform: translateY(30px);
  animation: fadeInUpCard 0.8s ease forwards;
}

.calculation-card:nth-child(1) {
  animation-delay: 0.1s;
}

.calculation-card:nth-child(2) {
  animation-delay: 0.2s;
}

.calculation-card:nth-child(3) {
  animation-delay: 0.3s;
}

.calculation-card:nth-child(4) {
  animation-delay: 0.4s;
}

@keyframes fadeInUpCard {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.calculation-card:hover {
  transform: translateY(-8px) scale(1.02);
  box-shadow: 
    0 30px 80px rgba(0, 0, 0, 0.4),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.card-glow {
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
  z-index: 0;
}

.calculation-card:hover .card-glow {
  opacity: 1;
}

.card-1 {
  background: linear-gradient(135deg, 
    rgba(250, 204, 21, 0.15) 0%, 
    rgba(251, 191, 36, 0.08) 100%);
}

.card-1 .card-glow {
  background: radial-gradient(circle, rgba(250, 204, 21, 0.4) 0%, transparent 70%);
}

.card-2 {
  background: linear-gradient(135deg, 
    rgba(59, 130, 246, 0.15) 0%, 
    rgba(37, 99, 235, 0.08) 100%);
}

.card-2 .card-glow {
  background: radial-gradient(circle, rgba(59, 130, 246, 0.4) 0%, transparent 70%);
}

.card-3 {
  background: linear-gradient(135deg, 
    rgba(16, 185, 129, 0.15) 0%, 
    rgba(5, 150, 105, 0.08) 100%);
}

.card-3 .card-glow {
  background: radial-gradient(circle, rgba(16, 185, 129, 0.4) 0%, transparent 70%);
}

.card-4 {
  background: linear-gradient(135deg, 
    rgba(255, 31, 140, 0.15) 0%, 
    rgba(236, 72, 153, 0.08) 100%);
}

.card-4 .card-glow {
  background: radial-gradient(circle, rgba(255, 31, 140, 0.4) 0%, transparent 70%);
}

.card-3d-icon {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 2;
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 3D Check Icon */
.icon-3d-check {
  position: relative;
  width: 60px;
  height: 60px;
  transform-style: preserve-3d;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.icon-3d-check-circle {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: linear-gradient(135deg, #10b981 0%, #059669 100%);
  box-shadow: 
    0 10px 30px rgba(16, 185, 129, 0.4),
    inset 0 2px 10px rgba(255, 255, 255, 0.3),
    inset 0 -2px 10px rgba(0, 0, 0, 0.2);
  transform: perspective(1000px) rotateY(-15deg) rotateX(5deg);
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.icon-3d-check-mark {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 32px;
  font-weight: 900;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
  z-index: 1;
}

.calculation-card:hover .icon-3d-check-circle {
  transform: perspective(1000px) rotateY(0deg) rotateX(0deg) scale(1.1);
}

/* 3D Money/Coins Icon */
.icon-3d-money {
  position: relative;
  width: 70px;
  height: 70px;
  transform-style: preserve-3d;
}

.icon-3d-coin {
  position: absolute;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  background: linear-gradient(135deg, #facc15 0%, #f59e0b 100%);
  box-shadow: 
    0 8px 20px rgba(250, 204, 21, 0.5),
    inset 0 2px 8px rgba(255, 255, 255, 0.4),
    inset 0 -2px 8px rgba(0, 0, 0, 0.2);
  transform-style: preserve-3d;
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.icon-3d-coin::before {
  content: '$';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: 18px;
  font-weight: 900;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.icon-3d-coin.coin-1 {
  top: 0;
  left: 50%;
  transform: translateX(-50%) perspective(1000px) rotateY(-20deg) rotateX(10deg);
}

.icon-3d-coin.coin-2 {
  top: 20px;
  left: 10px;
  transform: perspective(1000px) rotateY(15deg) rotateX(-5deg);
  z-index: 1;
}

.icon-3d-coin.coin-3 {
  top: 20px;
  right: 10px;
  transform: perspective(1000px) rotateY(-15deg) rotateX(-5deg);
  z-index: 2;
}

.calculation-card:hover .icon-3d-coin.coin-1 {
  transform: translateX(-50%) perspective(1000px) rotateY(0deg) rotateX(0deg) translateY(-5px);
}

.calculation-card:hover .icon-3d-coin.coin-2 {
  transform: perspective(1000px) rotateY(0deg) rotateX(0deg) translateY(-5px);
}

.calculation-card:hover .icon-3d-coin.coin-3 {
  transform: perspective(1000px) rotateY(0deg) rotateX(0deg) translateY(-5px);
}

/* 3D Rocket Icon */
.icon-3d-rocket {
  position: relative;
  width: 60px;
  height: 60px;
  transform-style: preserve-3d;
  transform: perspective(1000px) rotateY(-15deg) rotateX(5deg);
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.rocket-body {
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  width: 20px;
  height: 35px;
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  border-radius: 10px 10px 4px 4px;
  box-shadow: 
    0 8px 20px rgba(59, 130, 246, 0.5),
    inset 0 2px 8px rgba(255, 255, 255, 0.3),
    inset 0 -2px 8px rgba(0, 0, 0, 0.2);
}

.rocket-wings {
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
}

.rocket-wings.wing-left {
  top: 20px;
  left: 8px;
  border-width: 0 12px 15px 0;
  border-color: transparent #60a5fa transparent transparent;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
}

.rocket-wings.wing-right {
  top: 20px;
  right: 8px;
  border-width: 0 0 15px 12px;
  border-color: transparent transparent transparent #60a5fa;
  filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
}

.rocket-flame {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 12px;
  height: 15px;
  background: linear-gradient(180deg, #facc15 0%, #f59e0b 50%, #ef4444 100%);
  border-radius: 0 0 6px 6px;
  box-shadow: 0 0 15px rgba(250, 204, 21, 0.8);
  animation: rocketFlame 1s ease-in-out infinite;
}

@keyframes rocketFlame {
  0%, 100% {
    height: 15px;
    opacity: 1;
  }
  50% {
    height: 20px;
    opacity: 0.8;
  }
}

.calculation-card:hover .icon-3d-rocket {
  transform: perspective(1000px) rotateY(0deg) rotateX(0deg) scale(1.15) translateY(-5px);
}

/* 3D Fire Icon */
.icon-3d-fire {
  position: relative;
  width: 60px;
  height: 60px;
  transform-style: preserve-3d;
  transform: perspective(1000px) rotateY(-15deg) rotateX(5deg);
  transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.flame {
  position: absolute;
  border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
  filter: blur(1px);
  animation: flicker 1.5s ease-in-out infinite;
}

.flame-1 {
  width: 25px;
  height: 35px;
  background: linear-gradient(180deg, #facc15 0%, #f59e0b 50%, #ef4444 100%);
  left: 50%;
  bottom: 5px;
  transform: translateX(-50%);
  box-shadow: 0 0 20px rgba(250, 204, 21, 0.8);
  animation-delay: 0s;
  z-index: 3;
}

.flame-2 {
  width: 20px;
  height: 28px;
  background: linear-gradient(180deg, #f59e0b 0%, #ef4444 50%, #dc2626 100%);
  left: 35%;
  bottom: 8px;
  box-shadow: 0 0 15px rgba(239, 68, 68, 0.7);
  animation-delay: 0.3s;
  z-index: 2;
}

.flame-3 {
  width: 20px;
  height: 28px;
  background: linear-gradient(180deg, #f59e0b 0%, #ef4444 50%, #dc2626 100%);
  right: 35%;
  bottom: 8px;
  box-shadow: 0 0 15px rgba(239, 68, 68, 0.7);
  animation-delay: 0.6s;
  z-index: 2;
}

@keyframes flicker {
  0%, 100% {
    transform: translateX(0) scaleY(1);
  }
  25% {
    transform: translateX(-2px) scaleY(1.1);
  }
  50% {
    transform: translateX(2px) scaleY(0.95);
  }
  75% {
    transform: translateX(-1px) scaleY(1.05);
  }
}

.calculation-card:hover .icon-3d-fire {
  transform: perspective(1000px) rotateY(0deg) rotateX(0deg) scale(1.15) translateY(-5px);
}

.calculation-content {
  position: relative;
  z-index: 1;
  padding-right: 80px;
}

.card-title {
  font-size: 18px;
  font-weight: 700;
  color: #f1f5f9;
  margin-bottom: 18px;
  line-height: 1.3;
}

.calculation-result {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  flex-wrap: wrap;
}

.calculation-formula {
  font-size: 16px;
  color: #cbd5e1;
  font-weight: 600;
}

.calculation-amount {
  font-size: 32px;
  font-weight: 900;
  background: linear-gradient(135deg, #facc15 0%, #fbbf24 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  text-shadow: 0 0 20px rgba(250, 204, 21, 0.4);
}

.calculation-benefit {
  font-size: 14px;
  color: #94a3b8;
  font-style: italic;
  margin-top: 8px;
}

.calculations-cta {
  text-align: center;
  padding: 35px 25px;
  background: linear-gradient(135deg, 
    rgba(122, 60, 255, 0.2) 0%, 
    rgba(255, 31, 140, 0.2) 100%);
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.cta-title {
  font-size: 24px;
  font-weight: 800;
  color: #f1f5f9;
  margin-bottom: 15px;
  line-height: 1.3;
}

.cta-benefits {
  font-size: 16px;
  color: #cbd5e1;
  line-height: 1.6;
  max-width: 900px;
  margin: 0 auto;
}

.cta-benefits strong {
  color: #facc15;
  font-weight: 700;
}

/* Responsive Design */
@media (max-width: 1024px) {
  .calculations-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  
  .calculations-title {
    font-size: 36px;
  }
  
  .calculations-proposition {
    font-size: 20px;
  }
}

@media (max-width: 768px) {
  .number-calculations-section {
    padding: 40px 15px;
  }
  
  .calculations-header {
    margin-bottom: 30px;
  }
  
  .calculations-title {
    font-size: 28px;
    margin-bottom: 15px;
  }
  
  .calculations-proposition {
    font-size: 18px;
    margin-bottom: 12px;
  }
  
  .calculations-intro {
    font-size: 15px;
  }
  
  .calculation-card {
    padding: 24px 18px;
  }
  
  .calculation-content {
    padding-right: 0;
  }
  
  .card-3d-icon {
    position: relative;
    top: 0;
    right: 0;
    margin-bottom: 15px;
    width: 60px;
    height: 60px;
  }
  
  .card-title {
    font-size: 16px;
    margin-bottom: 15px;
  }
  
  .calculation-amount {
    font-size: 26px;
  }
  
  .calculations-cta {
    padding: 25px 20px;
  }
  
  .cta-title {
    font-size: 20px;
    margin-bottom: 12px;
  }
  
  .cta-benefits {
    font-size: 14px;
  }
  
  .icon-3d-check-circle {
    width: 50px;
    height: 50px;
  }
  
  .icon-3d-check-mark {
    font-size: 26px;
  }
  
  .icon-3d-coin {
    width: 28px;
    height: 28px;
  }
  
  .icon-3d-coin::before {
    font-size: 14px;
  }
}

/* Investment Comparison Section - Modern Gradient Design */
.investment-comparison-section {
  padding: 70px 0;
  background: linear-gradient(135deg, #f5f7fa 0%, #f0f4ff 25%, #faf5ff 50%, #fff5f7 75%, #f5f7fa 100%);
  position: relative;
  overflow: hidden;
}

.investment-comparison-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(circle at 20% 50%, rgba(139, 92, 246, 0.08) 0%, transparent 50%),
              radial-gradient(circle at 80% 80%, rgba(236, 72, 153, 0.08) 0%, transparent 50%),
              radial-gradient(circle at 40% 20%, rgba(59, 130, 246, 0.08) 0%, transparent 50%);
  pointer-events: none;
}

.comparison-section,
.tokprimeai-highlight-section {
  margin-bottom: 60px;
  position: relative;
  z-index: 1;
}

.comparison-section:last-of-type,
.tokprimeai-highlight-section:last-of-type {
  margin-bottom: 0;
}

.section-header {
  text-align: center;
  margin-bottom: 0px;
}

.star-icon {
  font-size: 28px;
  display: inline-block;
  margin-bottom: 12px;
  animation: float 3s ease-in-out infinite;
}

@keyframes float {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-8px); }
}

.section-title {
  font-size: 38px;
  font-weight: 800;
  line-height: 1.2;
  margin: 0;
  letter-spacing: -0.8px;
}

.subtitle-text {
  display: block;
  font-size: 24px;
  font-weight: 600;
  margin-top: 8px;
  opacity: 1;
}

.gradient-text-1 {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.gradient-text-2 {
  background: linear-gradient(135deg, #f093fb 0%, #4facfe 50%, #00f2fe 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

/* Comparison Grid */
.comparison-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
  margin-top: 35px;
}

.comparison-card {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.9) 100%);
  backdrop-filter: blur(20px);
  border-radius: 20px;
  padding: 28px 24px;
  border: 1px solid rgba(255, 255, 255, 0.8);
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06),
              0 2px 12px rgba(139, 92, 246, 0.08),
              inset 0 1px 0 rgba(255, 255, 255, 0.95);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.comparison-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
}

.comparison-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1),
              0 6px 20px rgba(139, 92, 246, 0.15),
              inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.comparison-card:hover::before {
  opacity: 1;
}

.comparison-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  position: relative;
  transition: all 0.3s ease;
}

.comparison-icon svg {
  width: 36px;
  height: 36px;
  transition: all 0.3s ease;
}

.stock-icon {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  box-shadow: 0 6px 20px rgba(102, 126, 234, 0.3);
}

.realestate-icon {
  background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
  color: white;
  box-shadow: 0 6px 20px rgba(245, 87, 108, 0.3);
}

.crypto-icon {
  background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
  color: white;
  box-shadow: 0 6px 20px rgba(79, 172, 254, 0.3);
}

.software-icon {
  background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
  color: white;
  box-shadow: 0 6px 20px rgba(250, 112, 154, 0.3);
}

.comparison-card:hover .comparison-icon {
  transform: scale(1.08) rotate(3deg);
}

.comparison-card:hover .comparison-icon svg {
  transform: scale(1.05);
}

.comparison-title {
  font-size: 22px;
  font-weight: 700;
  color: #1e293b;
  margin: 0 0 14px 0;
  text-align: center;
  line-height: 1.35;
}

.comparison-desc {
  font-size: 15px;
  line-height: 1.6;
  color: #475569;
  margin: 0;
  text-align: center;
}

.comparison-desc strong {
  color: #1e293b;
  font-weight: 700;
}

/* Highlight Section */
.highlight-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
  margin-top: 35px;
}

.highlight-card {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.92) 100%);
  backdrop-filter: blur(20px);
  border-radius: 22px;
  padding: 32px 28px;
  border: 2px solid transparent;
  background-clip: padding-box;
  position: relative;
  box-shadow: 0 6px 32px rgba(0, 0, 0, 0.06),
              0 3px 16px rgba(139, 92, 246, 0.1),
              inset 0 1px 0 rgba(255, 255, 255, 0.95);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
}

.highlight-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 22px;
  padding: 2px;
  background: linear-gradient(135deg, #f093fb 0%, #4facfe 50%, #00f2fe 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask-composite: exclude;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.highlight-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 14px 48px rgba(0, 0, 0, 0.1),
              0 8px 24px rgba(139, 92, 246, 0.2),
              inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.highlight-card:hover::before {
  opacity: 1;
}

.highlight-icon-wrapper {
  display: flex;
  justify-content: center;
  margin-bottom: 20px;
}

.highlight-icon {
  width: 80px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 20px;
  position: relative;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.highlight-icon svg {
  width: 44px;
  height: 44px;
  transition: all 0.3s ease;
}

.ai-icon {
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  box-shadow: 0 8px 24px rgba(102, 126, 234, 0.35),
              inset 0 2px 8px rgba(255, 255, 255, 0.2);
}

.rocket-icon {
  background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
  color: white;
  box-shadow: 0 8px 24px rgba(245, 87, 108, 0.35),
              inset 0 2px 8px rgba(255, 255, 255, 0.2);
}

.clock-icon {
  background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
  color: white;
  box-shadow: 0 8px 24px rgba(79, 172, 254, 0.35),
              inset 0 2px 8px rgba(255, 255, 255, 0.2);
}

.support-icon {
  background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
  color: white;
  box-shadow: 0 8px 24px rgba(250, 112, 154, 0.35),
              inset 0 2px 8px rgba(255, 255, 255, 0.2);
}

.highlight-card:hover .highlight-icon {
  transform: scale(1.1) rotate(3deg);
}

.highlight-card:hover .highlight-icon svg {
  transform: scale(1.05);
}

.highlight-title {
  font-size: 20px;
  font-weight: 700;
  color: #1e293b;
  margin: 0 0 14px 0;
  text-align: center;
  line-height: 1.4;
}

.highlight-desc {
  font-size: 15px;
  line-height: 1.65;
  color: #475569;
  margin: 0;
  text-align: center;
}

.highlight-desc strong {
  color: #1e293b;
  font-weight: 700;
}

/* Responsive Design */
@media (max-width: 768px) {
  .investment-comparison-section {
    padding: 50px 0;
  }

  .section-title {
    font-size: 30px;
  }

  .subtitle-text {
    font-size: 20px;
  }

  .comparison-section,
  .tokprimeai-highlight-section {
    margin-bottom: 45px;
  }

  .section-header {
    margin-bottom: 30px;
  }

  .comparison-grid,
  .highlight-grid {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 28px;
  }

  .comparison-card,
  .highlight-card {
    padding: 24px 20px;
  }

  .comparison-title,
  .highlight-title {
    font-size: 19px;
    margin-bottom: 12px;
  }

  .comparison-desc,
  .highlight-desc {
    font-size: 14px;
  }

  .comparison-icon {
    width: 56px;
    height: 56px;
    margin-bottom: 16px;
  }

  .comparison-icon svg {
    width: 32px;
    height: 32px;
  }

  .highlight-icon {
    width: 72px;
    height: 72px;
    margin-bottom: 18px;
  }

  .highlight-icon svg {
    width: 40px;
    height: 40px;
  }
}

@media (max-width: 480px) {
  .investment-comparison-section {
    padding: 40px 0;
  }

  .section-title {
    font-size: 24px;
  }

  .subtitle-text {
    font-size: 18px;
  }

  .comparison-section,
  .tokprimeai-highlight-section {
    margin-bottom: 40px;
  }

  .section-header {
    margin-bottom: 28px;
  }

  .comparison-card,
  .highlight-card {
    padding: 22px 18px;
    border-radius: 18px;
  }

  .comparison-title,
  .highlight-title {
    font-size: 18px;
  }
}

/* ================== BEST PART SECTION ================== */
.best-part-section {
  position: relative;
  padding: 50px 20px;
  background: linear-gradient(135deg, #f8fafc 0%, #e0e7ff 50%, #f0f9ff 100%);
  overflow: hidden;
  margin: 60px 0 0;
}

.best-part-section::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 800px;
  height: 800px;
  background: radial-gradient(circle, rgba(255, 31, 140, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  animation: float 20s ease-in-out infinite;
  z-index: 0;
}

.best-part-section::after {
  content: '';
  position: absolute;
  bottom: -30%;
  left: -10%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(99, 102, 241, 0.12) 0%, transparent 70%);
  border-radius: 50%;
  animation: float 25s ease-in-out infinite reverse;
  z-index: 0;
}

.best-part-content {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 60px;
  align-items: center;
  position: relative;
  z-index: 1;
}

.best-part-left {
  display: flex;
  justify-content: center;
  align-items: center;
}

/* Modern Support Illustration */
.support-illustration-modern {
  position: relative;
  width: 100%;
  max-width: 450px;
  height: 450px;
  margin: 0 auto;
  transform-style: preserve-3d;
  perspective: 1200px;
}

.illustration-bg {
  position: absolute;
  inset: 0;
  border-radius: 40px;
  overflow: hidden;
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.08) 0%, rgba(255, 31, 140, 0.08) 50%, rgba(59, 130, 246, 0.08) 100%);
}

.bg-gradient-1,
.bg-gradient-2,
.bg-gradient-3 {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  opacity: 0.6;
  animation: bgFloat 15s ease-in-out infinite;
}

.bg-gradient-1 {
  width: 200px;
  height: 200px;
  background: radial-gradient(circle, rgba(99, 102, 241, 0.4) 0%, transparent 70%);
  top: -50px;
  left: -50px;
  animation-delay: 0s;
}

.bg-gradient-2 {
  width: 180px;
  height: 180px;
  background: radial-gradient(circle, rgba(255, 31, 140, 0.4) 0%, transparent 70%);
  bottom: -40px;
  right: -40px;
  animation-delay: 5s;
}

.bg-gradient-3 {
  width: 150px;
  height: 150px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.4) 0%, transparent 70%);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  animation-delay: 10s;
}

/* 3D Support Person */
.support-person-3d {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 140px;
  height: 200px;
  transform-style: preserve-3d;
  animation: person3DFloat 4s ease-in-out infinite;
  z-index: 10;
}

.person-head-3d {
  position: relative;
  width: 70px;
  height: 70px;
  margin: 0 auto 15px;
  transform-style: preserve-3d;
}

.hair {
  position: absolute;
  top: -5px;
  left: 50%;
  transform: translateX(-50%);
  width: 75px;
  height: 50px;
  background: linear-gradient(135deg, #8b4513 0%, #654321 100%);
  border-radius: 50% 50% 40% 40%;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2), inset 0 -2px 5px rgba(0, 0, 0, 0.1);
}

.face {
  position: relative;
  width: 70px;
  height: 70px;
  background: linear-gradient(135deg, #fdbcb4 0%, #f5a097 100%);
  border-radius: 50%;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2), 0 0 0 4px rgba(255, 255, 255, 0.4), inset 0 2px 10px rgba(255, 255, 255, 0.3);
  z-index: 2;
}

.eye {
  position: absolute;
  width: 8px;
  height: 8px;
  background: #1a1a1a;
  border-radius: 50%;
  top: 28px;
  box-shadow: 0 0 0 2px #fff, inset 0 0 0 1px rgba(0, 0, 0, 0.1);
  animation: blink 3s ease-in-out infinite;
}

.left-eye {
  left: 22px;
}

.right-eye {
  right: 22px;
}

.mouth {
  position: absolute;
  width: 20px;
  height: 10px;
  border: 2px solid #d97706;
  border-top: none;
  border-radius: 0 0 20px 20px;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
}

.person-body-3d {
  position: relative;
  width: 100px;
  height: 120px;
  margin: 0 auto;
  transform-style: preserve-3d;
}

.shirt {
  width: 100px;
  height: 120px;
  background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 50%, #e9ecef 100%);
  border-radius: 25px 25px 20px 20px;
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15), inset 0 3px 8px rgba(255, 255, 255, 0.8), inset 0 -2px 5px rgba(0, 0, 0, 0.05);
  position: relative;
}

.shirt::before {
  content: '';
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 30px;
  height: 30px;
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  border-radius: 50%;
  box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.2);
}

/* 3D Phone */
.phone-3d {
  position: absolute;
  right: -35px;
  top: 50px;
  width: 50px;
  height: 90px;
  transform-style: preserve-3d;
  transform: rotate(-20deg) rotateY(-15deg);
  animation: phone3DFloat 3s ease-in-out infinite;
  z-index: 15;
}

.phone-screen {
  width: 50px;
  height: 75px;
  background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
  border-radius: 8px;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4), inset 0 2px 5px rgba(255, 255, 255, 0.1);
  position: relative;
}

.phone-screen::before {
  content: '';
  position: absolute;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: 30px;
  height: 4px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 2px;
}

.phone-screen::after {
  content: '';
  position: absolute;
  bottom: 8px;
  left: 50%;
  transform: translateX(-50%);
  width: 25px;
  height: 25px;
  background: rgba(59, 130, 246, 0.3);
  border-radius: 50%;
  border: 2px solid rgba(59, 130, 246, 0.5);
}

.phone-button {
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 35px;
  height: 5px;
  background: #1e293b;
  border-radius: 3px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

/* 3D Laptop */
.laptop-3d {
  position: absolute;
  bottom: -20px;
  left: 50%;
  transform: translateX(-50%) rotateX(15deg);
  width: 140px;
  height: 90px;
  transform-style: preserve-3d;
  transform-origin: bottom center;
  z-index: 5;
}

.laptop-screen {
  width: 140px;
  height: 85px;
  background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
  border-radius: 4px 4px 0 0;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3), inset 0 2px 10px rgba(0, 0, 0, 0.5);
  position: relative;
  transform: rotateX(-15deg);
  transform-origin: bottom;
}

.screen-content {
  position: absolute;
  inset: 8px;
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.2) 0%, rgba(139, 92, 246, 0.2) 100%);
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.screen-content::before {
  content: 'ðŸ’¬';
  font-size: 24px;
  opacity: 0.6;
}

.laptop-base {
  width: 150px;
  height: 8px;
  background: linear-gradient(135deg, #475569 0%, #334155 100%);
  border-radius: 0 0 4px 4px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  margin-top: -2px;
}

/* Floating Elements */
.floating-elements {
  position: absolute;
  inset: 0;
  z-index: 20;
}

.float-card {
  position: absolute;
  width: 65px;
  height: 65px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.85) 100%);
  border-radius: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15), 0 0 0 2px rgba(255, 255, 255, 0.8), inset 0 2px 5px rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  transform-style: preserve-3d;
  animation: cardFloat 5s ease-in-out infinite;
}

.float-card.card-1 {
  top: 8%;
  left: 8%;
  animation-delay: 0s;
}

.float-card.card-2 {
  top: 5%;
  left: 50%;
  transform: translateX(-50%);
  width: 75px;
  height: 75px;
  font-size: 32px;
  animation-delay: 1s;
}

.float-card.card-3 {
  top: 8%;
  right: 8%;
  animation-delay: 2s;
}

.card-glow {
  position: absolute;
  inset: -5px;
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.3) 0%, rgba(236, 72, 153, 0.3) 100%);
  border-radius: 22px;
  filter: blur(8px);
  z-index: -1;
  opacity: 0.6;
  animation: glowPulse 3s ease-in-out infinite;
}

.float-avatar {
  position: absolute;
  width: 50px;
  height: 50px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.85) 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15), 0 0 0 2px rgba(255, 255, 255, 0.8), inset 0 2px 5px rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  transform-style: preserve-3d;
  animation: avatar3DFloat 4s ease-in-out infinite;
}

.float-avatar.avatar-1 {
  bottom: 22%;
  left: 12%;
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.9) 0%, rgba(236, 72, 153, 0.9) 100%);
  animation-delay: 0.5s;
}

.float-avatar.avatar-2 {
  bottom: 18%;
  left: 50%;
  transform: translateX(-50%);
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.9) 0%, rgba(37, 99, 235, 0.9) 100%);
  animation-delay: 1.2s;
}

.float-avatar.avatar-3 {
  bottom: 22%;
  right: 12%;
  background: linear-gradient(135deg, rgba(236, 72, 153, 0.9) 0%, rgba(219, 39, 119, 0.9) 100%);
  animation-delay: 1.8s;
}

.avatar-face {
  width: 35px;
  height: 35px;
  background: linear-gradient(135deg, #fdbcb4 0%, #f5a097 100%);
  border-radius: 50%;
  box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.1);
  position: relative;
}

.avatar-face::before,
.avatar-face::after {
  content: '';
  position: absolute;
  width: 4px;
  height: 4px;
  background: #1a1a1a;
  border-radius: 50%;
  top: 12px;
}

.avatar-face::before {
  left: 10px;
}

.avatar-face::after {
  right: 10px;
}

/* Connection Lines */
.connection-lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0.3;
}

.line {
  fill: none;
  stroke: url(#lineGradient);
  stroke-width: 2;
  stroke-dasharray: 5, 5;
  animation: lineDash 3s linear infinite;
}

/* Animations */
@keyframes bgFloat {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(20px, -20px) scale(1.1); }
  66% { transform: translate(-20px, 20px) scale(0.9); }
}

@keyframes person3DFloat {
  0%, 100% { transform: translate(-50%, -50%) translateY(0) rotateY(0deg); }
  50% { transform: translate(-50%, -50%) translateY(-8px) rotateY(5deg); }
}

@keyframes phone3DFloat {
  0%, 100% { transform: rotate(-20deg) rotateY(-15deg) translateY(0); }
  50% { transform: rotate(-18deg) rotateY(-12deg) translateY(-5px); }
}

@keyframes cardFloat {
  0%, 100% { transform: translateY(0) translateZ(0) rotateZ(0deg); }
  50% { transform: translateY(-12px) translateZ(10px) rotateZ(2deg); }
}

@keyframes avatar3DFloat {
  0%, 100% { transform: translateY(0) translateZ(0) scale(1); }
  50% { transform: translateY(-10px) translateZ(8px) scale(1.05); }
}

@keyframes blink {
  0%, 90%, 100% { transform: scaleY(1); }
  95% { transform: scaleY(0.1); }
}

@keyframes glowPulse {
  0%, 100% { opacity: 0.6; transform: scale(1); }
  50% { opacity: 0.9; transform: scale(1.1); }
}

@keyframes lineDash {
  0% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: 20; }
}

.best-part-right {
  position: relative;
  z-index: 2;
}

.best-part-heading {
  font-size: 48px;
  font-weight: 800;
  margin-bottom: 30px;
  display: flex;
  align-items: center;
  gap: 15px;
  line-height: 1.2;
}

.star-icon {
  font-size: 56px;
  display: inline-block;
  animation: starPulse 2s ease-in-out infinite;
  filter: drop-shadow(0 4px 12px rgba(255, 215, 0, 0.5));
  transform: rotate(-15deg);
}

.gradient-text {
  background: linear-gradient(135deg, #1e40af 0%, #3b82f6 50%, #6366f1 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: inline-block;
}

.best-part-text {
  font-size: 22px;
  line-height: 1.8;
  margin-bottom: 30px;
  font-weight: 500;
}

.text-blue {
  color: #2563eb;
  font-weight: 600;
}

.text-dark {
  color: #374151;
}

.best-part-note {
  background: linear-gradient(135deg, rgba(255, 182, 193, 0.3) 0%, rgba(255, 192, 203, 0.4) 100%);
  border-radius: 20px;
  padding: 25px 30px;
  display: flex;
  align-items: flex-start;
  gap: 20px;
  box-shadow: 0 8px 25px rgba(236, 72, 153, 0.15);
  border: 2px solid rgba(236, 72, 153, 0.2);
  backdrop-filter: blur(10px);
}

.note-icon {
  font-size: 32px;
  flex-shrink: 0;
  animation: noteBounce 2s ease-in-out infinite;
  filter: drop-shadow(0 2px 8px rgba(236, 72, 153, 0.3));
}

.note-text {
  font-size: 16px;
  line-height: 1.7;
  color: #374151;
  margin: 0;
  font-weight: 500;
}

.note-text strong {
  color: #1f2937;
  font-weight: 700;
}

/* Animations */
@keyframes float {
  0%, 100% { transform: translate(0, 0) rotate(0deg); }
  50% { transform: translate(30px, -30px) rotate(180deg); }
}

@keyframes personFloat {
  0%, 100% { transform: translateY(0) translateZ(20px); }
  50% { transform: translateY(-10px) translateZ(20px); }
}

@keyframes phoneShake {
  0%, 100% { transform: rotate(-15deg) translateZ(30px); }
  25% { transform: rotate(-12deg) translateZ(30px); }
  75% { transform: rotate(-18deg) translateZ(30px); }
}

@keyframes iconFloat {
  0%, 100% { transform: translateY(0) translateZ(10px); }
  50% { transform: translateY(-15px) translateZ(10px); }
}

@keyframes avatarFloat {
  0%, 100% { transform: translateY(0) translateZ(5px); }
  50% { transform: translateY(-12px) translateZ(5px); }
}

@keyframes starPulse {
  0%, 100% { transform: rotate(-15deg) scale(1); filter: drop-shadow(0 4px 12px rgba(255, 215, 0, 0.5)); }
  50% { transform: rotate(-15deg) scale(1.1); filter: drop-shadow(0 6px 18px rgba(255, 215, 0, 0.7)); }
}

@keyframes noteBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}

/* Responsive Design */
@media (max-width: 968px) {
  .best-part-content {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .best-part-left {
    order: 2;
  }

  .best-part-right {
    order: 1;
  }

  .support-illustration-modern {
    max-width: 350px;
    height: 350px;
  }

  .support-person-3d {
    width: 110px;
    height: 160px;
  }

  .person-head-3d {
    width: 55px;
    height: 55px;
  }

  .hair {
    width: 60px;
    height: 40px;
  }

  .face {
    width: 55px;
    height: 55px;
  }

  .person-body-3d {
    width: 80px;
    height: 100px;
  }

  .phone-3d {
    width: 40px;
    height: 70px;
    right: -25px;
  }

  .phone-screen {
    width: 40px;
    height: 60px;
  }

  .laptop-3d {
    width: 110px;
    height: 70px;
  }

  .laptop-screen {
    width: 110px;
    height: 65px;
  }

  .float-card {
    width: 50px;
    height: 50px;
    font-size: 22px;
  }

  .float-card.card-2 {
    width: 60px;
    height: 60px;
    font-size: 26px;
  }

  .float-avatar {
    width: 40px;
    height: 40px;
  }

  .avatar-face {
    width: 28px;
    height: 28px;
  }

  .best-part-heading {
    font-size: 36px;
  }

  .best-part-text {
    font-size: 18px;
  }
}

@media (max-width: 640px) {
  .best-part-section {
    padding: 50px 15px;
    margin: 40px 0;
  }

  .best-part-heading {
    font-size: 28px;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .star-icon {
    font-size: 40px;
  }

  .best-part-text {
    font-size: 16px;
  }

  .best-part-note {
    padding: 20px;
    flex-direction: column;
    gap: 15px;
  }

  .note-text {
    font-size: 14px;
  }

  .support-illustration-modern {
    max-width: 280px;
    height: 280px;
  }

  .support-person-3d {
    width: 90px;
    height: 130px;
  }

  .person-head-3d {
    width: 45px;
    height: 45px;
  }

  .hair {
    width: 50px;
    height: 35px;
  }

  .face {
    width: 45px;
    height: 45px;
  }

  .eye {
    width: 6px;
    height: 6px;
  }

  .left-eye {
    left: 18px;
    top: 22px;
  }

  .right-eye {
    right: 18px;
    top: 22px;
  }

  .mouth {
    width: 16px;
    height: 8px;
    bottom: 14px;
  }

  .person-body-3d {
    width: 65px;
    height: 80px;
  }

  .shirt {
    width: 65px;
    height: 80px;
  }

  .shirt::before {
    width: 24px;
    height: 24px;
    top: 15px;
  }

  .phone-3d {
    width: 32px;
    height: 55px;
    right: -20px;
    top: 40px;
  }

  .phone-screen {
    width: 32px;
    height: 45px;
  }

  .phone-screen::before {
    top: 6px;
    width: 24px;
    height: 3px;
  }

  .phone-screen::after {
    bottom: 6px;
    width: 20px;
    height: 20px;
  }

  .phone-button {
    width: 28px;
    height: 4px;
    bottom: -6px;
  }

  .laptop-3d {
    width: 90px;
    height: 55px;
  }

  .laptop-screen {
    width: 90px;
    height: 50px;
  }

  .screen-content::before {
    font-size: 18px;
  }

  .float-card {
    width: 40px;
    height: 40px;
    font-size: 18px;
  }

  .float-card.card-2 {
    width: 50px;
    height: 50px;
    font-size: 22px;
  }

  .float-avatar {
    width: 32px;
    height: 32px;
  }

  .avatar-face {
    width: 22px;
    height: 22px;
  }

  .avatar-face::before,
  .avatar-face::after {
    width: 3px;
    height: 3px;
    top: 9px;
  }

  .avatar-face::before {
    left: 7px;
  }

  .avatar-face::after {
    right: 7px;
  }
}
body {
  margin: 0 auto;
  padding: 0;
  font-family: "Nunito", sans-serif;
   color: #012C54;
}
html {
scroll-behavior: smooth;
}
p {
  font-size: 20px;
  color: #012C54;
  
}
h2 {
  font-size: 43px;
  color: #012C54;
}
.video-left-content-right ul li:last-child::after {
opacity: 0;
}
p.desc {
  font-size: 14px;
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}
.video-dem iframe {
  margin: 0 auto;
  display: table;
  left: 0;
  right: 0;
}
.stickybar.subscribebox .row .col-md-4 {
width: 25%;
flex: 0 0 25%;
max-width: 25%;
}
section.gtp-ofer iframe {
  border-radius: 10px;
  border: 7px solid #1177fe;
  width: 100% !important;
  height: 612px !important;
  object-fit: cover;
  object-position: center;
  max-width: 90%;
}

.launc-des-cup.pr-3 p {
font-size: 14px;
text-align: center;
}

.frame-price {
  box-shadow: rgb(221, 221, 221) 0px 0px 10px 1px;
  text-align: center;
  margin-top: 30px;
  padding: 20px;
}
section.gtp-ofer iframe {
  width: 100%;
  border-radius: 10px;
  border: 7px solid #1177fe;
}
  .video-dem iframe {
  border-radius: 10px;
  border: 7px solid #1177fe;
  width: 100% !important;
  height: 720px !important;
  object-fit: cover;
  object-position: center;
  max-width: 80%;
}
span.glass-head {
margin: 14px auto 30px;
display: table;
box-shadow: 0 0 10px 1px #ddd;
color: #0038a5;
line-height: 63px;
font-size: 49px;
padding: 20px 50px 15px;
border-radius: 10px;
}
.inner-steps-out ul {
  box-shadow: none;
  display: inline;
}
.inner-steps-out ul li {
  width: 100% !important;
  margin: 0px 0 11px !IMPORTANT;
}
.video-left-content-right ul {
padding: 0 !important;
margin: 15px 0 0 !important;
}
.video-left-content-right ul {
  box-shadow: rgb(221, 221, 221) 0px 0px 10px 1px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 24px;
  border-radius: 10px;
}
section.video-left {
  padding-bottom: 20px;
}
.single-bx .leadture-right {
  text-align: center;
  padding-bottom: 19px;
}
.container {
  max-width: 1200px;
  padding: 0;
}
.leadture-left ul li b {
  color: #D953FF;

}
.leadture-left ul li i
{
  color: #D953FF;
} 
.leadture-left.royal-clr h4, .leadture-left.royal-clr i
{
  color: #00C6D8;
}
.leadture-left.sky-clr h4, .leadture-left.sky-clr i
{
  color: #0022FF;
}
.leadture-left.gr-clr h4, .leadture-left.gr-clr i
{
  color: #00D042;
}
.leadture-left.red-clr h4, .leadture-left.red-clr i {
  color: #FF4D7A;
}
.leadture-left.prp-clr h4, .leadture-left.prp-clr i {
  color: #5B5BFF;
}
.leadture-left.pnk-clr h4, .leadture-left.pnk-clr i {
  color: #D8009B;
}
.leadture-left.yello-clr h4, .leadture-left.yello-clr i {
  color: #D8B400;
}
.lightbox {
/* Default to hidden */
display: none;

/* Overlay entire screen */
position: fixed;
z-index: 999;
top: 0;
left: 0;
right: 0;
bottom: 0;

/* A bit of padding around image */
padding: 1em;

/* Translucent background */
background: rgba(0, 0, 0, 0.8);
}
/* Unhide the lightbox when it's the target */
.lightbox:target {
display: block;
}
section.gift-sec iframe {
  height: 485px;
  position: static;
  width: 100%;
}
.lightbox video {
  max-width: 50%;
  margin: 0 auto;
  display: table;
}
.lightbox span {
/* Full width and height */
display: block;
width: 100%;
height: 100%;

/* Size and position background image */
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
.logo  img {
  max-width: 252px;
}
section#prizes h2 span {
  color: #FEDC01;
}
.launch-date {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 30px 0 33px;
}
.launch-date h5 img {
  margin-right: 11px;
}
.launch-date h5 img:last-child {
  margin-left: 23px;
}
.launch-date span {
  color: #fff;
  font-size: 27px;
  background: transparent;
  border-radius: 100px;
  width: 54px;
  height: 54px;
  margin: 0 19px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 10px 1px #dddddd4f;

  padding-top: 6px;
}
.launch-date h5 {
  background: #300560;
  color: #fff;
  font-size: 31px;
  text-transform: uppercase;
  padding: 8px 20px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  font-weight: 700;
}
.logo {
  padding-top: 30px;
  margin: 0 auto 13px;
  display: table;
  background: #fff;
  padding: 23px 40px;
  border-radius: 100px;
}
section.stream-play-section h5 {
  text-align: center;
  font-size: 23px;
  color: #012851;
  border-radius: 10px;

  padding: 5px 28px;
  margin: 56px auto 22px;
  display: table;
  font-weight: 600;
}
span.prp {
  color: #7539FF;
  
}
span.yel {
  color: #FFBC00;
  
}
span.sky {
  color: #0098FF;
  
}
span.rd {
  color: #FF0069;
  
}
span.grn {
  color: #29BE8B;
  
}
.video-left-content {
  box-shadow: 0 0 10px 1px #ddd;
  width: 100%;
  display: table;
  padding: 13px;
  border-radius: 10px;
}
.payment-outer {
  background-image: url("../images/payment-bk.png");
  background-size: cover;
  border-radius: 20px;
  padding: 30px 60px;
}
section.frame-section {
  padding: 70px 0 40px;
  background-repeat: no-repeat;
  background-image: url(../images/video-bk-banner.png);
  background-size: 100% 100%;
}
section.frame-section h3 {
  text-align: center;
  font-size: 42px;
  font-weight: 900;
  margin-bottom: 13px;
}
section.frame-section h4 {
  text-align: center;
  background-image: linear-gradient(to right, #0A93FE, #ED3C82, #FF3B48, #FF8C07);
  margin: 0 auto 25px;
  display: table;
  padding: 10px 40px;
  border-radius: 100px;
  font-weight: 800;
  color: #fff;
}
section.frame-section iframe {
  margin: 0 auto;
  display: table;
}
.video-left-frame img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 12px;
  max-width: 400px;
  margin: 0 auto;
  display: table;
}
.video-left-content ul {
  width: 48%;
  float: left;
  padding: 12px 20px !important;
  box-shadow: 0 0 10px 1px #ddd;
  margin: 0 10px;
}
.extra-margin {
padding: 0px 0 30px;
}

.video-left-content-right h6 {
color: #fff;
font-weight: 700;
font-size: 27px;
margin-bottom: 13px;
}
.video-left-content-right h5 {
color: #fff;
font-weight: 700;
font-size: 27px;
margin-bottom: 13px;
}
.poster img {
width: 100%;
max-width: 76%;
padding: 10px;
margin: 0 auto;
display: table;
}

.video-left-content-right ul li {
  position: relative;
  color: rgb(1, 44, 84);
  font-size: 17px;
  font-weight: 600;
  width: 49%;
  list-style: none;
  margin: 0px 0px 11px;
  background: rgba(161, 0, 0, 0.14);
  padding: 10px 16px 10px 47px;
  border-radius: 10px;
  border-width: 2px;
  border-style: dashed;
  border-color: rgba(161, 0, 0, 0.14);
  border-image: initial;
}
.video-left-content-right ul li.dep-two {
  background: #0060a124;
  border: 2px dashed #0060a1d9;
}
.video-left-content-right ul li.dep-three {
  background: #6b00a124;
  border: 2px dashed #6b00a1eb;
}
.video-left-content-right ul li.dep-four {
  background: #9aa10024;
  border: 2px dashed #9aa100;
}
.video-left-content-right ul li.dep-five {
  background: #00a11824;
  border: 2px dashed #00a118fa;
}
.problem-outre i {
  color: #E90000;
}
.video-left-content-right ul li img {
position: absolute;
  left: 13px;
max-width: 34px;
}

section.stream-play-section.jv-page-banner h2 {
  font-size: 30px;
  font-weight: 800;
  text-align: center;
  color: rgb(1, 44, 84);
  max-width: 900px;
  margin: 0px auto;
}
section.stream-play-section h1 {
  font-size: 40px;
  text-align: center;
  color: #012851;
  line-height: 64px;

  margin: 14px 0 22px;
}
/* section.video-left .video-left-frame .container22 {
  width: 100%;
  padding-top: 59%;
} */
iframe.responsive-iframe {
  width: 100%;
padding: 14px;
  background-image: url(../images/video-frame.png);
  border-radius: 20px;
  margin: 0 auto;
  left: 0;
  right: 0;
  background-size: 116% 124%;
  background-repeat: no-repeat;
  background-position: center;
}
.responsive-iframe {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
section.stream-play-section h6 span {
  color: #e64700;

}
section.stream-play-section h6 {
  text-align: center;
  font-size: 35px;
  width: 100%;
  color: rgb(1, 44, 84);
  max-width: 81%;
  position: relative;
  font-weight: 600;
  box-shadow: rgb(144, 144, 144) 0px 0px 10px 1px;
  padding: 21px 22px 16px;
  border-radius: 10px;
  margin: 0px auto;
  border-width: 4px;
  border-style: solid;
  border-color: rgb(28, 188, 255);
  border-image: initial;
  background: rgb(255, 255, 255) !important;
}
section.stream-play-section h6 span {
  -webkit-text-fill-color: transparent;
  background: linear-gradient(to left, rgb(169, 55, 242), rgb(255, 144, 4)) text;
}
section.tube-fetaure {
  padding: 80px 0;
  background-image: url("../images/grad-bk.jpg");
  background-size: cover;
  background-repeat: repeat;
}
section.tube-fetaure h3 {
  background-image: url("../images/heading-bk.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  color: #fff;
  padding: 35px 63px;
  margin: 0 auto;

  display: table;
}
.leadture-left ul li {
  list-style: none;
  margin-bottom: 6px;

  display: flex;
  align-items: center;
  column-gap: 11px;
}
.full-pt h6 {
  background: #FFC940;
  margin: 35px auto 0;
  display: table;
  font-size: 25px;
  padding: 11px 40px;
  border-radius: 100px;
  color: #012851;
  font-weight: 900;
}
.leadture-left h4 {
  font-size: 25px;
  color: #D953FF;

}
.leadture-left p {
  color: #7f7f7f;
  font-size: 16px;
}
.leadture-left ul {
  padding: 0;
  min-height: 90px;
  margin: 0;
}
.tube-fetaure-inner {
  background: #fff;
  padding: 40px;
  border-radius: 12px;
  margin-top: 30px;
  min-height: 550px;
}
.sec-stram-sec .video-left-frame img {
  width: 100%;
  float: right;
  margin-top: 0;
}
.fobes img {
  width: 100%;
}
.videoo-wapper::before {
  background-image: url(../images/video-bk-banner.png);
  content: "";
  top: 0;
  right: 0;
  width: 100%;
  height: 370px;
  position: absolute;
  background-repeat: no-repeat;
  background-position: top right;
}
header.main-header, section {
  position: relative;
}
.videoo-wapper {
  background-image: url(../images/video-bk-banner.png);
  background-size: contain;
  background-position: top -410px right;
  background-repeat: no-repeat;
}
section.stream-play-section.sec-stram-sec {
  padding-bottom: 90px;
      background-image: url(../images/present-bk.png);
  background-size: cover;
  background-position: center;
}
section.video-proceed {
  background: #49CA88;
  padding: 80px;
  text-align: center;
}
section.video-proceed h2 {
  font-size: 55px;

  color: #fff;
  margin-bottom: 30px;
}
.video-proceed-inner {
  background: #3537394a;
  border-radius: 7px;
  padding-bottom: 20px;
}
.video-proceed-inner p {
  font-size: 24px;
  color: #fff;

  max-width: 250px;
  margin: 0 auto 20px;
}
section.page-video-main.quick-demo.two-sec-video {
  background-image: url(../images/video-bk-1.png);
  background-position: top right;
  background-size: cover;
}
.video-proceed-inner img {
  margin-top: -30px;
  max-height: 256px;
}
section.video-proceed .row {
  max-width: 790px;
  margin: 0 auto;
}
section.nxt-gen-mian {
  padding: 80px 0;
}
.video-proceed-inner span {
  width: 100%;
  float: left;
  font-size: 49px;
  color: #fff;
  margin-top: -30px;
  letter-spacing: 5px;
font-weight: 900;
}
section.nxt-gen-mian h2 {
  font-size: 55px;
  text-align: center;
  line-height: 70px;

  margin-bottom: 30px;
}
section.nxt-gen-mian p {
  font-size: 39px;
  line-height: 57px;
  text-align: center;
  max-width: 750px;
  margin: 0 auto 50px;

}
section.nxt-gen-mian p span {
  position: relative;

}
section.nxt-gen-mian h2 span {
  background: #78F1FF;
  padding: 8px 17px 7px;
}
.next-gen-right.nex-gen-inner {
  background: #00CC88;
}
.next-gen-right.nex-gen-inner li {
  color: #085B31;
  border-color: #00cc886b;
}
section.nxt-gen-mian p span::before {
  position: absolute;
  height: 5px;
  width: 100%;
  background: #78f1ff;
  content: "";
  bottom: -6px;
  left: 0;
}
.nex-gen-inner {
  background: #E3335B;
  border-radius: 7px;
  padding: 30px;
}
.nex-gen-inner h3 {
  text-align: center;
  color: #fff;
  font-size: 35px;
  margin-bottom: 20px;

}
.nex-gen-inner ul {
  background: #FFFFFF;
  padding: 30px 60px;
  border-radius: 8px;
}
.nex-gen-inner ul li {
  list-style: none;
  font-size: 23px;
  line-height: 32px;
  border-bottom: 1px dashed #e3335b52;
  padding: 12px 0;
  position: relative;
  color: #9F345F;
  padding-left: 35px;

}
.nex-gen-inner ul li img {
  position: absolute;
  left: 0;
}
section.stream-play-section.sec-stram-sec h5 {
  font-size: 63px;
  color: #0099FF;
  background: transparent;
  font-family: 'Nanum Pen';
  font-weight: 400;
}
section.stream-play-section.sec-stram-sec li {
  font-size: 24px;
  line-height: 37px;
  padding: 11px 0 10px 35px;
}
.sec-stram-sec .video-left-content ul li b {
  color: #0036B5;
  font-weight: 600;
}
.sec-stram-sec .video-left-content ul li a b {
  color: #000;
}
.stream-inner h4 {
  text-align: center;
  background: #00AF56;
  border: 1px solid #00974A;
  border-radius: 10px;
  font-size: 21px;
  padding: 10px 50px;
  color: #fff;
  line-height: 33px;
  margin: 0 5px 5px;

}
.stream-inner {
  max-width: 896px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  position: relative;
}
.stream-inner::before {
  position: absolute;
  right: -96px;
  top: -30px;
  width: 60px;
  height: 163px;
  background-image: url("../images/rocket.png");
  background-repeat: no-repeat;
  content: "";
  background-size: 100%;
  transform: rotate(18deg);
}
.stream-inner span {
      color: #00AF56;
  font-size: 79px;
  line-height: 1;
  position: relative;
  top: 0px;
}
.video-left-content ul li u {
  
  color: #0036B5;
}
section.video-left .col-md-7 {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 56.333333%;
  flex: 0 0 56.333333%;
  max-width: 56.333333%;
}
section.video-left .col-md-5 {
  -ms-flex: 0 0 43.666667%;
  flex: 0 0 43.666667%;
  max-width: 43.666667%;
}

section.video-left {
  padding-top: 43px;
}
section.stream-play-section h1 span {
  position: relative;
  z-index: 9;
  background: linear-gradient(to right, #FB7434, #852F83);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  border-bottom: 5px solid #a8436c;
}
.video-gradient-upper {
  background-color: white;
  border-radius: 15px;
  height: 463px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.video-left-content ul li {
  min-height: 101px;
}
.video-left-content {
  margin-top: 20px;
}
.video-left-content ul li {
  list-style: none;
  font-size: 18px;

  position: relative;
  border-bottom: 1px dashed #ddd;
  padding: 8px 0 7px 35px;
  line-height: 27px;
  font-weight: 600;
  color: #000000;
}
.fet-video-btn a:hover img {
  transform: scale(1.02);
  transition: 0.5s;
}
.fet-video-btn a img {
  transform: scale(1);
  transition: 0.5s;
}
.page-video-main .container {
  max-width: 1280px;
}
.video-gradient img {
  width: 100%;
  margin-top: -70px;
}
.video-left-content ul {
  padding:  0;
}
.video-left-content ul li b {
  
  color: #0036B5;
}
.video-left-content ul li img {
  position: absolute;
  left: 0;
  top: 14px;
}
.video-left-content ul li a
{
color:#000;
text-decoration:underline;
}
.video-left-content ul li:last-child {
  border-bottom: 0;
}
section.sales-video h3 {
  text-align: center;
  font-size: 33px;
  line-height: 42px;
  color: #20253D;

  margin: 0;
}
.sales-bdr img {
  text-align: center;
  margin: -47px auto 8px;
  display: table;
  background: #fff;
  padding: 0 19px;
}
section.sales-video {
  padding-top: 62px;
}
section.sales-video h3 span.prp {
  color: #7539FF;
}
section.sales-video h3 span.yel {
  color: #FFBC00;
}
section.sales-video h3 span.sky {
  color: #0098FF;
}
section.sales-video h3 span.rd {
  color:#FF0069;
}
section.sales-video h3 span.grn {
  color: #29BE8B;
}
.sales-bdr {
  border-top: 1px dashed #ddd;
  border-bottom: 1px dashed #ddd;
  padding: 31px 0 20px;
}
section.payment-section h2 b label {

}
section.payment-section h2 {
  text-align: center;
  color: #20253D;
  line-height: 44px;
  margin-top: 55px;
  font-size: 32px;

}
section.payment-section h2 span {
  background: #FC3666;
  color: #fff;
  padding: 9px 10px 3px;
  font-size: 44px;
}
section.payment-section h2 b {

}
section.payment-section h2 label {
  position: relative;
  margin: 0;
}
section.payment-section h2 label::before {
  height: 5px;
  content: "";
  left: 0px;
  bottom: 0;
  background: #FC3666;
  width: 140px;
  position: absolute;
}	
.payment-inner {
  background: #F5FBFF;
  border: 1px solid #0099ff38;
  padding: 38px 88px;
  text-align: center;
  margin-top: 85px;
}
.payment-inner p a {
  color: #2C3C47;
  text-decoration: underline;
}
.prise-code {
  border: 1px  dashed #FF0069;
  max-width: 400px;
  margin: 22px auto 21px;
  background: #F8FCF2;
}
.fet-video-btn {
  margin-bottom: 14px;
}
p.pay-down {
  margin: 20px 0 11px;
  color: #546774;
}
.prise-code p span {
  color: #FF0069;
}
.prise-code p {
  margin: 0;
  padding: 9px 0 6px;
  font-size: 22px;
  
}
.payment-inner h3 {
  font-size: 41px;
  color: #0036B5;

}
section.chat-card-section h2 {
  font-size: 43px;
  text-align: center;
  line-height: 58px;
  font-family: 'Axiforma-Book';
  border-top: 1px dashed #ddd;
  margin-top: 90px;
  padding-top: 85px;
  position: relative;

}
section.chat-card-section h2 b {
  color: #0852FE;
}
.payment-chat-img {
  border-bottom: 1px dashed #ddd;
  padding-bottom: 100px;
}
section.chat-card-section h2::before {
  position: absolute;
  left: 0;
  top: 50px;
  content: "";
  width: 65px;
  height: 43px;
  background-image: url("../images/quot.png");
  background-repeat: no-repeat;
  background-size: 100%;
}
section.page-video-main h2 {
  margin-bottom: 40px;
}
section.page-video-main .video-gradient {
  position: relative;
}
section.page-video-main .video-gradient-upper {
  max-width: 830px;
  height: 530px;
}
section.page-video-main {
  padding-top: 130px;
  text-align: center;
  background-image: url(../images/video-bk.png);
}
section.page-video-main .video-gradient::before {
  position: absolute;
  content: "";
  width: 78px;
  height: 78px;
  background-image: url(../images/video-bf.png);
  background-repeat: no-repeat;
  background-size: 100%;
  top: -10px;
  left: -10px;
}
section.page-video-main .video-gradient::after {
  position: absolute;
  content: "";
  width: 78px;
  height: 78px;
  background-image: url(../images/video-af.png);
  background-repeat: no-repeat;
  background-size: 100%;
  top: -10px;

  right: -10px;
}

section.video-step-page h2 {
  text-align: center;
  padding: 0 110px;
  margin-bottom: 80px;
}
section.video-step-page {
  padding-top: 90px;
  padding-bottom: 90px;
}
section.welcm-introduction h2 span {
  color: #00A8FF;
  font-family: 'Nanum Pen';
}
section.welcm-introduction h2 {
  font-size: 36px;
  margin-bottom: 40px;
}
.br-top {
  border-top: 1px dashed #ddd;
  padding-top: 70px;
}
.welcm-introduction-left ul {
  margin: 0;
  padding: 0;
}
.welcm-introduction-left ul li img {
  position: absolute;
  left: 0;
  top: 7px;
}
.welcm-introduction-left ul li {
  font-size: 24px;
  border-bottom: 1px solid #ddd;
  width: 100%;
  float: left;
  padding: 13px 0;
  line-height: 41px;
  list-style: none;
  position: relative;
  padding-left: 60px;
  font-size: 23px;
}
.welcm-introduction-left ul li b {

}
.video-step-left span {
  font-size: 35px;
  font-family: 'GT Walsheim-Pro-Condensed-reg';
  background: #FF9100;
  color: #fff;
  padding: 4px 6px 2px;
  border-radius: 4px;
  border-bottom: 2px solid #FF6F00;
  border-left: 2px solid #FF6F00;
}
.fobes {
  width: 100%;
  float: left;
  border-radius: 6px;
  margin-top: 20px;
}
.welcm-introduction-left ul li:last-child {
  border: 0;
}
.welcm-introduction-right img {
  position: relative;
  left: 30px;
}
.video-step-left h3 {
  font-size: 38px;
  margin: 13px 0 14px;

}
.video-step-left p {
  font-size: 24px;
  line-height: 42px;
  font-weight: 600;
}
section.video-step-page .row {
  padding-bottom: 170px;
  position: relative;
}
.video-step-right img {
  width: 100%;
  height: 190px;
  object-fit: cover;
}
.software-five img {
  width: 100%;
  max-width: 890px;
}
.lightbox:target img {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  display: table;
}
section.video-step-page h2 span {
  position: relative;
}
section.video-step-page h2 span::before {
  height: 5px;
  content: "";
  left: 0;
  bottom: -6px;
  background: #FC3666;
  width: 100%;
  position: absolute;
}
section.video-step-page .row::before {
  position: absolute;
  content: "";
  width: 340px;
  height: 100px;
  background-image: url(../images/arrow-dots.png);
  background-repeat: no-repeat;
  bottom: 23px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
section.video-step-page .row:nth-child(3)::before {
  background-image: url(../images/arrow-dots-1.png);
  height: 100px;
  width: 360px;
}
.video-step-left span.gr {
  background: #1aa8ff;
  border-color: #1189d2;
}
.video-step-left span.bl {
  background: #34C47A;
  border-color: #17a95d;
}
section.video-step-page .row:last-child::before
{
  display: none;
}
section.video-step-page .row:last-child {
  padding-bottom: 0;
}
section.welcm-introduction {
  background: -moz-linear-gradient(45deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 41%, rgba(255,255,255,0.76) 49%, rgba(125,185,232,0.51) 100%);
  background: -webkit-linear-gradient(45deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0.8) 41%,rgba(255,255,255,0.76) 49%,rgba(125,185,232,0.51) 100%);
  background: linear-gradient(45deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0.8) 41%,rgba(255,255,255,0.76) 49%,rgba(125,185,232,0.51) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#827db9e8',GradientType=1 );
  padding: 70px 0;
  background-image: url(../images/author-bk.png);
  background-repeat: no-repeat;
  background-size: cover;
}
section.group-colog-sec {
padding: 80px 0 70px;
  background-image: url(../images/team-bk.png);
  background-size: cover;
  background-position: bottom -390px center;
  background-repeat: no-repeat;
  position: relative;
}
section.powerful-form {
  padding-top: 110px;
}
.welc-gradi p {
  text-align: center;
  font-size: 27px;
  line-height: 41px;
  padding: 12px 30px;
}
.welc-gradi p span {
  color: #2FA669;

}
section.group-colog-sec h2 span {
  position: relative;

}
img.down-arrow {
  margin: 25px auto 0;
  display: table;
  position: absolute;
  bottom: -54px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
section.group-colog-sec h2 span::before {
  position: absolute;
  left: 0;
  bottom: 0;
  content: "";
  background: #49CA88;
  width: 100%;
  height: 5px;
}
img.grp-img {
  width: 100%;
}

.group-colog-sec h6 {
  text-align: center;
  text-transform: uppercase;
  font-size: 30px;
  line-height: 42px;
  background: #fff;
  padding: 5px 50px;
  margin-top: 35px;
}

.group-colog-sec h6 span {
  color: #FC3666;
}
section.group-colog-sec h2 {
  font-size: 36px;
  line-height: 50px;
  text-align: center;
}

section.powerful-form h2 {
  font-size: 62px;
  color: #465B80;
}
.welc-gradi {
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#81ecb5+0,ffffff+16,ffffff+27,ffffff+98&0.39+0,0+100 */
background: -moz-linear-gradient(top,  rgba(129,236,181,0.39) 0%, rgba(255,255,255,0.33) 76%, rgba(255,255,255,0.29) 27%, rgba(255,255,255,0.01) 98%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(129,236,181,0.39) 0%,rgba(255,255,255,0.33) 76%,rgba(255,255,255,0.29) 27%,rgba(255,255,255,0.01) 98%,rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(129,236,181,0.39) 0%,rgba(255,255,255,0.33) 76%,rgba(255,255,255,0.29) 27%,rgba(255,255,255,0.01) 98%,rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6381ecb5', endColorstr='#00ffffff',GradientType=0 ); /* IE6-9 */

  border-radius: 9px;
  padding: 53px 50px;
}
section.powerful-form h2 {
  font-size: 62px;
  color: #465B80;
  border-bottom: 5px solid #FF5050;
}
section.powerful-form h2 span {

  color: #1B2E4E;
}
.powerful-form-left ul {
  padding: 0;
  margin: 0;
}
.powerful-form-left ul li img {
  position: absolute;
  left: 5px;
  top: 11px;
  max-width: 39px;
}
.powerful-form-left p {
  text-align: right;
  font-size: 24px;
  font-style: italic;
}
section.help-less-feal {
  padding: 80px 0;
}
section.help-less-feal h4 {
  background: #FFFBEF;
  padding: 10px;
  font-size: 40px;

  color: #FF0B34;
  padding: 16px 1px 16px 139px;
  text-align: left;
  position: relative;
  max-width: 999px;
  margin: 0 auto 50px;
}
section.help-less-feal h4 img {
  position: absolute;
  left: 30px;
  max-width: 90px;
  top: 13px;
}
section.help-less-feal h2 {
  text-align: center;
  font-size: 67px;
  line-height: 87px;
  margin: 30px 0;
  color: #20253D;
}
section.help-less-feal h2 span {
  color: #515A81;
}
section.help-less-feal p {
  font-size: 30px;
  line-height: 51px;
  text-align: center;
  padding: 0 90px;
  color: #363F68;
}
section.help-less-feal p span:first-child {
  color: #7034FF;
}
section.help-less-feal p span:nth-child(2) {
  color: #49CA88;
}
section.help-less-feal p span:last-child {
  color: #FC3666;
}
section.help-less-feal h6 {
  font-size: 34px;
  line-height: 56px;
  color: #417AFF;
  text-align: center;

}
.fact-data {
  width: auto;
  margin: 40px auto 80px;
  display: table;
  position: relative;
}
.fact-data h3 {
  font-size: 33px;
  background: #0099FF;
  color: #fff;
  padding: 20px 40px 15px;
  border-radius: 100px;
  position: relative;

}
.fact-chart::before {
  width: 10px;
  height: 32px;
  background: #0099ff;
  content: "";
  bottom: -20px;
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  border-radius: 10px;
z-index:9;
}
.fact-data::before {
  position: absolute;
  left: -43px;
  content: "";
  bottom: -85px;
  width: 420px;
  height: 78px;
  background-image: url("../images/chart-left.png");
  background-repeat: no-repeat;
}
.fact-data::after {
  position: absolute;
  right: -185px;
  content: "";
  bottom: -85px;
  width: 420px;
  height: 78px;
  background-image: url("../images/chart-right.png");
  background-repeat: no-repeat;
}
.help-inner span {
  background: #C4E9FF;
  border-radius: 11px;
  width: 100%;
  float: left;
  min-height: 265px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}
.help-inner.pl-4 {
  position: relative;
  left: -30px;
  padding-left: 90px !important;
}
.help-inner.pr-4 {
  position: relative;
  left: 30px;
   padding-right: 90px !important;
}
section.help-less-feal .help-inner p {
  padding: 0 50px;
  font-size: 22px;
  line-height: 38px;
}
.powerful-form-left ul li {
  list-style: none;
  background: #F2FBFF;
  margin-bottom: 16px;
  position: relative;
  width: 100%;
  float: left;
  padding: 12px;
  font-size: 23px;
  line-height: 37px;
  color: #20253D;
  padding-left: 49px;
}

section.vimeo-section h2 {
  color: #20253D;
  font-size: 49px;
  text-align: center;

  margin-bottom: 40px;
}
section.vimeo-section p {
  font-size: 32px;
  text-align: center;
}
a.cm-btn {
  font-size: 26px;
  text-align: center;
  background: #FC3666;
  color: #fff;
  padding: 8px 20px;
  margin: 0 auto 30px;
  display: table;

}
section.vimeo-section h6 {
  font-size: 39px;
  width: 100%;
  text-align: center;
  margin: 30px 0 12px;
  font-style: italic;
}
section.vimeo-section h3 {
  font-size: 26px;
  line-height: 46px;
  text-align: center;
  margin-bottom: 60px;

}
section.vimeo-section h3 span {
  color: #FC3666;

  font-size: 32px;
}
section.probem-facts {
  padding-top: 100px;
}
.probem-facts-inner h6 {
  font-size: 38px;
  background: #FC3666;
  color: #fff;
  text-align: center;
  max-width: 530px;
  padding: 20px 0 11px;
  margin-bottom: 28px;

}
.probem-facts-inner p  a {
  color: #20253D;
  text-decoration: underline;
}
.probem-facts-inner p, section.probem-facts p {
  font-size: 24px;
  line-height: 44px;
  margin-bottom: 33px;
}
.probem-facts-inner p span {
  color: #FC3666;

}
.probem-facts-inner-right {
  margin-top: 40px;
}
section.probem-facts h4 {
  font-size: 30px;
  color: #0036B5;
  margin-top: 40px;

}
span.solu-tag {
  background: #58CB45;
  color: #fff;
  font-size: 45px;
  text-transform: uppercase;

  padding: 20px 32px 9px;
  border-radius: 7px;
  margin-bottom: 20px;
  float: left;
}
span.solu-tag {
  background: #58CB45;
  color: #fff;
  font-size: 45px;
  text-transform: uppercase;

  padding: 20px 32px 9px;
  border-radius: 7px;
  margin-bottom: 20px;
  float: left;
}
.probem-facts-inner.think-two ul li {
  list-style: none;
  margin-bottom: 40px;
  font-size: 24px;
  line-height: 41px;
  position: relative;
  padding-left: 44px;
  font-weight: 600;
}
.probem-facts-inner.think-two ul
{
width:100%;

}
.probem-facts-inner.think-two ul {
  width: 100%;
  padding: 0;
  float: left;
  margin-top: 10px;
}
section.probem-facts p.iamg-tag {
  font-size: 27px;
  border-bottom: 1px dashed #dddd;
  padding-bottom: 40px;
  margin-bottom: 90px;
}
.probem-facts-inner.think-two ul li img {
  position: absolute;
  left: 0;
}
.probem-facts-inner.think-two ul li span, .probem-facts-inner.think-two ul li span a {
  color: #028E47;

}
.nex-gen-inner ul li:last-child {
  border: 0;
}
.border-tp {
  border-top: 1px dashed #ddd;
  padding-top: 70px;
  border-bottom: 1px dashed #ddd;
  padding-bottom: 70px;
}
section.page-video-main.quick-demo {
  padding-top: 30px;
}
section.video-blogs {
  padding-top: 70px;
  background: -moz-linear-gradient(top, rgba(227,241,253,0.10) 0%, rgba(255,252,252,0.52) 50%, rgba(227,241,253,0.79) 100%);
  background: -webkit-linear-gradient(top, rgba(227,241,253,0.10) 0%,rgba(255,252,252,0.52) 50%,rgba(227,241,253,0.79) 100%);
  background: linear-gradient(to bottom, rgba(227,241,253,0.10) 0%,rgba(255,252,252,0.52) 50%,rgba(227,241,253,0.79) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#40e3f1fd', endColorstr='#c9e3f1fd',GradientType=0 );
  padding-bottom: 50px;
}
section.video-blogs h2 {
  text-align: center;
  font-size: 46px;
  line-height: 69px;
  margin-bottom: 30px;
}
.video-blog-inner {
  background: #fff;
  border: 1px solid #97EAFF;
  padding: 18px;
  border-radius: 7px;
  min-height: 448px;
  margin-bottom: 35px;
}
.video-blog-inner span {
  width: 100%;
  height: 225px;
  float: left;
  background: #8AD7FF;
  border-radius: 8px;
  margin-bottom: 30px;
}
.video-blog-inner h4 {
  font-size: 18px;
  color: #20253D;
  padding-right: 0;

}
.video-blog-inner h6 {
  font-size: 17px;
  line-height: 23px;
  color: #20253D;
  font-weight: 600;
}
.video-blog-inner p {
  font-size: 16px;
  line-height: 25px;
  color: #5E6584;
}
section.video-blogs h3 {
  font-size: 35px;
  color: #013DB4;
  text-align: center;
  margin-bottom: 30px;
}
.purple-video-blog {
  border-top: 1px dashed #ddd;
  padding-top: 72px;
  margin-top: 30px;
}
img.sml-blog-ogo {
  margin: -89px auto 77px;
  display: table;
  background: #fff;
  padding: 0 10px;
}
section.video-blogs .purple-video-blog h2 {
  font-size: 41px;
  line-height: 60px;
  color: #3E12A7;
}
section.video-blogs .purple-video-blog .video-blog-inner {
  border-color: #A37FF6;
  min-height: 492px;
}
section.video-blogs .purple-video-blog .video-blog-inner span {
  background: #A37FF6;
}
section.video-blogs .row {
  justify-content: center;
}
section.video-blogs .purple-video-blog.gren-blog h2 {
  color: #0B753F;
}
section.video-blogs .purple-video-blog.gren-blog .video-blog-inner {
  border-color: #B1F3D1;
  min-height: 450px;
}
section.video-blogs .purple-video-blog.gren-blog .video-blog-inner span {
  background: #49CA88;
}   
section.video-blogs .purple-video-blog.red-blog h2 {
  color: #BC173C;
}
section.video-blogs .purple-video-blog.red-blog .video-blog-inner {
  border-color: #FFC2D1;
}
section.video-blogs .purple-video-blog.red-blog .video-blog-inner span {
  background: #FF5B83;
}
section.video-blogs .purple-video-blog.yellow-blog h2 {
  color: #810000;
}
section.video-blogs .purple-video-blog.yellow-blog .video-blog-inner {
  border-color: #F2DFA2;
  min-height: 479px;
}
section.video-blogs .purple-video-blog.sky-blog h2 {
  color: #005B5B;
}
section.video-blogs .purple-video-blog.sky-blog .video-blog-inner {
  border-color: #22DDDC;
  min-height: 390px;
}
section.video-blogs .purple-video-blog.sky-blog .video-blog-inner span {
  background: #48F3F2;
}
section.video-blogs .purple-video-blog.yellow-blog .video-blog-inner span {
  background: #FCD249;
}
section.play-market h2 {
  border-top: 1px dashed #ddd;
  padding-top: 80px;
  text-align: center;
  font-size: 56px;
  color: #20253D;
  margin-bottom: 40px;
}
.play-market-inner {
  background: #E7FEE7;
  border: 1px solid #84F8BD;
  border-radius: 10px;
  text-align: center;
  padding: 20px 10px;
  margin-bottom: 30px;
}
.play-market-inner img {
  max-height: 104px;
  min-height: 144px;
  margin-bottom: 20px;
}
.play-market-inner h4 {
  font-size: 22px;
  color: #20253D;
  margin-bottom: 0;

}
.play-market-inner p {
  font-size: 16px;
  line-height: 23px;
  color: #20253D;
  margin-bottom: 0;
  min-height: 50px;
  
}
.play-market-inner.mark-tw
{
  border-color: #78DBF5;
  background: #DBF7FE;
}
.play-market-inner.mark-thr
{
    border-color: #C6B1F8;
  background:#F9F6FF;
}
.play-market-inner.mark-fr
{
border-color: #78DBF5;
  background:#DBF7FE;
}
.play-market-inner.mark-fiv
{
border-color: #FEC301;
  background:#FFFAE8;
}
.play-market-inner.mark-sx
{
  border-color: #84F8BD;
  background:#E7FEE7;
}
.play-market-inner.mark-sev
{
      border-color: #FFC9D6;
  background:#FFECF1;
}
section.circle-flow h2 {
  border-top: 1px dashed #ddd;
  padding-top: 80px;
  text-align: center;
  margin-bottom: 40px;
}
section.gift-sec h3 {
  background: #58f998bf;
  text-align: center;
  padding: 13px 30px;
  border-bottom: 8px;
  font-size: 38px;
  line-height: 49px;
  border-radius: 10px;
  max-width: 87%;
  margin: 20px 0;
  margin: 20px auto;

}
section.video-left .video-gradient img {
  margin-top: 0px;
  transform: scale(1.2);
  height: auto;
  position: relative;
  left: 0;
}
section.video-left {
  overflow: hidden;
}
section.play-market {
  padding-bottom: 50px;
}
section.circle-flow img {
  margin: -110px auto;
  display: table;
  width: 100%;
}
section.circle-flow {
  padding-bottom: 70px;
}
section.gift-sec h4 {
  text-align: center;
  font-size: 33px;
  line-height: 41px;
  color: #1B2E4E;
  border-top: 1px dashed #ddd;
  padding-top: 130px;
  margin-top: 60px;
  position: relative;

}
section.gift-sec h4 span {
  color: #FC3666;
}
section.gift-sec p {
  font-size: 32px;
  line-height: 44px;
  text-align: center;
  color: #2B446E;
}
section.gift-sec .video-gradient img {
  margin-top: -20px;
}
section.gift-sec p b {

}
section.gift-sec .video-left-frame {
  max-width: 830px;
  margin: 0 auto;
  position: relative;
}
section.gift-sec h4::before {
  content: "";
  position: absolute;
  width: 83px;
  height: 83px;
  background-size: 100%;
  bottom: 0;
  left: 0;
  background-image: url(../images/gift.png);
  background-repeat: no-repeat;
}
section.gift-sec .video-left-frame::before {
  content: "";
  position: absolute;
  width: 1112px;
  height: 203px;
  background-size: 100%;
  top: -180px;
  left: -140px;
  background-image: url(../images/patr.png);
  background-repeat: no-repeat;
  opacity: 0.5;
}
section.gift-sec .video-left-frame::after {
  content: "";
  position: absolute;
  width: 110px;
  height: 110px;
  background-size: 100%;
  top: 40px;
  right: -150px;
  background-image: url(../images/clockpng.png);
  background-repeat: no-repeat;
}
section.jam-packed h2 {
  font-size: 65px;
  color: #0036B5;
  text-align: center;
  margin-bottom: 40px;
}
.jam-packinner h3 {
  font-size: 23px;
  color: #0036B5;
  margin: 13px 0;

}
.jam-packinner p {
  font-size: 20px;
  line-height: 32px;
  margin-bottom: 50px;
  padding-right: 10px;
  
}
section.gift-sec {
  background-image: url(../images/grad-bk.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100%;
  padding-bottom: 100px;
}
section.jam-packed {
  padding-bottom: 90px;
}
.meet-team-inner-up {
  border-top: 1px dashed #ddd;
  border-bottom: 1px dashed #ddd;
  padding: 80px 0;
  text-align: center;
}
.meet-team-inner {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding-bottom: 11px;
  overflow: hidden;
  margin-bottom: 30px;
  box-shadow: 0 0 10px 1px #ddd;
}
.meet-team-inner h3 {
  font-size: 24px;
  color: #20253D;
}
.meet-team-inner p {
  font-size: 18px;
  line-height: 25px;
  color: #6D7577;
  padding: 0 10px;
}
.meet-team-inner-up h2 {
  margin-bottom: 40px;
}
p.busi {
  margin-top: 10px;
  font-size: 28px;
}
.meet-team-inner span {
  background: #08CCFE;
  width: 100%;
  float: left;
  padding: 20px 0px;
  margin-bottom: 24px;
}
.meet-team-inner.tm-2 span {
  background: #7034FF;
}
.meet-team-inner.tm-3 span {
  background: #22DDDC;
}
.meet-team-inner.tm-4 span {
  background: #FEC301;
}
.meet-team-inner.tm-5 span {
  background: #FC3666;
}
.meet-team-inner.tm-6 span {
  background: #0852FE;
}
.meet-team-inner.tm-7 span {
  background: #49CA88;
}
.meet-team-inner.tm-8 span {
  background: #08CCFE;
}
.meet-team-inner.tm-9 span {
  background: #7034FF;
}
section.good-by {
  text-align: center;
  padding: 80px 0;
  background-image: url("../images/mn-bk.png");
  background-size: 100%;
  background-position: top -110px left 60px;
  background-repeat: no-repeat;
}
section.good-by h2 {
  margin-bottom: 50px;
}
.good-bay-inner {
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 15px 0;
  box-shadow: 3px 3px 2px 0px #dddddd7a;
  margin-bottom: 30px;
  background: #fff;
}
.good-bay-inner p {
  font-size: 21px;
  padding: 0 20px;
  margin-top: 14px;
  min-height: 95px;

}
section.hand-clock {
  background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(255,255,255,0.97) 4%, rgba(255,255,255,0.68) 46%, rgba(252,205,240,0.3) 100%);
  background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.97) 4%,rgba(255,255,255,0.68) 46%,rgba(252,205,240,0.3) 100%);
  background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(255,255,255,0.97) 4%,rgba(255,255,255,0.68) 46%,rgba(252,205,240,0.3) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#4dfccdf0',GradientType=0 );
  padding: 0px 0 80px;
}
section.hand-clock h2 {
  font-size: 52px;
  text-align: center;
  margin-bottom: 40px;
  color: #E3335B;
  border-top: 1px dashed #ddd;
  padding-top: 70px;
}
.hand-clock-right p {
  font-size: 34px;
  margin-bottom: 40px;
  line-height: 62px;
}
.hand-clock-right p span {
  color: #E3335B;

}
section.hand-clock h2 span {
  color: #0036B5;

}
.hand-clock-right p:nth-child(2) span {
  color: #0036B5;
}
.hand-clock-right p:nth-child(2) span a {
  color: #0036B5;
text-decoration:underline;
}
section.full-refund {
  padding: 120px 0 50px;
  background-image: url(../images/mn-bk.png);
  background-size: 100%;
  background-position: top -110px left 60px;
  background-repeat: no-repeat;
}
.refund-btn {
  width: 100%;
  float: left;
  text-align: center;
}
.refund-btn a {
  background: #0EC4A4;
  color: #fff;
  box-shadow: 3px 3px 1px 4px #2da28f;
  padding: 20px 50px 13px;
  font-size: 40px;

  border-radius: 100px;
text-decoration:none;
}
section.hand-clock.money-hand-clock {
  background: transparent;
  padding-top: 80px;
}
.money-brd {
  border-top: 1px dashed #ddd;
  padding-top: 80px;
  border-bottom: 1px dashed #ddd;
  padding-bottom: 80px;
}
img.head-img-pg {
  margin: 0 auto 30px;
  display: table;
}
.money-brd .hand-clock-right p {
  line-height: 34px;
  font-size: 25px;
}
.money-brd .hand-clock-right p span {
  color: #E34C1C;
}
p.hd-cloc-btn {
  line-height: 34px;
  font-size: 25px;
  margin-top: 30px;
}
section.faq-section {
  padding: 80px 0 40px;
  background: #E6EBF5;
}
section.faq-section h3 {
  font-weight: 900;
  text-align: center;
}
.faq-section h2 {
  background: #fff;
  display: table;
  margin: 0 auto;
  padding: 0 20px;
  margin-bottom: 40px;
  position: relative;
}
.faq-inner {
  background: #FAFAFA;
  padding: 25px 30px;
  border-radius: 12px;
  margin-bottom: 0;
  height: 100%;
}
.faq-brd .col-md-6 {
  margin-bottom: 17px;
}
p.footer-p {
  font-size: 14px;
  line-height: 26px;
  border-top: 2px solid #ddddddd6;
  border-bottom: 2px solid #ddddddd4;
  color: #fff;
  padding: 20px 0;
  font-weight: 400;
}
.footer-right ul li a {
  color: rgb(255, 255, 255);
  font-weight: 500;
}
.footer-right ul li {
  display: inline;
  margin-left: 23px;
  list-style: none;
}
.footer-right ul {
  display: flex;
  color: rgb(255, 255, 255);
  margin-left: auto;
  float: right;
  margin-top: 20px;
}
h6.no-more {
  font-size: 42px;
  color: rgb(237, 79, 68);
  font-weight: 800;
  text-align: center;
  margin: 0px;
}
.footer-right ul {
  padding: 0;
  text-align: right;
  margin: 25px 0 0;
}
.footer-right ul li a {
  font-size: 18px;
  color: #fff;
  font-weight: 400;
}
.footer-right ul li {
  list-style: none;
  display: inline;
  margin-left: 23px;
}
.footer-left p {
  font-size: 14px;
  color: #fff;
  font-weight: 500;
  text-align: left;
}
.faq-inner h4 {
  font-size: 20px;
  position: relative;
  padding-left: 38px;
  line-height: 34px;
  font-weight: 800;
}
.faq-inner p {
  font-size: 18px;
  line-height: 28px;
  padding-left: 40px;
  margin-bottom: 0;
}
.faq-inner h4 img {
  position: absolute;
  left: 0;
  top: 3px;
}
.faq-brd {
  border-top: 1px dashed #ddd;
  margin-top: -80px;
  padding-top: 100px;
}
.faq-brd h2 img {
  margin-right:7px;
}
p.hd-cloc-btn span {
  color: #F3B19D;

}
.money-brd .hand-clock-right p span a {
  color: #E34C1C;
text-decoration:underline;

}
section.full-refund h2 {
  margin: 0 auto;
  display: table;
  color: #09502C;

  font-size: 65px;
  border-bottom: 9px dashed #09502c14;
  padding: 40px 0 11px;
  margin-bottom: 41px;
}
.full-refund-left p {
  font-size: 23px;
  line-height: 40px;
  margin-top: 48px;
}
.refnd-brd {
  border-bottom: 1px dashed #ddd;
  padding-bottom: 90px;
}
section.stream-play-section h5 span {
  
  color: #FF3939;
}
/*--iot-1--*/
header.main-header.iot-one .logo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 20px;
}
header.main-header.iot-one .logo h3 {
  font-size: 24px;

  background: rgb(254,119,1);
  background: -moz-linear-gradient(left, rgba(254,119,1,1) 1%, rgba(255,78,121,1) 100%);
  background: -webkit-linear-gradient(left, rgba(254,119,1,1) 1%,rgba(255,78,121,1) 100%);
  background: linear-gradient(to right, rgba(254,119,1,1) 1%,rgba(255,78,121,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fe7701', endColorstr='#ff4e79',GradientType=1 );
  color: #fff;
  text-shadow: 1px 1px 2px #000;
  margin: 0;
  padding: 11px 20px 8px;
  border-radius: 8px;
}
.iot-banner h2 {
  text-align: center;
  font-size: 53px;

  margin: 40px 0 0;
}
section.stream-play-section.iot-banner h1 {
  font-size: 67px;
  color: #20253D;
}
section.stream-play-section.iot-banner h1 span {
  color: #FC3666;
}
section.stream-play-section.iot-banner h1 span::before
{
  display: none;
}
section.stream-play-section.iot-banner p {
  text-align: center;
  font-size: 36px;
  line-height: 51px;
  color: #38226B;
  margin-top: 34px;
}
section.stream-play-section.iot-banner p span {
  background: #FEED01;

  padding: 10px 13px 5px;
}
section.stream-play-section.iot-banner h1 b::before {
  width: 100%;
  height: 7px;
  background: #FC3666;
  content: "";
  position: absolute;
  bottom: -2px;
  left: 0;
  z-index: -1;
}
section.video-left.iot-video-bn .video-gradient img {
  height: 450px;
}
section.payment-section.iot-payment .payment-inner {
  padding: 58px 8px;
}
section.stream-play-section.iot-banner p label {
  margin: 0;
  border-bottom: 3px solid;
}
section.video-left.iot-video-bn {
  padding-top: 50px;
  overflow: inherit;
}
section.stream-play-section.iot-banner h1 b {
  color: #0036B5;
font-weight: 900;
  position: relative;
}
section.payment-section.iot-payment .payment-inner .fet-video-btn img {
  width: 100%;
}
section.payment-section.iot-payment h4 {
  font-size: 18px;
  color: #092B6E;
  line-height: 23px;
  background: #FEDC01;
  width: auto;
  margin: 0 auto 35px;
  display: table;
  border-radius: 10px;
  padding: 8px 20px;

}
section.leverage-power {
  padding-top: 70px;
}
section.leverage-power h2 {
  font-size: 49px;
  color: #0036B5;

  text-align: center;
  line-height: 58px;
}
section.leverage-power h3 {
  font-size: 37px;
  color: #20253D;
  text-align: center;
  margin: 13px 0 50px;
}
section.leverage-power ul {
  padding: 0;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
section.leverage-power ul li {
  background: #E8F6FF;
  border: 1px solid #e7efff;
  border-radius: 5px;
  padding: 15px;
  width: 18.2%;
  float: left;
  margin-bottom: 20px;
  display: flex;
   align-items: flex-start;
  margin: 0 10px 20px;
}
section.leverage-power ul li h4 {
  font-size: 18px;
  line-height: 27px;

  margin: 0;
  padding-left: 12px;
}
section.leverage-power ul li.pnk {
  background: #FFECF1;
  border-color: #ffe6ec;
}
section.leverage-power ul li.yel {
  background: #FFFAE8;
  border-color: #fff2c8;
}
section.leverage-power ul li.prp {
  background: #ECE4FF;
  border-color: #e7ddff;
}
section.leverage-power ul li.grn {
  background: #DEFFEE;
  border-color: #c6ffe2;
}
/*--jv-page-css--*/
header.main-header.jv-page-header a.navbar-brand img {
  max-width: 188px;
}
header.main-header.jv-page-header nav.navbar.navbar-expand-lg.navbar-light.bg-light {
  background: #fff!important;
  padding: 12px 39px;
  border-radius: 100px;
}
header.main-header.jv-page-header ul li a {
  font-size: 16px;
   
  text-transform: uppercase;
}
header.main-header.jv-page-header ul {
  margin-left: auto;
  margin-right: inherit !important;
}
header.main-header.jv-page-header {
  padding: 15px 0 30px;
}
nav.navbar img {
  max-width: 222px;
}
header.main-header.jv-page-header ul li.btn-menu a {
  color: #fff !important;
  border-radius: 100px;
  padding: 12px 22px;
  margin-left: 10px;
  border: 0 !important;
  background-image: linear-gradient(to right, #41D6FF , #6D7CF0);
}
section.stream-play-section.jv-page-banner h4 {
  margin: 0 auto 18px;
  display: table;
  font-family: "Dancing Script", cursive;
  font-size: 41px;
  color: #FF3939;
  position: relative;
  border: 1px solid #668bf3;
  background: #ff393924;
  border-radius: 10px;
  padding: 12px 51px;
  background-color: #59a5f73d;
  color: #5f97f4;
  /* -webkit-background-clip: text; */
  /* -webkit-text-fill-color: transparent; */
}
section.stream-play-section.jv-page-banner h5 {
  margin-top: 6px;
}
section.stream-play-section.jv-page-banner h1 {
  font-size: 60px;
  font-weight: 900;
  background: linear-gradient(to left, #A937F2, #FF9004);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
section.jv-page-banner h4::before {
  position: absolute;
  left: -54px;
  top: 16px;
  content: "";
  width: 40px;
  height: 40px;
  background-size: 100%;
  background-image: url(../images/bell.png);
}
section.stream-play-section.jv-page-banner h4::after {
  position: absolute;
  right: -54px;
  top: 16px;
  content: "";
  width: 40px;
  height: 40px;
  background-size: 100%;
    background-image: url(../images/bell.png);
}
div#wrapper {
  background-image: url(../images/wrap.png);
  background-size: contain;
  background-position: top;
  background-repeat: no-repeat;
  background-image: url(../images/video-bk-banner.png);
}
.hand-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
}
section.stream-play-section.jv-page-banner h6 {
  margin-bottom: 0px;
  font-weight: 800;
  margin-top: 18px;
  max-width: 100%;
}
.center-hnd {
  background: #FFC940;
  height: 66px;
  max-width: 845px;
  border-radius: 100px;
  margin: 0 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  width: 100%;
  background-image: linear-gradient(to right, #0A93FE, #ED3C82, #FF3B48, #FF8C07);
}
img.live {
  position: absolute;
  right: 9px;
  max-width: 100px;
  top: -19px;
}
img.clock {
  position: absolute;
  left: 12px;
  max-width: 103px;
  top: -19px;
}
.center-hnd h3 {
  font-size: 29px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 66px;
  text-decoration: none;
  margin: 0;
  font-weight: 800;
}
.comm-lic-inner {
  display: flex;
  align-items: center;
  background: #7034FF;
  padding: 20px;
  border-radius: 10px;
}
.comm-lic-inner h4 {
  font-size: 28px;
  line-height: 44px;
  margin: 0;
  color: #fff;
  padding-left: 40px;
}

.comm-lic-inner h4 span {

  border-bottom: 3px solid #ffffffb3;
  padding-bottom: 1px;
}
.clr-brd {
  background: transparent;
  padding: 20px;
  border-radius: 10px;
  margin-bottom: 50px;
  box-shadow: 0 0 10px 1px #c5c5c5;
  margin-top: 30px;
}

section.commercial-lic {
  padding-top: 0px;
  padding-bottom: 20px;
}
section.payment-jv h2 span {
  color: #f64d75;
  border-bottom: 4px solid #ffde85;
}
section.payment-jv h2 {
  font-size: 37px;
  text-align: center;
  border-top: 0;
  padding-top: 4px;

  color: #272727;
}
section.payment-jv p {
  text-align: center;
  font-size: 23px;
  color: #272727;
  margin: 16px 0 0px;
}
.payment-jv-left img {
  width: 100%;
  max-width: 370px;
  margin: 0 auto;
  display: table;
}
.payment-jv-right h3 {
  font-size: 32px;
  text-align: center;
  color: #006ACD;
  margin-bottom: 15px;
  font-weight: 800;
}
.payment-data h5 {
  background-image: linear-gradient(to right, #FEDE79, #E19458);
  border-radius: 12px;
  color: #000;
  padding: 11px 0;
  font-weight: 700;
  font-size: 28px;
  text-align: center;
}
.payment-data {
      max-width: 91%;
  margin: 0 auto;
}
.payment-data a {
  background: #4291F8;
  width: 100%;
  display: table;
  max-width: 425px;
  margin: 0 auto 15px;
  height: 70px;
  border-radius: 6px;
  display: flex;
  align-items: center;
  font-size: 25px;
  color: #fff;
  padding: 0 9px;
  box-shadow: 1px 4px 1px 1px #0153BB;
  position: relative;
  padding-left: 75px;
  font-weight: 700;
}
.payment-data a:last-child {
  background: #00BAFF;
  box-shadow: 1px 4px 1px 1px #0C96CB;
}
section.payment-jv {
  padding-bottom: 60px;
  padding-top: 10px;
  background-image: url("../images/price-grad.png");
  background-repeat: no-repeat;
  background-size: cover;
}
section.jv-amount {
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding: 30px 0 0px;
}
.brd-up-dw {
  padding-top: 30px;
  padding-bottom: 30px;
}
.payment-data a span {
  position: absolute;
  left: 0;
  top: 0;
  border-right: 1px solid #dddddd42;
  height: 100%;
  bottom: 0;
  display: flex;
  align-items: center;
  padding: 0px 10px;
  width: 56px;
  justify-content: center;
  text-align: center;
}
.jv-amount-inner img {
  width: 100%;
  margin-bottom: 20px;
}
.jv-amount-inner {
  background: #ffe3ef;
     padding: 15px 12px 0px;
  border-radius: 8px;
  min-height: 100%;
}
.jv-amount-inner h3 {
  font-size: 31px;
  color: #043359;
  background: #fc366638;
  width: auto;
  float: left;
  padding: 4px 5px 1px;
  clear: both;
  font-weight: 800;
}
.jv-amount-inner p {
  font-size: 24px;
  line-height: 37px;
  color: #043359;
  width: 100%;
  display: table;
  font-weight: 600;
}
.jv-amount-inner span {
  font-size: 22px;
  color: #20253D;

  background: #BAE7FF;
  padding: 5px 7px 3px;
}
.jv-amount-inner.jv-amount-sec {
  background: #E8F6FF;
}
.jv-amount-inner.jv-amount-sec p {
  font-size: 22px;
}
.jv-amount-inner.jv-amount-third p {
  font-size: 22px;
}
.jv-amount-inner.jv-amount-sec span.gry {
  background: #49ca8838;
  color: #20253D;
}

.jv-amount-inner.jv-amount-sec p.gry {
  color: #2C3C47;
}
.jv-amount-inner.jv-amount-third {
  background: #ECE4FF;
}
.jv-amount-inner.jv-amount-third span {
  background: #7034ff29;
}
.jv-amount-inner.jv-amount-third span.gry {
  background: #e3335b21;
  color: #043359;
}
section.jv-form {
  padding-top: 70px;
  padding-bottom: 40px;
}
section.prob-solu-section {
  padding: 40px 0;
  background-image: url(../images/alert-bk.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.prob-desc h6 {
  background: #FFDB1C;
  margin: 0 auto;
  display: table;
  padding: 17px 30px;
  text-align: center;
  font-size: 23px;
  max-width: 700px;
  border-radius: 10px;
  font-weight: 700;
}
.prob-desc h5 {
  font-size: 25px;
  color: #EC0000;
  text-align: center;
  font-weight: 700;
  margin: 14px 0;
}
.prob-desc h4 {
  font-size: 30px;
  color: #fff;
  font-weight: 800;
  max-width: 700px;
  margin: 0 auto;
  text-align: center;
}
section.prob-solu-section h3 {
  font-size: 52px;
  text-align: center;
  font-weight: 900;
  margin-bottom: 30px;
}
section.prob-solu-section h3 span {
  color: #F80000;
  background: #ff000021;
  position: relative;
  z-index: 9;
  border: 2px dashed #F80000;
  border-radius: 10px;
  padding: 2px 14px 2px;
}
.but-remains h4 {
  background: #EC0000;
  margin: 0 auto;
  display: table;
  color: #fff;
  font-weight: 900;
  padding: 20px 40px;
  border-radius: 10px;
  margin-top: -58px;
  font-size: 55px;
}
.but-remain-left h4 {
  font-size: 23px;
  width: auto;
  padding: 16px 20px;
  font-weight: 700;
  border-radius: 100px;
  margin: 0 0 16px;
}
.but-remain-left h6 {
  font-size: 42px;
  color: #ED4F44;
  font-weight: 800;
  margin: 0;
}
.but-remain-left p {
  color: #012C54;
  background: #ff000012;
  position: relative;
  z-index: 9;
  border: 2px dashed #F80000;
  border-radius: 10px;
  padding: 17px 22px 23px;
  font-size: 24px;
  font-weight: 600;
}
.but-remains h5 span {
  color: #F80000;
  background: #ff000021;
  position: relative;
  z-index: 9;
  border: 2px dashed #F80000;
  border-radius: 10px;
  padding: 10px 15px 5px;
}
.but-remains h5 {
  font-size: 42px;
  text-align: center;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 31px 0 50px;
}
.but-remain-right {
  text-align: center;
}
section.stream-play-section.jv-page-banner.deep-bk {
  background-image: url(../images/deep-bk.png);
  background-repeat: no-repeat;
  padding: 50px 0 0;
  background-size: cover;
}
section.stream-play-section.jv-page-banner.deep-bk h6::before, section.stream-play-section.jv-page-banner.deep-bk h6::after
{
display: none;
}
span.deep-logo {
  background: #fff;
  margin: 0 auto 30px;
  display: table;
  padding: 15px 30px;
  border-radius: 100px;
}
.prob-desc {
  background-image: url(../images/but-bk.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding: 60px 0 100px;
}
section.testomialis-sec {
  background-size: contain;
  background-position: top;
  background-repeat: no-repeat;
  background-image: url(../images/video-bk-banner.png);
  padding: 0px 0 30px;
  text-align: c;
}
section.testomialis-sec h4 {
  background: linear-gradient(to right, #FB7434, #852F83);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 20px;

  margin: 28px auto 0;
  display: table;
  border: 3px dashed #b54b63;
  border-radius: 100px;
  padding: 15px 50px;
  max-width: 800px;
  text-align: center;
}
section.testomialis-sec img {
  margin: 50px auto;
  display: table;
}
section.testomialis-sec h6 {
  color: #D80000;
  margin: 20px auto 0;
  max-width: 800px;
  text-align: center;
  font-size: 24px;
  
}
section.testomialis-sec h5 span.ger {
  color: #33FF73;
  
}
section.testomialis-sec h5 span.org {
  color: #E07F00;
  
}
section.testomialis-sec h5 span.pnk {
  color: #FF42D9;
  
}
section.testomialis-sec h5 {
  background: #7034FF;
  color: #fff;
  text-align: center;
  max-width: 710px;
  margin: 0 auto;
  border-radius: 10px;
  padding: 14px 30px;
  font-size: 22px;
  line-height: 1.4;
}
section.testomialis-sec h3 span {
  background: #FF3939;
  color: #fff;
  padding: 15px 20px 9px;
  border-radius: 8px;
  display: inline-block;
}
section.testomialis-sec h3 {
  text-align: center;
  color: #000;

  font-size: 35px;
}
section.jv-form h3 {
  font-size: 34px;
  color: #0066ff;
  text-align: center;
  margin-bottom: 30px;
  font-weight: 800;
}
.jv-form-btn a {
  background: #0066FF;
  height: 66px;
  width: 100%;
  float: left;
  border-radius: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 23px;
  text-transform: uppercase;
  margin-bottom: 23px;
  font-weight: 800;
  text-decoration: none;
  box-shadow: 4px 4px 1px 1px #0044aa;
}
section.jv-form .col-md-4:last-child a {
  font-size: 17px;
}
section#product section#demo {
  background: transparent;
}
section.stream-play-section.sec-stram-sec.jv-stream-section h5 {
  font-size: 36px;
  color: #A85467;

  margin: 40px auto 6px;
}
section.stream-play-section.sec-stram-sec.jv-stream-section h5 img {
  margin-right: 30px;
}
.jv-cont-form {
  background: #FFFBEF;
  border: 1px solid #FFEAA4;
  border-radius: 6px;
  padding: 32px 20px 20px;
  max-width: 1040px;
  margin: 17px auto 0;
}
.jv-cont-form h5 {
  font-size: 30px;
  text-align: center;
  margin-bottom: 25px;
  font-weight: 700;
}
section.stream-play-section.sec-stram-sec.jv-stream-section .comm-lic-inner {
  margin-top: 60px;
  margin-bottom: 30px;
  flex-wrap: wrap;
}
.jv-cont-form form {
  display: flex;
  align-items: center;
  justify-content: center;
}
.jv-cont-form form input[type="text"] {
  width: 355px;
  height: 50px;
  border: 1px solid #ddd;
  padding: 0 13px;
  border-radius: 4px;
  margin: 0 10px;
  font-size: 23px;
}
section.jv-form .row {
  padding: 0 35px;
}
.jv-cont-form form input[type="text"]:first-child
{
  margin-left :0;
}
.jv-cont-form .form-group {
  margin-bottom: 3px;
}
.jv-cont-form form input[type="submit"] {
  background: #45BF55;
  border: 0;
  color: #fff;
  height: 50px;
  border-radius: 6px;
  width: 242px;
  margin-left: 10px;
  font-size: 22px;
    transition: 0.5s;
}
.jv-cont-form form input[type="submit"]:hover {
  transform: scale(1.01);
  transition: 0.5s;
}
/* section.video-left .video-left-frame .container22 {
  width: 100%;
  padding-top: 58.25%;
} */

.video-left-frame div {
  margin: 0 auto;
}
.container22 {
  position: relative;
  overflow: hidden;
  width: 80%;
  /* padding-top: 56.25%; */
  text-align: center;
}
.brd-top {
  border-top: 1px dashed #ddd;
}
section.stream-play-section.sec-stram-sec.jv-stream-section .comm-lic-inner p {
  width: 100%;
  float: left;
  color: #fff;
  font-size: 22px;
  padding-left: 170px;
  margin: -11px 0 0;
}
section.stream-play-section.sec-stram-sec.jv-stream-section .comm-lic-inner img {
  position: relative;
  top: 15px;
}
section.conversion-funnel {
  background-image: url(../images/black.png);
  background-size: cover;
  background-repeat: no-repeat;
  padding: 85px 0;
}
section.stream-play-section.sec-stram-sec.jv-stream-section {
  padding-bottom: 30px;
}
section.conversion-funnel h2 {
  color: #fff;
  font-size: 54px;
  text-align: center;
  margin-bottom: 110px;
  font-weight: 900;
}
.payment-bk-outer h4 span {
  color: #530EE6;
}
.tube-bel-btn button {
  background: rgb(255, 118, 50);
  background: -moz-linear-gradient(left, rgba(255, 118, 50, 1) 0%, rgba(128, 44, 135, 1) 100%);
  background: -webkit-linear-gradient(left, rgba(255, 118, 50, 1) 0%, rgba(128, 44, 135, 1) 100%);
  background: linear-gradient(to right, #784CC7, #D8005E);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7632', endColorstr='#802c87',GradientType=1 );
  color: #fff;
  border: 0;
  width: 500px;
  height: 88px;
  border-radius: 12px;
  font-size: 29px;
  font-weight: 700;
  box-shadow: 1px 6px 0px 0px #da604f;
  margin: 0 37px;
  outline: none;
  cursor: pointer;
}
.payment-bk-outer p {
  color: #000;
  font-size: 18px;
  font-weight: 700;
  margin: 13px 0 12px;
}
.payment-bk-outer h4 {
  color: #012C54;
  font-size: 32px;
  font-weight: 900;
  margin-bottom: 15px;
}
section.conversion-funnel ul {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.payment-bk-outer {
  background-image: url("../images/payment-bk-new.png");
  padding: 40px 40px;
  background-size: cover;
  text-align: center;
}
section.conversion-funnel ul li {
  width: 31.33%;
  float: left;
  background: #fff;
  border-radius: 7px;
  margin: 0 12px;
  padding: 10px;
  text-align: center;
  box-shadow: 3px 3px 1px 1px #0099FF;
  position: relative;
}
section.conversion-funnel ul li span {
  background: #0099FF;
  font-size: 29px;
  color: #fff;
  padding: 9px 17px 3px;
  border-radius: 6px;
  margin: -39px auto 18px;
  display: table;
  
      position: relative;
  transform: rotate(-2deg);
}
section.conversion-funnel ul li h2 {
  font-size: 35px;
  color: #3B7DFF;
  
  margin: 28px 0 36px;
}
section.conversion-funnel ul li p {
  font-size: 17px;
  color: #20253D;
  margin-bottom: 0;
  line-height: 27px;
  text-align: left;
  padding: 0 14px;
}
section.conversion-funnel ul li h3 {
  font-size: 25px;
  
  text-transform: uppercase;
}
section.conversion-funnel ul li h6 {
  font-size: 19px;
  color: #20253D;
  line-height: 23px;
  
  margin-bottom: 16px;
  text-align: left;
  padding: 0 17px;
}  
.funel-height {
  min-height: 120px;
}
section.conversion-funnel ul li.funnel-two {
  box-shadow: 3px 3px 1px 1px #FC3666;
}
section.conversion-funnel ul li.funnel-two span {
  background: #fc3665;
}
section.conversion-funnel ul li.funnel-two h3 {
  color: #fc3665;
}
section.conversion-funnel ul li.funnel-three {
  box-shadow: 3px 3px 1px 1px #FEC301;
}
section.conversion-funnel ul li.funnel-three span {
  background: #FEC301;
}
section.conversion-funnel ul li.funnel-three h3 {
  color: #FEC301;
}
section.conversion-funnel ul li.funnel-fr {
  box-shadow: 3px 3px 1px 1px #7034FF;
  margin-top: 72px;
}
section.conversion-funnel ul li.funnel-fr span {
  background: #7034FF;
}
section.conversion-funnel ul li.funnel-fr h3 {
  color: #7034FF;
}
section.conversion-funnel ul li.funnel-fiv {
  box-shadow: 3px 3px 1px 1px #49CA88;
  margin-top: 72px;
}
section.conversion-funnel ul li.funnel-fiv span {
  background: #49CA88;
}
section.conversion-funnel ul li.funnel-fiv h3 {
  color: #49CA88;
}
section.conversion-funnel ul li.funnel-two::before {
  position: absolute;
  content: "";
  top: -75px;
  width: 60px;
  left: -27px;
  height: 60px;
  background-image: url(../images/red-ar.png);
  background-size: 100%;
  background-repeat: no-repeat;
}
section.conversion-funnel ul li.funnel-three::before {
  position: absolute;
  content: "";
      top: -60px;
  width: 60px;
  left: -37px;
  height: 60px;
     background-image: url(../images/yel-arow.png);
  background-size: 100%;
   background-repeat: no-repeat;
}
section.conversion-funnel ul li.funnel-fr::before {
  position: absolute;
  content: "";
  top: -55px;
  width: 60px;
  right: -40px;
  height: 60px;
  background-image: url(../images/prp-ar.png);
  background-size: 100%;
  background-repeat: no-repeat;
}
section.conversion-funnel ul li.funnel-fiv::before {
  position: absolute;
  content: "";
       bottom: -60px;
  width: 60px;
  left: -37px;
  height: 60px;
     background-image: url(../images/gr-agr.png);
  background-size: 100%;
    background-repeat: no-repeat;
}
section.jv-rate {
  padding-top: 80px;
  display: table;
  width: 100%;
}
section.jv-rate ul li {
  width: 50%;
  float: left;
}
section.jv-rate ul li ul li {
  width: 100%;
  float: left;
}
.jv-rate-inner {
  border: 1px solid #D0EAFB;
  border-radius: 7px;
  background: #fafdff;
}
.jav-rate-head {
  background: rgb(85,186,254);
  background: -moz-linear-gradient(left, rgba(85,186,254,1) 0%, rgba(0,153,255,1) 100%);
  background: -webkit-linear-gradient(left, rgba(85,186,254,1) 0%,rgba(0,153,255,1) 100%);
  background: linear-gradient(to right, rgba(85,186,254,1) 0%,rgba(0,153,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#55bafe', endColorstr='#0099ff',GradientType=1 );
  border-radius: 7px 7px 0 0;
  padding: 10px;
  text-align: center;
}
section.jv-rate ul {
  padding: 0;
}
.jav-rate-head h3 {
  font-size: 33px;
  
  color: #fff;
  margin-top: 3px;
}
.jav-rate-head h2 {
  font-size: 45px;
  
  color: #fff;
  text-transform: uppercase;
  margin-top: 16px;
  margin: 30px auto 18px;
  display: table;
  position: relative;

}
.jav-rate-head span {
  font-size: 48px;
  color: #fff;
  margin: 0;

}
.jav-rate-head h2::before {
  position: absolute;
  content: "";
  top: -10px;
  width: 100%;
  left: 0;
  height: 6px;
  background-image: url(../images/shd-top.png);
  background-size: 100%;
  background-repeat: no-repeat;
  opacity: 0.4;
}
section.jv-rate ul li {
  list-style: none;
}
.jav-rate-head h2::after {
  position: absolute;
  content: "";
  bottom: -62px;
  width: 100%;
  left: 0;
  height: 60px;
  background-image: url(../images/shd-up.png);
  background-size: 100%;
  background-repeat: no-repeat;
  opacity: 0.4;
}
.jv-rate-list {
  padding: 50px 32px 10px;
}
.jv-rate-list h6 {
  font-size: 24px;
  line-height: 40px;
  color: #20253D;
  border-bottom: 1px dashed #ddd;
  margin-bottom: 18px;

}
.jv-rate-list li {
  position: relative;
  padding-left: 35px;
  font-size: 22px;
  line-height: 34px;
  font-weight: 600;
  margin-bottom: 20px;
}
.jv-rate-list li img {
  position: absolute;
  left: 0;
  top: 2px;
}
section.jv-rate {
  padding-top: 80px;
  display: table;
  width: 100%;
  background-image: url(../images/list-bac.png);
  background-size: 100%;
  background-position: top right;
  background-repeat: no-repeat;
  background-image: url(../images/video-bk-banner.png);
}
.jv-rate-list ul {
  margin-bottom: 34px;
  display: table;
  width: 100%;
}

li.org-list .jav-rate-head {
  background: rgb(255,93,132);
  background: -moz-linear-gradient(left, rgba(255,93,132,1) 0%, rgba(252,54,102,1) 100%);
  background: -webkit-linear-gradient(left, rgba(255,93,132,1) 0%,rgba(252,54,102,1) 100%);
  background: linear-gradient(to right, rgba(255,93,132,1) 0%,rgba(252,54,102,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff5d84', endColorstr='#fc3666',GradientType=1 );
}
li.org-list .jv-rate-inner {
  border-color: #FFC2D1;
  background: #fffdfe;
}
.jv-rate-inner {
  margin-bottom: 110px;
}
.yel-list .jv-rate-inner {
  border-color: #FFEFBB;
  background: #fffdf5;
}
.yel-list .jav-rate-head {
  background: rgb(255,168,36);
  background: -moz-linear-gradient(left, rgba(255,168,36,1) 0%, rgba(255,136,0,1) 100%);
  background: -webkit-linear-gradient(left, rgba(255,168,36,1) 0%,rgba(255,136,0,1) 100%);
  background: linear-gradient(to right, rgba(255,168,36,1) 0%,rgba(255,136,0,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa824', endColorstr='#ff8800',GradientType=1 );
}
.jv-rate-inner .jav-rate-head p {
  margin: 0 0 6px;
  font-size: 29px;
  color: #fff;
  line-height: 35px;
  
}
.yel-list .jv-rate-inner h6 {
  border: 0;
}
.prp-list .jav-rate-head {
  background: rgb(142,95,254);
  background: -moz-linear-gradient(left, rgba(142,95,254,1) 0%, rgba(112,52,255,1) 100%);
  background: -webkit-linear-gradient(left, rgba(142,95,254,1) 0%,rgba(112,52,255,1) 100%);
  background: linear-gradient(to right, rgba(142,95,254,1) 0%,rgba(112,52,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8e5ffe', endColorstr='#7034ff',GradientType=1 );
}
.prp-list .jv-rate-inner {
  border-color: #E1D4FF;
  background: #fcfaff;
}
section.jv-get-touch h2 img {
  margin-right: 14px;
}
.grn-list .jav-rate-head {
  background: rgb(80,220,149);
  background: -moz-linear-gradient(left, rgba(80,220,149,1) 0%, rgba(73,202,136,1) 100%);
  background: -webkit-linear-gradient(left, rgba(80,220,149,1) 0%,rgba(73,202,136,1) 100%);
  background: linear-gradient(to right, rgba(80,220,149,1) 0%,rgba(73,202,136,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#50dc95', endColorstr='#49ca88',GradientType=1 );
}
.grn-list .jv-rate-inner {
  background: rgb(232,252,245);
  background: -moz-linear-gradient(top, rgba(232,252,245,1) 0%, rgba(255,255,255,1) 100%);
  background: -webkit-linear-gradient(top, rgba(232,252,245,1) 0%,rgba(255,255,255,1) 100%);
  background: linear-gradient(to bottom, rgba(232,252,245,1) 0%,rgba(255,255,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8fcf5', endColorstr='#ffffff',GradientType=0 );
  border-color: #49CA88;
}
section.page-video-main.quick-demo.two-sec-video.jv-sec-vid {
  padding-top: 0;
  padding-bottom: 10px;
}
section.page-video-main.quick-demo.two-sec-video.jv-sec-vid .border-tp {
  padding-top: 50px;
  border-bottom: 0;
  padding-bottom: 0;
}
section.prelaunc-lead {
  background: rgb(135,86,255);
  background: -moz-linear-gradient(45deg, rgba(135,86,255,1) 0%, rgba(112,52,255,1) 100%);
  background: -webkit-linear-gradient(45deg, rgba(135,86,255,1) 0%,rgba(112,52,255,1) 100%);
  background: linear-gradient(45deg, rgba(135,86,255,1) 0%,rgba(112,52,255,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8756ff', endColorstr='#7034ff',GradientType=1 );
  padding: 90px 0;
}
section.prelaunc-lead h2 {
  text-align: center;
  color: #fff;
  font-size: 66px;
  text-shadow: 1px 1px 1px #000;
  font-weight: 900;
}
section.prelaunc-lead p {
  font-size: 30px;
  text-align: center;
  color: #fff;
}
.prelaunc-lead-left ul {
  padding: 0;
}
.prelaunc-lead-left ul li {
  list-style: none;
  background: #fff;
  margin-bottom: 24px;
  border-radius: 10px;
  overflow: hidden;
  padding: 14px 22px;
  display: flex;
  align-items: center;
}
.prelaunc-lead-left ul li h5 {
  font-size: 38px;
  margin: 10px 110px 0 41px;
  color: #20253D;
  min-width: 234px;
  font-weight: 800;
}
.prelaunc-lead-left ul li span {
  font-size: 38px;
  font-weight: 800;
  margin: 11px 0 0;
  background: -webkit-linear-gradient(#b190ff, #7034FF);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
section.prelaunc-lead .row {
  padding-top: 35px;
}
.prelaunc-lead-right {
  background: #fff;
  padding: 30px 30px 8px;
  border-radius: 8px;
}
.prelaunc-lead-right h4 {
  text-align: center;
  font-size: 37px;
  font-weight: 800;
}
section.prelaunc-lead .prelaunc-lead-right p {
  color: #20253D;
  font-size: 19px;
  line-height: 27px;
  text-align: left;
  margin-bottom: 27px;
}
section.launch-cup {
  padding: 80px 0 70px;
  position: relative;
  background-image: url(../images/trofy-bk.png);
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: cover;
}
section.launch-cup h2 {
  color: #003957;
  font-size: 75px;
  text-align: center;
  margin: 0 auto 55px;
  display: table;
  position: relative;
  font-weight: 900;
}
section.launch-cup h2::before {
  content: "";
  width: 100%;
  height: 9px;
  border-radius: 10px;
  background: #FF5050;
  position: absolute;
  bottom: 0;
}
.launc-des h3 {
  font-size: 38px;
  color: #3518B4;
  font-weight: 800;

}
.launc-des
{
  text-align: center;
}
.launc-des p {
  font-size: 22px;
  line-height: 32px;
  text-transform: uppercase;
  padding: 0 111px;
}
.launc-des-cup ul {
  padding: 0;
}
.launc-des-cup ul li {
list-style: none;
background: #fff;
background: -moz-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,251,238,1) 100%);
background: -webkit-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,251,238,1) 100%);
background: linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(255,251,238,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff',endColorstr='#fffbee',GradientType=0 );
border: 3px solid #fec301;
border-radius: 10px;
margin-bottom: 31px;
box-shadow: 3px 4px 1px 1px #fec301;
display: flex;
padding: 15px 0;
align-items: center;
}
.launc-des-cup ul li:first-child img {
  max-width: 123px;
  position: relative;
  margin-top: -55px;
  left: -16px;
}
.launc-des-cup ul li img {
  max-width: 79px;
}
.launc-des-cup li h4 {
  color: #2C3C47;
  font-size: 38px;

  margin: 6px 0 0;
  padding-left: 23px;
  min-width: 310px;
  font-weight: 800;
}
.launc-des-cup li span {
  font-size: 30px;

  color: #2C3C47;
  margin: 8px 0 0;
  font-weight: 800;
}
.launc-des-cup ul li:first-child span {
  color: #E3335B;
  margin-left: -29px;
}
.launc-des-cup ul li:nth-child(2) span {
  color: #003FBC;
}
.launc-des-cup ul li:nth-child(3) span {
  color: #30AF6E;
}
.launc-des-cup ul li:nth-child(2)
{
  border-color: #08CCFE;
    box-shadow: 3px 4px 1px 1px #08CCFE;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,e5faff+100 */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,250,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,250,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,250,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5faff',GradientType=0 ); /* IE6-9 */

}
.launc-des-cup ul li:nth-child(3)
{
  border-color:#49CA88;
    box-shadow: 3px 4px 1px 1px #49CA88;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,f1fff8+100 */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(241,255,248,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(241,255,248,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(241,255,248,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f1fff8',GradientType=0 ); /* IE6-9 */

}
.launc-des-cup ul li:nth-child(4), .launc-des-cup ul li:last-child
{
  border-color:#D6D6D6;
    box-shadow: 3px 4px 1px 1px #D6D6D6;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,efefef+100 */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(239,239,239,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 ); /* IE6-9 */


}
.launc-des-cup li:first-child h4 {
  padding: 0;
  margin-left: -15px;
}
.launc-des {
  padding-bottom: 20px;
}
section.launch-cup h6 {
  font-size: 26px;
  color: #E3335B;
  text-align: center;
  font-weight: 700;
}
section.launch-cup::before {
  position: absolute;
  content: "";
  top: 40px;
  width: 66%;
  left: 0;
  height: 450px;
  background-image: url(../images/launch-before.png);
  background-size: 100%;
  background-repeat: no-repeat;
  margin: 0 auto;
  /* display: table; */
  right: 0;
}
section.promoter-sec {
  padding: 90px 0;
  background-image: url(../images/jai-bk.png);
  background-repeat: no-repeat;
  background-size: cover;
}
section.promoter-sec h2 {
  text-align: center;
  margin-bottom: 70px;
  font-size: 55px;
  font-weight: 900;
}
.promoter-sec-right {
  display: flex;
}
.promoter-sec-right-col {
  width: 50%;
  padding: 0 11px;
}
.pro-sec-blog {
  background: #DBF7FE;
  border: 1px solid #78DBF5;
  padding: 20px 10px;
  border-radius: 5px;
  margin-bottom: 30px;
  box-shadow: 0px 6px 2px 0px #AAD7EF;
}
.pro-sec-blog h4 b {

}
.pro-sec-blog h4 {
  position: relative;
  font-size: 20px;
  line-height: 32px;
  font-weight: 600;
  padding-left: 44px;
    color: #2C3C47;
        margin-bottom: 0;
}
.pro-sec-blog h4 a {
  text-decoration: underline;
}
.pro-sec-blog p {
  padding-left: 43px;
  font-size: 18px;
  color: #2C3C47;
  line-height: 32px;
  margin-top: 23px;
  margin-bottom: 31px;
}
.pro-sec-blog h5 {
  font-size: 18px;
  line-height: 25px;

  padding-left: 41px;
  margin-bottom: 0;
  color: #2C3C47;
}
.promoter-sec-left img {
  position: relative;
  left: -245px;
}
.pro-sec-blog h4 img {
  position: absolute;
  left: -8px;
}
.pro-sec-blog a {
  color: #2C3C47;
}
.pro-sec-blog.pro-sec-jv {
  background: #FFFAE8;
  border-color: #FEC301;
  box-shadow: 0px 6px 2px 0px #F9D99D;
}
.pro-sec-blog.pro-thr-jv {
  background: #F9F6FF;
  border-color: #C6B1F8;
  box-shadow: 0px 6px 2px 0px #E1D2FF;
}
.pro-sec-blog.pro-fr-jv {
  background: #E7FEE7;
  border-color: #84F8BD;
  box-shadow: 0px 6px 2px 0px #BDF3BD;
}
.pro-sec-blog.pro-fv-jv {
  background: #F9F6FF;
  border-color: #C6B1F8;
  box-shadow: 0px 6px 2px 0px #E1D2FF;
}
.pro-sec-blog.pro-sx-jv {
  background: #FFECF1;
  border-color: #FFC9D6;
  box-shadow: 0px 6px 2px 0px #F9D2FF;
}
.pro-sec-blog.pro-gr-jv {
  background: #E7FEE7;
  border-color: #84F8BD;
  box-shadow: 0px 6px 2px 0px #BDF3BD;
}
.promoter-sec-right-col-single {
  padding: 0 11px;
}
section.promoter-sec .row {
  align-items: flex-end;
}
section.track-records h2 {
  font-size: 46px;
  color: #3518B4;
  text-align: center;
  border-top: 1px dashed #ddd;
  padding-top: 80px;
  font-weight: 900;
}
section.track-records p {
  font-size: 29px;
  text-align: center;
  margin-bottom: 70px;
}
section.track-records ul {
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}
section.track-records ul li img {
  max-width: 93%;
}
section.receplotae p span {
  color: #36A542;
}
section.track-records ul li {
  list-style: none;
      width: 18.7%;
  margin: 0 7px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+1,ffffff+73,e6f5ff+100&1+0,0.77+100 */
background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,255,255,0.83) 73%, rgba(230,245,255,0.77) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 1%,rgba(255,255,255,0.83) 73%,rgba(230,245,255,0.77) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 1%,rgba(255,255,255,0.83) 73%,rgba(230,245,255,0.77) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#c4e6f5ff',GradientType=1 ); /* IE6-9 */


  border: 1px solid #10BEFE;
  border-radius: 4px;
  padding: 0 13px 14px;
  text-align: center;
      margin-bottom: 60px;
          box-shadow: 1px 2px 6px 3px #A8DBF6;
}
section.track-records ul li h5 {
  font-size: 26px;
  color: #fff;
  background: #00A8FF;
  margin: -17px auto 13px;
  display: table;
  padding: 1px 20px;
  border-radius: 2px;
  box-shadow: 0px 2px 1px 1px #0099FF;
}
section.receplotae h2 {
  border-top: 1px dashed #ddd;
  padding-top: 80px;
  text-align: center;
  color: #1B2E4E;
  font-weight: 900;
  font-size: 63px;
}
section.receplotae p {
  text-align: center;
  font-size: 28px;
  margin-bottom: 5px;
  color: #2B446E;
}
section.receplotae h4 {
  text-align: center;
  width: 100%;
  margin-bottom: 55px;
}
section.jv-get-touch {
  padding-bottom: 20px;
}
section.receplotae {
  padding-top: 22px;
  padding-bottom: 90px;
}
section.jv-get-touch h2 {
  text-align: center;
  margin: 0 auto;
  display: table;
  padding: 0 20px;
  position: relative;
  font-size: 48px;
font-weight: 900;
}
.jv-touch-left {
  text-align: right;
  padding-right: 50px;
}
.jv-touch-border {
  border-top: 1px dashed #ddd;
  margin-top: -31px;
  padding-top: 90px;
}
section.receplotae h4 u {
  font-size: 28px;
  text-decoration: underline;
  color: #0099FF
}
section.receplotae .col-md-4 {
padding: 0 8px;
width: 20%;
-ms-flex: 0 0 20%;
flex: 0 0 20%;
max-width: 20%;
}
.receplotae-inner {
border: 1px solid #dcf1ff;
border-radius: 9px;
text-align: center;
padding: -1px 0 40px;
min-height: 138px;
margin-bottom: 16px;
overflow: hidden;
background: #1aa8ff;
}
.receplotae-inner span {
font-size: 20px;
text-align: center;
width: 100%;
float: left;
color: #62667a;
margin-bottom: 20px;
font-size: 14px;
text-align: center;
width: 100%;
float: left;
color: #083580;
margin-bottom: 20px;
background: #c9edff;
padding: 10px 0;
}
.receplotae-inner img {
  max-height: 35px;
  object-fit: contain;
  max-height: 58px;
  object-fit: contain;
  max-width: 180px;
}
.jv-touch-right h4 {
  font-size: 32px;
  color: #20253D;

  border-bottom: 4px solid #FEC301;
  width: auto;
  float: left;
}
.jv-touch-right ul {
  width: 100%;
  float: left;
  padding: 15px 0 0;
}
.jv-touch-right ul li {
  list-style: none;
  line-height: 36px;
  position: relative;
  font-size: 24px;
  padding-left: 50px;
  margin-bottom: 14px;
}
.jv-touch-right ul li img {
  position: absolute;
  left: 10px;
  top: 3px;
  max-width: 28px;
}
.jv-touch-right h4 img {
  max-width: 28px;
}
.jv-touch-right ul li b {

}
.get-touch-email {
  background: #F5FBFF;
  border-radius: 5px;
  display: flex;
  align-items: center;
  padding: 36px 20px;
  justify-content: space-between;
  /* max-width: 925px; */
  margin: 19px auto 0;
  position: relative;
}
.get-touch-email h4 {
  font-size: 37px;
  line-height: 34px;
  color: #3518B4;

  text-align: center;
}

.get-touch-btn a {
  width: 100%;
  float: left;
  background: rgb(66,145,248);
  background: -moz-linear-gradient(top,  rgba(66,145,248,1) 0%, rgba(23,117,239,1) 100%);
  background: -webkit-linear-gradient(top,  rgba(66,145,248,1) 0%,rgba(23,117,239,1) 100%);
  background: linear-gradient(to bottom,  rgba(66,145,248,1) 0%,rgba(23,117,239,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4291f8', endColorstr='#1775ef',GradientType=0 );
  height: 55px;
  border-radius: 5px;
  box-shadow: 0px 4px 1px 1px #0153BB;
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  max-width: 295px;
  float: right;
  font-size: 24px;
  color: #fff;
  font-family: 'GT Walsheim-Pro-Condensed-reg';
  position: relative;
  padding-right: 30px;
text-decoration:none;
}
img.cnt-aro {
  position: relative;
  left: 38px;
}
.get-touch-btn a:last-child {
  background: rgb(0,186,255);
  background: -moz-linear-gradient(top,  rgba(0,186,255,1) 0%, rgba(0,175,240,1) 100%);
  background: -webkit-linear-gradient(top,  rgba(0,186,255,1) 0%,rgba(0,175,240,1) 100%);
  background: linear-gradient(to bottom,  rgba(0,186,255,1) 0%,rgba(0,175,240,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00baff', endColorstr='#00aff0',GradientType=0 );
  box-shadow: 0px 4px 1px 1px #0C96CB;
}
.get-touch-btn a img {
  max-width: 25px;
  max-height: 25px;
}
.get-touch-btn a span {
  position: absolute;
  left: 0;
  top: 0;
  border-right: 1px solid #dddddd42;
  height: 100%;
  bottom: 0;
  display: flex;
  align-items: center;
  padding: 0px 10px;
  width: 56px;
  justify-content: center;
}
section.jv-brands {
  padding: 10px 0 30px;
}
section.jv-brands h2 {
  text-align: center;
  font-size: 47px;
  font-weight: 900;
}
section.jv-brands h2 img {
  margin-left: 16px;
}
section.jv-brands p {
  font-size: 28px;
  text-align: center;
  margin-bottom: 30px;
}
section.jv-brands p span {
  border-bottom: 4px solid #0099FF;
  padding-bottom: 5px;
}
.jv-brand-own {
  background-image: url(../images/yop-bk.png);
  background-repeat: no-repeat;
  background-size: contain;
  padding: 0px 0 0;
  text-align: center;
  background-position: center;
}
.navbar-light .navbar-nav .nav-link:hover {
  border-bottom: 2px solid #1898ff;
  color: #1898ff;
}
ul.navbar-nav.mr-auto li {
  margin-left: 14px;
}
img.brand-logo {
  width: 100%;
  margin-bottom: 90px;
}
.navbar-light .navbar-nav .nav-link {
  color: #2C3C47;
  font-weight: bold;
  border-bottom: 2px solid transparent;
  text-transform: capitalize;
  font-size: 17px;
}
.jv-form-btn a:hover {
  /* background: #1356bb; */
  background-image: linear-gradient(to right, #852F83 ,#FB7434 );
}
.jv-cont-form form input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: #BBBBBB;
font-size:23px;
}
.jv-cont-form form input::-moz-placeholder { /* Firefox 19+ */
color: #BBBBBB;
font-size:23px;
}
.jv-cont-form form input:-ms-input-placeholder { /* IE 10+ */
color: #BBBBBB;
font-size:23px;
}
.jv-cont-form form input:-moz-placeholder { /* Firefox 18- */
color: #BBBBBB;
font-size:23px;
}
.Sophistication h2 {
  font-size: 76px;
  text-align: center;
  color: #0036b5;
}
.Sophistication p {
  text-align: center;
  font-size: 40px;
  text-align: center;
  margin: 15px 0 30px;
  color: #1a2e5e;
}
.Sophistication ul {
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
}
.Sophistication ul li {
  background: #fff;
  border: 1px solid #a7dcff;
  width: 137px;
  height: 137px;
  display: flex;
  align-items: center;
  flex-direction: column;
  padding: 25px 10px;
  margin: 0 7px;
}
.Sophistication ul li.fature-lst {
  background: #eff9ff;
  width: 365px;
  font-size: 37px;

  justify-content: center;
  align-items: flex-start;
  margin-left: 0;
  padding-left: 30px;
  padding-top: 32px;
}
.Sophistication p span {
  border-bottom: 3px solid #ff7171;
}
.you-tb-video img {
  width: 100%;
}
.Sophistication h2 span {
  color: #fc3666;
}
section.vimeo-section {
  padding-bottom: 60px;
}
footer.footer-main p {
  font-size: 13px;
}
footer.footer-main .col-md-6 span {
  font-size: 19px;
  font-weight: 600;
}
.footer-log img {
  max-width: 219px;
}
.footer-right ul li a {
  font-size: 16px;
}
.Sophistication ul li img {
  width: 97px;
  object-fit: contain;
  height: 31px;
  width: 114px;
}
section.vimeo-section h3 span {
  font-size: 48px;
}
.Sophistication ul.one-time-lisy {
  justify-content: end;
  margin: 30px 0 60px;
}
.sho-n {
  box-shadow: 0 0 10px 1px #ddd;
  border-radius: 10px;
  padding: 40px 20px;
}
.table-responsive table {
  width: 100%;
  border: 1px solid #a7dcff;
  margin-top: 40px;
}
.table-responsive table tr td {
  border-bottom: 1px solid #a7dcff;
  font-size: 20px;


  padding: 19px 20px;
}
.table-responsive table tr td:first-child {
  width: 440px;
}
.table-responsive table tr td img {
  max-width: 33px;
}
.table-responsive table tr:nth-child(2n) td {
  background: #eff9ff;
}
.Sophistication ul li span {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 17px;
}
.Sophistication ul li h3 {
  font-size: 31px;
  color: #3b7dff;

  
  margin: 0;
}
.Sophistication ul li.sm-clr h3, .Sophistication ul li.sm-clr h6 {
  color: #dd4e1c;
}
.Sophistication li h6 {
  font-family: 'Nanum Pen';
  color: #3b7dff;
  font-size: 21px;
  line-height: 1;
}
.Sophistication ul li.sm-clr h3, .Sophistication ul li.sm-clr h6 {
  color: #dd4e1c;
}



.stickybar {
  display: table;
  margin: 0 auto 8px;
  width: 64%;
  border-radius: 6px;
  float: left;
  background: #171717f0;
  opacity: 1;
  position: fixed;
  bottom: 0;
  padding: 13px 30px 6px 30px;
  z-index: 9999;
  left: 0;
  right: 0;
}
.stickybar h5 {
  color: #fff;
  text-align: center;
  font-weight: 900;
  margin: 0 0 13px;
}
.stickybar.subscribebox p {
  color: #fff;
  font-size: 20px;
  margin: 0;
  text-align: center;
}
.text-new {
  color: #28b720;

  text-transform: uppercase;
}
.blink-soft {
  animation: blinker 1.5s linear infinite;
}
@keyframes blinker {
  50% {
    opacity: 0;
  }
}
.subscribebox a {
  border-radius: 8px;
  background-image: -moz-linear-gradient( 124deg, rgb(249,112,145) 0%, rgb(249,122,127) 42%, rgb(249,132,108) 100%);
  background-image: -webkit-linear-gradient( 124deg, rgb(249,112,145) 0%, rgb(249,122,127) 42%, rgb(249,132,108) 100%);
  background-image: -ms-linear-gradient( 124deg, rgb(249,112,145) 0%, rgb(249,122,127) 42%, rgb(249,132,108) 100%);
  box-shadow: 0px 10px 0px 0px rgba(36, 105, 181, 0.004);
  border: 0;
  width: 100%;
  color: #fff;
  box-shadow: 3px 5px 2px 0 rgba(36,105,186,1);
  cursor: pointer;
  padding: 5px 0;
  margin-top: 3px;
  background: rgb(26 168 255);
  box-shadow: 3px 5px 2px 0 rgb(23 146 255);
  font-size: 30px;
  width: 100%;
  float: left;
  text-align: center;
  text-decoration: none;
}
footer.footer-main {
  padding-bottom: 15px;
  padding-top: 30px;
}
.stickybar .jv-form-btn a {
  height: 45px;
  font-size: 17px;
  margin-bottom: 15px;
}
section.before-after-sec h2, section.mega-feature-sec h2 {
  text-align: center;
  font-size: 43px;
  line-height: 58px;
  font-weight: 800;
  background: -webkit-linear-gradient(#892D87, #FE4B7A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  box-shadow: 0 0 10px 1px #c5c5c5;
  margin: 0 auto;
  display: table;

  padding: 10px 50px;
  border-radius: 10px;
}
section.before-after-sec .frame img {
  width: 100%;
}
section.before-after-sec .frame-right h6 {
  background: transparent;
  padding: 0;
  background: -webkit-linear-gradient(#892D87, #FE4B7A);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 36px;
}
section.before-after-sec .frame-right h4 {
  margin: 14px 0 21px;
  background: #1fbf67;
  color: #fff;
  font-size: 24px;
  padding: 10px 10px;
  border-radius: 5px;
}
section.before-after-sec h5 {
  font-size: 24px;
  text-align: center;
  font-weight: 600;
}
.frame-right h5 span {
  color: red;
  border-bottom: 3px solid;
}
.before-after-sec h4 {
  font-size: 33px;
  color: #0D6EFD;
  font-weight: 700;
  text-align: center;
  margin-top: 40px;
  text-transform: uppercase;
}
section.before-after-sec h6 {
  background: #FF2020;
  width: auto;
  margin: 6px auto;
  display: table;
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  padding: 20px 40px;
  border-radius: 15px;
}
section.before-after-sec .col-md-12 img {
  margin-top: 30px;
}
section.before-after-sec img {
  width: 100%;
}
body section.before-after-sec .col-md-12 h5 {
  font-size: 26px;
  margin-top: 17px;
  text-align: center;
  font-weight: 600;
}
span.std {
  margin: 14px 0 21px;
  background: #1fbf67;
  color: #fff;
  font-size: 24px;
  padding: 10px 10px;
  border-radius: 5px;
  margin: 30px auto 0;
  display: table;
}
section.before-after-sec p {
  font-size: 24px;
  text-align: center;
  font-weight: 600;
  margin-bottom: 4px;
  font-weight: 600;
  margin-top: 20px;
}
section.before-after-sec p b {
  color: red;

}
.frame {
  margin-top: 50px;
}
section.before-after-sec {
  padding-top: 80px;
}
body section.before-after-sec h6 {
  background: rgb(255,118,50);
  background: -moz-linear-gradient(left, rgba(255,118,50,1) 0%, rgba(128,44,135,1) 100%);
  background: -webkit-linear-gradient(left, rgba(255,118,50,1) 0%,rgba(128,44,135,1) 100%);
  background: linear-gradient(to right, rgba(255,118,50,1) 0%,rgba(128,44,135,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7632', endColorstr='#802c87',GradientType=1 );
}
section.problem-sec h3 {
  background-image: url("../images/pk-heading.png");
  color: #0D0D0D;
  font-size: 40px;

  text-align: center;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding: 40px 30px;
  max-width: 920px;
  margin: 0 auto;
}
section.problem-sec {
  padding-top: 40px;
}
section.problem-sec h4 {
  background: #cb0000;
  color: #fff;
  font-size: 22px;
  margin: 30px auto;
  display: table;
  padding: 24px 60px;
  border-radius: 10px;

  position: relative;
}
section.problem-sec h4 img {
  position: absolute;
}
img.stay {
  left: -29px;
  top: -16px;
  max-width: 70px;
}

img.stay-two {
  right: -29px;
  top: -16px;
  max-width: 70px;
}
.problem-outre.solution-outer i {
  color: #0fa735;
}
.problem-outre {
  background: #ff898982;
  padding: 30px;
  border-radius: 11px;
  margin: 16px 0;
}
.problem-outre h6 {
  background: #E90000;
  display: inline-block;
  color: #fff;
  font-size: 35px;
  padding: 16px 30px 10px;
  border-radius: 10px;

  margin-bottom: 20px;
}
.problem-left ul {
  padding: 0;
}
.problem-left ul li {
  list-style: none;
  margin-bottom: 12px;
  position: relative;
  padding-left: 28px;
  font-size: 17px;
}
.problem-left ul li i {
position: absolute;
left: 0;
top: 0;
}
.problem-outre.solution-outer {
  background: #00a73540;
}
.problem-outre.solution-outer .problem-left h6 {
  background: #00A735;
}
section.demo-video-blue h3 {
  text-align: center;
  font-size: 48px;
  margin-bottom: 24px;
  font-weight: 800;
  position: relative;
}
section.demo-video-blue {
  padding: 40px 0 50px;
  background-image: url("../images/video-bk-coin.png");
  background-size: cover;
}
section.demo-video-blue h3 span {
  background: #D80000;
  color: #fff;
  padding: 7px 13px 4px;
  border-radius: 10px;
}
.video-dem {
  text-align: center;
  padding: 39px 0 0;
}
section.payment-section {
  padding: 0 0 40px;
}
section.conversion-funnel ul li label {
  background: #0099ff;
  color: #fff;
  padding: 12px 29px 9px;
  display: inline-block;
  border-radius: 100px;
  margin-top: 12px;
  font-size: 20px;
}
section.conversion-funnel ul li.funnel-two label
{
  background: #FC3666;
}
section.conversion-funnel ul li.funnel-three label
{
  background: #FEC301;
}
section.conversion-funnel ul li.funnel-fr label
{
background: #7034FF;
}
section.conversion-funnel ul li.funnel-fiv label
{
  background: #49CA88;
}
section.video-paly {
  padding: 80px 0;
  background-image: url("../images/video-bk.png");
  background-repeat: no-repeat;
  background-size: cover;
}
.video-before {
  max-width: 80%;
  margin: 0 auto;
  padding: 0 40px;
  position: relative;
}
.video-before img {
  width: 100%;
}
.video-before::before {
  width: 37px;
  height: 100%;
  content: "";
  position: absolute;
  left: -13px;
  top: 0;
  background: #852f8359;
}
.video-before::after {
  width: 37px;
  height: 100%;
  content: "";
  position: absolute;
  right: -13px;
  top: 0;
  background: #fca35982;
}
section.Sophistication {
  padding-top: 60px;
}
section.mega-feature-sec h3 {
  margin: 9px auto 50px;
  display: table;
  font-size: 49px;
  font-weight: 900;
  color: #fff;
  background: rgb(255,118,50);
  background: -moz-linear-gradient(left, rgba(255,118,50,1) 0%, rgba(128,44,135,1) 100%);
  background: -webkit-linear-gradient(left, rgba(255,118,50,1) 0%,rgba(128,44,135,1) 100%);
  background: linear-gradient(to right, #EA20EA,#006ACD);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7632', endColorstr='#802c87',GradientType=1 );
  padding: 22px 31px;
  border-radius: 10px;
  text-align: center;
  position: relative;
}
section.mega-feature-sec h3::before {
  position: absolute;
  left: -89px;
  top: 50px;
  background-image: url("../images/zig-star.png");
  background-repeat: no-repeat;
  width: 60px;
  height: 60px;
  background-size: 100%;
  content: "";
}
section.mega-feature-sec h3::after {
  position: absolute;
  right: -89px;
  top: 50px;
  background-image: url("../images/zig-star.png");
  background-repeat: no-repeat;
  width: 60px;
  height: 60px;
  background-size: 100%;
  content: "";
}
section.mega-feature-sec .mega-head h4 {
  color: #0D6EFD;
  font-size: 32px;
  font-weight: 700;
  background: rgb(255,209,183);
  background: -moz-linear-gradient(left, rgba(255,209,183,1) 1%, rgba(250,178,222,1) 100%);
  background: -webkit-linear-gradient(left, rgba(255,209,183,1) 1%,rgba(250,178,222,1) 100%);
  background: linear-gradient(to right, rgba(255,209,183,1) 1%,rgba(250,178,222,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffd1b7', endColorstr='#fab2de',GradientType=1 );
  padding: 12px 30px 13px;
  border-radius: 10px;
  margin: 0 14px !important;
}
.mega-head {
  width: auto;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  margin-bottom: 40px;
  align-items: center;
}
section.ai-video-editoe h5.edit-con {
  background-image: linear-gradient(to right, #ff41e2, #6db1f0);
}
.mega-feature {
  padding-bottom: 7px;
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 30px;
  background: #fff;
  background: #e59e7e21;
  border: 2px dashed #e59e7e;
}
.row-center
{
  justify-content:center;
}
.new-outline {
  background: #ffe7e7;
  border: 2px dashed red;
  border-radius: 10px;
  padding: 30px 0 10px;
}
.video-left-content-right ul  h5 {
  font-size: 22px;
  color: #012C54;
  font-weight: 800;
}
section.ai-video-editoe h5.edit-tool {
  background-image: linear-gradient(to right, #41ff6d, #f0b26d);
}
section.ai-video-editoe h5.edit-lib {
  background-image: linear-gradient(to right, #c9cc00, #d76df0);
}
section.ai-video-editoe h5.edit-custom {
  background-image: linear-gradient(to right, #6541ff, #6df0ce);
}
section.ai-video-editoe h5.edit-export {
  background-image: linear-gradient(to right, #dd41ff, #6D7CF0);
}
.mega-feature.blue {
  background: #72ad8c33;
  border-color: #6fac8d;
}
.mega-feature.pink {
  background: #c6ff000f;
  border-color: #c6ff00;
}
.mega-feature.gray {
  background: #46b9e226;
  border-color: #46b9e2;
}
.mega-feature.orange {
  background: #ff98cb24;
  border-color: #ff98cb;
}
.mega-feature.purple {
  background: #d13d4326;
}
.mega-feature a {
  text-decoration: none;
}
.mega-feature h6 {
  font-size: 19px;
  color: #292429;
  font-weight: 600;
  padding: 23px 8px 6px 30px;
  min-height: 93px;
  align-items: center;
  margin: 0;
  line-height: 26px;
  min-height: 140px;
}
section.mega-feature-sec {
  padding-top: 70px;
  margin-top: 10px;
  background-image: url(../images/file-bk.png);
  background-repeat: no-repeat;
  background-position: center;
  padding-bottom: 70px;
  background-image: url(../images/alert-bk.png);
  background-size: 100%;
  background-repeat: repeat;
}
section.mega-feature-sec h5 {
  font-size: 37px;
  line-height: 55px;
  text-align: center;
  font-weight: 700;
  margin-bottom: 32px;
}
section.mega-feature-sec h4 {
  font-size: 23px;
  color: #fff;
  font-weight: 700;
  margin: 0 auto;
  display: table;
  background: rgb(255,118,50);
  background: -moz-linear-gradient(left, rgba(255,118,50,1) 0%, rgba(128,44,135,1) 100%);
  background: -webkit-linear-gradient(left, rgba(255,118,50,1) 0%,rgba(128,44,135,1) 100%);
  background: linear-gradient(to right, rgba(255,118,50,1) 0%,rgba(128,44,135,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7632', endColorstr='#802c87',GradientType=1 );
  padding: 22px 31px;
  border-radius: 10px;
}
section.mega-feature-sec h5 span {
  color: #FE5F70;
}
p.note {
  text-align: center;
  font-size: 22px;
  padding: 0 40px;
  margin: 22px 0 0;
  color: red;
}
section.check-comparison {
  padding: 43px 0;
  background: #F4F7FC;
}
section.check-comparison h3 {
  font-size: 40px;
  text-align: center;
  color: #006ACD;
  font-weight: 700;
  margin-bottom: 32px;
}
section.check-comparison h6 {
  background: #FFDB1C;
  margin: 39px auto 20px;
  display: table;
  padding: 10px 40px;
  border-radius: 50px;
  font-size: 25px;
  font-weight: 700;
}
section.check-comparison h6 span {
  color: #ED4F44;
}
section.check-comparison h3 span {
  color: #FF6702;
}
.top-tab-grad
{
  background-image: linear-gradient(to right, #41d6ff3d, #6d7cf057);
  display: flex;
  padding: 10px 0;
  align-items: center;
  border-radius: 8px;
}
ul.org-grad {
  display: flex;
  background-image: linear-gradient(to right, #fff, #FFDAC1, #fff);
  border-radius: 8px;
  align-items: center;
}
ul.blu-grad
{
  display: flex;
  background-image: linear-gradient(to right, #fff, #D4EEFD, #fff);
  border-radius: 8px;
  align-items: center;
}
section.check-comparison ul li:first-child {
  width: 3% !important;
}
section.check-comparison ul li {
  list-style: none;
  color: #012C54;
  font-weight: 600;
  font-size: 15px;
  width: 23% !important;
  position: relative;
}
section.check-comparison h4 b, span.new-tab-heading b {
  -webkit-text-fill-color: transparent;
  background: linear-gradient(to left, rgb(0 0 0), rgb(0 0 0)) text;
}
section.check-comparison ul {
  padding: 14px 29px;
}
section.check-comparison ul li:nth-child(2) {
  width: 45%;
}
section.check-comparison ul li:nth-child(3) {
  width: 15%;
}
section.check-comparison ul li:nth-child(4) {
  width: 21%;
}
section.check-comparison ul li:nth-child(5) {
  width: 17%;
}
section.check-comparison ul img {
  max-width: 25px;
}
section.stream-play-section.jv-page-banner h5 {
  background: #FF0000;
  color: #fff;
  max-width: 1000px;
  padding: 12px 30px;
  font-size: 25px;
}
section.stream-play-section.jv-page-banner {
  padding-top: 13px;
}
section.stream-play-section h5 span {
  color: #FFDB1C;
  font-weight: 700;
}
section.stream-play-section.jv-page-banner h2 span {
  -webkit-text-fill-color: transparent;
  background: linear-gradient(to left, rgb(169, 55, 242), rgb(255, 144, 4)) text;
}
section.meet-desk {
  background-image: url("../images/meet-desk-bk.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding: 60px 0;
}
section.meet-desk h3 {
  font-size: 42px;
  color: #012C54;
  font-weight: 900;
  text-align: center;
  margin-bottom: 40px;
}
section.meet-desk img {
  margin: 0 auto;
  display: table;
}
section.test-main h3 {
  background: linear-gradient(to left, #A937F2, #FF9004);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 900;
  text-align: center;
  font-size: 45px;
  margin-bottom: 30px;
}
section.test-main {
  padding: 20px 0 50px;
}
section.test-main img {
  margin: 0 auto;
  display: table;
}
section.advantages-des {
  background-image: url("../images/dec-bk.png");
  background-repeat: no-repeat;
  background-size: cover;
  padding: 60px 0;
}
section.advantages-des h3 {
  background: linear-gradient(to top, #9502BA, #F40000);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 900;
  text-align: center;
  font-size: 45px;
  margin-bottom: 30px;
}
.advantages-des .card {
  background: #fff;
  box-shadow: 5px 5px 1px 1px #ED4F44;
  padding: 24px;
}
.advantages-des .card h4 {
  font-size: 32px;
  background: #ff3e07;
  text-align: center;
  border-radius: 10px;
  color: #fff;
  font-weight: 800;
  padding: 17px 0;
}
.advantages-des .card ul li b {
  color: #ff3e07;
}
.advantages-des .card ul {
  padding: 0;
  margin: 15px 0 0;
}
.advantages-des .card.with {
  box-shadow: 5px 5px 1px 1px #33A000;
}
.advantages-des .card.with h4 {
background: #33A000;
}
.advantages-des .card.with ul li b
{
  color: #33A000;
}
.advantages-des .card ul li {
  list-style: none;
  font-size: 19px;
  color: #012C54;
  font-weight: 600;
  margin: 17px 0;
  position: relative;
  padding-left: 36px;
  padding-right: 30px;
}
.advantages-des .card ul li img {
  position: absolute;
  left: 0;
  top: 0;
  max-width: 25px;
}
section.monthly-rev h3 {
  color: #012C54;
  text-align: left;
  font-weight: 900;
  font-size: 45px;
}
.monthly-left p {
  font-size: 22px;
  font-weight: 600;
}
.monthly-left p span {
  color: #ED4F44;
  font-weight: 800;
}
section.monthly-rev h4 {
  background: rgb(255, 118, 50);
  background: -moz-linear-gradient(left, rgba(255, 118, 50, 1) 0%, rgba(128, 44, 135, 1) 100%);
  background: -webkit-linear-gradient(left, rgba(255, 118, 50, 1) 0%, rgba(128, 44, 135, 1) 100%);
  background: linear-gradient(to right, rgba(255, 118, 50, 1) 0%, rgba(128, 44, 135, 1) 100%);
  margin: 15px auto 30px;
  display: table;
  color: #fff;
  font-weight: 800;
  padding: 15px 40px;
  border-radius: 100px;
}
.monthly-left ul li {
  background-image: linear-gradient(to right, #FFF4CE, #fff);
  margin: 0 0 12px;
  list-style: none;
  padding: 14px 22px;
  border-radius: 10px;
  border: 1px dashed #C69900;
  font-size: 22px;
  FONT-WEIGHT: 800;
  line-height: 1.4;
}
.monthly-left ul {
padding: 0;
}
.monthly-left ul li:nth-child(2) {
  background-image: linear-gradient(to right, #D2FFCE, #fff);
  border-color: #0AA500;
}
.monthly-left ul li:nth-child(3) {
  background-image: linear-gradient(to right, #CEFFFF, #fff);
  border-color: #00B2B2;
}
.monthly-left ul li:nth-child(4) {
  background-image: linear-gradient(to right, #E9CEFF, #fff);
  border-color: #6B00C2;
}
.monthly-left ul li b {
  color: #C69900;
}
.monthly-left ul li:nth-child(2) b {
 color: #0AA500;
}
.monthly-left ul li:nth-child(3) b {
  color: #00B2B2;
}
.monthly-left ul li:nth-child(4) b {
  color: #6B00C2;
}
.monthly-right img {
  max-width: 460px;
  margin: 0 auto;
  display: table;
}
.monthly-left h5 {
  color: #ED4F44;
  font-size: 30px;
  font-weight: 800;
}
section.monthly-rev {
  background-image: url(../images/alert-bk.png);
  background-size: 100%;
  background-repeat: repeat;
  padding-bottom: 60px;
  padding-top: 50px;
}
section.gold-pack {
  padding: 70px 0 30px;
}
.coin-bk {
  background: rgb(255,118,50);
  background: -moz-linear-gradient(left, rgba(255,118,50,1) 0%, rgba(128,44,135,1) 100%);
  background: -webkit-linear-gradient(left, rgba(255,118,50,1) 0%,rgba(128,44,135,1) 100%);
  background: linear-gradient(to right, rgba(255,118,50,1) 0%,rgba(128,44,135,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7632', endColorstr='#802c87',GradientType=1 );
  padding: 42px 90px;
  border-radius: 13px;
  position: relative;
}
.coin-bk::before {
  position: absolute;
  left: -59px;
  top: -50px;
  content: "";
  width: 170px;
  height: 210px;
  background-image: url(../images/shield.png);
  background-size: 100%;
  background-repeat: no-repeat;
}
.coin-bk h3 {
  font-size: 26px;
  line-height: 36px;
  text-align: center;
  color: #fff;
  padding: 0 60px;
  font-weight: 800;
}
.coin-bk h4 {
  background: #fff;
  margin: 18px auto 30px;
  display: table;
  padding: 8px 21px;
  border-radius: 10px;
  font-size: 18px;
  color: #FF8F54;
  font-weight: 600;
  font-weight: 800;
}
.gold-pack-left img {
  width: 100%;
}
.gold-pack-right p {
  font-size: 18px;
  color: #fff;
  line-height: 27px;
  padding-left: 10px;
}
section.commercial-plans.oto-one-commercial-plans h1 {
  font-size: 44px;
  text-align: center;
 font-weight: 900;
  margin-bottom: 20px;
}
section.commercial-plans.oto-one-commercial-plans h2 {
  font-size: 36px;
  color: #0036B5;
  text-align: center;
  margin-bottom: 30px;
  font-weight: 900;
}
section.commercial-plans.oto-one-commercial-plans h2 span {
  border-bottom: 4px solid #FFDB5B;
  padding-bottom: 10px;
}
section.commercial-plans.oto-one-commercial-plans p {
  font-size: 24px;
  text-align: center;
}
section.commercial-plans.oto-one-commercial-plans p b span {
  color: #36A542;
  border: 0;
}
.commercialplans-inner {
  background: #F6F6F6;
  border: 1px solid #70707021;
  border-radius: 6px;
  padding: 15px 20px 20px;
  
}
img.comm-logo {
  margin: 40px auto 34px;
  display: table;
}
.commercialplans-inner h5 {
  font-size: 31px;
  font-weight: 900;
  background: #39528A;
  height: 68px;
  border-radius: 100px;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 455px;
  margin: 0 auto 50px;
}
.commercialplans-inner ul {
  padding: 0;
  box-shadow: 0 0 10px 1px #ddddddbf;
  background: #fff;
  border-radius: 10px;
  padding: 35px 30px 80px;
}
.commercialplans-inner ul li {
  list-style: none;
  font-size: 20px;
  padding-left: 40px;
  line-height: 30px;
  position: relative;
  border-bottom: 1px solid #ddd;
  padding: 12px 0 12px 41px;
  font-weight:500 ;
  color: #20253D;
}
.commercialplans-inner ul li img {
  position: absolute;
  left: 10px;
  max-width: 23px;
}
.commercialplans-inner ul li.no-border-page.per-use {
  color: #2f7afc;
 font-weight: 700;
}
.commercialplans-inner ul h6 {
  font-size: 29px;
  color: #B7546A;
  font-weight: 700;
  text-align: center;
  padding-top: 40px;
  padding-bottom: 25px;
  text-decoration: line-through;
}
.commercialplans-inner ul button {
  font-size: 26px;
  background: #888888;
  border-radius: 5px;
  border: 0;
  font-weight:700 ;
  color: #fff;
  width: 100%;
  height: 63px;
  box-shadow: 0px 3px 1px 1px #5f5f5f;
  cursor: pointer;
  position: relative;
}

.launch-speed img {
  margin: 0 auto;
  display: table;
}
.commercialplans-inner ul button::before {
  width: 100%;
  height: 2px;
  background: red;
  content: "";
  position: absolute;
  left: 0;
  transform: rotate(-7deg);
  top: 31px;
}
.commercialplans-inner ul button::after {
  width: 100%;
  height: 2px;
  background: red;
  content: "";
  position: absolute;
  left: 0;
  transform: rotate(7deg);
  top: 31px;
}
footer .col-md-6 span {
  width: 100%;
  display: table;
  text-align: left;
  color: #fff;
  margin: 14px 0 0;
}
.oto-cards {
  padding-top: 30px;
}
.oto-cards img:first-child {
  max-width: 340px;
  margin: 0 auto;
  display: table;
}
section.commercial-plans.oto-one-commercial-plans p {
  font-size: 24px;
  text-align: center;
}
.oto-cards img {
  width: 100%;
  margin-bottom: 12px;
}
.commercialplans-inner.commercialplans-two {
  background: #2F7AFC;
  padding-bottom: 1px;
}
.commercialplans-inner.commercialplans-two h5 {
  width: 100%;
  max-width: 93%;
  border-radius: 0;
  background: transparent;
  color: #043359;
  font-size: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  height: 69px;
}
.commercialplans-inner ul li .Powered-edit {
  color: #00b825;
}
.commercialplans-inner ul li.ul-org .PhotoProAi-stp {
  color: #00a2a2;
}
section.commercial-plans.oto-one-commercial-plans p.ai-video-edit::before {
  opacity: 0;
}
.commercialplans-inner ul li.ul-org .photoshoot-stp h5 {
  color: #f28400;
}
.commercialplans-inner.commercialplans-two h5 img {
  margin-right: 12px;
}
.commercialplans-inner.commercialplans-two ul {
  box-shadow: none;
}
.commercialplans-inner.commercialplans-two button {
  background: #5ED34A;
  width: 100%;
  height: 78px;
  font-size: 38px;
  box-shadow: 0 5px 1px 1px #41AB49;
}
span.oto-bought {
  background-image: url(../images/last-boutght.png);
  background-repeat: no-repeat;
  width: 267px;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  color: #171263;
  margin: auto;
  padding-top: 11px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  font-weight: 800;
}
img.disc-1 {
  position: absolute;
  left: -10px;
  top: 90px;
}
section.commercial-plans.oto-one-commercial-plans {
  background-image: url(../images/alert-bk.png);
  background-size: 100%;
  background-repeat: repeat;
  padding-bottom: 40px;
  padding-top: 40px;
}
span.perc-bought {
  background-image: url(../images/perc.png);
  background-repeat: no-repeat;
  width: 464px;
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 39px;
  font-weight: 800;
  margin: -66px auto 0;
}
span.use-code {
  width: 100%;
  display: table;
  text-align: center;
  font-size: 20px;
  margin: 24px 0 0;
}
span.everything {
  text-align: center;
  width: 100%;
  display: table;
  margin-bottom: 12px;
  color: #2f7afc;
  font-size: 22px;
  font-weight: 800;
}
.commercialplans-inner ul li.ul-red {
  background: #ff000014;
  border: 2px dashed red;
  border-radius: 10px;
  padding: 20px 10px 16px 42px;
  margin-bottom: 12px;
}
.commercialplans-inner.commercialplans-two h5.wellness {
  background: #ff000026 ! IMPORTANT;
  padding: 6px;
  width: 100%;
}
span.plus-or {
  margin: 0 auto 12px;
  display: table;
  background: #2f7afc;
  color: #ffffff;
  padding: 6px 10px;
  border-radius: 7px;
  font-size: 26px;
}
.commercialplans-inner ul li.ul-blue {
  background: #df00ff14;
  border: 2px dashed #ce00ff;
  border-radius: 10px;
  padding: 20px 10px 16px 42px;
  margin-bottom: 12px;
}
section.commercial-plans.oto-one-commercial-plans p.shadow {
  box-shadow: 0 0 10px 1px #ddd;
  border-radius: 10px;
  padding: 13px !IMPORTANT;
  line-height: 1.3;
  font-size: 20px !important;
  background: #f8d1ff;
  margin: 12px 0 0 !IMPORTANT;
}
.commercialplans-inner ul li.ul-pink {
  background: #00ff3914;
  border: 2px dashed #11d700;
  border-radius: 10px;
  padding: 20px 10px 16px 42px;
  margin-bottom: 12px;
}
section.commercial-plans.oto-one-commercial-plans p.ai-video-edit {
  background: #d0ffd9;
  border-radius: 10px;
  padding: 13px !IMPORTANT;
  line-height: 1.3;
  font-size: 20px !important;
  margin-top: 10px !important;
}
.commercialplans-inner ul li.ul-org {
  background: #00e1e021;
  border: 2px dashed #00cabb;
  border-radius: 10px;
  padding: 20px 10px 16px 42px;
  margin-bottom: 12px;
}
.Hollywood-stp {
  background: #adffff;
  border-radius: 10px;
  padding: 11px;
}
.commercialplans-inner ul li.ul-green {
  background: #c7e10017;
  border: 2px dashed #c7ca00;
  border-radius: 10px;
  padding: 20px 10px 16px 42px;
  margin-bottom: 12px;
}
.commercialplans-inner ul li.ul-green .Unnecessary-stp {
  background: #f9ffbe;
  border-radius: 10px;
  padding: 12px;
  margin-top: 10px;
}
.commercialplans-inner ul li.ul-volt b {
  color: red;
}
span.use-code b {
  color: #2bca00;
}
.commercialplans-inner ul li b.green {
  color: #2bca00;
}
.commercialplans-inner.commercialplans-two h5 {
  width: 100%;
  max-width: 93%;
  border-radius: 0;
  background: transparent;
  color: #043359;
  font-size: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  height: 69px;
}
img.disc-2 {
  position: absolute;
  right: -38px;
  top: 129px;
}
img.disc-3 {
  position: absolute;
  bottom: 420px;
  left: 4px;
}
span.oto-bought {
  background-image: url(../images/last-boutght.png);
  background-repeat: no-repeat;
}
.launch-speed p {
  font-size: 36px;
  color: #13244A;
  font-weight: 800;
}
.commercialplans-inner ul h6 {
  font-size: 29px;
  color: #B7546A;
  font-weight: 800;
  text-align: center;
  padding-top: 40px;
  padding-bottom: 25px;
  text-decoration: line-through;
}
.commercialplans-inner.commercialplans-two ul h6 {
  color: #E3335B;
  /* text-decoration: none; */
}
.commercialplans-inner ul button a {
  color: #fff;
  text-decoration: none;
  width: 100%;
  float: left;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 30px;
}
.commercialplans-inner.commercialplans-two button::before, .commercialplans-inner.commercialplans-two button::after
{
  display: none;
}
@keyframes scroll {
  0% {
    transform: translateX(0); }
  100% {
    transform: translateX(calc(-250px * 8)); } }

.slider {
  background: white;
  box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.125);
  margin: auto;
  overflow: hidden;
  position: relative;
  width: 100%; }



  .slider .slide-track {
    animation: scroll 40s linear infinite;
    display: flex;
    width: calc(250px * 14); }
    .slide {
      margin: 0 13px;
      position: relative;
  }
  img.main-image {
      max-width: 290px;
      border-radius: 13px;
  }


  .ai-gen {
      position: absolute;
      bottom: 0;
      display: flex;
      align-items: center;
      justify-content: space-between;
      left: 0;
      right: 0;
  }
  .ai-gen img {
      max-width: 74px;
      border-radius: 10px;
      border-top: 4px solid #fff;
      border-right: 4px solid #fff;
  }
  .ai-gen p {
      font-size: 12px;
      background: #000;
      border-radius: 10px;
      padding: 9px 11px;
      color: #fff;
      letter-spacing: 1px;
      margin: 0 15px 0 0;
  }
  section.ai-starch {
      background-color: #121212;
      overflow: hidden;
      padding: 60px 0 ;
  }
  section.ai-starch::before {
      position: absolute;
      width: 1600px;
      height: 1040px;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%) translate3d(0px, 0px, 0px);
      background: linear-gradient(90.33deg, rgba(0, 38, 82, 0.8) 10.74%, rgba(12, 68, 99, 0.8) 56.34%, rgb(18, 41, 36) 98.6%);
      filter: blur(250px);
      border-radius: 1000px;
      content: "";
  }
  .starch-left h4 {
      color: #fff;
      font-size: 35px;
      font-weight: 800;
  }
  .ai-video video {
      width: 100%;
      height: auto;
  }
  .ai-video img {
      margin: 0 auto;
      display: table;
      border-radius: 10px;
  }
  .starch-left p {
      font-size: 22px;
      margin: 26px 0 0;
      font-weight: 600;
      color: #fff;
      opacity: 0.6;
  }
  section.ai-starch .row {
      padding-bottom: 60px;
  }
  .starch-right img {
      width: 100%;
      border-radius: 20px;
  }
  section.ai-starch h3 {
      font-weight: 700;
      font-family: "DM Sans", sans-serif, "Noto Sans TC", "Microsoft JhengHei", å¾®è»Ÿæ­£é»‘é«”, "Helvetica Neue", Arial, sans-serif;
      background: linear-gradient(122.13deg, rgb(0, 177, 255) 0%, rgb(255, 255, 255) 100%) text;
      -webkit-text-fill-color: transparent;
      font-size: 40px;
      text-align: center;
      margin-bottom: 40px;
  }
  section.contine-moving {
      padding: 60px 0 60px;
  }
  section.contine-moving h4 {
      text-align: center;
      margin: 0 auto 18px;
      display: table;
      padding: 10px 30px;
      border-radius: 10px;
      background-image: linear-gradient(28deg, rgb(3, 62, 254) 0%, rgb(50, 254, 253) 100%);
      color: #fff;
      font-weight: 800;
  }
  section.contine-moving h3 {
      text-align: center;
      font-size: 41px;
      padding: 0 90px;
      font-weight: 900;
      margin-bottom: 22px;
  }
  section.contine-moving h3 span {
      color: #00db9a;
  }
  section.contine-moving h5 {
      text-align: center;
      color: #ff550a;
      font-size: 26px;
      font-weight: 800;
  }
  section.contine-moving h6 {
      background: yellow;
      margin: 20px auto 20px;
      display: table;
      text-align: center;
      padding: 11px 30px;
      border-radius: 10px;
      font-weight: 800;
      font-size: 28px;
  }
  span.best-part {
      text-align: center;
      width: auto;
      display: table;
      margin: 0 auto 22px;
      padding: 10px 30px;
      border-radius: 100px;
      background-image: linear-gradient(28deg, #00b199 0%, #32bb00 100%);
      color: #fff;
      font-weight: 900;
      font-size: 31px;
  }
section.faq-section h5 {
  background: #FFDB1C;
  margin: 0 auto;
  display: table;
  font-size: 22px;
  padding: 11px 40px;
  border-radius: 100px;
  font-weight: 800;
}
footer {
  background-image: linear-gradient(to top, #6D3AF2, #A937F2);
  padding: 40px 0;
      background: #2a2626;
  text-align: center;
}
footer p {
  color: #fff;
  margin: 12px 0 0;
  text-align: left;
  font-size: 14px;
}
.fixed-top-bar.fixed-top-bar.fixed-top-bar {
  background-color: transparent;
  position: sticky;
  top: 0px;
  z-index: 99;
  background-image:  linear-gradient(28deg, #033EFE 0%, #32FEFD 100%);
  padding: 5px 0px;
}
.fixed-top-bar div {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.fixed-top-bar div p {
  font-size: 18px;
  font-weight: 400;
  color: rgb(255, 255, 255);
  margin: 0px 15px 0px 0px;
}
.fixed-top-bar div p span {
  text-decoration-line: line-through;
}
.fixed-top-bar a {
  font-size: 18px;
  font-weight: 600;
  text-transform: uppercase;
  fill: rgb(0, 0, 0);
  color: rgb(0, 0, 0);
  background-color: rgb(255, 222, 74);
  border-radius: 5px;
  padding: 6px 15px 4px;
}
ul.leader-ul {
  list-style-type: none;
  padding: 0px;
  margin: 0px;
}
ul.leader-ul li {
  display: inline-block;
  font-weight: 500;
  color: #000;
  margin-left: auto;
  padding: 0px 10px;
  float: right;
}
a.affiliate-link-btn {
  text-align: center;
  display: block;
  font-size: 18px;
  color: #fff;
  font-weight: 600 !important;
  border-radius: 10px;
  background: linear-gradient(28deg, #033EFE 0%, #32FEFD 100%);
  text-decoration: none;
  padding: 5px 20px;
  transition: 0.3s;
}
a.affiliate-link-btn {
  font-size: 20px;
  padding: 15px 20px !important;
}
.preheadline {
  backdrop-filter: blur(25px);
  display: inline-block;
  border-radius: 10px;
  border-width: 1px;
  border-style: solid;
  border-color: rgb(33, 187, 253);
  border-image: initial;
  background: rgb(238, 244, 251);
  font-size: 22px;
  font-weight: 600;
  margin: 13px 0 20px;
  padding: 11px 40px;
  margin: 0 auto;
  display: table;
  width: auto !important;
}
.preheadline span.w700 {
  font-weight: 800;
}
.text-danger {
  color: #dc3545!important;
}
.w800 {
  font-weight: 800 !important;
}
.lh140 {
  line-height: 140%;
}
.f-md-22 {
  font-size: 22px;
  width: 100%;
}
.text-success {
  color: #198754!important;
}
.f-md-28 {
  font-size: 28px;
  width: 100%;
}
section.demo-video-blue h4 {
  text-align: center;
  font-weight: 700;
}
.mt-md30 {
  margin-top: 25px!important;
}
.mb-md30 {
  margin-bottom: 25px!important;
}
.f-md-45 {
  font-size: 47px;
  font-weight: 900 !important;
}
.theme-clr {
  background: linear-gradient(28deg, #033EFE 0%, #32FEFD 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.w700 {
  font-weight: 700 !important;
}
.f-md-26 {
  font-size: 26px;
}
.inner-steps-out {
  background: #ffba0012;
  padding: 27px;
  border-radius: 10px;
  margin-bottom: 15px;
  border: 2px dashed #ffba00;
}
.inner-steps-out h3 {
  font-weight: 700;
  font-size: 21px;
}
.inner-steps-out ul {
  padding: 0 0 0 17px;
  margin: 13px 0;
}
.inner-steps-out ul li, .inner-steps-out p {
  font-size: 17px;
  font-weight: 600;
margin: 0;
}
.commercialplans-inner.commercialplans-two ul p {
  font-size: 19px;
  font-weight: 600;
  margin: 10px 0 !important;
}
.inner-steps-out h3 b {
background: #ffde4a;
  padding: 4px 7px;
     display: inline-block;
  border-radius: 10px;
}
.inner-steps-out.sec-trim {
  background: #ff00001f;
  border-color: red;
}
.inner-steps-out.yhird-trim {
  background: #00800012;
  border-color: green;
}
.inner-steps-out.forth-trim {
  background: #0000ff14;
  border-color: #ca00ff;
}
.inner-steps-out.fifth-trim {
  background: #00fff11a;
  border-color: #00fff1;
}
.inner-steps-out.sixth-trim {
  background: #0d67fd14;
  border-color: #0d67fd;
}
section.gtp-ofer {
  padding: 32px 0 20px;
  text-align: center;
}
section.gtp-ofer h3 {
  font-weight: 900;
  font-size: 40px;
  margin-bottom: 21px;
}
section.gtp-ofer h3 span {
  background: linear-gradient(28deg, #033EFE 0%, #32FEFD 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.benefits-section.sec-pd.sec-md-pd {
  padding: 50px 0;
}
.benefits-section .black-clr {
  font-size: 42px;
  font-weight: 900 !important;
  line-height: 1.3;
}
h5.timer-take {
  background: #009a20;
  color: #fff;
  padding: 15px 40px;
  text-align: center;
  border-radius: 10px;
  font-weight: 700;
  font-size: 22px;
  max-width: 800px;
  margin: 0 auto 19px;
}
h6.x-proff {
  background: #eac500;
  color: #000;
  padding: 15px 23px;
  text-align: center;
  border-radius: 10px;
  font-weight: 700;
  font-size: 20px;
  max-width: 800px;
  margin: 0 auto 19px;
  line-height: 28px;
}
span.theme-clr.clear-theme {
  font-weight: 800;
  font-size: 35px;
  margin: 0 0 17px;
  display: table;
  width: 100%;
}
.video-creator-inner img {
  width: 100%;
  max-width: 85%;
  margin: 0 auto;
  display: table;
  max-height: 231px;
  object-fit: contain;
}
.video-creator-inner.peri-six {
  background: #d13d4326;
}
.video-creator-inner.peri-five {
  background: #ff98cb24;
  border-color: #ff98cb;
}
.video-creator-inner.peri-four {
  background: #46b9e226;
  border-color: #46b9e2;
}
.video-creator .col-md-4 {
  margin-bottom: 23px;
}
.video-creator-inner {
  background: #e59e7e21;
  border-radius: 10px;
  padding: 20px 15px 13px;
  border: 2px dashed #e59e7e;
  height: 100%;
}
.video-creator-inner h5 {
  margin: 14px 0 6px;
  text-align: center;
  font-weight: 800;
}
.video-creator-inner p {
  text-align: center;
  font-size: 19px;
  line-height: 1.5;
  margin: 0;
}
.video-creator-inner.peri-two {
  background: #72ad8c33;
  border-color: #6fac8d;
}
.video-creator-inner.peri-three {
  background: #c6ff000f;
  border-color: #c6ff00;
}
section.a-z-steps h3 {
  text-align: center;
  font-size: 43px;
  font-weight: 900;
}
section.a-z-steps h4 {
  text-align: center;
  font-weight: 700;
  font-size: 28px;
  background: linear-gradient(28deg, #033EFE 0%, #32FEFD 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 30px;
}
section.a-z-steps img {
  margin: 0 auto;
  display: table;
}
section.a-z-steps.grab-step {
  padding: 10px 0 60px;
}
section.a-z-steps.grab-step img {
  width: 100%;
  max-width: 54%;
}
.videos-sec {
  background: rgb(9, 9, 9);
  padding-top: 80px;
  padding-bottom: 80px;
}
.videos-sec .white-clr {
  color: #fff !important;
  font-size: 30px;
}
.videos-sec .white-clr {
  color: #fff !important;
  font-size: 45px;
  padding: 0 60px;
  margin: 0 0 18px;
}
.yellow-frame {
  background: url("https://cdn.oppyotest.com/launches/aivideocreator/bundle/yellow-frame.webp") 0% 0% / 100% 100% no-repeat;
  padding: 0px 20px 4px;
}
.videos-box-1 {
  background: url("https://cdn.oppyotest.com/launches/aivideocreator/bundle/videos-box-2.webp") 0% 0% / 100% 100% no-repeat;
  padding: 50px;
}
.mt-md60 {
  margin-top: 60px !important;
}
.mt-md100 {
  margin-top: 100px !important;
}
section.ai-video-editoe h3 {
  font-size: 45px;
  text-align: center;
  font-weight: 900;
  margin-bottom: 14px;
}
section.ai-video-editoe h5 {
  color: #fff !important;
  border-radius: 100px;
  padding: 12px 22px;
  margin-left: 10px;
  border: 0 !important;
  background-image: linear-gradient(to right, #41D6FF, #6D7CF0);
  margin: 21px auto 34px;
  display: table;
  font-size: 28px;
  font-weight: 700;
}
section.ai-video-editoe {
  padding: 50px 0 0;
}
.video-step-right ul {
  padding-left: 20px;
  padding-top: 8px;
}
section.check-comparison.new-table-comp ul li {
  width: auto;
  font-size: 15px;
}
section.check-comparison.new-table-comp ul li:first-child {
  width: 3%;
}
section.check-comparison.new-table-comp ul li:nth-child(2) {
  width: 25%;
}
section.check-comparison.new-table-comp ul li:nth-child(3) {
  width: 20%;
}
section.check-comparison.new-table-comp ul li:nth-child(4) {
  width: 15%;
}
section.check-comparison.new-table-comp ul li:nth-child(5) {
  width: 20%;
}
section.software-five {
  padding: 40px 0;
  background: #e1f6ff;
  margin-bottom: 30px;
}
section.software-five h3 {
  text-align: center;
  font-size: 45px;
  font-weight: 900;
}
section.software-five h4 {
  background: red;
  max-width: 830px;
  margin: 0 auto 14px;
  text-align: center;
  padding: 17px 30px;
  border-radius: 10px;
  color: #fff;
  font-weight: 700;
}
section.software-five h5 {
  background: #ffde4a;
  max-width: 830px;
  margin: 0 auto 14px;
  text-align: center;
  padding: 17px 30px;
  border-radius: 10px;
  font-weight: 700;
  font-size: 23px;
}
section.software-five h6 {
  background-image: linear-gradient(28deg, #033EFE 0%, #32FEFD 100%);
  padding: 10px 30px;
  max-width: 830px;
  margin: 0 auto 14px;
  text-align: center;
  color: #fff;
  font-weight: 700;
  font-size: 26px;
  border-radius: 10px;
}
span.photo-ai {
  font-size: 20px;
  text-align: center;
  max-width: 900px;
  margin: 0 auto;
  font-weight: 700;
  display: table;
}

section.video-left h6 {
  background: #ffde4a;
  border-radius: 100px;
  text-align: center;
  font-size: 21px;
  max-width: 800px;
  margin: 0 auto;
  padding: 15px 30px;
  font-weight: 700;
}
section.gif-section {
  background-repeat: no-repeat;
  background-image: url(../images/brand.jpg);
  background-size: cover;
  padding: 53px 0 40px;
}
section.gif-section h6 {
  font-size: 20px;
  width: 100%;
}
section.gif-section h3 {
  font-size: 40px;
  color: #008ddf;
  font-weight: 900;
}
section.gif-section img {
  width: 100%;
  max-width: 980px;
  margin: 50px auto 0;
}
section.gif-section h4 {
  font-size: 30px;
}
.outer-row {
  display: flex;
  align-items: center;
  background: #f2ffed;
  border: 2px dashed #00ba19;
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 30px;
  position: sticky;
  top: 80px;
  z-index: 9;
}
.outer-row.outer-row-two {
  background: #fde8ff;
  border-color: #c600dc;
}
.outer-row.outer-row-two .right-gif {
  padding-left: 0;
  padding-right: 29px;
}
.right-gif {
  width: 60%;
  padding-left: 25px;
}
.left-gif {
  width: 40%;
}
.right-gif h3 {
  font-size: 34px;
  font-weight: 800;
  margin-bottom: 13px;
  margin-top: 12px;
}
.right-gif h4 {
  background: #259d00;
  padding: 8px 22px;
  border-radius: 10px;
  font-size: 21px;
  font-weight: 700;
  color: #fff;
}
.right-gif ul {
  padding-left: 20px;
  padding-top: 11px;
}
.right-gif ul li {
  font-size: 20px;
  font-weight: 700;
}
.outer-row.outer-row-three {
  background: #eaffff;
  border-color: #00c2c2;
}
.outer-row.outer-row-two h4 {
  background: #a400b7;
}
.outer-row.outer-row-three h4 {
  background: #00c2c2;
}
section.ai-generated-style {
  background-image: url("../images/demo-sec-bg.webp");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding: 60px 0;
}
section.ai-generated-style h2 {
  color: #fff;
  font-weight: 900;
  text-align: center;
  font-size: 40px;
  margin-bottom: 20px;
}
section.ai-generated-style p {
  background: #aa00cd;
  text-align: center;
  color: #fff;
  margin: 0 auto 22px;
  display: table;
  padding: 11px 40px;
  border-radius: 10px;
  font-weight: 700;
}
section.ai-generated-style h3 {
  background: #00a1b8;
  text-align: center;
  display: table;
  padding: 9px 20px;
  border-radius: 100px;
  margin: 16px auto 0;
  color: #fff;
  font-weight: 800;
}
.ai-box-gen h4 {
  text-align: center;
  color: #fff;
  font-weight: 700;
  margin: 20px 0 17px;
}
.ai-box-gen h5 {
  color: #ffac00;
  text-align: center;
  font-size: 26px;
  font-weight: 700;
}
.ai-box-gen h6 {
  background: #e4ff37;
  margin: 20px auto 60px;
  display: table;
  text-align: center;
  padding: 10px 40px;
  border-radius: 100px;
  font-size: 23px;
  color: #000;
  font-weight: 700;
}
span.time-set {
  color: red;
  font-size: 24px;
  font-weight: 800;
  text-align: center;
  display: table;
  width: 100%;
  margin: 0 0 18px;
}
section.software-five img {
  margin: 0 auto;
  display: table;
}
section.advantages-des .row {
  justify-content: center;
}
.monthly-left h6 {
  background: rgb(255, 118, 50);
  background: -moz-linear-gradient(left, rgba(255, 118, 50, 1) 0%, rgba(128, 44, 135, 1) 100%);
  background: -webkit-linear-gradient(left, rgba(255, 118, 50, 1) 0%, rgba(128, 44, 135, 1) 100%);
  background: linear-gradient(to right, rgba(255, 118, 50, 1) 0%, rgba(128, 44, 135, 1) 100%);
  margin: 15px auto 30px;
  color: #fff;
  font-weight: 800;
  padding: 15px 40px;
  border-radius: 100px;
  font-size: 18px;
}
section.steps-count {
  padding: 40px 0;
}
section.steps-count h3 {
  text-align: center;
  font-size: 40px;
  font-weight: 900;
  margin-bottom: 25px;
}
section.steps-count h3 span {
  color: #007acd;
}
.simple-one img {
  width: 100%;
  height: 230px;
  object-fit: cover;
  border-radius: 10px;
}
.simple-one {
  box-shadow: 0 0 10px 1px #ddd;
  padding: 12px;
  margin-bottom: 30px;
  background: #e9fbff;
}
.simple-one h4 {
  text-align: center;
  font-weight: 700;
  margin: 15px 0 12px;
}
.simple-one h5 {
  text-align: center;
  min-height: auto;
  font-size: 19px;
  padding-bottom: 10px;
}
.simple-one.simple-two {
  background: #ffeaec;
}
.simple-one.simple-three {
  background: #f2ebff;
}
h6.no-more {
  background: #cb3e4a;
  margin: 0 auto;
  display: table;
  margin-top: 14px;
  font-size: 20px;
  color: #fff;
  font-weight: 800;
  padding: 13px 40px;
  max-width: 780px;
  display: table;
  width: 100%;
  border-radius: 100px;
  text-align: center;
}
span.record {
  background: #e9ff20;
  margin: 0 auto;
  display: table;
  font-size: 23px;
  font-weight: 900;
  padding: 12px 40px;
  border-radius: 100px;
  margin-top: 20px;
}
span.mill-users {
  text-align: center;
  font-size: 30px;
  font-weight: 800;
  width: 100%;
  display: table;
  background: red;
  color: #fff;
  border-radius: 10px;
  padding: 14px 0;
  margin-bottom: 14px;
}
span.huge-market {
  text-align: center;
  font-size: 25px;
  width: 100%;
  display: table;
  color: #d0008c;
  font-weight: 900;
}
span.sell-mark {
  background: green;
  margin: 14px auto 0;
  display: table;
  padding: 10px 30px;
  font-size: 21px;
  font-weight: 800;
  color: #fff;
  border-radius: 100px;
}
section.ressler-agency h3 {
  text-align: center;
  font-weight: 900;
  font-size: 40px;
}
section.ressler-agency h4 {
  text-align: center;
  font-weight: 800;
  font-size: 30px;
  margin: 13px 0 13px;
  color: #b500c5;
}
section.ressler-agency h4 b {
  color: #00c498;
  border-bottom: 3px solid;
}
section.ressler-agency h5 {
  text-align: center;
  font-size: 29px;
  font-weight: 800;
  margin: 46px 0 14px;
}
section.ressler-agency h5 span {
  background: #ffde4a;
  padding: 2px 8px;
  border-radius: 10px;
}
section.ressler-agency h6 {
  margin: 29px auto 20px;
  display: table;
  text-align: center;
  background: #ffde4a;
  padding: 12px 50px;
  border-radius: 10px;
  font-size: 28px;
  font-weight: 700;
}
section.invest-money h3 {
  text-align: center;
  font-size: 40px;
  font-weight: 900;
  color: #00bdff;
}
section.invest-money {
  padding: 20px 0 0;
}
h4.return-out {
  margin: 12px auto 30px;
  display: table;
  color: #fff;
  font-weight: 900;
  background: #0080ff;
  padding: 11px 30px;
  border-radius: 100px;
}
.invest-money-left img {
  width: 100%;
  max-width: 430px;
  margin: 0 auto;
  display: table;
}
.invest-money-right {
  background: #fff;
  box-shadow: 0 0 10px 1px #ddd;
  border-radius: 10px;
  padding: 30px;
}
.invest-money-right ul {
  padding: 0;
}
.invest-money-right ul li {
  list-style: none;
  padding-left: 34px;
  position: relative;
  margin: 22px 0;
  font-size: 21px;
  font-weight: 700;
}
.invest-money-right ul li img {
  position: absolute;
  left: 0;
  top: 0;
}
span.resle {
  background: #ff4a4a;
  margin: 23px auto;
  display: table;
  padding: 11px 30px;
  font-size: 21px;
  font-weight: 900;
  border-radius: 100px;
  color: #fff;
}
.bundle-outer {
  background: #c000ff33;
  text-align: center;
  padding: 50px 0;
  border-radius: 10px;
  margin-bottom: 30px;
}
.bundle-outer h4 {
  font-weight: 900;
  font-size: 44px;
}
.bundle-outer h5 {
  text-align: center;
  font-size: 30px;
  font-weight: 700;
  color: #8000cd;
}
section.gif-section h2 {
  text-align: center;
  font-weight: 900;
  font-size: 45px;
  margin-bottom: 20px;
}
section.gif-section.gif-animated .outer-row {
  padding: 70px 20px;
}
.straem-steps-four-inner {
  box-shadow: 0 0 10px 1px #ddd;
  border-radius: 10px;
  padding: 10px;
}
.straem-steps-four-inner {
  position: relative;
}
.straem-steps-four-inner::before {
  background-image: url(../images/ic-step-arrrow.png);
  background-repeat: no-repeat;
  width: 92px;
  height: 54px;
  position: absolute;
  content: "";
  background-size: 100%;
  right: -123px;
  transform: translateX(-50%);
  top: -21px;
}
.straem-steps-four-inner span {
  color: #fff;
  font-size: 28px;
  text-align: center;
  margin: 0 auto;
  display: table;
  background: #FF8E00;
  font-weight:800; 
  padding: 0 22px;
  box-shadow: -2px 2px 1px 1px #FF5700;
  position: relative;
}
.straem-steps-four-inner img {
  margin-top: -29px;
  height: 221px;
  width: 100%;
}
.straem-steps-four-inner h4 {
  font-size: 20px;
  color: #043359;
  font-weight: 800;
  margin: 11px 0 7px;
  line-height: 27px;
}
.straem-steps-four-inner p {
  font-size: 17px;
  line-height: 26px;
  color: #043359;
  font-weight: 600;
  padding-right: 10px;
}
.benefits-section.sec-pd.sec-md-pd .col-md-4:last-child .straem-steps-four-inner::before {
  opacity: 0;
}
.benefits-section.sec-pd.sec-md-pd .col-md-4:nth-child(2) .straem-steps-four-inner span {
  background: #42C984;
  box-shadow: -2px 2px 1px 1px #2ba164;
}
.benefits-section.sec-pd.sec-md-pd .col-md-4:last-child .straem-steps-four-inner span {
  background: #1AB1FF;
  box-shadow: -2px 2px 1px 1px #14a0e9;
}
section.page-video-main h2 {
  margin-bottom: 40px;
  font-size: 36px;
  color: #20253D;
  font-weight: 900;
}
iframe.responsive-iframe {
  /* background: red; */
  padding: 20px;
  background-image: url("../images/video-frame.png");
  /* box-shadow: inset 0 0 12px 12px white, inset 0 0 3px 2px white; */
  /* background: linear-gradient(to right, #80A6FF,#A9DFC5, #80A6FF, #FDBCC8, #FEC2C2, #F9ECB2, #9BEFED); */
  border-radius: 20px;
  margin: 0 auto;
  /* display: table; */
  left: 0;
  right: 0;
  background-size: 116% 124%;
  background-repeat: no-repeat;
  background-position: center;
}
section.page-video-main .video-gradient {
  position: relative;
}
section.page-video-main .video-gradient::before {
  position: absolute;
  content: "";
  width: 78px;
  height: 78px;
  background-image: url(../images/video-bf.png);
  background-repeat: no-repeat;
  background-size: 100%;
  top: -10px;
  left: -10px;
}
section.page-video-main .video-gradient::after {
  position: absolute;
  content: "";
  width: 78px;
  height: 78px;
  background-image: url(../images/video-af.png);
  background-repeat: no-repeat;
  background-size: 100%;
  top: -10px;
  right: -10px;
}
section.page-video-main.quick-demo.two-sec-video.jv-sec-vid iframe {
  height: 681px;
  position: static;
  width: 100%;
  max-width: 71%;
  object-fit: contain;
}  
section.page-video-main.quick-demo.two-sec-video {
  background-image: url(../images/video-bk-1.png);
  background-position: top right;
  background-size: cover;
}
section.agency-kit-oto h2 {
  text-align: center;
  font-size: 62px;
  line-height: 87px;
  margin-bottom: 60px;
  font-weight: 900;
}
.agencykit-inner img {
  width: 100%;
}
.agencykit-inner {
  background: #ffc40021;
  padding-bottom: 16px;
  margin-bottom: 25px;
  border-radius: 9px;
  overflow: hidden;
}
.agencykit-inner p {
  font-size: 20px;
  line-height: 29px;
  text-align: center;
  margin-top: 15px;
  padding: 0 10px;
  min-height: 102px;
  margin-bottom: 0;
  font-weight: 600;
}
.agencykit-inner p span {
  color: #0036B5;
  font-weight: 800;
}
.agencykit-inner.kit-two {
  background: #ffbee03d;
}
.agencykit-inner.kit-three {
  background: #cce8fe33;
}
.agencykit-inner.kit-fr {
  background: #c6aeff4f;
}
.agencykit-inner.kit-fv {
  background: #40e9e829;
}
.agencykit-inner.kit-sx {
  background: #6a81f126;
}
.agencykit-inner.kit-sv {
  background: #ffc6e629;
}
.agencykit-inner.kit-eig {
  background: #c6aeff4f;
}
.agencykit-inner.kit-nin {
  background: #f2c7c136;
}
.agencykit-inner.kit-ten {
  background: #22dddc1f;
}
span.offer-out {
  text-align: center;
  width: 100%;
  display: table;
  font-size: 40px;
  font-weight: 900;
  color: red;
  line-height: 1.3;
  margin: 0 0 66px;
}
section.check-comparison h4, span.new-tab-heading {
  -webkit-text-fill-color: transparent;
  background: linear-gradient(to left, rgb(169, 55, 242), rgb(255, 144, 4)) text;
  box-shadow: 0 0 10px 1px #ddd;
  margin: 0 auto;
  display: table;
  padding: 22px  50px;
  border-radius: 10px;
  margin-bottom: 34px;
  font-weight: 900;
  font-size: 30px;
  text-align: center;
}
section.check-comparison .five-col-table ul.top-tab-grad {
  background-image: linear-gradient(to right, #ff41fd3d, #6df0a957);
}
section.check-comparison .five-col-table ul.org-grad {
  background-image: linear-gradient(to right, #fff, #fbc1ff, #fff);
}
section.check-comparison .five-col-table ul.blu-grad {
  background-image: linear-gradient(to right, #fff, #d6fdd4, #fff);
}
section.check-comparison .five-col-table ul li {
  width: 30% !important;
}
section.check-comparison .five-col-table.six-col-table ul.top-tab-grad {
  background-image: linear-gradient(to right, #e9ff413d, #6ddff057);
}
section.check-comparison .five-col-table.six-col-table ul.org-grad {
  background-image: linear-gradient(to right, #fff, #c1d4ff, #fff);
}
section.check-comparison .five-col-table.six-col-table ul.blu-grad {
  background-image: linear-gradient(to right, #fff, #fdd4f7, #fff);
}
section.check-comparison .five-col-table ul li {
  width: 30% !important;
}
section.problem-new {
  background-image: url("../images/alert-bk.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding-bottom: 50px;
  padding-top: 40px;
}
.two-prob h2 {
  text-align: center;
  font-weight: 900;
  font-size: 50px;
  color: red;
  margin-bottom: 42px;
}
.two-prob h2 span {
  border-bottom: 7px solid rgb(254, 50, 50);
}
.two-prob h3 {
  text-align: center;
  display: table;
  color: rgb(0, 0, 0);
  font-weight: 900;
  background: rgb(254, 196, 50);
  margin: 18px auto 0px;
  border-radius: 100px;
  padding: 11px 40px;
}
.two-prob h3 {
  text-align: center;
  display: table;
  color: rgb(0, 0, 0);
  font-weight: 900;
  background: rgb(254, 196, 50);
  margin: 18px auto 0px;
  border-radius: 100px;
  padding: 11px 40px;
}
.two-prob h4 {
  display: table;
  color: rgb(45, 38, 38);
  font-weight: 900;
  border-width: 2px;
  border-style: dashed;
  border-color: red;
  border-image: initial;
  margin: 23px auto 27px;
  background: rgba(255, 0, 0, 0.14);
  padding: 11px 50px;
}
.two-prob h5 {
  text-align: center;
  font-size: 30px;
  font-weight: 800;
  margin: 20px 0px;
}
.two-prob h5 span {
  color: red;
}
.red-outers {
  text-align: center;
  background: rgba(255, 0, 0, 0.13);
  padding: 30px 40px;
  border-radius: 10px;
  border-width: 2px;
  border-style: dashed;
  border-color: red;
  border-image: initial;
}
.red-outers span.looking-out {
  font-size: 40px;
  color: rgb(59, 59, 59);
  font-weight: 900;
  display: table;
  width: auto;
  background: rgb(255, 242, 0);
  border-radius: 100px;
  margin: 0px auto 17px;
  padding: 2px 70px;
}
.red-outers span.looking-arival {
  font-size: 30px;
  font-weight: 900;
  color: rgb(0, 68, 255);
}
.red-outers span {
  width: 100%;
  display: table;
  color: red;
  font-size: 19px;
  padding: 2px 0px;
}
.but-outer h1 {
  display: table;
  color: rgb(255, 255, 255);
  font-weight: 900;
  font-size: 60px;
  background: red;
  margin: 24px auto 16px;
  padding: 10px 20px;
  border-radius: 10px;
}
.but-outer h2 {
  display: flex;
  align-items: center;
  text-align: center;
  font-size: 35px;
  font-weight: 900;
  justify-content: center;
  margin-bottom: 25px;
}
.danger-left h3 {
  display: table;
  color: rgb(255, 255, 255);
  font-weight: 900;
  font-size: 39px;
  margin-bottom: 22px;
  background: rgb(236, 0, 0);
  padding: 12px 34px;
  border-radius: 10px;
}
.danger-left p {
  font-weight: 600;
  font-size: 27px;
}
.danger-right {
  text-align: center;
}
.prob-two {
  text-align: center;
  margin-top: 25px;
  background: rgba(255, 0, 0, 0.16);
  padding: 30px;
  border-width: 2px;
  border-style: dashed;
  border-color: red;
  border-image: initial;
  border-radius: 10px;
}
.prob-two h3 {
  display: table;
  color: red;
  font-weight: 900;
  font-size: 33px;
  margin: 0px auto 11px;
}
.prob-two h4 {
  font-size: 29px;
}
.prob-two h5 {
  display: table;
  font-size: 27px;
  font-weight: 900;
  background: rgb(254, 196, 50);
  margin: 0px auto 30px;
  padding: 10px 30px;
  border-radius: 100px;
}
section.inspiration-sec {
  background-size: contain;
  background-position: top;
  background-repeat: no-repeat;
  background-image: url(../images/video-bk-banner.png);
  padding: 60px 0;
}
section.check-comparison.multi-tools .five-col-table.six-col-table ul li:first-child {
  width: 6% !important;
}
section.check-comparison.multi-tools .five-col-table.six-col-table ul li {
  width: 36% !important;
}
section.inspiration-sec h3 span {
  -webkit-text-fill-color: transparent;
  background: linear-gradient(to left, rgb(169, 55, 242), rgb(255, 144, 4)) text;
  width: 100%;
  font-weight: 900;
}
section.inspiration-sec h3 {
  text-align: center;
  font-size: 31px;
  font-weight: 700;
  margin-bottom: 40px;
}
section.inspiration-sec img {
  margin: 0 auto;
  display: table;
}
.prob-two img {
  width: 100%;
  max-width: 80%;
}
span.know-more {
  display: table;
  font-size: 40px;
  color: rgb(255, 255, 255);
  margin: 30px auto 0px;
  background: rgb(255, 106, 0);
  padding: 11px 40px;
  border-radius: 100px;
}
h6.x-proff span {
  font-size: 40px;
  display: table;
  width: 100%;
  padding-bottom: 12px;
  padding-top: 9px;
  font-weight: 900;
  color: #0044e3;
}
.upload-pro {
  background-image: url("../images/hero_circls.png");
  background-repeat: no-repeat;
  background-size: cover;
  padding: 40px 0;
}
span.unlock-limit {
  background: #f6d208;
  margin: 0 auto;
  display: table;
  border-bottom: 4px solid red;
  padding: 20px 40px;
  font-size: 24px;
  font-weight: 900;
  margin-bottom: 20px;
}
p.poppins.fm24.white.line150.pt-4 {
  color: #fff;
}
p.poppins.fm22.white.text-center.line150.pt-4 {
  color: #fff;
}
.ai-pro img {
  width: 100%;
}
.ai-pro {
  background-image: url("../images/bgr.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  padding: 20px 0 50px;
}
span.feature-shadow {
  -webkit-text-fill-color: transparent;
  background: linear-gradient(to left, rgb(169, 55, 242), rgb(255, 144, 4)) text;
  box-shadow: 0 0 10px 1px #ddd;
  margin: 38px auto 0;
  display: table;
  padding: 22px 50px;
  border-radius: 10px;
  margin-bottom: 34px;
  font-weight: 900;
  font-size: 30px;
  text-align: center;
}
.upload-pro img {
  margin: 31px auto 0;
  display: table;
}
section.colage h3 {
  background-color: #10b9ff;
  background-image: linear-gradient(45deg, #b606e6, #f7bf02);
  background-size: 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: 43px;
  font-weight: 900;
  text-align: center;
}
.commercialplans-inner ul li p {
  font-size: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  padding-left: 16px !important;
  position: relative;
}
section.colage {
  padding: 60px 0;
}
section.colage img {
  margin: 20px auto 0;
  display: table;
}
.commercialplans-inner.commercialplans-two h5.yellow {
  color: #d26b00;
}
.commercialplans-inner ul li h5 {
  font-size: 19px !important;
  display: block !important;
  font-weight: 600;
  margin: 13px 0 7px !important;
  height: auto !important;
}
.commercialplans-inner ul li p::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 8px;
  background: #20253d;
  border-radius: 100px;
}
.commercialplans-inner ul li.ul-org .photoshoot-stp h5 {
  color: #f28400;
}
.commercialplans-inner ul li.ul-green .RecordPro-stp {
  color: #a9bc00;
}
.commercialplans-inner ul li.ul-volt {
  background: #ff000014;
  border: 2px dashed red;
  border-radius: 10px;
  padding: 20px 10px 16px 42px;
  margin-bottom: 12px;
}
.hero-wrap {
  background-image: url("../images/banner-bk.png");
  background-repeat: no-repeat;
  background-size: cover;
  padding: 60px 0 0px;
  border-radius: 0 0 70px 70px;
}
.container
{
       max-width: 1120px;
       margin: 0 auto;
}
span.span-titlenew {
background: #00ad4f;
color: #fff;
padding: 10px 20px;
display: inline-block;
border-radius: 4px;
font-size: 23px;
margin: 15px 0 0;
}
.down-arrow {
  position: relative;
  z-index: 1;
}
.hero-intro-section {
  position: relative;
  padding: 50px 18px;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 50%, #e0e7ff 100%);
  overflow: hidden;
  z-index: 1;
  margin-top: 40px;
}
span.million-view {
  box-shadow: 0 0 10px 1px #ddd;
  display: inline-block;
  padding: 13px 40px;
  font-size: 29px;
  margin-top: 33px;
  border-radius: 10px;
  font-weight: 600;
}
span.secreat {
  width: 100%;
  display: table;
  font-size: 22px;
  margin-bottom: 15px;
}
span.wtch-yel {
  background: #ffe63f;
  padding: 13px 20px;
  font-size: 22px;
  margin: 39px auto 6px;
  display: table;
  border-radius: 10px;
  font-weight: 600;
}
.hero-intro-container {
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}
span.recap {
  border: 1px solid #ff1f8c;
  color: #ff1f8c;
  padding: 10px 12px;
  border-radius: 6px;
  display: inline-block;
  margin-bottom: 15px;
  font-size: 24px;
  font-weight: 600;
}
.hero-intro-content {
  text-align: center;
  margin-bottom: 30px;
}
.paypal-wrap h1 {
color: #fff;
font-size: 33px;
max-width: 900px;
margin: 0 auto 14px;
font-weight: 700;
}
.proof-grid-images img {
  width: 100%;
}
p.real-tok {
color: #fff;
font-size: 19px;
padding: 0 30px;
}
p.real-tok span
{
color: #ff1f8c;
font-weight: 700;
}
span.main-tok-ai {
width: auto;
color: #ff1f8c;
font-size: 60px;
border: 2px solid;
margin: 0 auto 20px;
display: table;
padding: 8px 30px;
border-radius: 12px;
}
section.launch-timeline h1 {
text-align: center;
color: #6d44ff;
}
section.prelaunc-lead {
background: rgb(135,86,255);
background: -moz-linear-gradient(45deg, rgba(135,86,255,1) 0%, rgba(112,52,255,1) 100%);
background: -webkit-linear-gradient(45deg, rgba(135,86,255,1) 0%,rgba(112,52,255,1) 100%);
background: linear-gradient(45deg, rgba(135,86,255,1) 0%,rgba(112,52,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8756ff', endColorstr='#7034ff',GradientType=1 );
padding: 60px 0;
}
section.launch-timeline h6 {
text-align: center;
font-size: 18px;
}
.arrow {
text-align: center;
}
.bounce {
-moz-animation: bounce 2s infinite;
-webkit-animation: bounce 2s infinite;
animation: bounce 2s infinite;
}
img.arrow.bounce {
  position: relative;
  top: 30px;
}
.tp-showcase__image video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 15px;
}
.tp-showcase__image {
  margin-bottom: 16px;
}
.down-arrow span {
  text-align: center;
  width: 100%;
  display: table;
}

.paypal-wrap {
  background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/res-pink-bg.jpg/public");
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 50px;
  padding: 35px 20px;
  background-position: center bottom;

}
.mf-demo-play video, .imgf-demo-play video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
section.paypal-btn.section-wrap {
  padding: 50px 0;
}
.reality-wrap {
  background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/res-pink-bg.jpg/public");
  background-repeat: no-repeat;
  background-size: cover;
}
span#mfDemoPlaceholder {
  display: none;
}
.launch-speed {
  text-align: center;
  width: 100%;
  padding: 29px 0 0;
}

.launch-speed p {
  font-size: 24px;
  text-align: center;
}
.tp-footer-row a {
  margin: 0 auto;
}

.oto-cards {
  text-align: center;
  width: 100%;
}
.oto-cards p.pay-down {
  font-size: 22px;
  margin: 19px 0 31px;
}
span.use-code {
  width: 100%;
  display: table;
  text-align: center;
  font-size: 20px;
  margin: 18px 0 7px;
}
.dx-capsule-shimmer {
  pointer-events: none;
  position: absolute;
  top: -60%;
  left: -40%;
  width: 60%;
  height: 220%;
  background: linear-gradient(
    120deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.8) 45%,
    rgba(255, 255, 255, 0) 90%
  );
  transform: translateX(-130%) skewX(-18deg);
  opacity: 0;
  mix-blend-mode: screen;
  animation: dxCapsuleSweep 9s ease-in-out infinite;
}
.grad-bk {
  position: relative;
  max-width: 980px;
  padding: 18px 26px;
  border-radius: 999px;
  background: radial-gradient(circle at top left, rgba(15, 23, 42, 0.96), rgba(15, 23, 42, 0.85));
  border: 1px solid rgba(252, 211, 77, 0.9);
  box-shadow: 0 0 0 2px rgba(253, 224, 71, 0.2),
    0 18px 55px rgba(15, 23, 42, 0.9),
    inset 0 1px 0 rgba(255, 255, 255, 0.45);
  backdrop-filter: blur(20px);
  overflow: hidden;
  transition: transform 0.35s ease, box-shadow 0.35s ease;
  margin: 0 auto 16px;
}
.dx-glow-separator {
  width: 260px;
  height: 4px;
  border-radius: 999px;
  margin: 20px auto 32px;
  background: radial-gradient(circle, #ec4899 0%, #3b82f6 35%, transparent 70%);
  box-shadow: 0 0 18px rgba(227, 21, 250, 0.95),
    0 0 40px rgba(183, 36, 251, 0.75);
  opacity: 0.98;
}

a.cta-button-main span:nth-child(1) {
  top: 0;
  left: 0;
  width: 100%;
  height: 10px;
  background: linear-gradient(90deg, transparent, #d09500);
  animation: animate1 1s linear infinite;
     position: absolute;
  display: block;
}

a.cta-button-main span:nth-child(2) {
  top: -100%;
  right: 0;
  width: 10px;
  height: 100%;
  background: linear-gradient(180deg, transparent, #d09500);
  animation: animate2 1s linear infinite;
  animation-delay: 0.25s;
     position: absolute;
  display: block;
}
a.cta-button-main span:nth-child(3) {
  bottom: 0;
  right: 0;
  width: 100%;
  height: 10px;
  background: linear-gradient(270deg, transparent, #ffbd17);
  animation: animate3 1s linear infinite;
     position: absolute;
  display: block;
  animation-delay: 0.5s;
}.down-arrow.oposit-error {
  margin-top: -50px;
}
section.tp-showcase .grad-bk {
  margin-top: 30px;
  margin-bottom: 30px;
}
.image-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 16px;
}
.tiktok-attention__headline span {
  color: #00baff;
  border: 2px solid;
  padding: 4px 20px;
  border-radius: 10px;
  display: inline-block;
  position: relative;
  top: 10px;
  font-size: 32px;
}
.video-colg {
  position: relative;
}
.video-colg img {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
  top: 50%;
  transform: translateY(-50%);
}
a.cta-button-main span:nth-child(4) {
  bottom: -100%;
  left: 0;
  width: 10px;
  height: 100%;
  background: linear-gradient(360deg, transparent, #ffbd17);
  animation: animate4 1s linear infinite;
  animation-delay: 0.75s;
     position: absolute;
  display: block;
}

section.prelaunc-lead h2 {
text-align: center;
color: #fff;
font-size: 60px;
text-shadow: 1px 1px 1px #000;
font-weight: 800;
}
section#prizes h2 span {
color: #FEDC01;
}
.launch-date {
display: flex;
justify-content: center;
align-items: center;
margin: 30px 0 33px;
}
.launch-date h5 {
background: #300560;
color: #fff;
font-size: 29px;
text-transform: uppercase;
padding: 8px 20px;
border-radius: 10px;
display: flex;
align-items: center;
}
.launch-date h5 img {
margin-right: 11px;
}
.launch-date h5 img:last-child {
margin-left: 23px;
}
.launch-date span {
color: #fff;
font-size: 27px;
background: transparent;
border-radius: 100px;
width: 54px;
height: 54px;
margin: 0 19px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 0 10px 1px #dddddd4f;
padding-top: 6px;
}
.prelaunc-lead-left ul li {
list-style: none;
background: #fff;
margin-bottom: 24px;
border-radius: 10px;
overflow: hidden;
padding: 14px 22px;
display: flex;
align-items: center;
}
.prelaunc-lead-left ul li h5 {
font-size: 38px;
margin: 10px 110px 0 41px;
color: #20253D;
min-width: 234px;
}
.prelaunc-lead-left ul li span {
font-size: 38px;
margin: 11px 0 0;
background: -webkit-linear-gradient(#b190ff, #7034FF);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-weight: 700;
}
.prelaunc-lead-right {
background: #fff;
padding: 30px 30px 8px;
border-radius: 8px;
}
.prelaunc-lead-right h4 {
text-align: center;
font-size: 36px;
}
section.prelaunc-lead .prelaunc-lead-right p {
color: #20253D;
font-size: 18px;
line-height: 27px;
text-align: left;
margin-bottom: 23px;
}
section.launch-cup {
padding: 50px 0 50px;
position: relative;
background-image: url(../images/trofy-bk.png);
background-repeat: no-repeat;
background-position: bottom;
background-size: cover;
}
section.launch-cup h2 {
color: #003957;
font-size: 75px;
text-align: center;
margin: 0 auto 55px;
display: table;
position: relative;
}
.launc-des {
padding-bottom: 20px;
}
.launc-des {
text-align: center;
}
.launc-des h3 {
font-size: 46px;
color: #3518B4;
font-weight: 600;
}
.launc-des p {
  font-size: 24px;
  line-height: 32px;
  text-transform: uppercase;
  padding: 0 100px;
}
.launc-des-cup ul {
padding: 0;
}
section.launch-cup h2::before {
content: "";
width: 100%;
height: 9px;
border-radius: 10px;
background: #FF5050;
position: absolute;
bottom: 0;
}
.launc-des-cup ul li {
list-style: none;
background: #fff;
background: -moz-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,251,238,1) 100%);
background: -webkit-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,251,238,1) 100%);
background: linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(255,251,238,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff',endColorstr='#fffbee',GradientType=0 );
border: 3px solid #fec301;
border-radius: 10px;
margin-bottom: 31px;
box-shadow: 3px 4px 1px 1px #fec301;
display: flex;
padding: 15px 0;
align-items: center;
}
.launc-des-cup ul li img {
max-width: 79px;
}
.launc-des-cup li h4 {
color: #2C3C47;
font-size: 38px;
margin: 6px 0 0;
padding-left: 23px;
min-width: 310px;
}
.launc-des-cup ul li:first-child img {
max-width: 123px;
position: relative;
margin-top: -55px;
left: -16px;
}
.launc-des-cup li:first-child h4 {
padding: 0;
margin-left: -15px;
}
.launc-des-cup li span {
font-size: 35px;
color: #2C3C47;
margin: 8px 0 0;
font-weight: 600;
}
.launc-des-cup ul li:first-child span {
color: #E3335B;
margin-left: -29px;
}
.launc-des-cup ul li:nth-child(2) span {
color: #003FBC;
}
.launc-des-cup ul li:nth-child(3) span {
color: #30AF6E;
}
section.launch-cup h6 {
font-size: 26px;
color: #E3335B;
text-align: center;
}
.launc-des-cup.pr-3 p {
font-size: 14px;
text-align: center;
}

.launc-des-cup ul li:nth-child(2) {
border-color: #08CCFE;
box-shadow: 3px 4px 1px 1px #08CCFE;
background: rgb(255,255,255);
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(229,250,255,1) 100%);
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(229,250,255,1) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,250,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5faff',GradientType=0 );
}
.launc-des-cup ul li:nth-child(3) {
border-color: #49CA88;
box-shadow: 3px 4px 1px 1px #49CA88;
background: rgb(255,255,255);
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(241,255,248,1) 100%);
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(241,255,248,1) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(241,255,248,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f1fff8',GradientType=0 );
}
.launc-des-cup ul li:nth-child(4), .launc-des-cup ul li:last-child {
border-color: #D6D6D6;
box-shadow: 3px 4px 1px 1px #D6D6D6;
background: rgb(255,255,255);
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(239,239,239,1) 100%);
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%);
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(239,239,239,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=0 );
}
section.promoter-sec {
padding: 50px 0;
background-image: url(../images/jai-bk.png);
background-repeat: no-repeat;
background-size: cover;
}
section.promoter-sec h2 {
text-align: center;
margin-bottom: 70px;
font-size: 55px;
}
section.new-agrigat {
  background: #faeffe;
  padding: 60px 0;
  text-align:center;
}
.my-partner-outer img.absolute:nth-child(2) {
  position: absolute;
  right: -70px;
  top: 50px;
}
.my-partner-outer img.absolute:first-child {
  position: absolute;
  left: -60px;
  top: 60px;
}
.my-partner h4 {
  font-size: 30px;
  margin-bottom: 22px;
}
.my-partner button {
  width: 27%;
  background: transparent;
  border: 0;
  color: #000;
  margin: 8px 0;
  text-align: left;
}
.my-partner button a {
  color: #000;
  text-decoration: none;
  font-size: 17px;
}
section.meet-agricator div {
  text-align: center;
}
.my-partner-outer {
  background-color: #E8A1FF;
  border-radius: 20px;
  position: relative;
  margin-top: 30px;
  padding: 33px 0;
}
section.meet-agricator {
  background-color: #36074E;
  padding: 70px 0;
}
section.meet-agricator h3 {
  font-size: 58px;
  font-weight: 700;
}
section.meet-agricator p {
  font-size: 23px;
}
section.new-agrigat img {
  margin: 20px 0;
}
.promoter-sec-left img {
  position: relative;
  left: -204px;
  top: -23px;
}
.promoter-sec-right {
display: flex;
}
.promoter-sec-right-col {
width: 50%;
padding: 0 11px;
}
.pro-sec-blog {
background: #DBF7FE;
border: 1px solid #78DBF5;
padding: 20px 10px;
border-radius: 5px;
margin-bottom: 30px;
box-shadow: 0px 6px 2px 0px #AAD7EF;
} 
.pro-sec-blog h4 {
position: relative;
font-size: 18px;
line-height: 27px;
padding-left: 44px;
color: #2C3C47;
margin-bottom: 0;
}

.pro-sec-blog h4 img {
position: absolute;
left: -8px;
}
.pro-sec-blog p {
padding-left: 43px;
font-size: 17px;
color: #2C3C47;
line-height: 25px;
margin-top: 9px;
margin-bottom: 16px;
}
.pro-sec-blog.pro-fr-jv {
background: #E7FEE7;
border-color: #84F8BD;
box-shadow: 0px 6px 2px 0px #BDF3BD;
}.pro-sec-blog.pro-fv-jv {
background: #F9F6FF;
border-color: #C6B1F8;
box-shadow: 0px 6px 2px 0px #E1D2FF;
}.pro-sec-blog.pro-sx-jv {
background: #FFECF1;
border-color: #FFC9D6;
box-shadow: 0px 6px 2px 0px #F9D2FF;
}
.pro-sec-blog.pro-gr-jv {
background: #E7FEE7;
border-color: #84F8BD;
box-shadow: 0px 6px 2px 0px #BDF3BD;
}
.pro-sec-blog.pro-sec-jv {
background: #FFFAE8;
border-color: #FEC301;
box-shadow: 0px 6px 2px 0px #F9D99D;
}
.pro-sec-blog.pro-thr-jv {
background: #F9F6FF;
border-color: #C6B1F8;
box-shadow: 0px 6px 2px 0px #E1D2FF;
}
section.track-records h2 {
font-size: 46px;
color: #3518B4;
text-align: center;
border-top: 1px dashed #ddd;
padding-top: 50px;
font-weight: 700;
}
section.track-records p {
font-size: 29px;
text-align: center;
margin-bottom: 70px;
}

section.track-records ul {
padding: 0;
display: flex;
flex-wrap: wrap;
}
section.track-records ul li {
list-style: none;
width: 18.7%;
margin: 0 7px;
background: -moz-linear-gradient(left,  rgba(255,255,255,1) 0%, rgba(255,255,255,1) 1%, rgba(255,255,255,0.83) 73%, rgba(230,245,255,0.77) 100%);
background: -webkit-linear-gradient(left,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 1%,rgba(255,255,255,0.83) 73%,rgba(230,245,255,0.77) 100%);
background: linear-gradient(to right,  rgba(255,255,255,1) 0%,rgba(255,255,255,1) 1%,rgba(255,255,255,0.83) 73%,rgba(230,245,255,0.77) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#c4e6f5ff',GradientType=1 );
border: 1px solid #10BEFE;
border-radius: 4px;
padding: 0 13px 14px;
text-align: center;
margin-bottom: 60px;
box-shadow: 1px 2px 6px 3px #A8DBF6;
}
section.track-records ul li h5 {
font-size: 26px;
color: #fff;  
background: #00A8FF;
margin: -17px auto 13px;
display: table;
padding: 1px 20px;
border-radius: 2px;
font-weight: 700;
box-shadow: 0px 2px 1px 1px #0099FF;
}
section.track-records ul li img {
max-width: 93%;
} 
section.receplotae {
padding-top: 22px;
padding-bottom: 90px;
}
section.receplotae h2 {
border-top: 1px dashed #ddd;
padding-top: 50px;
text-align: center;
color: #1B2E4E;
font-size: 63px;
font-weight: 700;
}
section.receplotae p {
text-align: center;
font-size: 28px;
margin-bottom: 5px;
color: #2B446E;
}
section.receplotae h4 {
text-align: center;
width: 100%;
margin-bottom: 55px;
}
section.receplotae h4 u {
font-size: 28px;
text-decoration: underline;
color: #0099FF;
}
.receplotae-inner {
border: 1px solid #dcf1ff;
border-radius: 9px;
text-align: center;
padding: -1px 0 40px;
min-height: 138px;
margin-bottom: 16px;
overflow: hidden;
background: #1aa8ff;
}
.receplotae-inner span {
font-size: 20px;
text-align: center;
width: 100%;
float: left;
color: #62667a;
margin-bottom: 20px;
font-size: 14px;
text-align: center;
width: 100%;
float: left;
color: #083580;
margin-bottom: 20px;
background: #c9edff;
padding: 10px 0;
}
.receplotae-inner img {
max-height: 35px;
object-fit: contain;
max-height: 58px;
object-fit: contain;
max-width: 180px;
}
section.receplotae .col-md-4 {
padding: 0 8px;
width: 20%;
-ms-flex: 0 0 20%;
flex: 0 0 20%;
max-width: 20%;
}
section.welcm-introduction {
background: -moz-linear-gradient(45deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0.8) 41%, rgba(255,255,255,0.76) 49%, rgba(125,185,232,0.51) 100%);
background: -webkit-linear-gradient(45deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0.8) 41%,rgba(255,255,255,0.76) 49%,rgba(125,185,232,0.51) 100%);
background: linear-gradient(45deg, rgba(255,255,255,1) 0%,rgba(255,255,255,0.8) 41%,rgba(255,255,255,0.76) 49%,rgba(125,185,232,0.51) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#827db9e8',GradientType=1 );
padding: 70px 0;
background-image: url(../images/author-bk.png);
background-repeat: no-repeat;
background-size: cover;
}

section.jv-get-touch h2 {
text-align: center;
margin: 0 auto;
display: table;
padding: 0 20px;
position: relative;
font-size: 48px;
font-weight: 700;
}
section.jv-get-touch h2 img {
margin-right: 14px;
}

.welcm-introduction-left ul {
margin: 0;
padding: 0;
}
.welcm-introduction-left ul li {
font-size: 24px;
border-bottom: 1px solid #ddd;
width: 100%;
float: left;
padding: 13px 0;
line-height: 41px;
list-style: none;
position: relative;
padding-left: 60px;
font-size: 23px;
}
.welcm-introduction-left ul li img {
position: absolute;
left: 0;
top: 7px;
}
.welcm-introduction-right img {
position: relative;
left: 30px;
}
section.jv-brands h2 img {
margin-left: 16px;
}
section.jv-brands p {
font-size: 28px;
text-align: center;
margin-bottom: 30px;
}
.fobes img {
width: 100%;
}
section.jv-brands {
padding: 50px 0 90px;
}
section.jv-brands h2 {
text-align: center;
font-size: 47px;
font-weight: 700;
}
section.jv-brands p span {
border-bottom: 4px solid #0099FF;
padding-bottom: 5px;
}
img.brand-logo {
width: 100%;
margin-bottom: 90px;
}
.jv-brand-own {
background-image: url(../images/yop-bk.png);
background-repeat: no-repeat;
background-size: contain;
padding: 0px 0 0;
text-align: center;
background-position: center;
}
.payment-jv-left img {
width: 100%;
}
.payment-jv-right::before {
width: 190px;
height: 310px;
background-image: url(../images/lapi.png);
background-repeat: no-repeat;
content: "";
position: absolute;
right: -133px;
bottom: -20px;
} 
.payment-jv-right h3 {
font-size: 28px;
text-align: center;
font-weight: 700;
color: #083580;
margin-bottom: 15px;
}
.payment-data {
background: #a2d8ff40;
border: 1px solid #a2d8ff40;
border-radius: 6px;
padding: 21px;
max-width: 91%;
margin: 0 auto;
}
.payment-data a {
background: #4291F8;
width: 100%;
display: table;
max-width: 425px;
margin: 0 auto 15px;
height: 70px;
border-radius: 6px;
display: flex;
align-items: center;
font-size: 27px;
color: #fff;
padding: 0 9px;
box-shadow: 1px 4px 1px 1px #0153BB;
position: relative;
padding-left: 75px;
text-decoration: none;
}
.payment-data a span {
position: absolute;
left: 0;
top: 0;
border-right: 1px solid #dddddd42;
height: 100%;
bottom: 0;
display: flex;
align-items: center;
padding: 0px 10px;
width: 56px;
justify-content: center;
text-align: center;
}
.payment-data a:last-child {
background: #00BAFF;
box-shadow: 1px 4px 1px 1px #0C96CB;
}

.payment-data h5 {
font-size: 26px;
line-height: 34px;
color: #394271;
font-weight: 700;
text-align: center;
margin-bottom: 18px;
text-transform: uppercase;
}

@keyframes bounce {
0%, 20%, 50%, 80%, 100% {
  transform: translateY(0);
}
40% {
  transform: translateY(-30px);
}
60% {
  transform: translateY(-15px);
}
}

@keyframes dxCapsuleSweep {
      0% {
          transform: translateX(-140%) skewX(-18deg);
          opacity: 0;
      }

      20% {
          opacity: 0.85;
      }

      55% {
          transform: translateX(160%) skewX(-18deg);
          opacity: 0.9;
      }

      100% {
          transform: translateX(200%) skewX(-18deg);
          opacity: 0;
      }
  }

  @keyframes animate1 {
0% {
  left: -100%;
}
50%,
100% {
  left: 100%;
}
}

@keyframes animate2 {
0% {
  top: -100%;
}
50%,
100% {
  top: 100%;
}
}
@keyframes animate3 {
0% {
  right: -100%;
}
50%,
100% {
  right: 100%;
}
}
@keyframes animate4 {
0% {
  bottom: -100%;
}
50%,
100% {
  bottom: 100%;
}
}

/* Number Calculations Section */
.number-calculations-section {
position: relative;
padding: 50px 20px;
background: linear-gradient(135deg, 
  rgba(15, 23, 42, 0.98) 0%, 
  rgba(30, 41, 59, 0.95) 50%,
  rgba(15, 23, 42, 0.98) 100%);
overflow: hidden;
}

.number-calculations-section::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: 
  radial-gradient(circle at 20% 30%, rgba(255, 31, 140, 0.15) 0%, transparent 50%),
  radial-gradient(circle at 80% 70%, rgba(122, 60, 255, 0.15) 0%, transparent 50%),
  radial-gradient(circle at 50% 50%, rgba(250, 204, 21, 0.1) 0%, transparent 60%);
pointer-events: none;
z-index: 0;
}

.calculations-container {
max-width: 1200px;
margin: 0 auto;
position: relative;
z-index: 1;
}

.calculations-header {
text-align: center;
margin-bottom: 40px;
}

.calculations-title {
font-size: 42px;
font-weight: 900;
margin-bottom: 20px;
line-height: 1.2;
}

.gradient-text-yellow {
background: linear-gradient(135deg, #facc15 0%, #fbbf24 50%, #f59e0b 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-shadow: 0 0 30px rgba(250, 204, 21, 0.5);
display: inline-block;
filter: drop-shadow(0 4px 8px rgba(250, 204, 21, 0.3));
}

.calculations-proposition {
font-size: 22px;
color: #e2e8f0;
margin-bottom: 15px;
line-height: 1.5;
}

.calculations-proposition strong {
color: #facc15;
font-weight: 700;
}

.price-highlight {
color: #facc15;
font-size: 26px;
font-weight: 900;
text-shadow: 0 0 20px rgba(250, 204, 21, 0.6);
}

.calculations-intro {
font-size: 17px;
color: #cbd5e1;
max-width: 900px;
margin: 0 auto;
line-height: 1.6;
}

.calculations-intro strong {
color: #facc15;
font-weight: 600;
}

.calculations-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 20px;
margin-bottom: 40px;
}

.calculation-card {
position: relative;
padding: 28px 24px;
border-radius: 24px;
background: linear-gradient(135deg, 
  rgba(255, 255, 255, 0.08) 0%, 
  rgba(255, 255, 255, 0.03) 100%);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.1);
box-shadow: 
  0 20px 60px rgba(0, 0, 0, 0.3),
  inset 0 1px 0 rgba(255, 255, 255, 0.1);
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            box-shadow 0.4s ease;
overflow: hidden;
opacity: 0;
transform: translateY(30px);
animation: fadeInUpCard 0.8s ease forwards;
}

.calculation-card:nth-child(1) {
animation-delay: 0.1s;
}

.calculation-card:nth-child(2) {
animation-delay: 0.2s;
}

.calculation-card:nth-child(3) {
animation-delay: 0.3s;
}

.calculation-card:nth-child(4) {
animation-delay: 0.4s;
}

@keyframes fadeInUpCard {
to {
  opacity: 1;
  transform: translateY(0);
}
}

.calculation-card:hover {
transform: translateY(-8px) scale(1.02);
box-shadow: 
  0 30px 80px rgba(0, 0, 0, 0.4),
  inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.card-glow {
position: absolute;
top: -50%;
left: -50%;
width: 200%;
height: 200%;
opacity: 0;
transition: opacity 0.4s ease;
pointer-events: none;
z-index: 0;
}

.calculation-card:hover .card-glow {
opacity: 1;
}

.card-1 {
background: linear-gradient(135deg, 
  rgba(250, 204, 21, 0.15) 0%, 
  rgba(251, 191, 36, 0.08) 100%);
}

.card-1 .card-glow {
background: radial-gradient(circle, rgba(250, 204, 21, 0.4) 0%, transparent 70%);
}

.card-2 {
background: linear-gradient(135deg, 
  rgba(59, 130, 246, 0.15) 0%, 
  rgba(37, 99, 235, 0.08) 100%);
}

.card-2 .card-glow {
background: radial-gradient(circle, rgba(59, 130, 246, 0.4) 0%, transparent 70%);
}

.card-3 {
background: linear-gradient(135deg, 
  rgba(16, 185, 129, 0.15) 0%, 
  rgba(5, 150, 105, 0.08) 100%);
}

.card-3 .card-glow {
background: radial-gradient(circle, rgba(16, 185, 129, 0.4) 0%, transparent 70%);
}

.card-4 {
background: linear-gradient(135deg, 
  rgba(255, 31, 140, 0.15) 0%, 
  rgba(236, 72, 153, 0.08) 100%);
}

.card-4 .card-glow {
background: radial-gradient(circle, rgba(255, 31, 140, 0.4) 0%, transparent 70%);
}

.card-3d-icon {
position: absolute;
top: 16px;
right: 16px;
z-index: 2;
width: 70px;
height: 70px;
display: flex;
align-items: center;
justify-content: center;
}

/* 3D Check Icon */
.icon-3d-check {
position: relative;
width: 60px;
height: 60px;
transform-style: preserve-3d;
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.icon-3d-check-circle {
width: 60px;
height: 60px;
border-radius: 50%;
background: linear-gradient(135deg, #10b981 0%, #059669 100%);
box-shadow: 
  0 10px 30px rgba(16, 185, 129, 0.4),
  inset 0 2px 10px rgba(255, 255, 255, 0.3),
  inset 0 -2px 10px rgba(0, 0, 0, 0.2);
transform: perspective(1000px) rotateY(-15deg) rotateX(5deg);
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.icon-3d-check-mark {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
font-size: 32px;
font-weight: 900;
text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
z-index: 1;
}

.calculation-card:hover .icon-3d-check-circle {
transform: perspective(1000px) rotateY(0deg) rotateX(0deg) scale(1.1);
}

/* 3D Money/Coins Icon */
.icon-3d-money {
position: relative;
width: 70px;
height: 70px;
transform-style: preserve-3d;
}

.icon-3d-coin {
position: absolute;
width: 35px;
height: 35px;
border-radius: 50%;
background: linear-gradient(135deg, #facc15 0%, #f59e0b 100%);
box-shadow: 
  0 8px 20px rgba(250, 204, 21, 0.5),
  inset 0 2px 8px rgba(255, 255, 255, 0.4),
  inset 0 -2px 8px rgba(0, 0, 0, 0.2);
transform-style: preserve-3d;
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.icon-3d-coin::before {
content: '$';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
font-size: 18px;
font-weight: 900;
text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

.icon-3d-coin.coin-1 {
top: 0;
left: 50%;
transform: translateX(-50%) perspective(1000px) rotateY(-20deg) rotateX(10deg);
}

.icon-3d-coin.coin-2 {
top: 20px;
left: 10px;
transform: perspective(1000px) rotateY(15deg) rotateX(-5deg);
z-index: 1;
}

.icon-3d-coin.coin-3 {
top: 20px;
right: 10px;
transform: perspective(1000px) rotateY(-15deg) rotateX(-5deg);
z-index: 2;
}

.calculation-card:hover .icon-3d-coin.coin-1 {
transform: translateX(-50%) perspective(1000px) rotateY(0deg) rotateX(0deg) translateY(-5px);
}

.calculation-card:hover .icon-3d-coin.coin-2 {
transform: perspective(1000px) rotateY(0deg) rotateX(0deg) translateY(-5px);
}

.calculation-card:hover .icon-3d-coin.coin-3 {
transform: perspective(1000px) rotateY(0deg) rotateX(0deg) translateY(-5px);
}

/* 3D Rocket Icon */
.icon-3d-rocket {
position: relative;
width: 60px;
height: 60px;
transform-style: preserve-3d;
transform: perspective(1000px) rotateY(-15deg) rotateX(5deg);
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.rocket-body {
position: absolute;
top: 10px;
left: 50%;
transform: translateX(-50%);
width: 20px;
height: 35px;
background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
border-radius: 10px 10px 4px 4px;
box-shadow: 
  0 8px 20px rgba(59, 130, 246, 0.5),
  inset 0 2px 8px rgba(255, 255, 255, 0.3),
  inset 0 -2px 8px rgba(0, 0, 0, 0.2);
}

.rocket-wings {
position: absolute;
width: 0;
height: 0;
border-style: solid;
}

.rocket-wings.wing-left {
top: 20px;
left: 8px;
border-width: 0 12px 15px 0;
border-color: transparent #60a5fa transparent transparent;
filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
}

.rocket-wings.wing-right {
top: 20px;
right: 8px;
border-width: 0 0 15px 12px;
border-color: transparent transparent transparent #60a5fa;
filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
}

.rocket-flame {
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 12px;
height: 15px;
background: linear-gradient(180deg, #facc15 0%, #f59e0b 50%, #ef4444 100%);
border-radius: 0 0 6px 6px;
box-shadow: 0 0 15px rgba(250, 204, 21, 0.8);
animation: rocketFlame 1s ease-in-out infinite;
}

@keyframes rocketFlame {
0%, 100% {
  height: 15px;
  opacity: 1;
}
50% {
  height: 20px;
  opacity: 0.8;
}
}

.calculation-card:hover .icon-3d-rocket {
transform: perspective(1000px) rotateY(0deg) rotateX(0deg) scale(1.15) translateY(-5px);
}

/* 3D Fire Icon */
.icon-3d-fire {
position: relative;
width: 60px;
height: 60px;
transform-style: preserve-3d;
transform: perspective(1000px) rotateY(-15deg) rotateX(5deg);
transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.flame {
position: absolute;
border-radius: 50% 50% 50% 50% / 60% 60% 40% 40%;
filter: blur(1px);
animation: flicker 1.5s ease-in-out infinite;
}

.flame-1 {
width: 25px;
height: 35px;
background: linear-gradient(180deg, #facc15 0%, #f59e0b 50%, #ef4444 100%);
left: 50%;
bottom: 5px;
transform: translateX(-50%);
box-shadow: 0 0 20px rgba(250, 204, 21, 0.8);
animation-delay: 0s;
z-index: 3;
}

.flame-2 {
width: 20px;
height: 28px;
background: linear-gradient(180deg, #f59e0b 0%, #ef4444 50%, #dc2626 100%);
left: 35%;
bottom: 8px;
box-shadow: 0 0 15px rgba(239, 68, 68, 0.7);
animation-delay: 0.3s;
z-index: 2;
}

.flame-3 {
width: 20px;
height: 28px;
background: linear-gradient(180deg, #f59e0b 0%, #ef4444 50%, #dc2626 100%);
right: 35%;
bottom: 8px;
box-shadow: 0 0 15px rgba(239, 68, 68, 0.7);
animation-delay: 0.6s;
z-index: 2;
}

@keyframes flicker {
0%, 100% {
  transform: translateX(0) scaleY(1);
}
25% {
  transform: translateX(-2px) scaleY(1.1);
}
50% {
  transform: translateX(2px) scaleY(0.95);
}
75% {
  transform: translateX(-1px) scaleY(1.05);
}
}

.calculation-card:hover .icon-3d-fire {
transform: perspective(1000px) rotateY(0deg) rotateX(0deg) scale(1.15) translateY(-5px);
}

.calculation-content {
position: relative;
z-index: 1;
padding-right: 80px;
}

.card-title {
font-size: 18px;
font-weight: 700;
color: #f1f5f9;
margin-bottom: 18px;
line-height: 1.3;
}

.calculation-result {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 12px;
flex-wrap: wrap;
}

.calculation-formula {
font-size: 16px;
color: #cbd5e1;
font-weight: 600;
}

.calculation-amount {
font-size: 32px;
font-weight: 900;
background: linear-gradient(135deg, #facc15 0%, #fbbf24 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
text-shadow: 0 0 20px rgba(250, 204, 21, 0.4);
}

.calculation-benefit {
font-size: 14px;
color: #94a3b8;
font-style: italic;
margin-top: 8px;
}

.calculations-cta {
text-align: center;
padding: 35px 25px;
background: linear-gradient(135deg, 
  rgba(122, 60, 255, 0.2) 0%, 
  rgba(255, 31, 140, 0.2) 100%);
border-radius: 20px;
border: 1px solid rgba(255, 255, 255, 0.1);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
}

.cta-title {
font-size: 24px;
font-weight: 800;
color: #f1f5f9;
margin-bottom: 15px;
line-height: 1.3;
}

.cta-benefits {
font-size: 16px;
color: #cbd5e1;
line-height: 1.6;
max-width: 900px;
margin: 0 auto;
}

.cta-benefits strong {
color: #facc15;
font-weight: 700;
}

/* Responsive Design */
@media (max-width: 1024px) {
.calculations-grid {
  grid-template-columns: 1fr;
  gap: 18px;
}

.calculations-title {
  font-size: 36px;
}

.calculations-proposition {
  font-size: 20px;
}
}

@media (max-width: 768px) {
.number-calculations-section {
  padding: 40px 15px;
}

.calculations-header {
  margin-bottom: 30px;
}

.calculations-title {
  font-size: 28px;
  margin-bottom: 15px;
}

.calculations-proposition {
  font-size: 18px;
  margin-bottom: 12px;
}

.calculations-intro {
  font-size: 15px;
}

.calculation-card {
  padding: 24px 18px;
}

.calculation-content {
  padding-right: 0;
}

.card-3d-icon {
  position: relative;
  top: 0;
  right: 0;
  margin-bottom: 15px;
  width: 60px;
  height: 60px;
}

.card-title {
  font-size: 16px;
  margin-bottom: 15px;
}

.calculation-amount {
  font-size: 26px;
}

.calculations-cta {
  padding: 25px 20px;
}

.cta-title {
  font-size: 20px;
  margin-bottom: 12px;
}

.cta-benefits {
  font-size: 14px;
}

.icon-3d-check-circle {
  width: 50px;
  height: 50px;
}

.icon-3d-check-mark {
  font-size: 26px;
}

.icon-3d-coin {
  width: 28px;
  height: 28px;
}

.icon-3d-coin::before {
  font-size: 14px;
}
}

/* Investment Comparison Section - Modern Gradient Design */
.investment-comparison-section {
padding: 70px 0;
background: linear-gradient(135deg, #f5f7fa 0%, #f0f4ff 25%, #faf5ff 50%, #fff5f7 75%, #f5f7fa 100%);
position: relative;
overflow: hidden;
}

.investment-comparison-section::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: radial-gradient(circle at 20% 50%, rgba(139, 92, 246, 0.08) 0%, transparent 50%),
            radial-gradient(circle at 80% 80%, rgba(236, 72, 153, 0.08) 0%, transparent 50%),
            radial-gradient(circle at 40% 20%, rgba(59, 130, 246, 0.08) 0%, transparent 50%);
pointer-events: none;
}

.comparison-section,
.tokprimeai-highlight-section {
margin-bottom: 60px;
position: relative;
z-index: 1;
}

.comparison-section:last-of-type,
.tokprimeai-highlight-section:last-of-type {
margin-bottom: 0;
}

.section-header {
text-align: center;
margin-bottom: 0px;
}

.star-icon {
font-size: 28px;
display: inline-block;
margin-bottom: 12px;
animation: float 3s ease-in-out infinite;
}

@keyframes float {
0%, 100% { transform: translateY(0px); }
50% { transform: translateY(-8px); }
}

.section-title {
font-size: 38px;
font-weight: 800;
line-height: 1.2;
margin: 0;
letter-spacing: -0.8px;
}

.subtitle-text {
display: block;
font-size: 24px;
font-weight: 600;
margin-top: 8px;
opacity: 1;
}

.gradient-text-1 {
background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}

.gradient-text-2 {
background: linear-gradient(135deg, #f093fb 0%, #4facfe 50%, #00f2fe 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}

/* Comparison Grid */
.comparison-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 24px;
margin-top: 35px;
}

.comparison-card {
background: linear-gradient(145deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.9) 100%);
backdrop-filter: blur(20px);
border-radius: 20px;
padding: 28px 24px;
border: 1px solid rgba(255, 255, 255, 0.8);
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06),
            0 2px 12px rgba(139, 92, 246, 0.08),
            inset 0 1px 0 rgba(255, 255, 255, 0.95);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
overflow: hidden;
}

.comparison-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: linear-gradient(90deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
opacity: 0;
transition: opacity 0.4s ease;
}

.comparison-card:hover {
transform: translateY(-6px);
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.1),
            0 6px 20px rgba(139, 92, 246, 0.15),
            inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.comparison-card:hover::before {
opacity: 1;
}

.comparison-icon {
width: 64px;
height: 64px;
margin: 0 auto 18px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 16px;
position: relative;
transition: all 0.3s ease;
}

.comparison-icon svg {
width: 36px;
height: 36px;
transition: all 0.3s ease;
}

.stock-icon {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
box-shadow: 0 6px 20px rgba(102, 126, 234, 0.3);
}

.realestate-icon {
background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
color: white;
box-shadow: 0 6px 20px rgba(245, 87, 108, 0.3);
}

.crypto-icon {
background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
color: white;
box-shadow: 0 6px 20px rgba(79, 172, 254, 0.3);
}

.software-icon {
background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
color: white;
box-shadow: 0 6px 20px rgba(250, 112, 154, 0.3);
}

.comparison-card:hover .comparison-icon {
transform: scale(1.08) rotate(3deg);
}

.comparison-card:hover .comparison-icon svg {
transform: scale(1.05);
}

.comparison-title {
font-size: 22px;
font-weight: 700;
color: #1e293b;
margin: 0 0 14px 0;
text-align: center;
line-height: 1.35;
}

.comparison-desc {
font-size: 15px;
line-height: 1.6;
color: #475569;
margin: 0;
text-align: center;
}

.comparison-desc strong {
color: #1e293b;
font-weight: 700;
}

/* Highlight Section */
.highlight-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 24px;
margin-top: 35px;
}

.highlight-card {
background: linear-gradient(145deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.92) 100%);
backdrop-filter: blur(20px);
border-radius: 22px;
padding: 32px 28px;
border: 2px solid transparent;
background-clip: padding-box;
position: relative;
box-shadow: 0 6px 32px rgba(0, 0, 0, 0.06),
            0 3px 16px rgba(139, 92, 246, 0.1),
            inset 0 1px 0 rgba(255, 255, 255, 0.95);
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
overflow: hidden;
}

.highlight-card::before {
content: '';
position: absolute;
inset: 0;
border-radius: 22px;
padding: 2px;
background: linear-gradient(135deg, #f093fb 0%, #4facfe 50%, #00f2fe 100%);
-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
-webkit-mask-composite: xor;
mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
mask-composite: exclude;
opacity: 0;
transition: opacity 0.3s ease;
}

.highlight-card:hover {
transform: translateY(-6px);
box-shadow: 0 14px 48px rgba(0, 0, 0, 0.1),
            0 8px 24px rgba(139, 92, 246, 0.2),
            inset 0 1px 0 rgba(255, 255, 255, 0.95);
}

.highlight-card:hover::before {
opacity: 1;
}

.highlight-icon-wrapper {
display: flex;
justify-content: center;
margin-bottom: 20px;
}

.highlight-icon {
width: 80px;
height: 80px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 20px;
position: relative;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.highlight-icon svg {
width: 44px;
height: 44px;
transition: all 0.3s ease;
}

.ai-icon {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
box-shadow: 0 8px 24px rgba(102, 126, 234, 0.35),
            inset 0 2px 8px rgba(255, 255, 255, 0.2);
}

.rocket-icon {
background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
color: white;
box-shadow: 0 8px 24px rgba(245, 87, 108, 0.35),
            inset 0 2px 8px rgba(255, 255, 255, 0.2);
}

.clock-icon {
background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
color: white;
box-shadow: 0 8px 24px rgba(79, 172, 254, 0.35),
            inset 0 2px 8px rgba(255, 255, 255, 0.2);
}

.support-icon {
background: linear-gradient(135deg, #fa709a 0%, #fee140 100%);
color: white;
box-shadow: 0 8px 24px rgba(250, 112, 154, 0.35),
            inset 0 2px 8px rgba(255, 255, 255, 0.2);
}

.highlight-card:hover .highlight-icon {
transform: scale(1.1) rotate(3deg);
}

.highlight-card:hover .highlight-icon svg {
transform: scale(1.05);
}

.highlight-title {
font-size: 20px;
font-weight: 700;
color: #1e293b;
margin: 0 0 14px 0;
text-align: center;
line-height: 1.4;
}

.highlight-desc {
font-size: 15px;
line-height: 1.65;
color: #475569;
margin: 0;
text-align: center;
}

.highlight-desc strong {
color: #1e293b;
font-weight: 700;
}

/* Responsive Design */
@media (max-width: 768px) {
.investment-comparison-section {
  padding: 50px 0;
}

.section-title {
  font-size: 30px;
}

.subtitle-text {
  font-size: 20px;
}

.comparison-section,
.tokprimeai-highlight-section {
  margin-bottom: 45px;
}

.section-header {
  margin-bottom: 30px;
}

.comparison-grid,
.highlight-grid {
  grid-template-columns: 1fr;
  gap: 20px;
  margin-top: 28px;
}

.comparison-card,
.highlight-card {
  padding: 24px 20px;
}

.comparison-title,
.highlight-title {
  font-size: 19px;
  margin-bottom: 12px;
}

.comparison-desc,
.highlight-desc {
  font-size: 14px;
}

.comparison-icon {
  width: 56px;
  height: 56px;
  margin-bottom: 16px;
}

.comparison-icon svg {
  width: 32px;
  height: 32px;
}

.highlight-icon {
  width: 72px;
  height: 72px;
  margin-bottom: 18px;
}

.highlight-icon svg {
  width: 40px;
  height: 40px;
}
}

@media (max-width: 480px) {
.investment-comparison-section {
  padding: 40px 0;
}

.section-title {
  font-size: 24px;
}

.subtitle-text {
  font-size: 18px;
}

.comparison-section,
.tokprimeai-highlight-section {
  margin-bottom: 40px;
}

.section-header {
  margin-bottom: 28px;
}

.comparison-card,
.highlight-card {
  padding: 22px 18px;
  border-radius: 18px;
}

.comparison-title,
.highlight-title {
  font-size: 18px;
}
}

/* ================== BEST PART SECTION ================== */
.best-part-section {
position: relative;
padding: 50px 20px;
background: linear-gradient(135deg, #f8fafc 0%, #e0e7ff 50%, #f0f9ff 100%);
overflow: hidden;
margin: 60px 0 0;
}

.best-part-section::before {
content: '';
position: absolute;
top: -50%;
right: -20%;
width: 800px;
height: 800px;
background: radial-gradient(circle, rgba(255, 31, 140, 0.12) 0%, transparent 70%);
border-radius: 50%;
animation: float 20s ease-in-out infinite;
z-index: 0;
}

.best-part-section::after {
content: '';
position: absolute;
bottom: -30%;
left: -10%;
width: 600px;
height: 600px;
background: radial-gradient(circle, rgba(99, 102, 241, 0.12) 0%, transparent 70%);
border-radius: 50%;
animation: float 25s ease-in-out infinite reverse;
z-index: 0;
}

.best-part-content {
max-width: 1200px;
margin: 0 auto;
display: grid;
grid-template-columns: 1fr 1.2fr;
gap: 60px;
align-items: center;
position: relative;
z-index: 1;
}

.best-part-left {
display: flex;
justify-content: center;
align-items: center;
}

/* Modern Support Illustration */
.support-illustration-modern {
position: relative;
width: 100%;
max-width: 450px;
height: 450px;
margin: 0 auto;
transform-style: preserve-3d;
perspective: 1200px;
}

.illustration-bg {
position: absolute;
inset: 0;
border-radius: 40px;
overflow: hidden;
background: linear-gradient(135deg, rgba(99, 102, 241, 0.08) 0%, rgba(255, 31, 140, 0.08) 50%, rgba(59, 130, 246, 0.08) 100%);
}

.bg-gradient-1,
.bg-gradient-2,
.bg-gradient-3 {
position: absolute;
border-radius: 50%;
filter: blur(60px);
opacity: 0.6;
animation: bgFloat 15s ease-in-out infinite;
}

.bg-gradient-1 {
width: 200px;
height: 200px;
background: radial-gradient(circle, rgba(99, 102, 241, 0.4) 0%, transparent 70%);
top: -50px;
left: -50px;
animation-delay: 0s;
}

.bg-gradient-2 {
width: 180px;
height: 180px;
background: radial-gradient(circle, rgba(255, 31, 140, 0.4) 0%, transparent 70%);
bottom: -40px;
right: -40px;
animation-delay: 5s;
}

.bg-gradient-3 {
width: 150px;
height: 150px;
background: radial-gradient(circle, rgba(59, 130, 246, 0.4) 0%, transparent 70%);
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
animation-delay: 10s;
}

/* 3D Support Person */
.support-person-3d {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 140px;
height: 200px;
transform-style: preserve-3d;
animation: person3DFloat 4s ease-in-out infinite;
z-index: 10;
}

.person-head-3d {
position: relative;
width: 70px;
height: 70px;
margin: 0 auto 15px;
transform-style: preserve-3d;
}

.hair {
position: absolute;
top: -5px;
left: 50%;
transform: translateX(-50%);
width: 75px;
height: 50px;
background: linear-gradient(135deg, #8b4513 0%, #654321 100%);
border-radius: 50% 50% 40% 40%;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2), inset 0 -2px 5px rgba(0, 0, 0, 0.1);
}

.face {
position: relative;
width: 70px;
height: 70px;
background: linear-gradient(135deg, #fdbcb4 0%, #f5a097 100%);
border-radius: 50%;
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2), 0 0 0 4px rgba(255, 255, 255, 0.4), inset 0 2px 10px rgba(255, 255, 255, 0.3);
z-index: 2;
}

.eye {
position: absolute;
width: 8px;
height: 8px;
background: #1a1a1a;
border-radius: 50%;
top: 28px;
box-shadow: 0 0 0 2px #fff, inset 0 0 0 1px rgba(0, 0, 0, 0.1);
animation: blink 3s ease-in-out infinite;
}

.left-eye {
left: 22px;
}

.right-eye {
right: 22px;
}

.mouth {
position: absolute;
width: 20px;
height: 10px;
border: 2px solid #d97706;
border-top: none;
border-radius: 0 0 20px 20px;
bottom: 18px;
left: 50%;
transform: translateX(-50%);
}

.person-body-3d {
position: relative;
width: 100px;
height: 120px;
margin: 0 auto;
transform-style: preserve-3d;
}

.shirt {
width: 100px;
height: 120px;
background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 50%, #e9ecef 100%);
border-radius: 25px 25px 20px 20px;
box-shadow: 0 12px 35px rgba(0, 0, 0, 0.15), inset 0 3px 8px rgba(255, 255, 255, 0.8), inset 0 -2px 5px rgba(0, 0, 0, 0.05);
position: relative;
}

.shirt::before {
content: '';
position: absolute;
top: 20px;
left: 50%;
transform: translateX(-50%);
width: 30px;
height: 30px;
background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
border-radius: 50%;
box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.2);
}

/* 3D Phone */
.phone-3d {
position: absolute;
right: -35px;
top: 50px;
width: 50px;
height: 90px;
transform-style: preserve-3d;
transform: rotate(-20deg) rotateY(-15deg);
animation: phone3DFloat 3s ease-in-out infinite;
z-index: 15;
}

.phone-screen {
width: 50px;
height: 75px;
background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%);
border-radius: 8px;
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4), inset 0 2px 5px rgba(255, 255, 255, 0.1);
position: relative;
}

.phone-screen::before {
content: '';
position: absolute;
top: 8px;
left: 50%;
transform: translateX(-50%);
width: 30px;
height: 4px;
background: rgba(255, 255, 255, 0.2);
border-radius: 2px;
}

.phone-screen::after {
content: '';
position: absolute;
bottom: 8px;
left: 50%;
transform: translateX(-50%);
width: 25px;
height: 25px;
background: rgba(59, 130, 246, 0.3);
border-radius: 50%;
border: 2px solid rgba(59, 130, 246, 0.5);
}

.phone-button {
position: absolute;
bottom: -8px;
left: 50%;
transform: translateX(-50%);
width: 35px;
height: 5px;
background: #1e293b;
border-radius: 3px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

/* 3D Laptop */
.laptop-3d {
position: absolute;
bottom: -20px;
left: 50%;
transform: translateX(-50%) rotateX(15deg);
width: 140px;
height: 90px;
transform-style: preserve-3d;
transform-origin: bottom center;
z-index: 5;
}

.laptop-screen {
width: 140px;
height: 85px;
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
border-radius: 4px 4px 0 0;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3), inset 0 2px 10px rgba(0, 0, 0, 0.5);
position: relative;
transform: rotateX(-15deg);
transform-origin: bottom;
}

.screen-content {
position: absolute;
inset: 8px;
background: linear-gradient(135deg, rgba(59, 130, 246, 0.2) 0%, rgba(139, 92, 246, 0.2) 100%);
border-radius: 2px;
display: flex;
align-items: center;
justify-content: center;
}

.screen-content::before {
content: 'ðŸ’¬';
font-size: 24px;
opacity: 0.6;
}

.laptop-base {
width: 150px;
height: 8px;
background: linear-gradient(135deg, #475569 0%, #334155 100%);
border-radius: 0 0 4px 4px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
margin-top: -2px;
}

/* Floating Elements */
.floating-elements {
position: absolute;
inset: 0;
z-index: 20;
}

.float-card {
position: absolute;
width: 65px;
height: 65px;
background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.85) 100%);
border-radius: 18px;
display: flex;
align-items: center;
justify-content: center;
font-size: 28px;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15), 0 0 0 2px rgba(255, 255, 255, 0.8), inset 0 2px 5px rgba(255, 255, 255, 0.9);
backdrop-filter: blur(10px);
transform-style: preserve-3d;
animation: cardFloat 5s ease-in-out infinite;
}

.float-card.card-1 {
top: 8%;
left: 8%;
animation-delay: 0s;
}

.float-card.card-2 {
top: 5%;
left: 50%;
transform: translateX(-50%);
width: 75px;
height: 75px;
font-size: 32px;
animation-delay: 1s;
}

.float-card.card-3 {
top: 8%;
right: 8%;
animation-delay: 2s;
}

.card-glow {
position: absolute;
inset: -5px;
background: linear-gradient(135deg, rgba(59, 130, 246, 0.3) 0%, rgba(236, 72, 153, 0.3) 100%);
border-radius: 22px;
filter: blur(8px);
z-index: -1;
opacity: 0.6;
animation: glowPulse 3s ease-in-out infinite;
}

.float-avatar {
position: absolute;
width: 50px;
height: 50px;
background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(255, 255, 255, 0.85) 100%);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15), 0 0 0 2px rgba(255, 255, 255, 0.8), inset 0 2px 5px rgba(255, 255, 255, 0.9);
backdrop-filter: blur(10px);
transform-style: preserve-3d;
animation: avatar3DFloat 4s ease-in-out infinite;
}

.float-avatar.avatar-1 {
bottom: 22%;
left: 12%;
background: linear-gradient(135deg, rgba(139, 92, 246, 0.9) 0%, rgba(236, 72, 153, 0.9) 100%);
animation-delay: 0.5s;
}

.float-avatar.avatar-2 {
bottom: 18%;
left: 50%;
transform: translateX(-50%);
background: linear-gradient(135deg, rgba(59, 130, 246, 0.9) 0%, rgba(37, 99, 235, 0.9) 100%);
animation-delay: 1.2s;
}

.float-avatar.avatar-3 {
bottom: 22%;
right: 12%;
background: linear-gradient(135deg, rgba(236, 72, 153, 0.9) 0%, rgba(219, 39, 119, 0.9) 100%);
animation-delay: 1.8s;
}

.avatar-face {
width: 35px;
height: 35px;
background: linear-gradient(135deg, #fdbcb4 0%, #f5a097 100%);
border-radius: 50%;
box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.1);
position: relative;
}

.avatar-face::before,
.avatar-face::after {
content: '';
position: absolute;
width: 4px;
height: 4px;
background: #1a1a1a;
border-radius: 50%;
top: 12px;
}

.avatar-face::before {
left: 10px;
}

.avatar-face::after {
right: 10px;
}

/* Connection Lines */
.connection-lines {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
z-index: 1;
opacity: 0.3;
}

.line {
fill: none;
stroke: url(#lineGradient);
stroke-width: 2;
stroke-dasharray: 5, 5;
animation: lineDash 3s linear infinite;
}

/* Animations */
@keyframes bgFloat {
0%, 100% { transform: translate(0, 0) scale(1); }
33% { transform: translate(20px, -20px) scale(1.1); }
66% { transform: translate(-20px, 20px) scale(0.9); }
}

@keyframes person3DFloat {
0%, 100% { transform: translate(-50%, -50%) translateY(0) rotateY(0deg); }
50% { transform: translate(-50%, -50%) translateY(-8px) rotateY(5deg); }
}

@keyframes phone3DFloat {
0%, 100% { transform: rotate(-20deg) rotateY(-15deg) translateY(0); }
50% { transform: rotate(-18deg) rotateY(-12deg) translateY(-5px); }
}

@keyframes cardFloat {
0%, 100% { transform: translateY(0) translateZ(0) rotateZ(0deg); }
50% { transform: translateY(-12px) translateZ(10px) rotateZ(2deg); }
}

@keyframes avatar3DFloat {
0%, 100% { transform: translateY(0) translateZ(0) scale(1); }
50% { transform: translateY(-10px) translateZ(8px) scale(1.05); }
}

@keyframes blink {
0%, 90%, 100% { transform: scaleY(1); }
95% { transform: scaleY(0.1); }
}

@keyframes glowPulse {
0%, 100% { opacity: 0.6; transform: scale(1); }
50% { opacity: 0.9; transform: scale(1.1); }
}

@keyframes lineDash {
0% { stroke-dashoffset: 0; }
100% { stroke-dashoffset: 20; }
}

.best-part-right {
position: relative;
z-index: 2;
}

.best-part-heading {
font-size: 48px;
font-weight: 800;
margin-bottom: 30px;
display: flex;
align-items: center;
gap: 15px;
line-height: 1.2;
}

.star-icon {
font-size: 56px;
display: inline-block;
animation: starPulse 2s ease-in-out infinite;
filter: drop-shadow(0 4px 12px rgba(255, 215, 0, 0.5));
transform: rotate(-15deg);
}

.gradient-text {
background: linear-gradient(135deg, #1e40af 0%, #3b82f6 50%, #6366f1 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
display: inline-block;
}

.best-part-text {
font-size: 22px;
line-height: 1.8;
margin-bottom: 30px;
font-weight: 500;
}

.text-blue {
color: #2563eb;
font-weight: 600;
}

.text-dark {
color: #374151;
}

.best-part-note {
background: linear-gradient(135deg, rgba(255, 182, 193, 0.3) 0%, rgba(255, 192, 203, 0.4) 100%);
border-radius: 20px;
padding: 25px 30px;
display: flex;
align-items: flex-start;
gap: 20px;
box-shadow: 0 8px 25px rgba(236, 72, 153, 0.15);
border: 2px solid rgba(236, 72, 153, 0.2);
backdrop-filter: blur(10px);
}

.note-icon {
font-size: 32px;
flex-shrink: 0;
animation: noteBounce 2s ease-in-out infinite;
filter: drop-shadow(0 2px 8px rgba(236, 72, 153, 0.3));
}

.note-text {
font-size: 16px;
line-height: 1.7;
color: #374151;
margin: 0;
font-weight: 500;
}

.note-text strong {
color: #1f2937;
font-weight: 700;
}

/* Animations */
@keyframes float {
0%, 100% { transform: translate(0, 0) rotate(0deg); }
50% { transform: translate(30px, -30px) rotate(180deg); }
}

@keyframes personFloat {
0%, 100% { transform: translateY(0) translateZ(20px); }
50% { transform: translateY(-10px) translateZ(20px); }
}

@keyframes phoneShake {
0%, 100% { transform: rotate(-15deg) translateZ(30px); }
25% { transform: rotate(-12deg) translateZ(30px); }
75% { transform: rotate(-18deg) translateZ(30px); }
}

@keyframes iconFloat {
0%, 100% { transform: translateY(0) translateZ(10px); }
50% { transform: translateY(-15px) translateZ(10px); }
}

@keyframes avatarFloat {
0%, 100% { transform: translateY(0) translateZ(5px); }
50% { transform: translateY(-12px) translateZ(5px); }
}

@keyframes starPulse {
0%, 100% { transform: rotate(-15deg) scale(1); filter: drop-shadow(0 4px 12px rgba(255, 215, 0, 0.5)); }
50% { transform: rotate(-15deg) scale(1.1); filter: drop-shadow(0 6px 18px rgba(255, 215, 0, 0.7)); }
}

@keyframes noteBounce {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-5px); }
}

/* Responsive Design */
@media (max-width: 968px) {
.best-part-content {
  grid-template-columns: 1fr;
  gap: 40px;
}

.best-part-left {
  order: 2;
}

.best-part-right {
  order: 1;
}

.support-illustration-modern {
  max-width: 350px;
  height: 350px;
}

.support-person-3d {
  width: 110px;
  height: 160px;
}

.person-head-3d {
  width: 55px;
  height: 55px;
}

.hair {
  width: 60px;
  height: 40px;
}

.face {
  width: 55px;
  height: 55px;
}

.person-body-3d {
  width: 80px;
  height: 100px;
}

.phone-3d {
  width: 40px;
  height: 70px;
  right: -25px;
}

.phone-screen {
  width: 40px;
  height: 60px;
}

.laptop-3d {
  width: 110px;
  height: 70px;
}

.laptop-screen {
  width: 110px;
  height: 65px;
}

.float-card {
  width: 50px;
  height: 50px;
  font-size: 22px;
}

.float-card.card-2 {
  width: 60px;
  height: 60px;
  font-size: 26px;
}

.float-avatar {
  width: 40px;
  height: 40px;
}

.avatar-face {
  width: 28px;
  height: 28px;
}

.best-part-heading {
  font-size: 36px;
}

.best-part-text {
  font-size: 18px;
}
}

@media (max-width: 640px) {
.best-part-section {
  padding: 50px 15px;
  margin: 40px 0;
}

.best-part-heading {
  font-size: 28px;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

.star-icon {
  font-size: 40px;
}

.best-part-text {
  font-size: 16px;
}

.best-part-note {
  padding: 20px;
  flex-direction: column;
  gap: 15px;
}

.note-text {
  font-size: 14px;
}

.support-illustration-modern {
  max-width: 280px;
  height: 280px;
}

.support-person-3d {
  width: 90px;
  height: 130px;
}

.person-head-3d {
  width: 45px;
  height: 45px;
}

.hair {
  width: 50px;
  height: 35px;
}

.face {
  width: 45px;
  height: 45px;
}

.eye {
  width: 6px;
  height: 6px;
}

.left-eye {
  left: 18px;
  top: 22px;
}

.right-eye {
  right: 18px;
  top: 22px;
}

.mouth {
  width: 16px;
  height: 8px;
  bottom: 14px;
}

.person-body-3d {
  width: 65px;
  height: 80px;
}

.shirt {
  width: 65px;
  height: 80px;
}

.shirt::before {
  width: 24px;
  height: 24px;
  top: 15px;
}

.phone-3d {
  width: 32px;
  height: 55px;
  right: -20px;
  top: 40px;
}

.phone-screen {
  width: 32px;
  height: 45px;
}

.phone-screen::before {
  top: 6px;
  width: 24px;
  height: 3px;
}

.phone-screen::after {
  bottom: 6px;
  width: 20px;
  height: 20px;
}

.phone-button {
  width: 28px;
  height: 4px;
  bottom: -6px;
}

.laptop-3d {
  width: 90px;
  height: 55px;
}

.laptop-screen {
  width: 90px;
  height: 50px;
}

.screen-content::before {
  font-size: 18px;
}

.float-card {
  width: 40px;
  height: 40px;
  font-size: 18px;
}

.float-card.card-2 {
  width: 50px;
  height: 50px;
  font-size: 22px;
}

.float-avatar {
  width: 32px;
  height: 32px;
}



.avatar-face {
  width: 22px;
  height: 22px;
}

.avatar-face::before,
.avatar-face::after {
  width: 3px;
  height: 3px;
  top: 9px;
}

.avatar-face::before {
  left: 7px;
}

.avatar-face::after {
  right: 7px;
}
}

/* ================== NEW 3D FEATURES SECTION ================== */

/* ================== PRICING TABLE SECTION ================== */
.tp-pricing-section {
  padding: 80px 0;
  background: #fff;
  position: relative;
  overflow: hidden;
}

.tp-pricing-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(circle at 30% 20%, rgba(37, 99, 235, 0.1) 0%, transparent 50%),
              radial-gradient(circle at 70% 80%, rgba(239, 68, 68, 0.1) 0%, transparent 50%);
  pointer-events: none;
}

.tp-pricing-header {
  text-align: center;
  margin-bottom: 60px;
  position: relative;
  z-index: 1;
}

.tp-pricing-title {
  font-size: clamp(32px, 4vw, 48px);
  font-weight: 800;
  color: #1e293b;
  margin-bottom: 20px;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.tp-pricing-subtitle {
  font-size: clamp(18px, 2vw, 24px);
  color: #475569;
  font-weight: 600;
}

.tp-pricing-subtitle strong {
  color: #ef4444;
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.tp-pricing-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
  max-width: 1200px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.tp-pricing-card {
  background: #ffffff;
  border-radius: 24px;
  padding: 40px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: visible;
  border: 2px solid transparent;
  display: flex;
  flex-direction: column;
}

.tp-pricing-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 5px;
  background: linear-gradient(90deg, #3b82f6 0%, #8b5cf6 50%, #ec4899 100%);
  opacity: 0;
  transition: opacity 0.4s ease;
}

.tp-pricing-card:hover {
  transform: translateY(-8px);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.15);
  border-color: #e2e8f0;
}

.tp-pricing-card:hover::before {
  opacity: 1;
}

.tp-pricing-card-commercial {
  /* Swapped: commercial now uses the reseller visual (pink-tinted with border and visible accent) */
  background: linear-gradient(135deg, #ffffff 0%, #fef3f2 100%);
  border: 2px solid #fee2e2;
}

.tp-pricing-card-commercial::before {
  /* show the gradient accent by default for commercial (Basic) */
  opacity: 1;
}

.tp-pricing-card-reseller {
  /* Swapped: reseller now uses the original commercial visual (subtle white/blue tint) */
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border: 2px solid transparent;
}

.tp-pricing-card-reseller::before {
  /* hide the gradient accent by default for reseller (Bundle) */
  opacity: 0;
}

.tp-pricing-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 30px;
  padding-bottom: 20px;
  border-bottom: 2px solid #f1f5f9;
}

.tp-pricing-card-title {
  font-size: clamp(24px, 3vw, 32px);
  font-weight: 800;
  color: #1e293b;
  margin: 0;
  line-height: 1.3;
  flex: 1;
}

.tp-pricing-badge {
  background: linear-gradient(135deg, #008000 0%, #7dbe7d 100%);
  color: #ffffff;
  padding: 8px 16px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-left: 15px;
  white-space: nowrap;
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

.tp-pricing-badge-premium {
  background: linear-gradient(135deg, #ec4899 0%, #db2777 100%);
  box-shadow: 0 4px 12px rgba(236, 72, 153, 0.3);
}

.tp-pricing-features {
  margin-bottom: 35px;
  flex: 1;
}

.tp-pricing-features::-webkit-scrollbar {
  width: 6px;
}

.tp-pricing-features::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 10px;
}

.tp-pricing-features::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 10px;
}

.tp-pricing-features::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

.tp-pricing-software-list {
  margin-bottom: 30px;
  padding-bottom: 25px;
  border-bottom: 2px solid #f1f5f9;
}

.tp-software-list-title {
  font-size: 18px;
  font-weight: 800;
  color: #1e293b;
  margin-bottom: 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid #e2e8f0;
}

.tp-feature-category {
  margin-bottom: 25px;
  padding: 20px;
  background: linear-gradient(135deg, #f8fafc 0%, #ffffff 100%);
  border-radius: 12px;
  border: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.tp-feature-category:hover {
  border-color: #cbd5e1;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  transform: translateY(-2px);
}

.tp-feature-category-new {
  background: linear-gradient(135deg, #fef3f2 0%, #fff7ed 100%);
  border-color: #fecaca;
  position: relative;
}

.tp-feature-category-new::before {
  content: '';
  position: absolute;
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;
  background: linear-gradient(135deg, #ef4444, #f59e0b);
  border-radius: 12px;
  z-index: -1;
  opacity: 0.1;
}

.tp-feature-category-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 15px;
  padding-bottom: 12px;
  border-bottom: 2px solid #e2e8f0;
}

.tp-feature-category-icon {
  width: 28px;
  height: 28px;
  min-width: 28px;
  color: #ec4899;
  flex-shrink: 0;
}

.tp-feature-category-new .tp-feature-category-icon {
  color: #ef4444;
}

.tp-feature-category-title {
  font-size: 18px;
  font-weight: 800;
  color: #1e293b;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
}

.tp-new-badge {
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
  color: #ffffff;
  padding: 4px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  box-shadow: 0 2px 8px rgba(239, 68, 68, 0.3);
}

.tp-feature-category-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.tp-feature-category-list li {
  padding: 10px 0 10px 40px;
  position: relative;
  font-size: 15px;
  color: #475569;
  line-height: 1.6;
  border-bottom: 1px solid #f1f5f9;
}

.tp-feature-category-list li:last-child {
  border-bottom: none;
}

.tp-feature-category-list li::before {
  content: 'âœ“';
  position: absolute;
  left: 0;
  top: 10px;
  width: 24px;
  height: 24px;
  background: linear-gradient(135deg, #10b981 0%, #059669 100%);
  color: #ffffff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  box-shadow: 0 2px 6px rgba(16, 185, 129, 0.3);
}

/* Software Components Styles */
.tp-software-component {
  margin-bottom: 30px;
  padding: 25px;
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border-radius: 16px;
  border: 2px solid #e2e8f0;
  transition: all 0.3s ease;
  position: relative;
}

.tp-software-component:hover {
  border-color: #cbd5e1;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
}

.tp-software-component-reseller {
  background: linear-gradient(135deg, #fef3f2 0%, #fff7ed 100%);
  border-color: #fecaca;
}

.tp-software-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 2px solid #e2e8f0;
}

.tp-software-number {
  background: linear-gradient(135deg, #ec4899 0%, #db2777 100%);
  color: #ffffff;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  font-weight: 800;
  flex-shrink: 0;
  box-shadow: 0 4px 12px rgba(236, 72, 153, 0.3);
}

.tp-software-title {
  font-size: 22px;
  font-weight: 800;
  color: #1e293b;
  margin: 0;
}

.tp-software-headline {
  font-size: 18px;
  font-weight: 700;
  color: #1e293b;
  margin: 15px 0 10px;
  line-height: 1.4;
}

.tp-software-subheadline {
  font-size: 16px;
  color: #64748b;
  font-weight: 600;
  margin: 10px 0;
  font-style: italic;
}

.tp-software-description {
  font-size: 15px;
  color: #475569;
  line-height: 1.7;
  margin: 12px 0;
}

.tp-software-impact {
  font-size: 16px;
  color: #1e293b;
  font-weight: 600;
  margin: 12px 0;
  padding: 12px;
  background: linear-gradient(135deg, #fef3f2 0%, #fff7ed 100%);
  border-radius: 8px;
  border-left: 4px solid #ef4444;
}

.tp-software-impact strong {
  color: #ef4444;
}

.tp-software-highlight {
  background: linear-gradient(135deg, #fef3c7 0%, #fde68a 100%);
  padding: 15px;
  border-radius: 10px;
  margin: 15px 0;
  border: 2px solid #fbbf24;
}

.tp-software-highlight-text {
  font-size: 15px;
  color: #92400e;
  font-weight: 700;
  margin: 0;
  line-height: 1.6;
}

.tp-software-tagline {
  font-size: 15px;
  color: #475569;
  font-weight: 600;
  margin: 12px 0;
  padding: 10px;
  background: #f1f5f9;
  border-radius: 8px;
}

.tp-software-usp {
  font-size: 15px;
  color: #1e293b;
  font-weight: 600;
  margin: 15px 0;
  padding: 15px;
  background: linear-gradient(135deg, #dbeafe 0%, #bfdbfe 100%);
  border-radius: 10px;
  border-left: 4px solid #3b82f6;
}

.tp-software-benefits {
  margin-top: 15px;
  padding-top: 15px;
  border-top: 1px solid #e2e8f0;
}

.tp-software-benefit-item {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  font-size: 15px;
  color: #1e293b;
  font-weight: 600;
}

.tp-software-benefit-item:last-child {
  margin-bottom: 0;
}

.tp-software-steps {
  display: flex;
  align-items: center;
  gap: 15px;
  margin: 20px 0;
  padding: 20px;
  background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
  border-radius: 12px;
  flex-wrap: wrap;
  justify-content: center;
}

.tp-software-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  flex: 1;
  min-width: 120px;
}

.tp-step-number {
  font-size: 14px;
  font-weight: 700;
  color: #3b82f6;
}

.tp-step-text {
  font-size: 14px;
  color: #1e293b;
  font-weight: 600;
  text-align: center;
}

.tp-step-arrow {
  font-size: 24px;
  color: #3b82f6;
  font-weight: 700;
}

.tp-software-separator {
  text-align: center;
  margin: 25px 0 0;
  padding-top: 20px;
  position: relative;
  font-size: 18px;
  font-weight: 800;
  color: #ec4899;
}

.tp-software-separator::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, transparent, #ec4899, transparent);
  border-radius: 2px;
}

.tp-pricing-bundle-features {
  margin-top: 30px;
  padding-top: 25px;
  border-top: 3px solid #e2e8f0;
}

.tp-bundle-features-title {
  font-size: 18px;
  font-weight: 800;
  color: #1e293b;
  margin-bottom: 15px;
}

.tp-pricing-feature-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 18px;
  font-size: 16px;
  color: #475569;
  line-height: 1.6;
}

.tp-pricing-feature-item:last-child {
  margin-bottom: 0;
}

.tp-check-icon {
  width: 24px;
  height: 24px;
  min-width: 24px;
  color: #10b981;
  flex-shrink: 0;
  margin-top: 2px;
}

.tp-pricing-feature-item strong {
  color: #1e293b;
  font-weight: 700;
}

.tp-pricing-price {
  margin-bottom: 30px;
  padding: 25px;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
  border-radius: 16px;
  text-align: center;
}

.tp-pricing-price-old {
  margin-bottom: 12px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
}

.tp-price-label {
  font-size: 14px;
  color: #64748b;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.tp-price-strikethrough {
  font-size: 20px;
  color: #94a3b8;
  text-decoration: line-through;
  font-weight: 600;
}

.tp-pricing-price-new {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 4px;
}

.tp-price-currency {
  font-size: 32px;
  font-weight: 800;
  color: #1e293b;
  line-height: 1;
}

.tp-price-amount {
  font-size: 56px;
  font-weight: 900;
  color: #1e293b;
  line-height: 1;
  background: linear-gradient(135deg, #3b82f6 0%, #ec4899 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.tp-price-period {
  font-size: 24px;
  font-weight: 700;
  color: #64748b;
  line-height: 1;
}

.tp-pricing-button {
  display: block;
  width: 100%;
  padding: 18px 30px;
  border-radius: 12px;
  font-size: 18px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  border: none;
  cursor: pointer;
  letter-spacing: 0.3px;
}

.tp-pricing-button::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
  transition: left 0.5s ease;
}

.tp-pricing-button:hover::before {
  left: 100%;
}

.tp-pricing-button-commercial {
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
  color: #ffffff;
  box-shadow: 0 8px 24px rgba(59, 130, 246, 0.4);
}

.tp-pricing-button-commercial:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(59, 130, 246, 0.5);
}

.tp-pricing-button-reseller {
  background: linear-gradient(135deg, #ec4899 0%, #db2777 100%);
  color: #ffffff;
  box-shadow: 0 8px 24px rgba(236, 72, 153, 0.4);
}

.tp-pricing-button-reseller:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 32px rgba(236, 72, 153, 0.5);
}

/* Responsive Design */
@media (max-width: 968px) {
  .tp-pricing-grid {
    grid-template-columns: 1fr;
    gap: 30px;
    max-width: 600px;
  }
  
  .tp-pricing-card {
    padding: 35px 30px;
  }
  
  .tp-pricing-section {
    padding: 60px 0;
  }
}

@media (max-width: 640px) {
  .tp-pricing-header {
    margin-bottom: 40px;
    padding: 0 20px;
  }
  
  .tp-pricing-card {
    padding: 30px 20px;
    border-radius: 20px;
  }
  
  .tp-pricing-card-header {
    flex-direction: column;
    gap: 15px;
  }
  
  .tp-pricing-badge {
    margin-left: 0;
    align-self: flex-start;
  }
  
  .tp-pricing-price {
    padding: 20px 15px;
  }
  
  .tp-price-amount {
    font-size: 48px;
  }
  
  .tp-price-currency {
    font-size: 28px;
  }
  
  .tp-pricing-button {
    padding: 16px 25px;
    font-size: 16px;
  }
  
  .tp-software-list-title,
  .tp-bundle-features-title {
    font-size: 16px;
  }
  
  .tp-pricing-feature-item {
    font-size: 14px;
  }
  
  .tp-pricing-software-list {
    margin-bottom: 25px;
    padding-bottom: 20px;
  }
  
  .tp-feature-category {
    padding: 15px;
    margin-bottom: 20px;
  }
  
  .tp-feature-category-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  
  .tp-feature-category-title {
    font-size: 16px;
  }
  
  .tp-feature-category-icon {
    width: 24px;
    height: 24px;
    min-width: 24px;
  }
  
  .tp-feature-category-list li {
    font-size: 14px;
    padding-left: 35px;
  }
  
  .tp-feature-category-list li::before {
    width: 20px;
    height: 20px;
    font-size: 11px;
  }
  
  .tp-software-component {
    padding: 20px 15px;
    margin-bottom: 25px;
  }
  
  .tp-software-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  
  .tp-software-number {
    width: 32px;
    height: 32px;
    font-size: 14px;
  }
  
  .tp-software-title {
    font-size: 20px;
  }
  
  .tp-software-headline {
    font-size: 16px;
  }
  
  .tp-software-subheadline {
    font-size: 14px;
  }
  
  .tp-software-description,
  .tp-software-tagline,
  .tp-software-usp {
    font-size: 14px;
  }
  
  .tp-software-highlight-text {
    font-size: 14px;
  }
  
  .tp-software-steps {
    flex-direction: column;
    gap: 10px;
  }
  
  .tp-step-arrow {
    transform: rotate(90deg);
    font-size: 20px;
  }
  
  .tp-software-step {
    min-width: 100%;
  }
  
  .tp-software-separator {
    font-size: 16px;
    margin: 20px 0 0;
    padding-top: 15px;
  }
}
   
    :root {
      /* Global palette */
      --pink-main: #ff1f8c;
      --pink-soft: #ff7ac4;
      --pink-neon: #ff4fb3;
      --green-main: #10b981;
      --green-neon: #22c55e;
      --blue-main: #2563eb;
      --blue-accent: #2563eb;
      --orange-main: #ff8a3c;
      --purple-main: #7b61ff;
      --highlight-yellow: #fff64b;
      --text-main: #111827;
      --soft-border: #e5e7eb;
      --red-main: #ef4444;
      --insta: #a855f7;
      --youtube: #ef4444;
      --facebook: #2563eb;
    }

    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
    .tp-3d-icon-wrapper {
    display: none !important;
}
    body {
      font-family: "Nunito", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      background: #ffffff;
      color: var(--text-main);
      overflow-x: hidden;
    }

    /* ================== SECTION 1: HERO ================== */

    .hero-wrap {
      text-align: center;
    }
.hero-pre {
    font-size: 16px;
    font-weight: 600;
      color: #00a74c;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 22px;
    position: relative;
    z-index: 9;
}

    .hero-heading,
    .hero-sub {
      font-size: clamp(30px, 3.6vw, 31px);
      line-height: 1.25;
      font-weight: 700;
      letter-spacing: -0.02em;
      margin-bottom: 8px;
    }

    .hero-heading .pink,
    .hero-sub .pink {
      color: var(--pink-main);
    }

    .hero-sub {
      margin-bottom: 28px;
    }

 .hero-body {
    font-size: 19px;
    line-height: 1.7;
    color: #fff;
    margin: 0;
}

    p.hero-body span {
    background: linear-gradient(90deg, #f97316, #fb7185, #a855f7, #0ea5e9, #22c55e);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: 600;
}
.hero-cta {
    display: inline-block;
    margin-top: 10px;
    font-size: 19px;
    font-weight: 700;
    line-height: 1.5;
    padding: 8px 14px;
    border-radius: 6px;
    background: linear-gradient(90deg, #ec4899, #a855f7, #3b82f6, #06b6d4);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
    /* ================== SECTION 2: VIDEO + MAIN CTA BUTTON ================== */

    .section-wrap {
      /* max-width: 1120px; */
      margin: 0 auto 20px;
      padding: 0 18px;
      text-align: center;
    }

  .video-shell {
    max-width: 960px;
    margin: 40px auto 10px;
    border-radius: 18px;
    border: 2px solid #ff1f8c;
    aspect-ratio: 16 / 9;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
}
div#videoo_frame figure iframe {
    border-radius: 17px !important;
}
.video-label {
    font-size: 40px;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    width: 100%;
    height: 100%;
}

    .cta-button-wrap {
      margin-top: 10px;
      margin-bottom: 14px;
    }

    .cta-button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 20px 40px;
          border-radius: 14px;
      border: none;
      cursor: pointer;
      font-size: 34px;
      font-weight: 800;
      color: #ffffff;
      letter-spacing: 0.03em;
      white-space: normal;
      text-align: center;
      background-image: linear-gradient(90deg, var(--orange-main), var(--pink-main), var(--purple-main));
      box-shadow: 0 18px 40px rgba(255, 105, 180, 0.55);
      transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
    }

    .cta-button span.arrows {
      margin-left: 14px;
      font-size: 30px;
    }

    .cta-button:hover {
      transform: translateY(-2px);
      filter: brightness(1.04);
      box-shadow: 0 22px 60px rgba(255, 105, 180, 0.75);
    }

    .cta-button:active {
      transform: translateY(1px);
      box-shadow: 0 12px 30px rgba(255, 105, 180, 0.5);
    }

   .cta-subline {
    margin-top: 19px;
    font-size: 21px;
    font-weight: 500;
    color: #fff;
}
.benefits span {
    color: #fff;
}
    .payment-row {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 14px;
      margin-top: 18px;
      margin-bottom: 17px;
      flex-wrap: wrap;
    }

    .pay-badge {
      min-width: 80px;
      padding: 6px 12px;
      border-radius: 10px;
      font-size: 13px;
      font-weight: 600;
      background: #f3f4f6;
      border: 1px solid #e5e7eb;
    }

    .guarantee-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 6px 12px;
      border-radius: 999px;
      background: #fff7e0;
      border: 1px solid #fbbf24;
      font-size: 13px;
      font-weight: 600;
      color: #92400e;
    }

    .guarantee-badge span.icon {
      font-size: 18px;
    }

    .benefits {
      font-size: 28px;
      font-weight: 600;
      line-height: 1.6;
      margin-top: 12px;
    }
.benefits span:last-child {
    font-size: 24px;
}
    .benefits span {
      display: block;
    }

    /* ================== SECTION 3: PARTICLES + FEATURES GRID ================== */

    .particles{
      position:fixed;
      inset:0;
      z-index:0;
      pointer-events:none;
    }
    .particles span{
      position:absolute;
      width:14px;height:14px;
      border-radius:50%;
      background:linear-gradient(45deg,#ff1f8c,#facc15,#7a3cff);
      opacity:.15;
      animation:float 14s infinite linear;
    }
    @keyframes float{
      0%{transform:translateY(0) translateX(0)}
      50%{transform:translateY(-120px) translateX(40px)}
      100%{transform:translateY(0) translateX(0)}
    }

    .features-wrap{
      position:relative;
      z-index:1;
      max-width:1180px;
      margin:30px auto;
      padding:0 18px 40px;
    }

 .features-heading {
    text-align: center;
    font-size: 38px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: var(--pink-main);
    margin-bottom: 36px;
    opacity: 0;
    transform: translateY(30px);
    transition: .8s ease;
    border-top: 3px solid;
    border-bottom: 3px solid;
    padding: 18px 0;
}
    .features-heading.show{opacity:1;transform:none;}

    .features-grid{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      gap:26px;
    }

    .feature-card{
      position:relative;
      border-radius:22px;
      padding:22px 22px 26px;
      font-size:15px;
      line-height:1.7;
      color:#111827;
      background-size:140% 140%;
      background-position:0% 0%;
      box-shadow:0 18px 55px rgba(0, 0, 0, 0.15);
      border:1px solid rgba(255,255,255,.7);
      backdrop-filter:blur(18px);
      -webkit-backdrop-filter:blur(18px);
      overflow:hidden;
      opacity:1;
      transform:translateY(40px);
      transition:
        box-shadow .35s ease,
        background-position .9s ease,
        opacity .6s ease,
        transform .6s ease;
    }

    .feature-card.show{
      opacity:1;
      transform:none;
    }

    .feature-card::before{
      content:"";
      position:absolute;
      inset:-2px;
      border-radius:24px;
      background:linear-gradient(120deg,#ff1f8c,#facc15,#7a3cff);
      opacity:0;
      z-index:-1;
      filter:blur(16px);
      transition:.35s ease;
      animation:glowShift 5s linear infinite;
    }
    .feature-card:hover::before{opacity:.9;}

    @keyframes glowShift{
      0%{background-position:0% 50%}
      50%{background-position:100% 50%}
      100%{background-position:0% 50%}
    }

    .feature-card:hover{
      box-shadow:0 32px 90px rgba(0,0,0,0.28);
      background-position:100% 100%;
    }

    .feature-header{display:flex;align-items:center;gap:10px;margin-bottom:10px}
    .feature-icon{
      width:40px;height:40px;border-radius:18px;
      display:flex;align-items:center;justify-content:center;
      font-size:20px;color:#fff;
      background:radial-gradient(circle at 20% 0%,rgba(255,255,255,.9),rgba(255,255,255,.15));
      box-shadow:0 10px 25px rgba(0,0,0,.35);
    }
    .feature-title{font-size:20px;font-weight:700}
    .feature-subtitle{font-size:15px;margin-bottom:10px;font-weight:500}
    .feature-list{padding-left:18px}
    .feature-list li{font-size:15px;margin-bottom:6px}

    .feature-card:nth-child(1){background:linear-gradient(180deg,#eafff8,#b1f8e0);}
    .feature-card:nth-child(2){background:linear-gradient(180deg,#ffe5f6,#f36cbd);}
    .feature-card:nth-child(3){background:linear-gradient(180deg,#ffe9d7,#ffb894);}
    .feature-card:nth-child(4){background:linear-gradient(180deg,#fff0f5,#ff9fbf);}
    .feature-card:nth-child(5){background:linear-gradient(180deg,#fff8dd,#ffe27a);}
    .feature-card:nth-child(6){background:linear-gradient(180deg,#e0fff6,#17a18f);}
    .feature-card:nth-child(7){background:linear-gradient(180deg,#eceeff,#9ea3ff);}
    .feature-card:nth-child(8){background:linear-gradient(180deg,#ffecec,#ff9a9a);}
    .feature-card:nth-child(9){background:linear-gradient(180deg,#fff2e4,#ffb27c);}
    .feature-card:nth-child(10){background:linear-gradient(180deg,#f1f9ff,#d3f0fc);}

    /* ================== SECTION 4: BOTTOM CTA FROM HERO ================== */

    .cta-wrapper {

      text-align: center;
    }

    .cta-button-outer {
      display: inline-block;
      position: relative;
      padding-bottom: 10px;
      margin-bottom: 12px;
    }

    .cta-button-main {
      position: relative;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 26px 60px;
      border-radius: 28px;
      font-size: 34px;
      font-weight: 800;
      letter-spacing: 0.03em;
      color: #ffffff;
      text-decoration: none;
      background: linear-gradient(90deg, #ff7a3c, #ff4f7b, #7b3bf3);
      box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
      transition: transform 0.25s ease, box-shadow 0.25s ease, filter 0.25s ease;
      white-space: nowrap;
      overflow: hidden;
    }

    .cta-button-main span.chevron {
      margin-left: 16px;
      font-size: 36px;
    }



    .cta-button-main:hover {
      transform: translateY(-4px) scale(1.02);
      box-shadow: 0 26px 70px rgba(0, 0, 0, 0.4);
      filter: brightness(1.05);
      color: #fff;
    }

    .cta-subline-bottom {
    font-size: 21px;
    margin-bottom: 26px;
    color: #fff;
}
    .cta-subline-bottom span {
      margin: 0 4px;
    }

  .cta-payment-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 20px;
    margin-bottom: 16px;
}

    .pay-pill {
      min-width: 110px;
      padding: 10px 16px;
      border-radius: 10px;
      border: 1px solid #d4d4d8;
      background: #ffffff;
      box-shadow: 0 7px 18px rgba(15, 23, 42, 0.08);
      font-weight: 600;
      font-size: 15px;
    }

    .pay-pill.blue { color: #2563eb; }
    .pay-pill.red  { color: #dc2626; }
    .pay-pill.gold { color: #b45309; }

    .guarantee-pill {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 18px;
      border-radius: 999px;
      border: 1px solid #facc15;
      background: #fffbeb;
      box-shadow: 0 7px 18px rgba(251, 191, 36, 0.25);
      font-size: 15px;
      font-weight: 700;
      color: #92400e;
    }

    .guarantee-pill span.badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 38px;
      height: 38px;
      border-radius: 50%;
      background: #facc15;
      color: #1f2937;
      font-size: 18px;
    }

    .cta-bottom-heading {
      font-size: 28px;
      font-weight: 700;
      color: #fff;
      margin-bottom: 8px;
    }

   .cta-bottom-sub {
    font-size: 22px;
    font-weight: 500;
    color: #fff;
    margin-bottom: 0;
}

    /* ================== SECTION 5: WHY TIKTOK (TRUMP) ================== */

   .why-wrap {
    margin: 0px auto;
    padding: 70px 0px;
    background: #fff2db;
}

    .why-heading {
      text-align: center;
      margin-bottom: 40px;
    }

  .why-heading h2 {
    font-size: 52px;
    font-weight: 800;
    color: #ffa300;
    margin-bottom: 12px;
}

   .why-heading p {
    font-size: 26px;
    line-height: 1.35;
    font-weight: 600;
    color: #ffa300;
}

    .why-heading p em {
      font-style: italic;
    }

  .why-grid {
    display: flex;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 28px;
    align-items: center;
}

  .why-card {
    border-radius: 10px;
    border: 2px solid #ffa300;
    padding: 30px 32px;
    font-size: 17px;
    line-height: 1.8;
    background: #ffffff;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.05);
}

    .why-card p + p {
      margin-top: 14px;
    }

    .why-card .pink {
      color: var(--pink-main);
      font-weight: 700;
    }

.why-card .blue {
    color: #ffa300;
    font-weight: 700;
}

    .why-card em {
      font-style: italic;
    }

   .why-image-wrap {
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    align-items: stretch;
    justify-content: center;
    background: transparent;
    flex-direction: column;
}

    .why-image-wrap img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    /* ================== SECTION 6: TIKTOK = #1 ATTENTION ================== */

   .tiktok-attention {
    margin: 0 auto;
    padding: 70px 0;
    background: #fff;
}

  .tiktok-attention__headline {
    text-align: center;
    font-size: 39px;
    font-weight: 800;
    color: #000;
    letter-spacing: 0;
    line-height: 1.3;
    margin-bottom: 40px;
}

.tiktok-attention__story {
    font-size: 17px;
    line-height: 1.8;
    max-width: 980px;
    margin: 0 auto 32px;
    text-align: center;
    color: #00baff;
    font-weight: 600;
} 
.tiktok-attention__story p {
    margin-bottom: 0;
    margin-top: 3px !IMPORTANT;
}
    .tiktok-attention__story p + p {
      margin-top: 14px;
    }

.tiktok-attention__hook {
    display: table;
    max-width: 100%;
    margin: 23px auto 25px;
    font-size: 22px;
    font-weight: 700;
    color: var(--pink-main);
    position: relative;
    padding: 10px 18px;
    text-align: center;
    box-shadow: 0 0 10px 1px #ddd;
    border-radius: 10px;
}
    .tiktok-attention__hook::before {
      content: "";
      position: absolute;
      inset: 60% 4px -4px;
      background: linear-gradient(90deg, #fff1f8, #ffe9fb);
      border-radius: 10px;
      z-index: -1;
    }

    .tiktok-attention__comparison {
      max-width: 640px;
      margin: 0 auto 26px;
      font-size: 18px;
      line-height: 1.8;
    }

    .tiktok-attention__comparison ul {
      list-style: none;
      margin: 18px 0;
    }

  .tiktok-attention__comparison li {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 10px;
    font-weight: 600;
    text-align: center;
    margin: 13px auto;
    display: table;
}

    .tiktok-attention__comparison li span.x {
    color: #ef4444;
    font-size: 20px;
    line-height: 1;
    padding: 0 11px;
}

    .tiktok-attention__comparison li span.instagram {
      color: var(--insta);
    }
    .tiktok-attention__comparison li span.youtube {
      color: var(--youtube);
    }
    .tiktok-attention__comparison li span.facebook {
      color: var(--facebook);
    }

.tiktok-attention__but {
    margin-top: 8px;
    font-weight: 500;
    text-align: center;
    font-size: 34px;
    color: #fff;
    margin: 0 auto;
    display: table;
    padding: 0 20px;
    background: #00baff;
    border-radius: 10px;
}

    .tiktok-attention__final {
      max-width: 980px;
      margin: 24px auto 0;
      text-align: center;
      font-size: 18px;
      line-height: 1.8;
      color: #4b5563;
    }

    .tiktok-attention__final span.pink {
      color: var(--pink-main);
      font-weight: 700;
    }

    /* ================== SECTION 7: PROOF WALL (10 FAMOUS EXAMPLES) ================== */

    .proof-wrap.proof-wall {
      margin: 0px auto 0px;
      padding: 100px 0;
      background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 50%, #e2e8f0 100%);
      position: relative;
      overflow: hidden;
  }
  
  .proof-wrap.proof-wall::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: 
          radial-gradient(circle at 20% 30%, rgba(139, 92, 246, 0.08) 0%, transparent 50%),
          radial-gradient(circle at 80% 70%, rgba(236, 72, 153, 0.08) 0%, transparent 50%);
      pointer-events: none;
  }
  
  /* Header Styles */
  .proof-wrap.proof-wall .proof-heading {
      text-align: center;
      margin-bottom: 60px;
      position: relative;
      z-index: 1;
  }
  
  .proof-wrap.proof-wall .proof-badge {
      display: inline-block;
      padding: 10px 24px;
      background: linear-gradient(135deg, rgba(139, 92, 246, 0.1), rgba(236, 72, 153, 0.1));
      border: 1px solid rgba(139, 92, 246, 0.2);
      border-radius: 50px;
      font-size: 14px;
      font-weight: 600;
      color: #8b5cf6;
      margin-bottom: 20px;
      letter-spacing: 0.5px;
      text-transform: uppercase;
      backdrop-filter: blur(10px);
      box-shadow: 0 4px 20px rgba(139, 92, 246, 0.15);
  }
  
  .proof-wrap.proof-wall .proof-main-title {
      font-size: clamp(28px, 4vw, 42px);
      font-weight: 800;
      color: #0f172a;
      margin: 0 0 16px 0;
      line-height: 1.3;
      letter-spacing: -0.02em;
  }
  
  .proof-wrap.proof-wall .proof-subtitle-text {
      font-size: 18px;
      color: #64748b;
      margin: 0;
      font-weight: 500;
  }
  
  /* Grid Layout */
  .proof-wrap.proof-wall .proof-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
      gap: 30px;
      position: relative;
      z-index: 1;
  }
  
  /* Card Styles */
  .proof-wrap.proof-wall .proof-card {
      position: relative;
      border-radius: 24px;
      overflow: hidden;
      transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      cursor: pointer;
  }
  
  .proof-wrap.proof-wall .proof-card-inner {
      padding: 32px;
      background: #ffffff;
      border-radius: 24px;
      box-shadow: 
          0 4px 6px -1px rgba(0, 0, 0, 0.1),
          0 2px 4px -1px rgba(0, 0, 0, 0.06);
      transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      height: 100%;
      display: flex;
      flex-direction: column;
      position: relative;
      overflow: hidden;
  }
  
  .proof-wrap.proof-wall .proof-card-inner::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 4px;
      background: linear-gradient(90deg, transparent, currentColor, transparent);
      opacity: 0;
      transition: opacity 0.4s ease;
  }
  
  .proof-wrap.proof-wall .proof-card:hover .proof-card-inner {
      transform: translateY(-8px);
      box-shadow: 
          0 20px 25px -5px rgba(0, 0, 0, 0.1),
          0 10px 10px -5px rgba(0, 0, 0, 0.04);
  }
  
  .proof-wrap.proof-wall .proof-card:hover .proof-card-inner::before {
      opacity: 1;
  }
  
  /* Card Number */
  .proof-wrap.proof-wall .proof-number {
      position: absolute;
      top: 20px;
      right: 20px;
      font-size: 48px;
      font-weight: 900;
      line-height: 1;
      opacity: 0.08;
      color: #0f172a;
      font-family: 'Inter', sans-serif;
      transition: opacity 0.4s ease;
  }
  
  .proof-wrap.proof-wall .proof-card:hover .proof-number {
      opacity: 0.15;
  }
  
  /* Header Section */
  .proof-wrap.proof-wall .proof-header {
      display: flex;
      align-items: center;
      gap: 16px;
      margin-bottom: 24px;
  }
  
  .proof-wrap.proof-wall .proof-avatar-wrapper {
      position: relative;
      flex-shrink: 0;
  }
  
  .proof-wrap.proof-wall .proof-avatar-border {
      position: absolute;
      inset: -3px;
      border-radius: 50%;
      background: linear-gradient(135deg, #8b5cf6, #ec4899);
      opacity: 0;
      transition: opacity 0.4s ease;
      z-index: 0;
  }
  
  .proof-wrap.proof-wall .proof-card:hover .proof-avatar-border {
      opacity: 1;
  }
  
  .proof-wrap.proof-wall .proof-avatar {
      width: 64px;
      height: 64px;
      border-radius: 50%;
      object-fit: cover;
      border: 3px solid #ffffff;
      position: relative;
      z-index: 1;
      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
      transition: transform 0.4s ease;
  }
  
  .proof-wrap.proof-wall .proof-card:hover .proof-avatar {
      transform: scale(1.1);
  }
  
  .proof-wrap.proof-wall .proof-verified {
      position: absolute;
      bottom: 0;
      right: 0;
      width: 24px;
      height: 24px;
      background: linear-gradient(135deg, #10b981, #059669);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #ffffff;
      font-size: 12px;
      font-weight: 700;
      border: 2px solid #ffffff;
      z-index: 2;
      box-shadow: 0 2px 8px rgba(16, 185, 129, 0.4);
  }
  
  .proof-wrap.proof-wall .proof-header-text {
      flex: 1;
      min-width: 0;
  }
  
  .proof-wrap.proof-wall .proof-name {
      font-size: 20px;
      font-weight: 700;
      color: #0f172a;
      margin: 0 0 4px 0;
      line-height: 1.3;
  }
  
  .proof-wrap.proof-wall .proof-role {
      font-size: 14px;
      color: #64748b;
      margin: 0;
      font-weight: 500;
  }
  
  /* Content Section */
  .proof-wrap.proof-wall .proof-content {
      flex: 1;
      margin-bottom: 24px;
  }
  
  .proof-wrap.proof-wall .proof-story {
      font-size: 15px;
      line-height: 1.7;
      color: #475569;
      margin: 0;
      font-weight: 400;
  }
  
  /* Stats Section */
  .proof-wrap.proof-wall .proof-stats {
      display: flex;
      align-items: center;
      gap: 16px;
      padding: 20px;
      background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
      border-radius: 16px;
      margin-bottom: 20px;
      border: 1px solid rgba(0, 0, 0, 0.05);
  }
  
  .proof-wrap.proof-wall .proof-stat-item {
      flex: 1;
      text-align: center;
  }
  
  .proof-wrap.proof-wall .proof-stat-value {
      font-size: 21px;
      font-weight: 800;
      color: #0f172a;
      margin-bottom: 4px;
      line-height: 1.2;
      background: linear-gradient(135deg, #8b5cf6, #ec4899);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
  }
  
  .proof-wrap.proof-wall .proof-stat-label {
      font-size: 12px;
      color: #64748b;
      font-weight: 500;
      text-transform: uppercase;
      letter-spacing: 0.5px;
  }
  
  .proof-wrap.proof-wall .proof-stat-divider {
      width: 1px;
      height: 40px;
      background: linear-gradient(180deg, transparent, #cbd5e1, transparent);
  }
  
  /* Footer Section */
  .proof-wrap.proof-wall .proof-footer {
      display: flex;
      justify-content: center;
  }
  
  .proof-wrap.proof-wall .proof-tag {
      display: inline-block;
      padding: 6px 16px;
      background: linear-gradient(135deg, rgba(139, 92, 246, 0.1), rgba(236, 72, 153, 0.1));
      border: 1px solid rgba(139, 92, 246, 0.2);
      border-radius: 20px;
      font-size: 12px;
      font-weight: 600;
      color: #8b5cf6;
      text-transform: uppercase;
      letter-spacing: 0.5px;
  }
  
  /* Individual Card Color Themes */
  .proof-wrap.proof-wall .proof-card-1 .proof-card-inner {
      border-top: 4px solid #3b82f6;
  }
  
  .proof-wrap.proof-wall .proof-card-1 .proof-stat-value {
      background: linear-gradient(135deg, #3b82f6, #2563eb);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
  }
  
  .proof-wrap.proof-wall .proof-card-2 .proof-card-inner {
      border-top: 4px solid #ec4899;
  }
  
  .proof-wrap.proof-wall .proof-card-2 .proof-stat-value {
      background: linear-gradient(135deg, #ec4899, #db2777);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
  }
  
  .proof-wrap.proof-wall .proof-card-3 .proof-card-inner {
      border-top: 4px solid #f59e0b;
  }
  
  .proof-wrap.proof-wall .proof-card-3 .proof-stat-value {
      background: linear-gradient(135deg, #f59e0b, #d97706);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
  }
  
  .proof-wrap.proof-wall .proof-card-4 .proof-card-inner {
      border-top: 4px solid #8b5cf6;
  }
  
  .proof-wrap.proof-wall .proof-card-4 .proof-stat-value {
      background: linear-gradient(135deg, #8b5cf6, #7c3aed);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
  }
  
  .proof-wrap.proof-wall .proof-card-5 .proof-card-inner {
      border-top: 4px solid #10b981;
  }
  
  .proof-wrap.proof-wall .proof-card-5 .proof-stat-value {
      background: linear-gradient(135deg, #10b981, #059669);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
  }
  
    /* ================== SECTION 8: LOGIC SECTION ================== */

.logic-wrap {
    max-width: 1100px;
    margin: 29px auto 0;
    padding: 40px 20px 50px;
    text-align: center;
    line-height: 1.8;
    border-radius: 24px;
    background: radial-gradient(circle at top, #ffe6f3 0%, #ffffff 42%, #ffffff 100%);
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.08);
}

    .logic-lead {
      font-size: 20px;
      font-weight: 600;
      margin-bottom: 22px;
    }

    .logic-lines {
      font-size: 17px;
    }

    .logic-lines p {
      margin-bottom: 4px;
    }

    .logic-lines p.block-gap {
      margin-top: 16px;
    }

    .logic-highlight {
      margin: 26px auto 22px;
      max-width: 720px;
      font-size: 18px;
      font-weight: 800;
      color: var(--pink-main);
      padding: 10px 16px;
      border-radius: 999px;
      background: rgba(255, 24, 140, 0.06);
      box-shadow: 0 0 0 1px rgba(255, 24, 140, 0.2);
    }

    .logic-final {
      margin-top: 20px;
      font-size: 18px;
      font-weight: 600;
    }

    .logic-final span {
      color: var(--pink-main);
    }

    /* ================== SECTION 9: MANUAL VS TOKPRIMEAI TABLE ================== */

   .reality-wrap {
    max-width: 1150px;
    margin: 50px auto 30px;
    padding: 40px 22px 60px;
    text-align: center;
    position: relative;
    /* background: radial-gradient(circle at 0% 0%, rgba(255, 192, 203, 0.15), transparent 55%),
        radial-gradient(circle at 100% 100%, rgba(110, 231, 183, 0.12), transparent 55%); */
    border-radius: 32px;
   
}
  .reality-title {
    font-size: 40px;
    font-weight: 800;
    color: #fff;
    margin-bottom: 8px;
    letter-spacing: 0.02em;
}

   .reality-sub {
    font-size: 17px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #ffff;
    margin-bottom: 26px;
}

    .reality-sub span.pain {
      color: var(--red-main);
      font-weight: 700;
    }
    .reality-sub span.gain {
      color: var(--green-main);
      font-weight: 700;
    }

    .reality-card-shell {
      position: relative;
      border-radius: 26px;
      padding: 1px;
      background: linear-gradient(135deg, #ff9ad5, #ffb347, #4ade80, #38bdf8);
      box-shadow:
        0 24px 80px rgba(248, 113, 113, 0.28),
        0 0 0 1px rgba(255, 255, 255, 0.8);
    }

    .reality-grid {
      border-radius: 24px;
      background: #ffffff;
      overflow: hidden;
    }

    .reality-header {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      font-size: 20px;
      font-weight: 700;
      text-align: left;
    }

    .reality-header-cell {
      padding: 18px 22px;
      display: flex;
      align-items: center;
      gap: 12px;
      position: relative;
      overflow: hidden;
    }

    .reality-header-cell.left {
      background: linear-gradient(90deg, #ffe4e6, #ffe8f0);
      border-right: 1px solid var(--soft-border);
      color: #b91c1c;
    }

    .reality-header-cell.right {
      background: linear-gradient(90deg, #dcfce7, #e0fdf5);
      color: #065f46;
    }

    .reality-header-pill {
      font-size: 14px;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      padding: 2px 8px;
      border-radius: 999px;
      border: 1px solid rgba(0, 0, 0, 0.08);
      background: rgba(255, 255, 255, 0.85);
      color: #4b5563;
    }

    .reality-header-icon {
      width: 30px;
      height: 30px;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
      background: #ffffff;
      box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
    }

    .reality-rows {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      border-top: 1px solid var(--soft-border);
    }

    .reality-row {
      display: contents;
    }

    .reality-cell {
      padding: 12px 22px;
      font-size: 14px;
      text-align: left;
      line-height: 1.65;
      border-top: 1px solid #f3f4f6;
      position: relative;
      transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.18s ease;
    }

    .reality-cell.left {
      background: #fff9fb;
      border-right: 1px solid #f3f4f6;
      border-left: 3px solid rgba(248, 113, 113, 0.55);
    }

    .reality-cell.right {
      background: #f4fff8;
      border-left: 3px solid rgba(74, 222, 128, 0.55);
    }

    .reality-row:nth-child(2n) .reality-cell.left {
      background: #fff5f7;
    }
    .reality-row:nth-child(2n) .reality-cell.right {
      background: #ecfdf3;
    }

    .reality-cell span.pain {
      color: var(--red-main);
      font-weight: 600;
    }

    .reality-cell span.gain {
      color: var(--green-main);
      font-weight: 600;
    }

    .reality-row:hover .reality-cell.left {
      background: #ffe4ec;
      box-shadow: inset 4px 0 0 rgba(248, 113, 113, 0.8);
      transform: translateX(-2px);
    }
    .reality-row:hover .reality-cell.right {
      background: #dcfce7;
      box-shadow: inset 4px 0 0 rgba(34, 197, 94, 0.9);
      transform: translateX(2px);
    }

  .reality-bottomline {
    margin-top: 19px;
    font-size: 20px;
    color: #fff;
}

    .reality-bottomline span.label {
      color: var(--pink-neon);
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      margin-right: 4px;
    }

    .reality-bottomline span.strong {
      font-weight: 700;
    }

    /* ================== SECTION 10: REAL PROOF (TOKPRIMEAI ACCOUNTS) ================== */

    .proof-wrap.real-proof{
      max-width:1160px;
      margin:80px auto 0px;
      padding:0 18px 0px;
      text-align:center;
      position:relative;
    }

    .proof-wrap.real-proof::before{
      content:"";
      position:absolute;
      inset:-120px -140px auto;
      background:
        radial-gradient(circle at 10% 0%,rgba(255,192,203,.25),transparent 60%),
        radial-gradient(circle at 90% 20%,rgba(129,140,248,.18),transparent 60%);
      z-index:-1;
    }

    .proof-wrap.real-proof .proof-pre{
      font-size:16px;
      color:#6b7280;
      margin-bottom:6px;
    }

  .proof-wrap.real-proof .proof-main-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--pink-main);
    margin-bottom: 26px;
    box-shadow: 0 0 10px 1px #ddd;
    margin: 10px auto 40px;
    display: table;
    padding: 12px 20px;
    border-radius: 5px;
}

    .proof-wrap.real-proof .proof-main-title span{
      text-transform:uppercase;
      letter-spacing:.12em;
    }

    .proof-wrap.real-proof .proof-list{
      display:flex;
      flex-direction:column;
      gap:22px;
      margin-bottom:36px;
    }

    .proof-wrap.real-proof .proof-card{
      border-radius:24px;
      padding:16px 18px 18px;
      text-align:left;
      position:relative;
      overflow:hidden;
      background:linear-gradient(135deg,#fff0f6,#fef3c7);
      box-shadow:0 18px 50px rgba(248,113,113,.16);
      border:1px solid rgba(255,255,255,.9);
    }

    .proof-wrap.real-proof .proof-card:nth-child(2){
      background:linear-gradient(135deg,#e0f2fe,#fdf2ff);
      box-shadow:0 18px 50px rgba(96,165,250,.18);
    }
    .proof-wrap.real-proof .proof-card:nth-child(3){
      background:linear-gradient(135deg,#ecfdf5,#fef3c7);
      box-shadow:0 18px 50px rgba(52,211,153,.18);
    }
    .proof-wrap.real-proof .proof-card:nth-child(4){
      background:linear-gradient(135deg,#fef3c7,#fee2e2);
      box-shadow:0 18px 50px rgba(251,191,36,.2);
    }
    .proof-wrap.real-proof .proof-card:nth-child(5){
      background:linear-gradient(135deg,#eef2ff,#ffe4e6);
      box-shadow:0 18px 50px rgba(129,140,248,.2);
    }

    .proof-wrap.real-proof .proof-card::before{
      content:"";
      position:absolute;
      inset:-40%;
      background:radial-gradient(circle at 0 0,rgba(255,255,255,.9),transparent 60%);
      opacity:.35;
      pointer-events:none;
    }

    .proof-wrap.real-proof .proof-card-inner{
      position:relative;
      display:grid;
      grid-template-columns:auto minmax(0,1fr);
      column-gap:14px;
      row-gap:10px;
    }

    .proof-wrap.real-proof .proof-number{
      width:32px;
      height:32px;
      border-radius:999px;
      display:flex;
      align-items:center;
      justify-content:center;
      font-weight:700;
      font-size:16px;
      color:#fff;
      background:linear-gradient(135deg,var(--orange-main),var(--pink-main));
      box-shadow:0 8px 18px rgba(0,0,0,.18);
    }
.proof-wrap.real-proof .proof-headline {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.45;
    margin: 0;
}

    .proof-wrap.real-proof .proof-highlight{
      color:var(--pink-main);
    }

  .proof-wrap.real-proof .proof-body {
    grid-column: 1 / -1;
    font-size: 13px;
    margin-top: 4px;
    color: #374151;
    display: none;
}

    .proof-wrap.real-proof .proof-grid-images{
      grid-column:1 / -1;
      display:grid;
      grid-template-columns:repeat(1,minmax(0,1fr));
      gap:12px;
      margin-top:12px;
    }

    .proof-wrap.real-proof .proof-img-shell{
      border-radius:18px;
      overflow:hidden;
      background:#000;
      position:relative;
      box-shadow:0 14px 30px rgba(15,23,42,.35);
      transform:translateY(0);
      transition:transform .2s ease,box-shadow .2s ease;
    }

    .proof-wrap.real-proof .proof-img-shell img{
      width:100%;
      display:block;
    }

    .proof-wrap.real-proof .proof-tag{
      position:absolute;
      left:12px;
      top:12px;
      padding:4px 10px;
      border-radius:999px;
      font-size:11px;
      font-weight:600;
      letter-spacing:.08em;
      text-transform:uppercase;
      color:#f9fafb;
      background:rgba(15,23,42,.62);
      backdrop-filter:blur(10px);
    }

    .proof-wrap.real-proof .proof-img-shell:hover{
      transform:translateY(-4px);
      box-shadow:0 20px 40px rgba(15,23,42,.6);
    }

    .proof-wrap.real-proof .proof-card:hover{
      transform:translateY(-3px);
      box-shadow:0 24px 70px rgba(248,113,113,.25);
    }

   .proof-wrap.real-proof .proof-bottom-line {
    margin-top: 25px;
    font-size: 16px;
    color: #404040;
    text-align: center;
}

    .proof-wrap.real-proof .proof-bottom-line span.strong{
      font-weight:700;
      color:var(--text-main);
    }

    .proof-wrap.real-proof .proof-trust{
      margin-top:24px;
      font-size:23px;
      font-weight:600;
    }

    .proof-wrap.real-proof .proof-trust span{
      color:var(--pink-main);
    }

 .proof-wrap.real-proof .proof-mini {
    margin-top: 10px;
    font-size: 17px;
    color: #4b5563;
    max-width: 770px;
    margin-left: auto;
    margin-right: auto;
}

    .proof-wrap.real-proof .proof-final{
      margin-top:18px;
      font-size:17px;
      color:#111827;
      font-weight:500;
    }

    .proof-wrap.real-proof .proof-final span{
      font-weight:700;
    }

    /* ================== SECTION 11: INTRO + DEMO VIDEO ================== */

    .demo-hero-wrap{
      max-width:1120px;
      margin:80px auto 40px;
      padding:0 18px 20px;
      text-align:center;
      position:relative;
    }

    .demo-hero-wrap::before{
      content:"";
      position:absolute;
      inset:-140px -220px auto;
      background:
        radial-gradient(circle at 10% 0%,rgba(255,192,203,.35),transparent 60%),
        radial-gradient(circle at 90% 10%,rgba(129,140,248,.25),transparent 60%);
      z-index:-1;
    }

.demo-intro-label {
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .14em;
    color: #7549E1;
    margin-bottom: 4px;
}
.demo-product-name {
    font-size: 58px;
    font-weight: 800;
    letter-spacing: .04em;
    text-transform: capitalize;
    color: var(--pink-main);
    margin-bottom: 14px;
    margin: 24px auto;
    display: table;
    box-shadow: 0 0 10px 1px #ddd;
    padding: 0 40px;
    border-radius: 10px;
}

   .demo-strapline {
    display: inline-block;
    padding: 12px 18px;
    border-radius: 999px;
    background: var(--highlight-yellow);
    font-size: 20px;
    font-weight: 700;
    box-shadow: 0 10px 24px rgba(250,204,21,.4);
    margin-bottom: 26px;
}

.demo-description {
    font-size: 18px;
    line-height: 1.7;
    max-width: 100%;
    margin: 0 auto 6px;
}

    .demo-description .pink{color:var(--pink-main);font-weight:600;}
    .demo-description .blue{color:var(--blue-accent);font-weight:600;}
.demo-description-small {
    font-size: 20px;
    line-height: 1.7;
    max-width: 980px;
    margin: 0 auto 26px;
}

    .demo-description-small .pink{color:var(--pink-main);font-weight:600;}

.demo-subline {
    font-size: 23px;
    font-weight: 700;
    color: var(--pink-main);
    margin-bottom: 18px;
    margin-top: 32px;
}

   .demo-watch-title {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 18px;
    margin: 0 auto 20px;
    display: table;
    border: 1px solid var(--pink-main);
    color: var(--pink-main);
    padding: 10px 30px;
    border-radius: 14px;
}

    .demo-video-shell{
      max-width:880px;
      margin:0 auto 32px;
      position:relative;
      border-radius:24px;
      padding:4px;
      background:linear-gradient(135deg,#ff9ac6,#7c3aed);
      box-shadow:0 22px 60px rgba(0,0,0,.35);
    }

    .demo-video-inner{
      border-radius:20px;
      overflow:hidden;
      background:#050816;
      display:flex;
      align-items:center;
      justify-content:center;
      aspect-ratio:16 / 9;
      position:relative;
    }

    .demo-video-placeholder{
      font-size:22px;
      letter-spacing:.18em;
      text-transform:uppercase;
      color:#e5e7eb;
    }

    .demo-play-pill{
      position:absolute;
      bottom:18px;
      left:50%;
      transform:translateX(-50%);
      padding:7px 16px;
      border-radius:999px;
      font-size:12px;
      letter-spacing:.12em;
      text-transform:uppercase;
      background:rgba(15,23,42,.84);
      color:#f9fafb;
      display:flex;
      align-items:center;
      gap:8px;
      backdrop-filter:blur(10px);
    }
    .demo-play-pill span.icon{
      width:20px;height:20px;
      border-radius:999px;
      display:inline-flex;
      align-items:center;justify-content:center;
      background:radial-gradient(circle at 30% 20%,#f9fafb,#e5e7eb);
      color:#f97316;
      font-size:11px;
    }

    .demo-cta-wrapper{
      margin-top:8px;
    }

    .demo-cta-button-outer{
      display:inline-block;
      position:relative;
      padding-bottom:10px;
      margin-bottom:26px;
    }

    .demo-cta-button{
      position:relative;
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:24px 56px;
      border-radius:28px;
      font-size:30px;
      font-weight:800;
      letter-spacing:.03em;
      color:#ffffff;
      background:linear-gradient(90deg,#ff7a3c,#ff1f8c,#7b61ff);
      box-shadow:0 20px 45px rgba(236,72,153,.65);
      border:none;
      cursor:pointer;
      white-space:nowrap;
      transition:transform .22s ease,box-shadow .22s ease,filter .22s ease;
    }

    .demo-cta-button span.chev{
      margin-left:16px;
      font-size:32px;
    }

    .demo-cta-button::after{
      content:"";
      position:absolute;
      inset:auto 0 -10px 0;
      height:11px;
      border-radius:0 0 28px 28px;
      background:#d75a3d;
      opacity:.92;
      z-index:-1;
    }

    .demo-cta-button:hover{
      transform:translateY(-4px) scale(1.02);
      box-shadow:0 28px 70px rgba(236,72,153,.8);
      filter:brightness(1.05);
    }

    .demo-cta-subline{
      font-size:16px;
      margin-bottom:20px;
    }

    .demo-cta-subline span{margin:0 4px;}

    .demo-payment-row{
      display:flex;
      flex-wrap:wrap;
      justify-content:center;
      align-items:center;
      gap:18px;
      margin-bottom:26px;
    }

    .demo-bottom-benefits{
      font-size:18px;
      font-weight:600;
      line-height:1.6;
    }
    .demo-bottom-benefits span{
      display:block;
    }
.span-title1::after {
    content: '';
    position: absolute;
    top: -1px;
    bottom: -1px;
    left: -1px;
    right: -1px;
    background: linear-gradient(to right, #7549E1, #C1509C, #F88E4D);
    z-index: -1;
    border-radius: 60px;
}
.span-title1 {
    border-radius: 60px;
    background: #ffffff;
    display: inline-block;
    padding: 14px 28px 16px;
    position: relative;
    border: 2px solid transparent;
    background-clip: padding-box;
    font-size: 20px;
    font-weight: 700;
    color: #334155;
    letter-spacing: 0.02em;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}
    /* ================== RESPONSIVE ================== */

    @media (max-width: 992px) {
      .proof-wrap.proof-wall .proof-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 900px){
      .demo-product-name{
        font-size:26px;
      }
      .demo-strapline{
        font-size:11px;
        padding:6px 14px;
      }
      .demo-video-shell{
        border-radius:20px;
      }
      .demo-cta-button{
        font-size:22px;
        padding:18px 26px;
        white-space:normal;
      }
      .demo-cta-button span.chev{
        font-size:26px;
      }
      .demo-bottom-benefits{
        font-size:16px;
      }

      .features-grid{
        grid-template-columns:1fr;
      }
    }

    @media (max-width: 768px) {
      .hero-wrap { margin-top: 40px; }

      .hero-body {
        font-size: 16px;
      }

      .hero-cta {
        font-size: 15px;
        padding: 8px 12px;
      }

      .video-shell {
        border-radius: 14px;
      }

      .video-label {
        font-size: 30px;
      }

      .cta-button {
        font-size: 22px;
        padding: 18px 26px;
      }

      .cta-button span.arrows {
        font-size: 26px;
      }

      .benefits {
        font-size: 15px;
      }

      .cta-button-main {
        font-size: 24px;
        padding: 20px 24px;
        white-space: normal;
      }

      .cta-button-main span.chevron {
        font-size: 28px;
      }

      .cta-subline-bottom {
        font-size: 18px;
      }

      .cta-bottom-heading {
        font-size: 22px;
      }

      .cta-bottom-sub {
        font-size: 18px;
      }

      .why-heading h2 {
        font-size: 26px;
      }

      .why-heading p {
        font-size: 20px;
      }

      .why-grid {
        grid-template-columns: 1fr;
      }

      .why-card {
        font-size: 16px;
        padding: 24px 22px;
      }

      .tiktok-attention {
        margin: 60px auto 80px;
      }

      .tiktok-attention__headline {
        font-size: 24px;
      }

      .tiktok-attention__story,
      .tiktok-attention__final,
      .tiktok-attention__comparison {
        font-size: 16px;
      }

      .tiktok-attention__hook {
        font-size: 18px;
        padding: 8px 12px;
      }

      .proof-wrap.proof-wall .proof-grid {
        grid-template-columns: 1fr;
      }

      .logic-wrap {
        margin: 60px 16px 70px;
        padding: 30px 18px 40px;
      }

      .logic-lead {
        font-size: 18px;
      }

      .logic-lines,
      .logic-highlight,
      .logic-final {
        font-size: 16px;
      }

      .reality-wrap {
        padding: 30px 16px 45px;
      }

      .reality-card-shell {
        box-shadow:
          0 16px 50px rgba(248, 113, 113, 0.25),
          0 0 0 1px rgba(255, 255, 255, 0.8);
      }

      .reality-header,
      .reality-rows {
        grid-template-columns: 1fr;
      }

      .reality-header-cell.left,
      .reality-cell.left {
        border-right: none;
      }

      .reality-cell {
        border-top: 1px solid #e5e7eb;
      }

      .reality-row:hover .reality-cell.left,
      .reality-row:hover .reality-cell.right {
        transform: translateX(0);
      }

      .proof-wrap.real-proof .proof-card-inner{
        grid-template-columns:minmax(0,1fr);
      }
      .proof-wrap.real-proof .proof-grid-images{
        grid-template-columns:1fr;
      }
      .proof-wrap.real-proof .proof-card{
        padding:14px 14px 16px;
      }
    }

    @media (max-width: 640px) {
      .proof-wrap.proof-wall .proof-name {
        font-size: 20px;
      }

      .proof-wrap.proof-wall .proof-subtitle {
        font-size: 14px;
      }

      .proof-wrap.proof-wall .proof-story {
        font-size: 13px;
      }
    }

    /* ================== ADDITIONAL STYLES FROM STYLE TAG 2 ================== */
    .mf-demo-play img, .imgf-demo-play img, .imgf-demo-play img, .imgf-demo-play img {
  width: 100%;
  object-fit: cover;
}
    /* Scoped to avoid any theme/builder conflicts */
    #tokPrimeBundleV2{
      font-family: "Nunito", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      color:#0f172a;
      width:100%;
    }
    #tokPrimeBundleV2 *{ box-sizing:border-box; }
    #tokPrimeBundleV2 a{ color:inherit; }
    #tokPrimeBundleV2 .container{
      width:100%;
      max-width:1320px;
      margin:0 auto;
      padding:22px 14px;
    }
    
    
    /* ===== HERO / TOP STRIP (OPTIONAL) ===== */
    #tokPrimeBundleV22 .topbar{
      background: linear-gradient(90deg, #0a57ff 0%, #18e6e6 100%);
        padding: 14px 16px;
        position: sticky;
        top: 0;
        z-index: 9;
    }
    #tokPrimeBundleV22 .topbar .inner{
      max-width:1320px;
      margin:0 auto;
      display:flex;
      align-items:center;
      justify-content:center;
      gap:18px;
      position:relative;
    }
    #tokPrimeBundleV22 .offer{
      color:#fff;
      font-weight:700;
      font-size:18px;
      line-height:1.2;
      text-align:center;
      padding-right:170px;
    }
    #tokPrimeBundleV22 .strike{ text-decoration:line-through; opacity:.85; margin:0 6px; }
    #tokPrimeBundleV22 .btn-offer{
      position:absolute;
      right:0;
      top:50%;
      transform:translateY(-50%);
      background:#ffd84a;
      border:none;
      border-radius:10px;
      padding:10px 16px;
      font-weight:900;
      cursor:pointer;
    }
  
    /* ===== HERO / TOP STRIP (OPTIONAL) ===== */
    #tokPrimeBundleV2 .topbar {
    background: linear-gradient(90deg, #0a57ff 0%, #18e6e6 100%);
    padding: 14px 16px;
    position: sticky;
    top: 0;
    z-index: 1;
}
    #tokPrimeBundleV2 .topbar .inner{
      max-width:1320px;
      margin:0 auto;
      display:flex;
      align-items:center;
      justify-content:center;
      gap:18px;
      position:relative;
    }
    #tokPrimeBundleV2 .offer{
      color:#fff;
      font-weight:700;
      font-size:18px;
      line-height:1.2;
      text-align:center;
      padding-right:170px;
    }
    #tokPrimeBundleV2 .strike{ text-decoration:line-through; opacity:.85; margin:0 6px; }
    #tokPrimeBundleV2 .btn-offer{
      position:absolute;
      right:0;
      top:50%;
      transform:translateY(-50%);
      background:#ffd84a;
      border:none;
      border-radius:10px;
      padding:10px 16px;
      font-weight:900;
      cursor:pointer;
    }
  
    #tokPrimeBundleV2 .hero{
      background:
        radial-gradient(900px 500px at 15% 65%, rgba(255,219,184,.65), transparent 70%),
        radial-gradient(800px 500px at 85% 75%, rgba(191,195,255,.55), transparent 70%),
        radial-gradient(700px 420px at 35% 15%, rgba(255,194,235,.55), transparent 70%),
        radial-gradient(700px 420px at 70% 10%, rgba(184,255,244,.45), transparent 70%);
      padding:10px 18px 20px;
    }
    #tokPrimeBundleV2 .brand-row{
      display:flex;
      justify-content:space-between;
      align-items:center;
      gap:16px;
      max-width:1320px;
      margin:0 auto;
    }
    #tokPrimeBundleV2 .logo {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 900;
    font-size: 16px;
    padding: 10px 28px;
    margin: initial;
}
    #tokPrimeBundleV2 .mark{
      width:44px; height:34px;
      border:3px solid #2f6dff;
      border-radius:6px;
      display:grid;
      place-items:center;
      font-size:16px;
      font-weight:950;
      color:#2f6dff;
    }
    #tokPrimeBundleV2 .btn-start {
    background: linear-gradient(180deg, #2fd5ff 0%, #0a57ff 100%);
    color: #fff;
    border: none;
    border-radius: 14px;
    padding: 10px 14px;
    font-size: 17px;
    font-weight: 900;
    cursor: pointer;
}
#tokPrimeBundleV2 .callout {
    max-width: 760px;
    margin: 8px auto;
    text-align: center;
    background: rgba(255,255,255,.6);
    border: 2px solid rgba(110,168,255,.9);
    border-radius: 10px;
    padding: 7px 18px;
    font-size: 20px;
    font-weight: 700;
}
    #tokPrimeBundleV2 .subline{ text-align:center; max-width:1320px; margin:0 auto; }
    #tokPrimeBundleV2 .subline .red{ color:#e54747; font-size:22px; font-weight:800; }
    #tokPrimeBundleV2 .subline .green{ color:#1f9a58; font-size:28px; font-weight:900; margin-top:8px; }
    #tokPrimeBundleV2 .headline {
    text-align: center;
    margin-top: 4px;
    font-weight: 900;
    max-width: 1320px;
    margin-left: auto;
    margin-right: auto;
}
    #tokPrimeBundleV2 .headline .l1{ font-size:52px; }
    #tokPrimeBundleV2 .headline .l2 {
    font-size: 64px;
    margin-top: -18px;
}
    #tokPrimeBundleV2 .brand{ color:#0a57ff; }
    #tokPrimeBundleV2 .otos{ color:#2fd5ff; }
    #tokPrimeBundleV2 .bundle{ text-align:center; font-size:28px; font-weight:900; margin-top:0px; max-width:1320px; margin-left:auto; margin-right:auto; }
  
    /* ===== GRID SYSTEM (NO THIN COLUMNS) ===== */
    #tokPrimeBundleV2 .grid{
      display:grid;
      gap:16px;
      align-items:stretch;
      width:100%;
    }
    /* Row A: 1 wide + 2 normal (prevents col2/3 thin strips) */
    #tokPrimeBundleV2 .grid--wideFirst {
    grid-template-columns: minmax(400px, 2fr) minmax(400px, 1fr) minmax(400px, 1fr);
}
    /* Row B: 3 equal */
    #tokPrimeBundleV2 .grid--equal{
      grid-template-columns: repeat(3, minmax(340px, 1fr));
    }
    /* Responsive: never squeeze */
    @media (max-width: 1120px){
      #tokPrimeBundleV2 .grid--wideFirst,
      #tokPrimeBundleV2 .grid--equal{ grid-template-columns: repeat(2, minmax(320px, 1fr)); }
      #tokPrimeBundleV2 .offer{ padding-right:0; font-size:16px; }
      #tokPrimeBundleV2 .btn-offer{ position:static; transform:none; }
      #tokPrimeBundleV2 .brand-row{ flex-direction:column; align-items:flex-start; }
      #tokPrimeBundleV2 .headline .l1{ font-size:38px; }
      #tokPrimeBundleV2 .headline .l2{ font-size:44px; }
    }
    @media (max-width: 760px){
      #tokPrimeBundleV2 .grid--wideFirst,
      #tokPrimeBundleV2 .grid--equal{ grid-template-columns: 1fr; }
    }
  
    /* ===== CARD ===== */
    #tokPrimeBundleV2 .card{
      min-width:0;
      width:100%;
      background:#fff;
      border:2px solid rgba(15,23,42,.12);
      border-radius:14px;
      overflow:hidden;
      display:flex;
      flex-direction:column;
      box-shadow: 0 10px 26px rgba(2,6,23,.08);
    }
    #tokPrimeBundleV2 .head{
      padding:16px 16px 14px;
      border-bottom:1px solid rgba(15,23,42,.10);
      background: linear-gradient(180deg, var(--soft), transparent);
    }
    #tokPrimeBundleV2 .kicker{ font-weight:900; font-size:14px; opacity:.9; margin-bottom:6px; }
    #tokPrimeBundleV2 .title{ margin:0 0 8px; font-weight:900; font-size:18px; line-height:1.25; }
    #tokPrimeBundleV2 .sub{ margin:0; font-size:13px; color: rgba(15,23,42,.72); line-height:1.35; }
  
    #tokPrimeBundleV2 .highlight{
      margin-top:12px;
      padding:10px 12px;
      border-radius:12px;
      border:1px solid rgba(15,23,42,.10);
      background:#fff;
    }
    #tokPrimeBundleV2 .highlight .h1{ color:var(--accent); font-weight:900; font-size:13px; margin:0 0 6px; }
    #tokPrimeBundleV2 .highlight .h2{ margin:0; font-size:13px; color: rgba(15,23,42,.78); line-height:1.45; }
  
    #tokPrimeBundleV2 .body{
      padding:14px 16px 18px;
      flex:1;
      display:flex;
      flex-direction:column;
      gap:12px;
      min-width:0;
    }
    #tokPrimeBundleV2 .note{
      border-left:4px solid var(--accent);
      background:var(--soft);
      padding:10px 12px;
      border-radius:10px;
      color: rgba(15,23,42,.86);
      font-size:13px;
      line-height:1.5;
    }
  
    #tokPrimeBundleV2 .section-title{
      font-weight:900;
      font-size:13px;
      color:#0b1220;
      display:flex;
      align-items:center;
      gap:8px;
      margin-top:2px;
    }
    #tokPrimeBundleV2 .dot{
      width:10px; height:10px; border-radius:999px;
      background:var(--accent);
      box-shadow: 0 0 0 5px var(--soft);
    }
    #tokPrimeBundleV2 .list{
      margin:0;
      padding-left:18px;
      color: rgba(15,23,42,.78);
      font-size:13px;
      line-height:1.55;
    }
    #tokPrimeBundleV2 .list li{ margin:6px 0; }
    #tokPrimeBundleV2 .list b{ color:#0b1220; }
  
    /* Column 1 - AiVideoStitcherFx Commercial lists */
    #tokPrimeBundleV2 .firt-check-list,
    #tokPrimeBundleV2 .tp-feature-list{
      list-style:none;
      margin:4px 0;
      padding:0;
      display:flex;
      flex-direction:column;
      gap:6px;
      color: rgba(15,23,42,.82);
      font-size:13px;
      line-height:1.55;
    }
    #tokPrimeBundleV2 .firt-check-list li,
    #tokPrimeBundleV2 .tp-feature-list li{
      display:flex;
      align-items:flex-start;
      gap:8px;
    }
    #tokPrimeBundleV2 .firt-check-list img,
    #tokPrimeBundleV2 .tp-feature-list img{
      width:16px;
      height:16px;
      flex-shrink:0;
      margin-top:2px;
    }
    #tokPrimeBundleV2 .note-four{
      margin:8px 0 4px;
      font-size:14px;
      line-height:1.45;
      color:#0b1220;
    }
    #tokPrimeBundleV2 .note-five{
      margin:0 0 6px;
      font-size:13px;
      line-height:1.5;
      color: rgba(15,23,42,.86);
    }
    #tokPrimeBundleV2 .plan-selling-process{
      margin-top:10px;
      padding:10px 12px;
      border-radius:12px;
      border:1px dashed rgba(15,23,42,.20);
      background:#f9fafb;
    }
    #tokPrimeBundleV2 .selling-title{
      margin:0 0 8px;
      font-size:13px;
      line-height:1.4;
      display:flex;
      align-items:center;
      gap:6px;
    }
    #tokPrimeBundleV2 .selling-star{
      font-size:14px;
    }
    #tokPrimeBundleV2 .selling-steps{
      display:flex;
      flex-direction:column;
      gap:6px;
    }
    #tokPrimeBundleV2 .selling-step{
      display:flex;
      align-items:flex-start;
      gap:8px;
    }
    #tokPrimeBundleV2 .step-number{
      width:20px;
      height:20px;
      border-radius:999px;
      background:#0b1220;
      color:#fff;
      font-size:12px;
      display:flex;
      align-items:center;
      justify-content:center;
      flex-shrink:0;
      margin-top:2px;
    }
    #tokPrimeBundleV2 .step-content{
      font-size:13px;
      line-height:1.5;
    }
    article.card.c3 .why-webstories-content {
      flex: initial;
      padding-bottom: 20px;
  }
    #tokPrimeBundleV2 .mini {
      border: 1px dashed rgba(15,23,42,.18);
      border-radius: 12px;
      padding: 10px 12px;
      font-size: 12.5px;
      color: rgba(15,23,42,.76);
      background: #fff;
      text-align: center;
      margin-bottom: 12px;
  }
  
    #tokPrimeBundleV2 .cta{
      margin-top:10px;
      width:100%;
      border:none;
      border-radius:12px;
      padding:12px 14px;
      font-weight:900;
      cursor:pointer;
      background:var(--accent);
      color:#fff;
      box-shadow:0 12px 26px rgba(2,6,23,.12);
    }
  
    #tokPrimeBundleV2 .footer{
      padding:14px 16px;
      background:#0b1220;
      color:#fff;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:10px;
    }
    #tokPrimeBundleV2 .price{ font-weight:900; font-size:18px; }
    #tokPrimeBundleV2 .badge{
      background: rgba(255,255,255,.12);
      border:1px solid rgba(255,255,255,.18);
      padding:8px 10px;
      border-radius:12px;
      font-size:12px;
      line-height:1.2;
      text-align:right;
      white-space:nowrap;
    }
    @media (max-width:760px){
      #tokPrimeBundleV2 .badge{ white-space:normal; }
    }
  
    /* Accents */
    #tokPrimeBundleV2 .c1{ --accent:#2563eb; --soft:rgba(37,99,235,.10); }
    #tokPrimeBundleV2 .c2{ --accent:#7c3aed; --soft:rgba(124,58,237,.10); }
    #tokPrimeBundleV2 .c3{ --accent:#f97316; --soft:rgba(249,115,22,.12); }
    #tokPrimeBundleV2 .c4{ --accent:#2563eb; --soft:rgba(37,99,235,.10); }
    #tokPrimeBundleV2 .c5{ --accent:#7c3aed; --soft:rgba(124,58,237,.10); }
    #tokPrimeBundleV2 .c6{ --accent:#16a34a; --soft:rgba(22,163,74,.10); }
  
    /* Extra blocks used in columns 4/5/6 */
    #tokPrimeBundleV2 .heroBox{
      border:1px solid rgba(15,23,42,.12);
      border-radius:12px;
      background:#0b1220;
      color:#fff;
      padding:12px;
      text-align:center;
      font-weight:900;
      line-height:1.35;
    }
    #tokPrimeBundleV2 .heroBox .small{ display:block; margin-top:6px; font-weight:800; font-size:12px; opacity:.85; }
    #tokPrimeBundleV2 .heroBox .hl{ color:#ffd84a; font-weight:900; }
  
  
    #tokPrimeBundleV2 .box .top{
      padding:10px 12px;
      font-weight:900;
      font-size:12.5px;
      background:var(--soft);
      border-bottom:1px solid rgba(15,23,42,.10);
    }
    #tokPrimeBundleV2 .box .content{
      padding:10px 12px;
      font-size:12.5px;
      color: rgba(15,23,42,.78);
      line-height:1.55;
      min-width:0;
    }
    #tokPrimeBundleV2 .miniList{ margin:0; padding-left:18px; }
    #tokPrimeBundleV2 .miniList li{ margin:5px 0; }
  
    /* Marketing kit rails */
    #tokPrimeBundleV2 .marketingKit{ position:relative; }
    #tokPrimeBundleV2 .marketingKit::before,
    #tokPrimeBundleV2 .marketingKit::after{
      content:""; position:absolute; top:0; bottom:0; width:6px; background:#3b82f6;
    }
    #tokPrimeBundleV2 .marketingKit::before{ left:0; }
    #tokPrimeBundleV2 .marketingKit::after{ right:0; }
    #tokPrimeBundleV2 .kitList{ display:flex; flex-direction:column; gap:10px; padding:14px 18px; }
    #tokPrimeBundleV2 .kitItem{ padding:8px 10px; border-bottom:1px solid rgba(15,23,42,.08); font-weight:700; }
    #tokPrimeBundleV2 .kitItem:last-child{ border-bottom:none; }
    #tokPrimeBundleV2 .kitItem.ok{ color:#0f5132; }
    #tokPrimeBundleV2 .kitItem.special{ color:#92400e; }
    #tokPrimeBundleV2 .kitItem.warn{ color:#991b1b; }
  
    /* Column 3 extra */
    #tokPrimeBundleV2 .pink{
      border-left:4px solid #ff3ea5;
      background: rgba(255,62,165,.10);
      color:#b8005a;
      padding:10px 12px;
      border-radius:10px;
      font-size:13px;
      line-height:1.5;
      font-weight:800;
    }
    #tokPrimeBundleV2 .para{
      margin:0;
      font-size:13px;
      line-height:1.6;
      color: rgba(15,23,42,.78);
    }
    #tokPrimeBundleV2 .steps{
      padding:10px 12px;
      border:1px dashed rgba(15,23,42,.20);
      border-radius:12px;
      font-size:13px;
      color: rgba(15,23,42,.82);
      background:#fff;
      font-weight:700;
    }
    #tokPrimeBundleV2 .preview{
      border:1px solid rgba(15,23,42,.12);
      border-radius:12px;
      overflow:hidden;
      background:#fff;
    }
    #tokPrimeBundleV2 .previewTop{
      padding:10px 12px;
      background: rgba(249,115,22,.10);
      border-bottom:1px solid rgba(15,23,42,.10);
      font-size:12.5px;
      font-weight:900;
    }
    #tokPrimeBundleV2 .muted{ color: rgba(15,23,42,.65); font-weight:700; }
    #tokPrimeBundleV2 .mutedSm{ margin-top:4px; color: rgba(15,23,42,.65); font-size:11.5px; font-weight:600; }
    #tokPrimeBundleV2 .previewBlock{
      padding:10px 12px;
      border-bottom:1px solid rgba(15,23,42,.08);
    }
    #tokPrimeBundleV2 .previewTitle{
      font-weight:900;
      font-size:12px;
      color:#ff3ea5;
      margin-bottom:6px;
    }
    #tokPrimeBundleV2 .previewList{
      margin:0;
      padding-left:18px;
      font-size:12px;
      color: rgba(15,23,42,.72);
      line-height:1.5;
    }
    #tokPrimeBundleV2 .previewList li{ margin:4px 0; }
    #tokPrimeBundleV2 .previewBottom{
      padding:10px 12px;
      background:#fafafa;
      font-size:12px;
      font-weight:700;
    }

    /* ================== ADDITIONAL STYLES FROM STYLE TAG 3 ================== */
  .tp-urgency-banner{
    font-family: 'Space Grotesk', sans-serif;
    text-align: center;
    padding: 28px 16px 24px;
    background: #ffffff;
  }

  .tp-urgency-banner .line-1{
    color: #ff0000;
    font-size: 26px;
    font-weight: 800;
    margin: 0 0 12px;
  }

  .tp-urgency-banner .line-2{
    color: #ff0000;
    font-size: 30px;
    font-weight: 900;
    margin: 0;
  }

  .tp-urgency-banner .line-2 u{
    text-decoration-thickness: 3px;
    text-underline-offset: 6px;
  }
  .reseller-video-container iframe {
    width: 100%;
    height: 617px;
    margin-top: 30px;
    border-radius: 30px;
}
section.reseller-hero-section .reseller-video-container iframe {
    width: 100%;
    height: 504px;
    margin-top: 0;
    border-radius: 30px;
}
.reseller-video-container {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    background: transparent;
    opacity: 1;
    margin-bottom: 0px;
}
span.watch-webinar {
    background: #f2ff0f;
    font-size: 30px;
    padding: 8px 40px;
    border-radius: 10px;
    display: inline-block;
    margin-top: 20px;
    font-weight: 600;
}
  @media (max-width: 768px){
    .tp-urgency-banner .line-1{
      font-size: 20px;
    }
    .tp-urgency-banner .line-2{
      font-size: 22px;
    }
  }

    /* ================== ADDITIONAL STYLES FROM REMAINING STYLE TAGS ================== */
/* =========================
   MEGA-FEATURES LIST PILL
   ========================= */
.mf-pill-wrap{
  display:flex;
  justify-content:center;
  margin-bottom:18px;
}
.mf-pill{
  padding:14px 34px;
  border-radius:999px;
  border:2px solid rgba(64, 115, 255, 0.55);
  color:#3b6bff;
  font-weight:800;
  letter-spacing:0.28em;
  font-size:18px;
  text-transform:uppercase;
  background:rgba(255,255,255,0.55);
  backdrop-filter: blur(6px);
}

/* =========================
   HEADLINE STYLES
   ========================= */
.mf-section-head{
  text-align:center;
  margin-bottom:28px;
}
.mf-section-title{
  font-size:42px;
  font-weight:800;
  color:#0f172a;
  margin:0 0 10px;
  line-height:1.15;
}
.mf-section-index{ color:#ff4d8d; }
.mf-section-subtitle{
  font-size:20px;
  font-style:italic;
  color:#ff4d8d;
  font-weight:600;
  margin:0;
}

/* HARD OVERRIDE: force 2 rows (3 columns) no matter what existing CSS does */
#mfTabs{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap:14px !important;
  align-items:stretch !important;
  justify-items:stretch !important;
}

/* Make each tab fill its grid cell cleanly */
#mfTabs .mf-tab{
  width:100% !important;
  max-width:none !important;
}

/* Tablet: 2 columns */
@media (max-width: 760px){
  #mfTabs{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile: 1 column */
@media (max-width: 620px){
  #mfTabs{
    grid-template-columns: 1fr !important;
  }
}

/* === FORCE 2 ROWS (3 + 3) ï¿½ LAST CSS IN FILE === */
#ai-video-creation-suite #mfTabs{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  width: 100% !important;
  max-width: 1200px !important; /* keeps it centered and prevents ultra-wide stretching */
  margin: 0 auto !important;
}

/* Each tab fills its grid cell */
#ai-video-creation-suite #mfTabs > .mf-tab{
  width: 100% !important;
  max-width: none !important;
  flex: initial !important;       /* kills any flex sizing */
  justify-self: stretch !important;
}

/* If your CSS forces horizontal scrolling, kill it */
#ai-video-creation-suite #mfTabs{
  overflow: visible !important;
  white-space: normal !important;
}

/* Tablet */
@media (max-width: 760px){
  #ai-video-creation-suite #mfTabs{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile */
@media (max-width: 620px){
  #ai-video-creation-suite #mfTabs{
    grid-template-columns: 1fr !important;
  }
}

/* ================== IMAGE CREATION SECTION STYLES ================== */
  :root{
    --imgf-pink:#ff1f8c;
    --imgf-blue:#0ea5e9;
    --imgf-mint:#22c55e;
    --imgf-peach:#fb923c;
    --imgf-text:#0f172a;
  }

  .imgf-section{
    background:
      radial-gradient(circle at 0 0,#e0f2fe 0,#ecfdf3 40%,transparent 65%),
      radial-gradient(circle at 100% 0,#fee2e2 0,#fff7ed 40%,transparent 70%),
      #f4fbff;
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--imgf-text);
  }

  .imgf-inner{ max-width:1160px; margin:0 auto; }

  .imgf-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .imgf-heading span{ color:var(--imgf-pink); }

  .imgf-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--imgf-pink);
    margin-bottom:28px;
  }

  /* tabs row */
  .imgf-tabs{
    max-width:760px;
    margin:0 auto 24px;
    display:flex;
    gap:16px;
    justify-content:center;
    flex-wrap:wrap;
  }

  .imgf-tab{
    flex:1 1 220px;
    min-width:220px;
    cursor:pointer;
    border-radius:999px;
    padding:11px 18px;
    border:1px solid rgba(148,163,184,.7);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 26px rgba(148,163,184,.25);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    font-size:15px;
    font-weight:700;
  }
  .imgf-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#a5f3fc,#bef264);
    opacity:0;
    transition:opacity .18s ease;
  }
  .imgf-tab span.label{ position:relative; }
  .imgf-tab span.icon{
    position:relative;
    width:26px;height:26px;border-radius:999px;
    display:flex;align-items:center;justify-content:center;
    font-size:16px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
  }

  .imgf-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#0ea5e9,#22c55e);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(34,197,94,.55);
    transform:translateY(-3px);
  }
  .imgf-tab.active::before{ opacity:.25; }

  /* panel shell */
  .imgf-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#0ea5e9,#22c55e,#fb923c);
    box-shadow:0 20px 60px rgba(15,23,42,.35);
  }

  .imgf-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
  }

  .imgf-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .imgf-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .imgf-title span{ color:var(--imgf-pink); }

  .imgf-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .imgf-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .imgf-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .imgf-bullets li span.dot{
    font-size:16px;
    color:var(--imgf-pink);
  }

  /* demo card */
  .imgf-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fee2e2);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .imgf-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.4);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:13px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    overflow:hidden;
  }
  .imgf-demo-play{
    position: relative;
    bottom: 0;
    left: 0;
    padding: 0;
    border-radius: 999px;
    background: rgba(15,23,42,.86);
    color: #f9fafb;
    font-size: 11px;
    letter-spacing: .12em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 6px;
  }

  .imgf-panel,
  .imgf-demo{
    transition:opacity .1s ease,transform .1s ease;
  }
  .imgf-panel.is-switching,
  .imgf-demo.is-switching{
    opacity:1;
    transform:translateY(3px);
  }

  /* responsive */
  @media (max-width:900px){
    .imgf-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .imgf-section{ padding:60px 16px 70px; }
    .imgf-tabs{
      max-width:none;
      overflow-x:auto;
      flex-wrap:nowrap;
      padding-bottom:4px;
      scrollbar-width:none;
    }
    .imgf-tabs::-webkit-scrollbar{display:none;}
    .imgf-tab{ flex:0 0 80%; }
  }

/* ================== REMIX SECTION STYLES ================== */
  :root{
    --rmx-pink:#ff1f8c;
    --rmx-purple:#7c3aed;
    --rmx-orange:#fb923c;
    --rmx-blue:#0ea5e9;
    --rmx-text:#0f172a;
  }

  .rmx-section{
    background:
      radial-gradient(circle at 0 0,#f5f3ff 0,#fee2e2 40%,transparent 70%),
      radial-gradient(circle at 100% 0,#e0f2fe 0,#fef9c3 40%,transparent 70%),
      #fff7fb;
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--rmx-text);
  }

  .rmx-inner{
    max-width:1160px;
    margin:0 auto;
  }

  .rmx-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .rmx-heading span{
    color:var(--rmx-pink);
  }

  .rmx-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--rmx-pink);
    margin-bottom:28px;
  }

  /* tabs container */
  .rmx-tabs{
    max-width:1080px;
    margin:0 auto 24px;
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .rmx-tabs-row{
    display:flex;
    gap:14px;
    justify-content:center;
    flex-wrap:wrap;
  }

  .rmx-tabs-row--second{
    margin-top:4px;
  }

  .rmx-tab{
    flex:1 1 0;
    max-width:260px;
    cursor:pointer;
    border-radius:999px;
    padding:10px 18px;
    border:1px solid rgba(148,163,184,.7);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 26px rgba(148,163,184,.25);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    font-size:14px;
    font-weight:700;
    text-align:left;
    white-space:nowrap;
  }
  .rmx-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#a5b4fc,#f472b6);
    opacity:0;
    transition:opacity .18s ease;
  }
  .rmx-tab span.label{
    position:relative;
  }
  .rmx-tab span.icon{
    position:relative;
    width:24px;
    height:24px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .rmx-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#4f46e5,#ec4899);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(147,51,234,.55);
    transform:translateY(-3px);
  }
  .rmx-tab.active::before{
    opacity:.28;
  }

  /* panel shell */
  .rmx-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#4f46e5,#ec4899,#fb923c);
    box-shadow:0 20px 60px rgba(15,23,42,.35);
  }
  .imgf-demo-play img {
    width: 100%;
}
  .rmx-panel {
    border-radius: 24px;
    background: #ffffff;
    padding: 24px 26px 26px;
    display: flex;
    grid-template-columns: minmax(0,1.5fr) minmax(0,1.1fr);
    gap: 26px;
    transition: opacity .25s ease,transform .25s ease;
    align-items: center;
}
  .rmx-panel.is-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .rmx-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  body .rmx-title{
    font-size:22px;
    font-weight:800;
    text-align: left;
    margin-bottom:10px;
  }
  body  .rmx-title span{
    color:var(--rmx-pink);
  }
  body  .rmx-desc {
    font-size: 18px;
    line-height: 1.8;
    color: #4b5563;
    text-align: left;
    margin-bottom: 10px;
}

  .rmx-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .rmx-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .rmx-bullets li span.dot{
    font-size:16px;
    color:var(--rmx-pink);
  }

  /* demo card */
  .rmx-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fce7f3);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .rmx-demo.is-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .rmx-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .rmx-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .rmx-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.4);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .rmx-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.86);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .rmx-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  @media (max-width:900px){
    .rmx-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .rmx-section{
      padding:60px 16px 70px;
    }
    .rmx-tab{
      max-width:none;
      white-space:normal;
    }
    .rmx-demo-video{
      font-size:11px;
    }
  }

    /* ================== ADDITIONAL STYLES FROM REMAINING STYLE TAGS ================== */
/* =========================
   MEGA-FEATURES LIST PILL
   ========================= */
.mf-pill-wrap{
  display:flex;
  justify-content:center;
  margin-bottom:18px;
}
.mf-pill{
  padding:14px 34px;
  border-radius:999px;
  border:2px solid rgba(64, 115, 255, 0.55);
  color:#3b6bff;
  font-weight:800;
  letter-spacing:0.28em;
  font-size:18px;
  text-transform:uppercase;
  background:rgba(255,255,255,0.55);
  backdrop-filter: blur(6px);
}

/* =========================
   HEADLINE STYLES
   ========================= */
.mf-section-head{
  text-align:center;
  margin-bottom:28px;
}
.mf-section-title{
  font-size:42px;
  font-weight:800;
  color:#0f172a;
  margin:0 0 10px;
  line-height:1.15;
}
.mf-section-index{ color:#ff4d8d; }
.mf-section-subtitle{
  font-size:20px;
  font-style:italic;
  color:#ff4d8d;
  font-weight:600;
  margin:0;
}

/* HARD OVERRIDE: force 2 rows (3 columns) no matter what existing CSS does */
#mfTabs{
  display:grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap:14px !important;
  align-items:stretch !important;
  justify-items:stretch !important;
}

/* Make each tab fill its grid cell cleanly */
#mfTabs .mf-tab{
  width:100% !important;
  max-width:none !important;
}

/* Tablet: 2 columns */
@media (max-width: 760px){
  #mfTabs{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile: 1 column */
@media (max-width: 620px){
  #mfTabs{
    grid-template-columns: 1fr !important;
  }
}

/* === FORCE 2 ROWS (3 + 3) ï¿½ LAST CSS IN FILE === */
#ai-video-creation-suite #mfTabs{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 14px !important;
  width: 100% !important;
  max-width: 1200px !important; /* keeps it centered and prevents ultra-wide stretching */
  margin: 0 auto !important;
}

/* Each tab fills its grid cell */
#ai-video-creation-suite #mfTabs > .mf-tab{
  width: 100% !important;
  max-width: none !important;
  flex: initial !important;       /* kills any flex sizing */
  justify-self: stretch !important;
}

/* If your CSS forces horizontal scrolling, kill it */
#ai-video-creation-suite #mfTabs{
  overflow: visible !important;
  white-space: normal !important;
}

/* Tablet */
@media (max-width: 760px){
  #ai-video-creation-suite #mfTabs{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile */
@media (max-width: 620px){
  #ai-video-creation-suite #mfTabs{
    grid-template-columns: 1fr !important;
  }
}

  :root{
    --imgf-pink:#ff1f8c;
    --imgf-blue:#0ea5e9;
    --imgf-mint:#22c55e;
    --imgf-peach:#fb923c;
    --imgf-text:#0f172a;
  }

  .imgf-section{
    background:
      radial-gradient(circle at 0 0,#e0f2fe 0,#ecfdf3 40%,transparent 65%),
      radial-gradient(circle at 100% 0,#fee2e2 0,#fff7ed 40%,transparent 70%),
      #f4fbff;
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--imgf-text);
  }

  .imgf-inner{ max-width:1160px; margin:0 auto; }

  .imgf-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .imgf-heading span{ color:var(--imgf-pink); }

  .imgf-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--imgf-pink);
    margin-bottom:28px;
  }

  /* tabs row */
  .imgf-tabs{
    max-width:760px;
    margin:0 auto 24px;
    display:flex;
    gap:16px;
    justify-content:center;
    flex-wrap:wrap;
  }

  .imgf-tab{
    flex:1 1 220px;
    min-width:220px;
    cursor:pointer;
    border-radius:999px;
    padding:11px 18px;
    border:1px solid rgba(148,163,184,.7);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 26px rgba(148,163,184,.25);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    font-size:15px;
    font-weight:700;
  }
  .imgf-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#a5f3fc,#bef264);
    opacity:0;
    transition:opacity .18s ease;
  }
  .imgf-tab span.label{ position:relative; }
  .imgf-tab span.icon{
    position:relative;
    width:26px;height:26px;border-radius:999px;
    display:flex;align-items:center;justify-content:center;
    font-size:16px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
  }

  .imgf-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#0ea5e9,#22c55e);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(34,197,94,.55);
    transform:translateY(-3px);
  }
  .imgf-tab.active::before{ opacity:.25; }

  /* panel shell */
  .imgf-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#0ea5e9,#22c55e,#fb923c);
    box-shadow:0 20px 60px rgba(15,23,42,.35);
  }

  .imgf-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
  }

  .imgf-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .imgf-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .imgf-title span{ color:var(--imgf-pink); }

  .imgf-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .imgf-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .imgf-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .imgf-bullets li span.dot{
    font-size:16px;
    color:var(--imgf-pink);
  }

  /* demo card */
  .imgf-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fee2e2);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .imgf-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.4);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:13px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    overflow:hidden;
  }
  .imgf-demo-play{
    position: relative;
    bottom: 0;
    left: 0;
    padding: 0;
    border-radius: 999px;
    background: rgba(15,23,42,.86);
    color: #f9fafb;
    font-size: 11px;
    letter-spacing: .12em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 6px;
  }

  .imgf-panel,
  .imgf-demo{
    transition:opacity .1s ease,transform .1s ease;
  }
  .imgf-panel.is-switching,
  .imgf-demo.is-switching{
    opacity:1;
    transform:translateY(3px);
  }

  /* responsive */
  @media (max-width:900px){
    .imgf-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .imgf-section{ padding:60px 16px 70px; }
    .imgf-tabs{
      max-width:none;
      overflow-x:auto;
      flex-wrap:nowrap;
      padding-bottom:4px;
      scrollbar-width:none;
    }
    .imgf-tabs::-webkit-scrollbar{display:none;}
    .imgf-tab{ flex:0 0 80%; }
  }

  :root{
    --rmx-pink:#ff1f8c;
    --rmx-purple:#7c3aed;
    --rmx-orange:#fb923c;
    --rmx-blue:#0ea5e9;
    --rmx-text:#0f172a;
  }

  .rmx-section{
    background:
      radial-gradient(circle at 0 0,#f5f3ff 0,#fee2e2 40%,transparent 70%),
      radial-gradient(circle at 100% 0,#e0f2fe 0,#fef9c3 40%,transparent 70%),
      #fff7fb;
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--rmx-text);
  }

  .rmx-inner{
    max-width:1160px;
    margin:0 auto;
  }

  .rmx-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .rmx-heading span{
    color:var(--rmx-pink);
  }

  .rmx-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--rmx-pink);
    margin-bottom:28px;
  }

  /* tabs container */
  .rmx-tabs{
    max-width:1080px;
    margin:0 auto 24px;
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .rmx-tabs-row{
    display:flex;
    gap:14px;
    justify-content:center;
    flex-wrap:wrap;
  }

  .rmx-tabs-row--second{
    margin-top:4px;
  }

  .rmx-tab{
    flex:1 1 0;
    max-width:260px;
    cursor:pointer;
    border-radius:999px;
    padding:10px 18px;
    border:1px solid rgba(148,163,184,.7);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 26px rgba(148,163,184,.25);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    font-size:14px;
    font-weight:700;
    text-align:left;
    white-space:nowrap;
  }
  .rmx-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#a5b4fc,#f472b6);
    opacity:0;
    transition:opacity .18s ease;
  }
  .rmx-tab span.label{
    position:relative;
  }
  .rmx-tab span.icon{
    position:relative;
    width:24px;
    height:24px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .rmx-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#4f46e5,#ec4899);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(147,51,234,.55);
    transform:translateY(-3px);
  }
  .rmx-tab.active::before{
    opacity:.28;
  }

  /* panel shell */
  .rmx-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#4f46e5,#ec4899,#fb923c);
    box-shadow:0 20px 60px rgba(15,23,42,.35);
  }
  .imgf-demo-play img {
    width: 100%;
  }
  .rmx-panel {
    border-radius: 24px;
    background: #ffffff;
    padding: 24px 26px 26px;
    display: flex;
    grid-template-columns: minmax(0,1.5fr) minmax(0,1.1fr);
    gap: 26px;
    transition: opacity .25s ease,transform .25s ease;
    align-items: center;
  }
  .rmx-panel.is-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .rmx-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  body .rmx-title{
    font-size:22px;
    font-weight:800;
    text-align: left;
    margin-bottom:10px;
  }
  body  .rmx-title span{
    color:var(--rmx-pink);
  }
  body  .rmx-desc {
    font-size: 18px;
    line-height: 1.8;
    color: #4b5563;
    text-align: left;
    margin-bottom: 10px;
  }

  .rmx-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .rmx-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .rmx-bullets li span.dot{
    font-size:16px;
    color:var(--rmx-pink);
  }

  /* demo card */
  .rmx-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fce7f3);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .rmx-demo.is-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .rmx-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .rmx-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .rmx-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.4);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .rmx-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.86);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .rmx-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  @media (max-width:900px){
    .rmx-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .rmx-section{
      padding:60px 16px 70px;
    }
    .rmx-tab{
      max-width:none;
      white-space:normal;
    }
    .rmx-demo-video{
      font-size:11px;
    }
  }
   
   
  :root{
    /* dedicated palette for section 4 */
    --disc4-pink:#ff2f92;
    --disc4-teal:#14b8a6;
    --disc4-blue:#2563eb;
    --disc4-yellow:#facc15;
    --disc4-text:#0f172a;
  }

  .disc4-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--disc4-text);
    background:
      radial-gradient(circle at 0 0,#e0f2fe 0,#fef9c3 40%,transparent 70%),
      radial-gradient(circle at 100% 100%,#fce7f3 0,#e0f2fe 40%,transparent 70%),
      #f8fafc;
  }

  .disc4-inner{
    max-width:1160px;
    margin:0 auto;
  }

  .disc4-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .disc4-heading span{
    color:var(--disc4-pink);
  }

  .disc4-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--disc4-pink);
    margin-bottom:26px;
  }

  /* TABS */
  .disc4-tabs{
    max-width:980px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    justify-content:center;
    flex-wrap:wrap;
  }

  .disc4-tab{
    flex:1 1 0;
    max-width:250px;
    border-radius:999px;
    padding:10px 18px;
    border:1px solid rgba(148,163,184,.7);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.25);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    white-space:nowrap;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
  }

  .disc4-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#4ade80,#60a5fa);
    opacity:0;
    transition:opacity .18s ease;
  }

  .disc4-tab span.label{
    position:relative;
  }

  .disc4-tab span.icon{
    position:relative;
    width:24px;
    height:24px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .disc4-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#22c55e,#0ea5e9);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(34,197,94,.55);
    transform:translateY(-3px);
  }
  .disc4-tab.active::before{
    opacity:.25;
  }

  /* PANEL */
  .disc4-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#22c55e,#0ea5e9,#f97316);
    box-shadow:0 20px 60px rgba(15,23,42,.35);
  }

  .disc4-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
       align-items: center;
  }
  .disc4-panel.disc4-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .disc4-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .disc4-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .disc4-title span{
    color:var(--disc4-pink);
  }

  .disc4-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .disc4-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .disc4-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .disc4-bullets li .dot{
    font-size:16px;
    color:var(--disc4-pink);
  }

  /* DEMO CARD */
  .disc4-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#dbeafe,#fef3c7);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .disc4-demo.disc4-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .disc4-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .disc4-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .disc4-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.4);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .disc4-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.86);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .disc4-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  @media (max-width:900px){
    .disc4-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .disc4-section{
      padding:60px 16px 70px;
    }
    .disc4-tab{
      max-width:none;
      white-space:normal;
    }
    .disc4-demo-video{
      font-size:11px;
    }
  }
 
 
  :root{
    /* Dedicated palette for section 5 */
    --spy5-pink:#ff2f92;
    --spy5-purple:#7c3aed;
    --spy5-sky:#0ea5e9;
    --spy5-mint:#22c55e;
    --spy5-text:#020617;
  }

  .spy5-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--spy5-text);
    background:
      radial-gradient(circle at 0 100%,rgba(129,140,248,.24),transparent 60%),
      radial-gradient(circle at 100% 0,rgba(45,212,191,.25),transparent 60%),
      linear-gradient(135deg,#fef3f2,#eef2ff);
  }

  .spy5-inner{
    max-width:1160px;
    margin:0 auto;
  }

  .spy5-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .spy5-heading span{
    color:var(--spy5-pink);
  }

  .spy5-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--spy5-pink);
    margin-bottom:26px;
  }

  /* TABS */
  .spy5-tabs{
    max-width:1000px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:center;
  }

  .spy5-tab{
    flex:1 1 0;
    max-width:260px;
    border-radius:999px;
    padding:10px 18px;
    border:1px solid rgba(148,163,184,.7);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.25);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    white-space:nowrap;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
  }

  .spy5-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#22c55e,#0ea5e9);
    opacity:0;
    transition:opacity .18s ease;
  }

  .spy5-tab span.label{
    position:relative;
  }

  .spy5-tab span.icon{
    position:relative;
    width:24px;
    height:24px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .spy5-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#22c55e,#0ea5e9,#7c3aed);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(76,81,191,.55);
    transform:translateY(-3px);
  }
  .spy5-tab.active::before{ opacity:.25; }

  /* PANEL */
  .spy5-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#22c55e,#0ea5e9,#f97316);
    box-shadow:0 20px 60px rgba(15,23,42,.35);
  }

  .spy5-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .spy5-panel.spy5-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .spy5-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .spy5-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .spy5-title span{
    color:var(--spy5-pink);
  }

  .spy5-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .spy5-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .spy5-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .spy5-bullets li .dot{
    font-size:16px;
    color:var(--spy5-pink);
  }

  /* DEMO CARD */
  .spy5-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fef3c7);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .spy5-demo.spy5-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .spy5-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .spy5-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .spy5-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.4);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .spy5-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.86);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .spy5-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  @media (max-width:900px){
    .spy5-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }

  @media (max-width:640px){
    .spy5-section{
      padding:60px 16px 70px;
    }
    .spy5-tab{
      max-width:none;
      white-space:normal;
    }
    .spy5-demo-video{
      font-size:11px;
    }
  }
 
 
  :root{
    /* Dedicated palette for section 6 */
    --cge6-pink:#ff3b9a;
    --cge6-orange:#fb923c;
    --cge6-blue:#6366f1;
    --cge6-teal:#14b8a6;
    --cge6-text:#020617;
  }

  .cge6-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--cge6-text);
    background:
      radial-gradient(circle at 0 0,rgba(244,114,182,.25),transparent 55%),
      radial-gradient(circle at 100% 100%,rgba(56,189,248,.23),transparent 55%),
      linear-gradient(135deg,#fef9c3,#fef3f2);
  }

  .cge6-inner{
    max-width:1160px;
    margin:0 auto;
  }

  .cge6-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .cge6-heading span{
    color:var(--cge6-pink);
  }

  .cge6-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--cge6-pink);
    margin-bottom:26px;
  }

  /* TABS */
  .cge6-tabs{
    max-width:900px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:center;
  }

  .cge6-tab{
    flex:1 1 0;
    max-width:260px;
    border-radius:999px;
    padding:9px 18px;
    border:1px solid rgba(148,163,184,.75);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.26);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    white-space:nowrap;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
  }

  .cge6-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#f97316,#6366f1);
    opacity:0;
    transition:opacity .18s ease;
  }

  .cge6-tab span.label{
    position:relative;
  }

  .cge6-tab span.icon{
    position:relative;
    width:24px;
    height:24px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .cge6-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#fb923c,#f97316,#6366f1);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(248,113,113,.58);
    transform:translateY(-3px);
  }
  .cge6-tab.active::before{ opacity:.25; }

  /* PANEL */
  .cge6-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#fb923c,#6366f1,#14b8a6);
    box-shadow:0 20px 60px rgba(15,23,42,.36);
  }

  .cge6-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .cge6-panel.cge6-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .cge6-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .cge6-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .cge6-title span{
    color:var(--cge6-pink);
  }

  .cge6-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .cge6-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .cge6-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .cge6-bullets li .dot{
    font-size:16px;
    color:var(--cge6-pink);
  }

  /* DEMO CARD */
  .cge6-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fee2e2);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .cge6-demo.cge6-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .cge6-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .cge6-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .cge6-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.42);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .cge6-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.9);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .cge6-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  @media (max-width:900px){
    .cge6-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }

  @media (max-width:640px){
    .cge6-section{
      padding:60px 16px 70px;
    }
    .cge6-tab{
      max-width:none;
      white-space:normal;
    }
    .cge6-demo-video{
      font-size:11px;
    }
  }
 
 
  :root{
    --agd7-pink:#ec4899;
    --agd7-indigo:#4f46e5;
    --agd7-sky:#0ea5e9;
    --agd7-text:#020617;
  }

  .agd7-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--agd7-text);
    background:
      radial-gradient(circle at 15% 0,rgba(251,113,133,.3),transparent 55%),
      radial-gradient(circle at 100% 85%,rgba(56,189,248,.35),transparent 55%),
      linear-gradient(135deg,#eff6ff,#fdf2ff);
  }

  .agd7-inner{max-width:1160px;margin:0 auto;}

  .agd7-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .agd7-heading span{color:var(--agd7-pink);}

  .agd7-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--agd7-pink);
    margin-bottom:26px;
  }

  /* TABS */
  .agd7-tabs{
    max-width:640px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:center;
  }

  .agd7-tab{
    flex:1 1 0;
    min-width:190px;
    border-radius:999px;
    padding:9px 18px;
    border:1px solid rgba(148,163,184,.75);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.26);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    white-space:nowrap;
  }

  .agd7-tab span.label{position:relative;}
  .agd7-tab span.icon{
    position:relative;
    width:24px;height:24px;
    border-radius:999px;
    display:flex;align-items:center;justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .agd7-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#ec4899,#4f46e5);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(129,140,248,.6);
    transform:translateY(-3px);
  }

  /* PANEL */
  .agd7-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#ec4899,#4f46e5,#0ea5e9);
    box-shadow:0 20px 60px rgba(15,23,42,.36);
  }

  .agd7-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .agd7-panel.agd7-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .agd7-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .agd7-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .agd7-title span{color:var(--agd7-indigo);}

  .agd7-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .agd7-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .agd7-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .agd7-bullets li .dot{
    font-size:16px;
    color:var(--agd7-pink);
  }

  /* DEMO */
  .agd7-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fce7f3);
    box-shadow:0 16px 40px rgba(15,23,42,.26);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .agd7-demo.agd7-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .agd7-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .agd7-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .agd7-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.42);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .agd7-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.9);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .agd7-demo-play span.icon{
    width:18px;height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#bfdbfe);
    color:#4f46e5;
    font-size:10px;
  }

  @media (max-width:900px){
    .agd7-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .agd7-section{padding:60px 16px 70px;}
    .agd7-tab{white-space:normal;}
    .agd7-demo-video{font-size:11px;}
  }
 
  
  :root{
    --sa8-violet:#8b5cf6;
    --sa8-cyan:#06b6d4;
    --sa8-amber:#f59e0b;
    --sa8-text:#020617;
  }

  .sa8-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--sa8-text);
    background:
      radial-gradient(circle at 10% 0,rgba(251,191,36,.35),transparent 55%),
      radial-gradient(circle at 100% 85%,rgba(59,130,246,.4),transparent 55%),
      linear-gradient(135deg,#eef2ff,#ecfeff);
  }

  .sa8-inner{max-width:1160px;margin:0 auto;}

  .sa8-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .sa8-heading span{color:var(--sa8-amber);}

  .sa8-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--sa8-amber);
    margin-bottom:26px;
  }

  /* TABS */
  .sa8-tabs{
    max-width:800px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:center;
  }

  .sa8-tab{
    flex:1 1 0;
    min-width:200px;
    border-radius:999px;
    padding:9px 18px;
    border:1px solid rgba(148,163,184,.75);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.26);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    white-space:nowrap;
  }

  .sa8-tab span.label{position:relative;}
  .sa8-tab span.icon{
    position:relative;
    width:24px;height:24px;
    border-radius:999px;
    display:flex;align-items:center;justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .sa8-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#8b5cf6,#06b6d4);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(59,130,246,.55);
    transform:translateY(-3px);
  }

  /* PANEL */
  .sa8-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#8b5cf6,#06b6d4,#f59e0b);
    box-shadow:0 20px 60px rgba(15,23,42,.36);
  }

  .sa8-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .sa8-panel.sa8-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .sa8-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .sa8-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .sa8-title span{color:var(--sa8-violet);}

  .sa8-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .sa8-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .sa8-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .sa8-bullets li .dot{
    font-size:16px;
    color:var(--sa8-cyan);
  }

  /* DEMO */
  .sa8-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fef3c7);
    box-shadow:0 16px 40px rgba(15,23,42,.26);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .sa8-demo.sa8-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .sa8-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .sa8-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .sa8-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.42);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .sa8-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.9);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .sa8-demo-play span.icon{
    width:18px;height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#bfdbfe);
    color:#4f46e5;
    font-size:10px;
  }

  @media (max-width:900px){
    .sa8-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .sa8-section{padding:60px 16px 70px;}
    .sa8-tab{white-space:normal;}
    .sa8-demo-video{font-size:11px;}
  }
 
 
  :root{
    --tg9-pink:#ec4899;
    --tg9-indigo:#6366f1;
    --tg9-lime:#a3e635;
    --tg9-text:#020617;
  }

  .tg9-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--tg9-text);
    background:
      radial-gradient(circle at 8% 0,rgba(236,72,153,.35),transparent 55%),
      radial-gradient(circle at 100% 95%,rgba(129,140,248,.45),transparent 55%),
      linear-gradient(135deg,#fdf2ff,#eef2ff);
  }

  .tg9-inner{max-width:1160px;margin:0 auto;}

  .tg9-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .tg9-heading span{color:var(--tg9-pink);}

  .tg9-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--tg9-pink);
    margin-bottom:26px;
  }

  /* TABS */
  .tg9-tabs{
    max-width:860px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:center;
  }

  .tg9-tab{
    flex:1 1 0;
    min-width:240px;
    border-radius:999px;
    padding:10px 18px;
    border:1px solid rgba(148,163,184,.75);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.26);
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    text-align:left;
  }

  .tg9-tab .label{
    position:relative;
    line-height:1.3;
  }
  .tg9-tab .label small{
    display:block;
    font-size:11px;
    font-weight:600;
    opacity:.8;
  }
  .tg9-tab .icon{
    position:relative;
    width:26px;height:26px;
    border-radius:999px;
    display:flex;align-items:center;justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .tg9-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#ec4899,#6366f1);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(129,140,248,.55);
    transform:translateY(-3px);
  }

  /* PANEL */
  .tg9-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#ec4899,#6366f1,#a3e635);
    box-shadow:0 20px 60px rgba(15,23,42,.36);
  }

  .tg9-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .tg9-panel.tg9-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .tg9-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .tg9-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .tg9-title span{color:var(--tg9-indigo);}

  .tg9-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .tg9-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .tg9-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .tg9-bullets li .dot{
    font-size:16px;
    color:var(--tg9-pink);
  }

  /* DEMO */
  .tg9-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#f9a8d4,#e0f2fe);
    box-shadow:0 16px 40px rgba(15,23,42,.26);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .tg9-demo.tg9-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .tg9-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .tg9-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .tg9-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.42);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .tg9-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.9);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .tg9-demo-play span.icon{
    width:18px;height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#bfdbfe);
    color:#4f46e5;
    font-size:10px;
  }

  @media (max-width:900px){
    .tg9-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .tg9-section{padding:60px 16px 70px;}
    .tg9-demo-video{font-size:11px;}
  }
 
 
  :root{
    --t10-pink:#ec4899;
    --t10-purple:#a855f7;
    --t10-indigo:#6366f1;
    --t10-cyan:#22d3ee;
    --t10-text:#020617;
  }
.t10-section {
    padding: 60px 20px 60px;
    font-family: "Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color: var(--t10-text);
    background: radial-gradient(circle at 0 0, rgba(236, 72, 153, .45), transparent 55%), radial-gradient(circle at 100% 0, rgba(56, 189, 248, .35), transparent 55%), radial-gradient(circle at 50% 105%, rgba(129, 140, 248, .55), transparent 55%), linear-gradient(135deg, #0f172a40, #14ff053b);
    margin-bottom: 50px;
}

  .t10-inner{max-width:1180px;margin:0 auto;}

.t10-heading {
    text-align: center;
    font-size: clamp(30px,3.4vw,40px);
    font-weight: 800;
    letter-spacing: .03em;
    color: #424242;
    margin-bottom: 8px;
}
  .t10-heading span{color:var(--t10-pink);}

  .t10-tagline{
    text-align:center;
    font-size:clamp(18px,2.1vw,22px);
    font-weight:600;
    color:#000;
    margin-bottom:30px;
  }

  /* FEATURE GRID */
  .t10-grid{
    max-width:980px;
    margin:0 auto 28px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr)); /* 4 + 4 + 2 layout on desktop */
    gap:12px;
  }

  .t10-tab{
    position:relative;
    border-radius:16px;
    padding:10px 10px 10px 14px;
    background:linear-gradient(135deg,rgba(15,23,42,.9),rgba(30,64,175,.85));
    border:1px solid rgba(148,163,184,.6);
    color:#e5e7eb;
    font-size:13px;
    font-weight:600;
    display:flex;
    align-items:center;
    gap:8px;
    cursor:pointer;
    text-align:left;
    box-shadow:0 10px 22px rgba(15,23,42,.7);
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease,opacity .18s ease;
  }

  .t10-tab .num{
    width:22px;height:22px;
    border-radius:999px;
    display:flex;
    align-items:center;justify-content:center;
    background:radial-gradient(circle at 30% 20%,#f9fafb,#fee2e2);
    color:#020617;
    font-size:11px;
    font-weight:800;
    flex-shrink:0;
  }
  .t10-tab .label{
    line-height:1.3;
  }

  .t10-tab::before{
    content:"";
    position:absolute;
    inset:-40%;
    background:conic-gradient(from 180deg,var(--t10-pink),var(--t10-indigo),var(--t10-cyan),var(--t10-pink));
    opacity:0;
    transition:opacity .2s ease;
    z-index:-1;
  }

  .t10-tab.active{
    border-color:transparent;
    background:radial-gradient(circle at 0 0,rgba(251,113,133,.18),transparent 55%),
               radial-gradient(circle at 100% 100%,rgba(96,165,250,.18),transparent 55%),
               linear-gradient(135deg,rgba(236,72,153,.95),rgba(99,102,241,.92));
    box-shadow:0 18px 40px rgba(59,130,246,.65);
    transform:translateY(-2px);
  }
  .t10-tab.active::before{opacity:.5;}
  .t10-tab:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(15,23,42,.85);}

  /* PANEL WRAP */
  .t10-panel-shell{
    max-width:1040px;
    margin:0 auto;
    padding:1px;
    border-radius:26px;
    background:linear-gradient(135deg,var(--t10-pink),var(--t10-indigo),var(--t10-cyan));
    box-shadow:0 26px 70px rgba(15,23,42,.95);
  }

  .t10-panel{
    border-radius:24px;
    background:radial-gradient(circle at 0 0,#0f172a,#020617 50%,#020617 70%);
    padding:26px 26px 28px;
    display:grid;
    grid-template-columns:minmax(0,1.6fr) minmax(0,1.2fr);
    gap:26px;
    color:#e5e7eb;
    transition:opacity .1s ease,transform .1s ease;
  }
  .t10-panel.t10-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .t10-copy{}
  .t10-eyebrow{
    font-size:12px;
    letter-spacing:.18em;
    text-transform:uppercase;
    font-weight:700;
    color:#9ca3af;
    margin-bottom:6px;
  }
  .t10-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .t10-title span{color:#a5b4fc;}
  .t10-desc{
    font-size:15px;
    line-height:1.8;
    color:#d1d5db;
    margin-bottom:10px;
  }

  .t10-bullets{
    list-style:none;
    padding-left:0;
    margin:0;
    font-size:14px;
  }
  .t10-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .t10-bullets .dot{
    color:var(--t10-pink);
    font-size:18px;
    line-height:1;
  }

  /* DEMO CARD */
  .t10-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#f97316,#ec4899);
    box-shadow:0 16px 40px rgba(15,23,42,.9);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .t10-demo.t10-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .t10-demo-label{
    font-size:12px;
    letter-spacing:.18em;
    text-transform:uppercase;
    font-weight:700;
    color:#fee2e2;
  }
  .t10-demo-title{
    font-size:15px;
    font-weight:700;
    color:#f9fafb;
  }

  .t10-demo-video{
    position:relative;
    border-radius:14px;
    border:1px solid rgba(15,23,42,.9);
    background:#020617;
    padding:36px 16px 30px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:14px;
    text-align:center;
    color:#e5e7eb;
    font-size:11px;
    letter-spacing:.18em;
    text-transform:uppercase;
  }

  /* Decorative mini timeline */
  .t10-timeline{
    width:100%;
    max-width:260px;
    height:56px;
    border-radius:10px;
    background:radial-gradient(circle at 0 0,#0f172a,#020617);
    border:1px solid rgba(148,163,184,.3);
    padding:6px 10px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    position:relative;
    overflow:hidden;
  }
  .t10-timeline .lane{
    height:10px;
    border-radius:999px;
    background:linear-gradient(90deg,rgba(236,72,153,.9),rgba(56,189,248,.9));
  }
  .t10-timeline .lane-b{
    width:80%;
    opacity:.75;
  }
  .t10-timeline .lane-c{
    width:60%;
    opacity:.6;
  }
  .t10-timeline .lane-a{width:100%;}
  .t10-timeline .playhead{
    position:absolute;
    top:0;
    bottom:0;
    left:55%;
    width:2px;
    background:#e5e7eb;
    box-shadow:0 0 8px rgba(248,250,252,.8);
  }

  .t10-demo-play{
    position:absolute;
    left:12px;
    bottom:10px;
    padding:7px 11px;
    border-radius:999px;
    background:rgba(15,23,42,.9);
    border:1px solid rgba(148,163,184,.6);
    display:flex;
    align-items:center;
    gap:6px;
    font-size:10px;
    letter-spacing:.18em;
    text-transform:uppercase;
  }
  .t10-demo-play .play-icon{
    width:18px;height:18px;
    border-radius:999px;
    display:flex;
    align-items:center;justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fee2e2);
    color:#0f172a;
    font-size:10px;
  }

  @media (max-width:900px){
    .t10-panel{
      grid-template-columns:1fr;
      padding:22px 18px 24px;
    }
    .t10-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  }
  @media (max-width:640px){
    .t10-section{padding:70px 16px 80px;}
    .t10-grid{grid-template-columns:minmax(0,1fr);}
    .t10-demo-video{font-size:10px;}
  }
 
 
/* Base */
#tp-video-models, #tp-video-models *{
  font-family:"Space Grotesk",system-ui,sans-serif;
}

.tp-video-models{
  position:relative;
  padding:90px 20px;
  overflow:hidden;
}

/* TokPrimeAI background */
.tp-vm-bg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(700px 300px at 20% 0%, rgba(255,77,141,.12), transparent 60%),
    radial-gradient(700px 300px at 80% 0%, rgba(14,165,233,.12), transparent 60%),
    linear-gradient(#fdfdff, #f8f9ff);
  z-index:-1;
}

/* Intro */
.tp-vm-intro{text-align:center;max-width:960px;margin:0 auto 40px}
.tp-vm-pill{
  display:inline-block;
  padding:10px 22px;
  border-radius:999px;
  font-weight:900;
  font-size:13px;
  letter-spacing:.2em;
  background:#ffffff;
  border:2px solid rgba(99,102,241,.45);
  color:#4f46e5;
}
.tp-vm-title{font-size:40px;font-weight:900;margin:18px 0}
.tp-vm-title .pink{color:#ff4d8d}
.tp-vm-sub{color:#475569;font-size:17px}

/* Grid */
.tp-vm-grid{
  max-width:1160px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
}

/* Cards */
.tp-vm-card{
  border-radius:24px;
  padding:22px;
  border:1px solid rgba(148,163,184,.4);
  box-shadow:0 18px 46px rgba(15,23,42,.08);
  transition:.25s;
}
.tp-vm-card:hover{transform:translateY(-4px)}

/* Spacing fixes */
.tp-vm-top{
  display:flex;
  gap:8px;
  margin-bottom:10px;
  flex-wrap:wrap;
}
.tp-vm-name{
  font-weight:800;
  font-size:18px;
  margin-bottom:10px;
}

/* Backgrounds */
.model-fast{background:#f5f9ff}
.model-pro-t2v{background:#faf5ff}
.model-pro-i2v{background:#f3fcf7}
.model-pro-s2v{background:#fff8ec;border:2px solid rgba(251,146,60,.25)}

/* Headline highlight */
.tp-vm-headline{margin:12px 0 14px}
.tp-hl{
  display:inline-block;
  padding:6px 14px;
  border-radius:12px;
  font-weight:900;
  position:relative;
}
.tp-hl::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:12px;
  filter:blur(10px);
  opacity:.45;
  z-index:-1;
}

/* Highlight colors */
.model-fast .tp-hl{background:#eef4ff}
.model-fast .tp-hl::after{background:#c7dcff}
.model-pro-t2v .tp-hl{background:#f4ecff}
.model-pro-t2v .tp-hl::after{background:#d8c8ff}
.model-pro-i2v .tp-hl{background:#ecfff4}
.model-pro-i2v .tp-hl::after{background:#b7f0d6}
.model-pro-s2v .tp-hl{background:#fff3dc}
.model-pro-s2v .tp-hl::after{background:#ffd9a6}

/* Recommended glow */
.recommended{
  box-shadow:0 0 0 2px rgba(34,197,94,.35),
             0 0 24px rgba(34,197,94,.22);
}

/* Badges */
.tp-badge{
  padding:6px 14px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
}
.tp-badge.fast{background:#e0ecff;color:#1d4ed8}
.tp-badge.pro{background:#ede9fe;color:#6d28d9}
.tp-badge.coming{background:#ffedd5;color:#c2410c}

.tp-rec{
  background:#22c55e;
  color:#fff;
  font-weight:800;
  font-size:12px;
  padding:6px 14px;
  border-radius:999px;
}

/* Responsive */
@media(max-width:1100px){
  .tp-vm-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
  .tp-vm-grid{grid-template-columns:1fr}
}
 
 
  /* =========================================================
     TokPrimeAI Ultra Pro Max ï¿½ Section (scoped)
     Matches screenshot layout (centered, big title, bricks)
     Prefix: tpu3-
     ========================================================= */

  .tpu3-wrap{
    font-family:"Space Grotesk",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
    padding: 28px 18px;
    background: #ffffff;
  }

  .tpu3-card{
    max-width: 1080px;
    margin: 0 auto;
    border-radius: 22px;
    background:
      radial-gradient(900px 420px at 50% -25%, rgba(255,0,92,.10), rgba(255,255,255,0) 60%),
      linear-gradient(180deg, #ffffff 0%, #fff7fb 100%);
    border: 1px solid rgba(11,11,15,.10);
    box-shadow: 0 18px 60px rgba(11,11,15,.08);
    overflow: hidden;
    padding: 26px 22px;
    text-align:center;
  }

  /* Top stickers row */
  .tpu3-stickers{
    display:flex;
    flex-wrap:wrap;
    gap: 12px;
    align-items:center;
    justify-content:center;
    margin-bottom: 14px;
  }
  .tpu3-pill{
    display:inline-flex;
    align-items:center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 999px;
    font-weight: 900;
    font-size: 13.5px;
    letter-spacing: .25px;
    border: 1px solid rgba(11,11,15,.10);
    box-shadow: 0 14px 30px rgba(11,11,15,.08);
    background: #fff;
    white-space: nowrap;
  }
  .tpu3-dot{
    width: 10px;
    height: 10px;
    border-radius: 999px;
    flex: 0 0 auto;
    box-shadow: 0 0 0 4px rgba(0,0,0,.06);
    background: #111;
  }
  .tpu3-pill-green{
    background: linear-gradient(135deg, rgba(34,197,94,.18), rgba(16,185,129,.12));
    border-color: rgba(16,185,129,.30);
  }
  .tpu3-pill-green .tpu3-dot{
    background:#10b981;
    box-shadow: 0 0 0 4px rgba(16,185,129,.14);
  }

  .tpu3-pill-yellow{
    background: linear-gradient(135deg, rgba(250,204,21,.30), rgba(245,158,11,.16));
    border-color: rgba(245,158,11,.30);
  }
  .tpu3-pill-yellow .tpu3-dot{
    background:#f59e0b;
    box-shadow: 0 0 0 4px rgba(245,158,11,.14);
  }

  .tpu3-pill-pink{
    background: linear-gradient(135deg, rgba(255,0,92,.12), rgba(140,0,45,.08));
    border-color: rgba(255,0,92,.22);
  }
  .tpu3-pill-pink .tpu3-dot{
    background:#ff005c;
    box-shadow: 0 0 0 4px rgba(255,0,92,.12);
  }

  /* Big title + stars */
  .tpu3-title{
    margin: 8px 0 10px 0;
    font-size: clamp(28px, 3.5vw, 44px);
    line-height: 1.08;
    font-weight: 950;
    letter-spacing: -1px;
  }

  .tpu3-star{
    color:#f59e0b;
    text-shadow: 0 8px 18px rgba(245,158,11,.28);
    font-weight: 950;
  }

  .tpu3-grad{
    background: linear-gradient(90deg, #8c002d, #ff005c);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .tpu3-sub{
    margin: 0 auto 18px auto;
    max-width: 920px;
    font-size: 16px;
    line-height: 1.55;
    font-weight: 650;
    color: rgba(11,11,15,.76);
  }
  .tpu3-sub strong{
    color: rgba(11,11,15,.92);
    font-weight: 850;
  }

  /* Bricks list */
  .tpu3-list{
    max-width: 880px;
    margin: 0 auto;
    display:flex;
    flex-direction:column;
    gap: 12px;
    text-align:left;
  }

  .tpu3-brick{
    background: rgba(255,255,255,.94);
    border: 1px solid rgba(11,11,15,.10);
    border-radius: 18px;
    padding: 16px 16px;
    box-shadow: 0 12px 30px rgba(11,11,15,.07);
    transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
    position: relative;
    overflow:hidden;
  }
  .tpu3-brick::before{
    content:"";
    position:absolute; inset:0;
    background:
      radial-gradient(820px 260px at 10% 0%, rgba(255,0,92,.12), rgba(255,255,255,0) 60%),
      radial-gradient(820px 260px at 110% 110%, rgba(140,0,45,.10), rgba(255,255,255,0) 60%);
    opacity:0;
    transition: opacity 200ms ease;
  }
  .tpu3-brick:hover{
    transform: translateY(-3px) scale(1.008);
    border-color: rgba(255,0,92,.20);
    box-shadow: 0 18px 45px rgba(11,11,15,.10);
  }
  .tpu3-brick:hover::before{ opacity:1; }

  .tpu3-row{
    position:relative; z-index:2;
    display:flex;
    gap: 14px;
    align-items:flex-start;
  }

  .tpu3-ic{
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display:grid;
    place-items:center;
    flex: 0 0 auto;
    color: #fff;
    font-weight: 950;
    background: linear-gradient(135deg, #8c002d, #ff005c);
    box-shadow: 0 12px 26px rgba(255,0,92,.18);
  }

  .tpu3-txt{
    margin: 0;
    font-size: 16.5px;
    line-height: 1.5;
    font-weight: 750;
    color: rgba(11,11,15,.92);
  }
  .tpu3-txt strong{
    color:#0b0b0f;
    font-weight: 950;
  }

  .tpu3-small{
    display:block;
    margin-top: 6px;
    font-size: 13.5px;
    line-height: 1.35;
    font-weight: 650;
    color: rgba(11,11,15,.68);
  }

  /* Quick tip + bottom stickers */
  .tpu3-tip{
    max-width: 880px;
    margin: 14px auto 14px auto;
    padding: 12px 14px;
    border-radius: 14px;
    background: rgba(255,255,255,.88);
    border: 1px dashed rgba(11,11,15,.18);
    text-align:left;
    font-size: 14.5px;
    line-height: 1.5;
  }
  .tpu3-tip b{ font-weight: 900; }

  .tpu3-stickers-bottom{
    margin-top: 10px;
  }

  @media (max-width: 640px){
    .tpu3-card{ padding: 20px 14px; }
    .tpu3-ic{ width: 42px; height: 42px; }
    .tpu3-txt{ font-size: 16px; }
    .tpu3-pill{ font-size: 12.5px; padding: 10px 12px; }
  }
 

 
/* Space Grotesk only for this section */
#tp-trust,
#tp-trust *{
  font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

.tp-trust{
  padding: 80px 20px;
  background:
    radial-gradient(circle at 10% 10%, rgba(255,77,141,.14), transparent 55%),
    radial-gradient(circle at 90% 20%, rgba(34,197,94,.10), transparent 55%),
    radial-gradient(circle at 50% 100%, rgba(14,165,233,.10), transparent 60%);
}

.tp-trust-wrap{
  max-width: 1160px;
  margin: 0 auto;
}

.tp-trust-pill-wrap{
  display:flex;
  justify-content:center;
  margin-bottom: 16px;
}

.tp-trust-pill{
  padding: 12px 30px;
  border-radius: 999px;
  border: 2px solid rgba(64,115,255,.55);
  background: rgba(255,255,255,.55);
  backdrop-filter: blur(8px);
  font-weight: 900;
  letter-spacing: .26em;
  text-transform: uppercase;
  font-size: 14px;
  color: #3b6bff;
  box-shadow: 0 12px 28px rgba(59,107,255,.18);
}

/* Heavier headline + emphasis */
.tp-trust-title{
  text-align:center;
  font-size: clamp(30px, 3.2vw, 44px);
  font-weight: 950;
  letter-spacing: -0.02em;
  line-height: 1.08;
  margin: 0 0 12px;
  color: #0f172a;
  position: relative;
  display: inline-block;
  left: 50%;
  transform: translateX(-50%);
}

.tp-trust-title .pink{ color: #ff4d8d; }

.tp-trust-sub{
  text-align:center;
  max-width: 960px;
  margin: 0 auto 28px;
  font-size: 16px;
  line-height: 1.75;
  font-weight: 550;
  color: #334155;
}

.tp-trust-sub strong{
  font-weight: 900;
  color: #0f172a;
}

/* Shining headline ONLY on headline hover */
.tp-trust-title::after{
  content:"";
  position:absolute;
  top:-10%;
  left:-60%;
  width: 60%;
  height: 140%;
  transform: skewX(-18deg);
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.0),
    rgba(255,255,255,.65),
    rgba(255,255,255,.0),
    transparent
  );
  opacity: 0;
  pointer-events:none;
}

.tp-trust-title:hover{
  text-shadow: 0 10px 30px rgba(255,77,141,.12), 0 10px 30px rgba(14,165,233,.10);
}

.tp-trust-title:hover::after{
  opacity: 1;
  animation: tpShine 1.15s ease-in-out 1;
}

@keyframes tpShine{
  0%   { left:-60%; opacity:0; }
  10%  { opacity:1; }
  55%  { opacity:1; }
  100% { left:120%; opacity:0; }
}

/* Main card */
.tp-trust-card{
  border-radius: 26px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255,77,141,.9), rgba(14,165,233,.85), rgba(34,197,94,.85));
  box-shadow: 0 22px 70px rgba(15,23,42,.18);
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
}

.tp-trust-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 26px 80px rgba(15,23,42,.22);
  filter: saturate(1.05);
}

.tp-trust-card-inner{
  border-radius: 25px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  padding: 26px;
  display: grid;
  grid-template-columns: 1.6fr .9fr;
  gap: 22px;
}

.tp-trust-kicker{
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #64748b;
  margin-bottom: 10px;
}

.tp-trust-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.tp-trust-item{
  border-radius: 18px;
  border: 1px solid rgba(148,163,184,.45);
  background: linear-gradient(135deg, rgba(255,255,255,.85), rgba(248,250,252,.9));
  box-shadow: 0 12px 30px rgba(15,23,42,.08);
  padding: 14px 14px 12px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.tp-trust-item:hover{
  transform: translateY(-2px);
  border-color: rgba(255,77,141,.35);
  box-shadow: 0 16px 36px rgba(15,23,42,.10);
}

.tp-trust-item-top{
  display:flex;
  align-items:center;
  gap: 10px;
  margin-bottom: 6px;
}

.tp-ic{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: radial-gradient(circle at 30% 20%, #fff, #e5e7eb);
  box-shadow: 0 8px 16px rgba(15,23,42,.12);
  font-size: 16px;
}

.tp-trust-item h3{
  margin:0;
  font-size: 15px;
  font-weight: 950;
  color: #0f172a;
}

.tp-trust-item p{
  margin:0;
  font-size: 13.5px;
  line-height: 1.65;
  color:#475569;
}

/* Right column */
.tp-trust-right{
  display:flex;
  flex-direction: column;
  gap: 14px;
}

.tp-trust-badge{
  border-radius: 18px;
  border: 1px solid rgba(148,163,184,.45);
  background: linear-gradient(135deg, rgba(2,6,23,.92), rgba(15,23,42,.92));
  color: #e2e8f0;
  padding: 14px 14px 12px;
  box-shadow: 0 14px 40px rgba(2,6,23,.25);
}

.tp-trust-badge-top{
  display:flex;
  align-items:center;
  gap: 10px;
  margin-bottom: 8px;
}

.tp-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 18px rgba(34,197,94,.7);
}

.tp-trust-badge-title{
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 12px;
}

.tp-trust-badge-sub{
  font-size: 13.5px;
  color: rgba(226,232,240,.92);
}

.tp-trust-mini{
  border-radius: 18px;
  border: 1px solid rgba(148,163,184,.45);
  background: linear-gradient(135deg, rgba(255,255,255,.9), rgba(248,250,252,.92));
  padding: 14px 14px 12px;
  box-shadow: 0 12px 30px rgba(15,23,42,.08);
}

.tp-trust-mini-title{
  font-weight: 950;
  font-size: 15px;
  color: #0f172a;
  margin-bottom: 6px;
}

.tp-trust-mini-desc{
  margin: 0 0 10px;
  font-size: 13.5px;
  line-height: 1.65;
  color:#475569;
}

.tp-trust-bullets{
  list-style: none;
  padding:0;
  margin:0 0 10px;
  display:flex;
  flex-direction: column;
  gap: 8px;
}

.tp-trust-bullets li{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  font-size: 13.5px;
  color:#334155;
}

.tp-trust-bullets .chk{
  width: 18px;
  height: 18px;
  border-radius: 6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(34,197,94,.15);
  color: #16a34a;
  font-weight: 950;
  flex: 0 0 18px;
  margin-top: 1px;
}

.tp-trust-footer{
  font-size: 12.5px;
  color:#0f172a;
  font-weight: 900;
  padding-top: 10px;
  border-top: 1px solid rgba(148,163,184,.35);
}

/* Responsive */
@media (max-width: 980px){
  .tp-trust-card-inner{ grid-template-columns: 1fr; }
  .tp-trust-grid{ grid-template-columns: 1fr; }
  .tp-trust-title{
    left:auto;
    transform:none;
    display:block;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .tp-trust-card,
  .tp-trust-item,
  .tp-trust-title::after{
    animation: none !important;
    transition: none !important;
  }
}
    
/* Global font override: use Nunito everywhere */
body,
body * {
  font-family: "Nunito", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}
                           
 
  span.softawe-three {
    margin: 0 auto;
    display: table;
    font-size: 35px;
    border: 2px solid #13bc00;
    padding: 5px 20px;
    margin-bottom: 14px;
    border-radius: 10px;
    color: #13bc00;
}
span.softawe-three-head {
    box-shadow: 0 0 10px 1px #ddd;
    font-size: 34px;
    padding: 11px 40px;
    display: inline-block;
    margin-bottom: 24px;
    margin-top: 20px;
    font-weight: 600;
    color: #008eb9;
}
  .secret-hack-section {
      background: linear-gradient(180deg, #ffffff 0%, #f8f9ff 100%);
      padding: 40px 20px 10px;
      position: relative;
      overflow: hidden;
    }

    .secret-hack-section::before {
      content: '';
      position: absolute;
      top: -50%;
      left: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle, rgba(255, 31, 140, 0.05) 0%, transparent 70%);
      animation: rotateBg 20s linear infinite;
    }
    .tp-guarantee-text p {
    color: #fff;
}

    @keyframes rotateBg {
      0% {
        transform: rotate(0deg);
      }
      100% {
        transform: rotate(360deg);
      }
    }

    .secret-hack-container {
      max-width: 1200px;
      margin: 0 auto;
      position: relative;
      z-index: 1;
    }

    .secret-hack-revealed {
      text-align: center;
      margin-bottom: 32px;
    }

    .secret-hack-title {
    font-size: 33px;
    font-weight: 800;
    color: var(--text-main);
    margin-bottom: 12px;
    line-height: 1.2;
}

    .secret-hack-title .underline {
      text-decoration: underline;
      text-decoration-color: var(--pink-main);
      text-decoration-thickness: 3px;
      text-underline-offset: 8px;
    }

    .secret-hack-subtitle {
      font-size: 25px;
      font-weight: 600;
      color: var(--text-main);
      line-height: 1.3;
    }

    .secret-hack-subtitle .underline {
      text-decoration: underline;
      text-decoration-color: var(--orange-main);
      text-decoration-thickness: 3px;
      text-underline-offset: 8px;
    }

.secret-hack-questions {
    background: linear-gradient(135deg, rgba(255, 31, 140, 0.1) 0%, rgba(255, 138, 60, 0.1) 100%);
    border-radius: 20px;
    padding: 16px 30px;
    margin: 16px 0;
    border: 2px solid rgba(255, 31, 140, 0.2);
}

.secret-hack-question {
    font-size: 34px;
    font-weight: 700;
    color: var(--pink-main);
    text-align: center;
    line-height: 1.4;
    margin: 0;
}
    .secret-hack-question .underline {
      text-decoration: underline;
      text-decoration-color: var(--pink-main);
      text-decoration-thickness: 3px;
      text-underline-offset: 8px;
    }

    .secret-hack-explanation {
      margin-top: 21px;
      text-align: center;
    }

.explanation-text-simple {
    font-size: 24px;
    font-weight: 600;
    color: var(--text-main);
    line-height: 1.4;
    max-width: 100%;
    margin: 0 auto;
    background: linear-gradient(135deg, rgb(31 154 255 / 10%) 0%, rgb(17 240 69 / 10%) 100%);
    border-radius: 20px;
    padding: 16px 30px;
    margin: 14px 0;
    border: 2px solid rgba(255, 31, 140, 0.2);
}

    .explanation-text-simple .bold {
      font-weight: 800;
      color: var(--pink-main);
    }

    .explanation-text-simple .underline {
      text-decoration: underline;
      text-decoration-color: var(--orange-main);
      text-decoration-thickness: 2px;
      text-underline-offset: 4px;
    }

    .explanation-text-simple .highlight-list {
      color: var(--pink-main);
      font-weight: 700;
    }
    .viral-templates-section {
      background: linear-gradient(180deg, #f8f9ff 0%, #ffffff 100%);
      padding: 10px 20px 50px;
      position: relative;
      overflow: hidden;
    }

    .viral-templates-section::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: 
        radial-gradient(circle at 20% 30%, rgba(255, 31, 140, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(255, 138, 60, 0.08) 0%, transparent 50%);
      pointer-events: none;
    }

    .viral-templates-container {
      max-width: 1200px;
      margin: 0 auto;
      position: relative;
      z-index: 1;
    }

    .viral-templates-header {
      text-align: center;
      margin-bottom: 30px;
    }
    .video-boxes {
    display: flex;
    flex-wrap: wrap;
    row-gap: 30px;
    column-gap: 20px;
}
.video-box-cot {
    width: 32%;
    float: left;
}
.video-box-cot span {
    color: #fff;
    background: #000;
    padding: 7px 20px;
    display: inline-block;
    border-radius: 10px;
}
.video-box-cot video {
    width: 100%;
    border-radius: 12px;
    margin-top: 12px;
    height: 250px;
    object-fit: cover;
}
  .viral-templates-intro {
    font-size: 27px;
    font-weight: 800;
    color: var(--text-main);
    line-height: 1.3;
    margin-bottom: 10px;
}
.viral-trend-intro-content video {
    height: 620px;
    border-radius: 20px;
}

    .viral-templates-intro .highlight {
      background: linear-gradient(135deg, var(--pink-main) 0%, var(--orange-main) 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
    }

    .viral-steps-container {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      flex-wrap: nowrap;
      margin-bottom: 30px;
    }

    .viral-step {
      display: flex;
      align-items: center;
      gap: 6px;
      position: relative;
      white-space: nowrap;
    }

    .viral-step-icon-wrapper {
      position: relative;
      display: inline-block;
    }

    .viral-step-icon {
      font-size: 40px;
      filter: 
        drop-shadow(0 4px 12px rgba(0, 0, 0, 0.15))
        drop-shadow(0 0 15px rgba(255, 31, 140, 0.3));
      transform: perspective(400px) rotateY(-3deg);
      animation: float3d 3s ease-in-out infinite;
      transition: all 0.3s ease;
      display: inline-block;
      line-height: 1;
    }

    .viral-step:nth-child(1) .viral-step-icon,
    .viral-step:nth-child(3) .viral-step-icon,
    .viral-step:nth-child(5) .viral-step-icon {
      animation-delay: 0s;
    }

    .viral-step:nth-child(2) .viral-step-icon,
    .viral-step:nth-child(4) .viral-step-icon {
      animation-delay: 0.5s;
    }

    @keyframes float3d {
      0%, 100% {
        transform: perspective(400px) rotateY(-3deg) translateY(0);
      }
      50% {
        transform: perspective(400px) rotateY(3deg) translateY(-5px);
      }
    }

    .viral-step:hover .viral-step-icon {
      transform: perspective(400px) rotateY(0deg) scale(1.1);
      filter: 
        drop-shadow(0 6px 20px rgba(255, 31, 140, 0.4))
        drop-shadow(0 0 20px rgba(255, 31, 140, 0.4));
    }

    .viral-step-number {
      font-size: 16px;
      font-weight: 700;
      color: var(--pink-main);
      letter-spacing: 0.3px;
      white-space: nowrap;
    }

    .viral-step-title {
      font-size: 22px;
      font-weight: 800;
      color: var(--text-main);
      line-height: 1.2;
      white-space: nowrap;
    }

    .viral-step-arrow {
      font-size: 28px;
      color: var(--orange-main);
      font-weight: 900;
      margin: 0 4px;
      display: inline-block;
      animation: pulseArrow 2s ease-in-out infinite;
      line-height: 1;
    }

    @keyframes pulseArrow {
      0%, 100% {
        transform: translateX(0);
        opacity: 1;
      }
      50% {
        transform: translateX(5px);
        opacity: 0.7;
      }
    }

    .viral-characters-info {
    background: linear-gradient(135deg, rgba(255, 31, 140, 0.1) 0%, rgba(255, 138, 60, 0.1) 100%);
    border-radius: 20px;
    padding: 19px;
    margin: 0 0 15px;
    text-align: center;
    border: 2px solid rgba(255, 31, 140, 0.2);
}

    .viral-characters-text {
      font-size: 24px;
      font-weight: 600;
      color: var(--text-main);
      line-height: 1.6;
      margin-bottom: 0px;
    }

    .viral-characters-text .character-types {
      color: var(--pink-main);
      font-weight: 800;
      text-decoration: underline;
      text-decoration-color: var(--orange-main);
      text-decoration-thickness: 2px;
      text-underline-offset: 4px;
    }

    .viral-zero-requirements {
      font-size: 26px;
      font-weight: 700;
      color: var(--orange-main);
      text-align: center;
      padding: 12px;
      background: linear-gradient(135deg, rgba(255, 138, 60, 0.1) 0%, rgba(255, 31, 140, 0.1) 100%);
      border-radius: 15px;
      border: 2px dashed rgba(255, 138, 60, 0.4);
    }

    .viral-zero-requirements .zero-highlight {
      color: var(--pink-main);
      font-weight: 900;
    }

    /* Responsive */
    @media (max-width: 768px) {
      body {
        padding-top: 60px;
      }

      .warning-text {
        font-size: 14px;
      }

      .warning-icon-3d {
        font-size: 24px;
      }

      .secret-hack-title {
        font-size: 28px;
      }

      .secret-hack-subtitle {
        font-size: 20px;
      }

      .secret-hack-question {
        font-size: 22px;
      }

      .explanation-text-simple {
        font-size: 18px;
        line-height: 1.6;
      }

      .secret-hack-questions {
        padding: 30px 20px;
      }

      .viral-templates-section {
        padding: 50px 20px;
      }

      .viral-templates-intro {
        font-size: 26px;
      }

      .viral-steps-container {
        flex-direction: column;
        gap: 12px;
        align-items: flex-start;
        flex-wrap: wrap;
      }

      .viral-step {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
      }

      .viral-step-arrow {
        transform: rotate(90deg);
        margin: 10px 0;
        align-self: center;
      }

      .viral-step-title {
        font-size: 20px;
        white-space: normal;
      }

      .viral-step-icon {
        font-size: 40px;
      }

      .viral-step-number {
        font-size: 14px;
      }

      .viral-characters-info {
        padding: 30px 20px;
      }

      .viral-characters-text {
        font-size: 18px;
      }

      .viral-zero-requirements {
        font-size: 20px;
      }
    }

    @media (max-width: 992px) and (min-width: 769px) {
      .viral-step-title {
        font-size: 20px;
        white-space: normal;
      }
      
      .viral-steps-container {
        gap: 10px;
        flex-wrap: wrap;
      }
      
      .viral-step {
        gap: 5px;
      }
      
      .viral-step-icon {
        font-size: 36px;
      }
    }

    @media (min-width: 993px) {
      .viral-steps-container {
        flex-wrap: nowrap;
      }
    }
  /* subtle float for right panel */
  .video-shell-right {
    position: relative;
    animation: floatRight 7s ease-in-out infinite;
    will-change: transform;
  }

  @keyframes floatRight {
    0%, 100% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(-6px);
    }
  }

  /* base animation + layout enhancements for contact buttons */
  .contact-box {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  .contact-item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 22px;
    border-radius: 18px;
    text-decoration: none;
    color: #ffffff;
    overflow: hidden;
    cursor: pointer;
    transition:
      transform 0.25s ease,
      box-shadow 0.25s ease,
      opacity 0.25s ease,
      background 0.35s ease;
  }

  /* glowing gradient border / sheen */
  .contact-item::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: radial-gradient(circle at 0% 0%, rgba(255,255,255,0.45), transparent 60%);
    opacity: 0;
    mix-blend-mode: screen;
    transition: opacity 0.35s ease, transform 0.35s ease;
    pointer-events: none;
  }

  .contact-item:hover::before {
    opacity: 1;
    transform: translate3d(12px, -8px, 0);
  }

  .contact-icon {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.18);
    color: #ffffff;
    flex-shrink: 0;
    transition:
      background 0.3s ease,
      color 0.3s ease,
      transform 0.25s ease;
  }

  .contact-icon svg {
    width: 18px;
    height: 18px;
    display: block;
    transition: transform 0.25s ease;
  }

  .contact-text {
    font-weight: 600;
    letter-spacing: 0.02em;
    transition: color 0.3s ease, transform 0.25s ease;
  }

  /* shared hover effects */
  .contact-item:hover {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 15px 35px rgba(15, 23, 42, 0.32);
    opacity: 1;
  }

  .contact-item:hover .contact-icon {
    background: rgba(255, 255, 255, 0.25);
    transform: scale(1.08);
  }

  .contact-item:hover .contact-icon svg {
    transform: scale(1.12);
  }

  .contact-item:hover .contact-text {
    transform: translateX(2px);
  }

  /* INDIVIDUAL BUTTON COLORS & GRADIENT HOVERS
     (normal state kept close to your original colors) */

  .contact-teams {
    background: linear-gradient(120deg, #7c3aed, #a855f7);
  }
  .contact-teams:hover {
    background: linear-gradient(135deg, #6d28d9, #c084fc);
    box-shadow: 0 0 22px rgba(124, 58, 237, 0.7);
  }

  .contact-facebook {
    background: #1877f2;
  }
  .contact-facebook:hover {
    background: linear-gradient(135deg, #1559c4, #2d88ff);
    box-shadow: 0 0 22px rgba(24, 119, 242, 0.7);
  }

  .contact-whatsapp {
    background: #25d366;
  }
  .contact-whatsapp:hover {
    background: linear-gradient(135deg, #1ebe5d, #3cf27e);
    box-shadow: 0 0 22px rgba(37, 211, 102, 0.7);
  }

  .contact-email {
    background: linear-gradient(120deg, #ff4f9a, #ff6ac1);
  }
  .contact-email:hover {
    background: linear-gradient(135deg, #f43f87, #ff85cf);
    box-shadow: 0 0 22px rgba(255, 111, 167, 0.7);
  }

  /* Optional: make icons shift color slightly on hover */
  .contact-teams:hover .contact-icon,
  .contact-facebook:hover .contact-icon,
  .contact-whatsapp:hover .contact-icon,
  .contact-email:hover .contact-icon {
    color: #ffffff;
  }

  @media (max-width: 767px) {
    .video-shell-right {
      animation: none; /* disable float on very small screens if you want */
    }
  }
 
 
   .viral-trend-hero-section {
      position: relative;
      max-width: 1400px;
      margin: 60px auto 80px;
      padding: 60px 30px;
      background: linear-gradient(135deg, 
        #ffffff 0%, 
        #fef3f8 15%, 
        #f0f9ff 30%, 
        #f5f3ff 50%, 
        #fff7ed 70%, 
        #ffffff 100%);
      border-radius: 24px;
      box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(255, 31, 140, 0.1);
      overflow: hidden;
    }

    .viral-trend-hero-section::before {
      content: '';
      position: absolute;
      top: -50%;
      left: -50%;
      width: 200%;
      height: 200%;
      background: 
        radial-gradient(circle at 20% 30%, rgba(255, 31, 140, 0.12) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(37, 99, 235, 0.12) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(123, 97, 255, 0.1) 0%, transparent 60%);
      animation: rotateBg 25s linear infinite;
      pointer-events: none;
      z-index: 0;
    }

    .viral-trend-container {
      position: relative;
      z-index: 1;
    }

    .viral-trend-header {
      text-align: center;
      margin-bottom: 50px;
    }

    .viral-trend-main-title {
      font-size: 42px;
      font-weight: 800;
      color: var(--text-main);
      line-height: 1.3;
      margin-bottom: 24px;
      letter-spacing: -0.02em;
    }

    .viral-trend-main-title .gradient-text {
      background: linear-gradient(135deg, #ff1f8c 0%, #7b61ff 50%, #2563eb 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      font-weight: 900;
    }

    .viral-trend-main-title .highlight-big {
      color: var(--pink-main);
      font-weight: 900;
      text-shadow: 0 2px 10px rgba(255, 31, 140, 0.3);
    }

    .viral-trend-subtitle {
      font-size: 24px;
      font-weight: 600;
      color: #4b5563;
      line-height: 1.5;
    }

    .viral-trend-intro-box {
      background: linear-gradient(135deg, rgba(255, 31, 140, 0.15) 0%, rgba(123, 97, 255, 0.15) 100%);
      border-radius: 20px;
      padding: 40px;
      margin: 40px 0 60px;
      border: 2px solid rgba(255, 31, 140, 0.3);
      box-shadow: 0 8px 30px rgba(255, 31, 140, 0.2);
      text-align: center;
      position: relative;
      overflow: hidden;
    }

    .viral-trend-intro-box::before {
      content: '';
      position: absolute;
      top: -50%;
      right: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle, rgba(255, 255, 255, 0.3) 0%, transparent 70%);
      animation: pulseGlow 3s ease-in-out infinite;
    }

    @keyframes pulseGlow {
      0%, 100% { opacity: 0.5; transform: scale(1); }
      50% { opacity: 0.8; transform: scale(1.1); }
    }

    .viral-trend-intro-content {
      position: relative;
      z-index: 1;
    }

    .viral-trend-intro-text {
      font-size: 22px;
      font-weight: 600;
      color: var(--text-main);
      margin-bottom: 16px;
      line-height: 1.5;
    }

    .viral-trend-intro-text-large {
      font-size: 28px;
      font-weight: 700;
      color: var(--text-main);
      line-height: 1.4;
    }

    .viral-trend-intro-text-large .highlight-number {
      color: var(--pink-main);
      font-weight: 900;
      font-size: 32px;
      text-shadow: 0 2px 8px rgba(255, 31, 140, 0.4);
    }

    .viral-trend-intro-text-large .highlight-viral {
      color: var(--purple-main);
      font-weight: 800;
      text-decoration: underline;
      text-decoration-color: var(--purple-main);
      text-decoration-thickness: 3px;
      text-underline-offset: 6px;
    }
.viral-categories-grid {
    display: flex;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    gap: 30px;
    margin-top: 50px;
    flex-direction: column;
}

    .viral-category-card {
      background: #ffffff;
      border-radius: 20px;
      padding: 32px;
      box-shadow: 0 6px 30px rgba(0, 0, 0, 0.08);
      border: 2px solid rgba(0, 0, 0, 0.05);
      transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      position: relative;
      overflow: hidden;
    }

    .viral-category-card::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 5px;
      background: linear-gradient(90deg, var(--pink-main), var(--purple-main), var(--blue-main));
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.4s ease;
    }

    .viral-category-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 12px 50px rgba(0, 0, 0, 0.15);
      border-color: rgba(255, 31, 140, 0.3);
    }

    .viral-category-card:hover::before {
      transform: scaleX(1);
    }

    .category-header {
      display: flex;
      align-items: flex-start;
      gap: 16px;
      margin-bottom: 24px;
    }

    .category-icon {
      font-size: 48px;
      line-height: 1;
      filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.1));
      animation: bounceIcon 2s ease-in-out infinite;
    }

    @keyframes bounceIcon {
      0%, 100% { transform: translateY(0); }
      50% { transform: translateY(-8px); }
    }

    .category-title {
      font-size: 22px;
      font-weight: 700;
      color: var(--text-main);
      line-height: 1.4;
      flex: 1;
      margin: 0;
    }

    .category-baby .category-title { color: #ff1f8c; }
    .category-dog .category-title { color: #2563eb; }
    .category-cat .category-title { color: #ff8a3c; }
    .category-monkey .category-title { color: #10b981; }
    .category-gorilla .category-title { color: #7b61ff; }
    .category-historical .category-title { color: #ef4444; }
    .category-celebrity .category-title { color: #a855f7; }

    .category-videos {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .video-link {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 16px 20px;
      background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
      border-radius: 12px;
      border: 1px solid rgba(0, 0, 0, 0.08);
      text-decoration: none;
      transition: all 0.3s ease;
      position: relative;
      overflow: hidden;
    }

    .video-link::before {
      content: '';
      position: absolute;
      left: 0;
      top: 0;
      bottom: 0;
      width: 4px;
      background: linear-gradient(180deg, var(--pink-main), var(--purple-main));
      transform: scaleY(0);
      transform-origin: top;
      transition: transform 0.3s ease;
    }

    .video-link:hover {
      background: linear-gradient(135deg, rgba(255, 31, 140, 0.08) 0%, rgba(123, 97, 255, 0.08) 100%);
      border-color: rgba(255, 31, 140, 0.3);
      transform: translateX(8px);
      box-shadow: 0 4px 15px rgba(255, 31, 140, 0.2);
    }

    .video-link:hover::before {
      transform: scaleY(1);
    }

    .video-stats {
      font-size: 18px;
      font-weight: 700;
      color: var(--pink-main);
      letter-spacing: -0.01em;
    }

    .video-time {
      font-size: 14px;
      font-weight: 500;
      color: #6b7280;
      background: rgba(0, 0, 0, 0.04);
      padding: 6px 12px;
      border-radius: 8px;
    }

    .video-link:hover .video-time {
      background: rgba(255, 31, 140, 0.15);
      color: var(--pink-main);
    }

    @media (max-width: 1200px) {
      .viral-categories-grid {
        grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
        gap: 25px;
      }
    }

    @media (max-width: 768px) {
      .viral-trend-hero-section {
        margin: 40px auto 50px;
        padding: 40px 20px;
        border-radius: 20px;
      }

      .viral-trend-main-title {
        font-size: 28px;
        margin-bottom: 20px;
      }

      .viral-trend-subtitle {
        font-size: 20px;
      }

      .viral-trend-intro-box {
        padding: 30px 20px;
        margin: 30px 0 40px;
      }

      .viral-trend-intro-text {
        font-size: 18px;
      }

      .viral-trend-intro-text-large {
        font-size: 22px;
      }

      .viral-trend-intro-text-large .highlight-number {
        font-size: 26px;
      }

      .viral-categories-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        margin-top: 40px;
      }

      .viral-category-card {
        padding: 24px;
      }

      .category-icon {
        font-size: 40px;
      }

      .category-title {
        font-size: 20px;
      }

      .video-link {
        padding: 14px 16px;
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
      }

      .video-stats {
        font-size: 16px;
      }

      .video-time {
        font-size: 13px;
      }
    }

   
     
       .viral-science-section {
    position: relative;
    max-width: 1200px;
    margin: 48px auto 50px;
    padding: 40px 25px;
    background: linear-gradient(135deg, 
        #0f0c29 0%, 
        #1a1a3e 25%, 
        #2d1b4e 50%, 
        #1a1a3e 75%, 
        #0f0c29 100%);
    border-radius: 30px;
    box-shadow: 0 20px 60px rgba(255, 31, 140, 0.3),
        0 0 0 1px rgba(255, 31, 140, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    overflow: hidden;
    z-index: 1;
}

    .viral-science-section::before {
      content: '';
      position: absolute;
      top: -50%;
      left: -50%;
      width: 200%;
      height: 200%;
      background: 
        radial-gradient(circle at 20% 30%, rgba(255, 31, 140, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(123, 97, 255, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(37, 99, 235, 0.1) 0%, transparent 60%);
      animation: pulseGlowSlow 8s ease-in-out infinite;
      pointer-events: none;
      z-index: 0;
    }

    .viral-science-section::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: 
        linear-gradient(180deg, transparent 0%, rgba(255, 31, 140, 0.05) 50%, transparent 100%),
        repeating-linear-gradient(
          0deg,
          transparent,
          transparent 2px,
          rgba(255, 31, 140, 0.03) 2px,
          rgba(255, 31, 140, 0.03) 4px
        );
      pointer-events: none;
      z-index: 1;
    }

    @keyframes pulseGlowSlow {
      0%, 100% { opacity: 0.5; transform: scale(1) rotate(0deg); }
      50% { opacity: 0.8; transform: scale(1.1) rotate(5deg); }
    }

    .viral-science-content {
      position: relative;
      z-index: 2;
      text-align: center;
      max-width: 950px;
      margin: 0 auto;
    }

    .viral-science-header {
      position: relative;
      margin-bottom: 40px;
    }

    .viral-icon-3d {
      font-size: 80px;
      display: inline-block;
      filter: 
        drop-shadow(0 15px 35px rgba(255, 31, 140, 0.4))
        drop-shadow(0 5px 15px rgba(255, 31, 140, 0.3));
      transform-style: preserve-3d;
      animation: float3D 4s ease-in-out infinite;
      margin-bottom: 0px;
    }

    @keyframes float3D {
      0%, 100% { transform: translateY(0) rotateY(0deg) scale(1); }
      50% { transform: translateY(-10px) rotateY(10deg) scale(1.05); }
    }

    .viral-science-title {
      font-size: 56px;
      font-weight: 900;
      color: #ffffff;
      line-height: 1.2;
      margin-bottom: 16px;
      letter-spacing: -0.03em;
      text-shadow: 
        0 0 30px rgba(255, 31, 140, 0.5),
        0 4px 20px rgba(0, 0, 0, 0.5);
    }

    .viral-science-subtitle {
      font-size: 32px;
      font-weight: 700;
      color: var(--pink-main);
      line-height: 1.3;
      margin-bottom: 0;
      letter-spacing: -0.02em;
      text-shadow: 
        0 0 20px rgba(255, 31, 140, 0.6),
        0 2px 10px rgba(255, 31, 140, 0.4);
    }

    .viral-science-body {
      text-align: left;
      margin-top: 35px;
    }

    .viral-science-paragraph {
      font-size: 22px;
      font-weight: 400;
      color: #e5e7eb;
      line-height: 1.8;
      margin-bottom: 22px;
      letter-spacing: 0.01em;
    }

    .inline-icon-3d {
      font-size: 28px;
      display: inline-block;
      filter: 
        drop-shadow(0 5px 15px rgba(255, 31, 140, 0.4))
        drop-shadow(0 2px 8px rgba(255, 31, 140, 0.3));
      transform-style: preserve-3d;
      animation: pulseIcon 2s ease-in-out infinite;
      margin-right: 10px;
      vertical-align: middle;
    }

    @keyframes pulseIcon {
      0%, 100% { transform: scale(1) rotateZ(0deg); }
      50% { transform: scale(1.1) rotateZ(5deg); }
    }

    .viral-science-paragraph strong {
      font-weight: 700;
      color: #ffffff;
    }

    .viral-science-paragraph .highlight-pink {
      color: var(--pink-main);
      font-weight: 700;
      text-shadow: 0 0 15px rgba(255, 31, 140, 0.6);
    }

    .viral-science-paragraph .underline-text {
      text-decoration: underline;
      text-decoration-color: var(--pink-main);
      text-decoration-thickness: 2px;
      text-underline-offset: 4px;
    }

    .emotional-circuits {
      background: linear-gradient(135deg, 
        rgba(255, 31, 140, 0.15) 0%, 
        rgba(123, 97, 255, 0.15) 100%);
      border: 2px solid rgba(255, 31, 140, 0.3);
      border-radius: 20px;
      padding: 32px 45px;
      margin: 30px 0;
      box-shadow: 
        0 10px 30px rgba(255, 31, 140, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
      position: relative;
      overflow: hidden;
    }

    .emotional-circuits::before {
      content: '';
      position: absolute;
      top: -50%;
      right: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
      animation: pulseGlow 3s ease-in-out infinite;
    }

    .circuit-item {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 15px;
      margin-bottom: 20px;
      font-size: 24px;
      position: relative;
      z-index: 1;
    }

    .circuit-item:last-of-type {
      margin-bottom: 0;
    }

    .circuit-icon-3d {
      font-size: 36px;
      display: inline-block;
      filter: 
        drop-shadow(0 8px 20px rgba(255, 31, 140, 0.5))
        drop-shadow(0 3px 10px rgba(255, 31, 140, 0.4));
      transform-style: preserve-3d;
      animation: bounce3D 2.5s ease-in-out infinite;
      flex-shrink: 0;
    }

    @keyframes bounce3D {
      0%, 100% { transform: translateY(0) rotateZ(0deg) scale(1); }
      50% { transform: translateY(-8px) rotateZ(5deg) scale(1.1); }
    }

    .circuit-trigger {
      color: #ffffff;
      font-weight: 600;
    }

    .circuit-trigger-humor {
      text-decoration: underline;
      text-decoration-color: var(--pink-main);
      text-decoration-style: wavy;
      text-underline-offset: 4px;
    }

    .circuit-arrow {
      color: var(--pink-main);
      font-weight: 700;
      font-size: 28px;
      text-shadow: 0 0 15px rgba(255, 31, 140, 0.8);
    }

    .circuit-result {
      color: var(--pink-main);
      font-weight: 700;
      text-shadow: 0 0 15px rgba(255, 31, 140, 0.6);
    }

    .circuit-conclusion {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(255, 31, 140, 0.3);
    text-align: center;
    font-size: 22px;
    font-weight: 500;
    color: #e5e7eb;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
}
    .conclusion-icon-3d {
      font-size: 32px;
      display: inline-block;
      filter: 
        drop-shadow(0 8px 20px rgba(255, 107, 53, 0.6))
        drop-shadow(0 3px 10px rgba(255, 31, 140, 0.4));
      transform-style: preserve-3d;
      animation: rotate3D 3s linear infinite;
    }

    @keyframes rotate3D {
      0% { transform: rotateZ(0deg) scale(1); }
      50% { transform: rotateZ(180deg) scale(1.15); }
      100% { transform: rotateZ(360deg) scale(1); }
    }

    .viral-science-final {
      margin-top: 35px;
      padding-top: 32px;
      border-top: 2px solid rgba(255, 31, 140, 0.3);
      font-size: 24px;
      line-height: 1.9;
    }

    .final-icons-group {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      margin-right: 12px;
      vertical-align: middle;
    }

    .final-icon-3d {
      font-size: 40px;
      display: inline-block;
      filter: 
        drop-shadow(0 10px 25px rgba(255, 31, 140, 0.5))
        drop-shadow(0 4px 12px rgba(123, 97, 255, 0.4));
      transform-style: preserve-3d;
      animation: floatIcon 3s ease-in-out infinite;
    }

    .final-icon-3d:nth-child(1) {
      animation-delay: 0s;
    }

    .final-icon-3d:nth-child(2) {
      animation-delay: 0.3s;
    }

    .final-icon-3d:nth-child(3) {
      animation-delay: 0.6s;
    }

    @keyframes floatIcon {
      0%, 100% { transform: translateY(0) rotateZ(0deg) scale(1); }
      50% { transform: translateY(-12px) rotateZ(10deg) scale(1.12); }
    }

    @media (max-width: 992px) {
      .viral-science-section {
        margin: 50px auto 40px;
        padding: 50px 35px;
        border-radius: 24px;
      }

      .viral-icon-3d {
        font-size: 65px;
        margin-bottom: 16px;
      }

      .viral-science-header {
        margin-bottom: 30px;
      }

      .viral-science-body {
        margin-top: 30px;
      }

      .viral-science-title {
        font-size: 42px;
        margin-bottom: 12px;
      }

      .viral-science-subtitle {
        font-size: 26px;
      }

      .viral-science-paragraph {
        font-size: 20px;
        margin-bottom: 20px;
      }

      .inline-icon-3d {
        font-size: 24px;
        margin-right: 8px;
      }

      .emotional-circuits {
        padding: 28px 35px;
        margin: 25px 0;
      }

      .circuit-item {
        font-size: 20px;
        flex-wrap: wrap;
        gap: 10px;
        margin-bottom: 10px;
      }

      .circuit-icon-3d {
        font-size: 30px;
      }

      .circuit-arrow {
        font-size: 24px;
      }

      .circuit-conclusion {
        margin-top: 20px;
        padding-top: 20px;
        font-size: 20px;
      }

      .conclusion-icon-3d {
        font-size: 28px;
      }

      .viral-science-final {
        margin-top: 30px;
        padding-top: 28px;
        font-size: 22px;
      }

      .final-icons-group {
        gap: 10px;
        margin-right: 10px;
      }

      .final-icon-3d {
        font-size: 35px;
      }
    }

    @media (max-width: 768px) {
      .viral-science-section {
        margin: 40px auto 35px;
        padding: 40px 25px;
        border-radius: 20px;
      }

      .viral-icon-3d {
        font-size: 55px;
        margin-bottom: 14px;
      }

      .viral-science-header {
        margin-bottom: 25px;
      }

      .viral-science-body {
        margin-top: 25px;
      }

      .viral-science-title {
        font-size: 36px;
        margin-bottom: 12px;
      }

      .viral-science-subtitle {
        font-size: 22px;
      }

      .viral-science-paragraph {
        font-size: 18px;
        margin-bottom: 18px;
      }

      .inline-icon-3d {
        font-size: 22px;
        margin-right: 8px;
        display: inline-block;
      }

      .emotional-circuits {
        padding: 25px 20px;
        margin: 22px 0;
      }

      .circuit-item {
        font-size: 18px;
        margin-bottom: 16px;
        flex-wrap: wrap;
        gap: 8px;
      }

      .circuit-icon-3d {
        font-size: 28px;
      }

      .circuit-arrow {
        font-size: 20px;
        transform: rotate(90deg);
      }

      .circuit-conclusion {
        margin-top: 20px;
        padding-top: 20px;
        font-size: 18px;
        flex-wrap: wrap;
      }

      .conclusion-icon-3d {
        font-size: 26px;
      }

      .viral-science-final {
        font-size: 20px;
        margin-top: 28px;
        padding-top: 24px;
      }

      .final-icons-group {
        gap: 8px;
        margin-right: 8px;
      }

      .final-icon-3d {
        font-size: 30px;
      }

      .cursor-box {
    width: 150px;
    height: 150px;
    background-color: #333;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1rem;
    transition: all 0.3s ease;
    text-align: center;
    padding: 1rem;
    position: relative;
    overflow: hidden;
}

.cursor-box::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, transparent, rgba(255,255,255,0.1), transparent);
    top: -100%;
    left: -100%;
    transition: all 0.5s ease;
}

.cursor-box:hover::before {
    top: 100%;
    left: 100%;
}


.help {
    cursor: help;
    background: linear-gradient(145deg, #2a2a2a, #383838);
    border: 2px solid #00bcd4;
}
.help:hover {
    transform: scale(1.05) translateY(-5px);
    box-shadow: 0 5px 15px #00bcd450;
}
    }

      
    .three-steps-section {
      position: relative;
      width: 100%;
      padding: 60px 20px;
      margin: 0px 0;
      background: linear-gradient(135deg, 
        #fef3f8 0%, 
        #f0f9ff 25%, 
        #f5f3ff 50%, 
        #fff7ed 75%, 
        #ffffff 100%);
      overflow: hidden;
    }

    .three-steps-section::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: 
        radial-gradient(circle at 20% 30%, rgba(255, 31, 140, 0.06) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(37, 99, 235, 0.06) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(123, 97, 255, 0.04) 0%, transparent 70%);
      pointer-events: none;
      z-index: 1;
    }

    .three-steps-container {
      position: relative;
      z-index: 2;
      max-width: 1400px;
      margin: 0 auto;
    }

    .three-steps-title {
      text-align: center;
      font-size: 48px;
      font-weight: 800;
      color: #111827;
      margin-bottom: 60px;
      letter-spacing: -0.02em;
      animation: fadeInUp 0.8s ease-out;
    }

    @keyframes fadeInUp {
      from {
        opacity: 0;
        transform: translateY(30px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .three-steps-grid {
      display: flex;
      flex-direction: column;
      gap: 50px;
      margin-top: 50px;
    }

    .step-card {
      position: relative;
      width: 100%;
      background: #ffffff;
      border-radius: 24px;
      padding: 0;
      box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08),
                  0 0 0 1px rgba(0, 0, 0, 0.05);
      transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
      animation: fadeInUp 0.8s ease-out;
      animation-fill-mode: both;
      overflow: hidden;
    }

    .step-card:nth-child(1) { animation-delay: 0.1s; }
    .step-card:nth-child(2) { animation-delay: 0.2s; }
    .step-card:nth-child(3) { animation-delay: 0.3s; }

    .step-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 20px 60px rgba(0, 0, 0, 0.12),
                  0 0 0 1px rgba(0, 0, 0, 0.08);
    }

    .step-card-inner {
      display: grid;
      grid-template-columns: 1fr 1fr;
      align-items: center;
      gap: 0;
      min-height: 300px;
    }

    .step-card.step-reverse .step-card-inner {
      grid-template-columns: 1fr 1fr;
    }

    .step-card.step-reverse .step-video {
      order: -1;
    }

    .step-content {
      padding: 50px 40px;
      display: flex;
      flex-direction: column;
      justify-content: center;
    }

    .step-header {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 20px;
    }

    .step-number-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 50px;
      height: 50px;
      border-radius: 12px;
      background: linear-gradient(135deg, #ff1f8c, #ff7ac4);
      color: #ffffff;
      font-size: 24px;
      font-weight: 800;
      box-shadow: 0 4px 15px rgba(255, 31, 140, 0.3);
      flex-shrink: 0;
    }

    .step-number-text {
      font-size: 16px;
      font-weight: 700;
      color: var(--pink-main);
      text-transform: uppercase;
      letter-spacing: 1px;
    }

    .step-icon-3d {
      font-size: 56px;
      filter: drop-shadow(0 6px 12px rgba(0, 0, 0, 0.2)) 
              drop-shadow(0 0 15px rgba(255, 31, 140, 0.3));
      animation: float3d 3s ease-in-out infinite;
      transform-style: preserve-3d;
      margin-bottom: 20px;
    }

    .step-card:nth-child(1) .step-icon-3d {
      animation-delay: 0s;
    }

    .step-card:nth-child(2) .step-icon-3d {
      animation-delay: 0.5s;
    }

    .step-card:nth-child(3) .step-icon-3d {
      animation-delay: 1s;
    }

    @keyframes float3d {
      0%, 100% {
        transform: perspective(500px) rotateY(0deg) rotateX(5deg) translateY(0);
      }
      50% {
        transform: perspective(500px) rotateY(10deg) rotateX(-5deg) translateY(-8px);
      }
    }

    .step-title {
      font-size: 32px;
      font-weight: 700;
      color: #111827;
      line-height: 1.3;
      margin-bottom: 20px;
      letter-spacing: -0.01em;
    }

    .step-title .step-number-inline {
      color: var(--pink-main);
      font-weight: 800;
    }

    .step-description {
      font-size: 17px;
      font-weight: 400;
      color: #4b5563;
      line-height: 1.8;
    }

    .step-description .highlight {
      font-weight: 600;
      color: var(--pink-main);
    }

    .step-description .highlight-bold {
      font-weight: 700;
      color: #111827;
      background: linear-gradient(120deg, #fff64b 0%, #fff64b 100%);
      padding: 2px 6px;
      border-radius: 4px;
    }

    .step-list {
      list-style: none;
      padding: 0;
      margin: 20px 0 0 0;
    }

    .step-list li {
      font-size: 17px;
      color: #374151;
      line-height: 2;
      padding-left: 28px;
      position: relative;
      margin-bottom: 12px;
    }

    .step-list li::before {
      content: '✓';
      position: absolute;
      left: 0;
      color: var(--green-main);
      font-weight: 700;
      font-size: 20px;
    }

    .step-video {
      position: relative;
      background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
      min-height: 300px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 30px;
    }



 .step-video-placeholder img {
    width: 100%;
    height: auto;
}

    .step-video-placeholder .play-icon {
      font-size: 64px;
      margin-bottom: 15px;
      filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
      animation: pulsePlay 2s ease-in-out infinite;
    }

    @keyframes pulsePlay {
      0%, 100% {
        transform: scale(1);
        opacity: 1;
      }
      50% {
        transform: scale(1.1);
        opacity: 0.8;
      }
    }

    .step-video-placeholder .video-label {
      position: relative;
      z-index: 1;
      font-size: 16px;
      opacity: 0.9;
      margin-top: 10px;
    }

    .step-video-placeholder .video-controls {
      position: relative;
      z-index: 1;
      font-size: 12px;
      opacity: 0.7;
      margin-top: 5px;
      font-weight: 400;
    }

    @media (max-width: 1024px) {
      .step-card-inner {
        grid-template-columns: 1fr;
        min-height: auto;
      }

      .step-video {
        min-height: 250px;
        order: -1;
      }

      .step-card.step-reverse .step-video {
        order: -1;
      }

      .step-card.step-reverse .step-content {
        order: 0;
      }

      .three-steps-title {
        font-size: 36px;
        margin-bottom: 40px;
      }
    }

    @media (max-width: 768px) {
      .three-steps-section {
        padding: 60px 15px;
        margin: 40px 0;
      }

      .three-steps-title {
        font-size: 28px;
        margin-bottom: 30px;
      }

      .step-content {
        padding: 35px 25px;
      }

      .step-title {
        font-size: 24px;
      }

      .step-icon-3d {
        font-size: 48px;
      }

      .step-description {
        font-size: 16px;
      }

      .step-video {
        min-height: 200px;
        padding: 20px;
      }

      .step-video-placeholder {
        max-width: 100%;
      }

      .step-number-badge {
        width: 45px;
        height: 45px;
        font-size: 20px;
      }
    }

   
     
    .demo-video-section {
      position: relative;
      z-index: 1;
      max-width: 1200px;
      margin: 60px auto;
      padding: 80px 20px;
      background: linear-gradient(135deg, #fef3ff 0%, #fff0f8 50%, #f0f9ff 100%);
      border-radius: 30px;
      overflow: hidden;
    }

    .demo-video-section::before {
      content: '';
      position: absolute;
      top: -50%;
      left: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle, rgba(255, 31, 140, 0.1) 0%, transparent 70%);
      animation: pulse 8s ease-in-out infinite;
    }

    @keyframes pulse {
      0%, 100% { transform: scale(1); opacity: 0.5; }
      50% { transform: scale(1.1); opacity: 0.8; }
    }

    .demo-video-container {
      position: relative;
      z-index: 2;
      text-align: center;
    }

.demo-video-headline {
    font-size: 34px;
    font-weight: 800;
    line-height: 1.2;
    color: var(--pink-main);
    margin-bottom: 6px;
    text-shadow: 0 2px 10px rgba(255, 31, 140, 0.2);
    background: linear-gradient(135deg, #ff1f8c 0%, #ff4fb3 50%, #ff7ac4 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: fadeInUp 0.8s ease-out;
}

    .demo-video-subtitle {
      font-size: 28px;
      font-weight: 700;
      color: var(--text-main);
      margin-bottom: 50px;
      letter-spacing: 0.05em;
      animation: fadeInUp 1s ease-out;
    }

    .demo-video-wrapper {
      position: relative;
      max-width: 900px;
      margin: 0 auto;
      animation: fadeInUp 1.2s ease-out;
    }

    .demo-video-card {
      position: relative;
      background: linear-gradient(145deg, #ffffff 0%, #f8f9fa 100%);
      border-radius: 24px;
      padding: 4px;
      box-shadow: 
        0 20px 60px rgba(255, 31, 140, 0.2),
        0 0 0 1px rgba(255, 31, 140, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
      transform: perspective(1000px) rotateX(2deg);
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .demo-video-card:hover {
      transform: perspective(1000px) rotateX(0deg) translateY(-5px);
      box-shadow: 
        0 30px 80px rgba(255, 31, 140, 0.3),
        0 0 0 1px rgba(255, 31, 140, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    }

    .demo-video-placeholder {
      width: 100%;
      aspect-ratio: 16 / 9;
      background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
      border-radius: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      overflow: hidden;
    }

    .demo-video-placeholder::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: 
        radial-gradient(circle at 30% 30%, rgba(255, 31, 140, 0.3) 0%, transparent 50%),
        radial-gradient(circle at 70% 70%, rgba(79, 172, 254, 0.3) 0%, transparent 50%);
      animation: shimmer 3s ease-in-out infinite;
    }

    @keyframes shimmer {
      0%, 100% { opacity: 0.5; }
      50% { opacity: 1; }
    }

    .demo-video-text {
      position: relative;
      z-index: 2;
      font-size: 48px;
      font-weight: 900;
      color: #ffffff;
      text-transform: uppercase;
      letter-spacing: 0.2em;
      text-shadow: 
        0 0 20px rgba(255, 31, 140, 0.5),
        0 4px 10px rgba(0, 0, 0, 0.3);
      animation: glow 2s ease-in-out infinite alternate;
    }

    @keyframes glow {
      from { text-shadow: 0 0 20px rgba(255, 31, 140, 0.5), 0 4px 10px rgba(0, 0, 0, 0.3); }
      to { text-shadow: 0 0 30px rgba(255, 31, 140, 0.8), 0 4px 15px rgba(0, 0, 0, 0.4); }
    }

    .demo-video-play-icon {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 100px;
      height: 100px;
      background: linear-gradient(135deg, var(--pink-main) 0%, var(--pink-neon) 100%);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 
        0 10px 30px rgba(255, 31, 140, 0.4),
        inset 0 2px 5px rgba(255, 255, 255, 0.3);
      z-index: 3;
      cursor: pointer;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .demo-video-play-icon:hover {
      transform: translate(-50%, -50%) scale(1.1);
      box-shadow: 
        0 15px 40px rgba(255, 31, 140, 0.6),
        inset 0 2px 5px rgba(255, 255, 255, 0.3);
    }

    .demo-video-play-icon::before {
      content: '';
      width: 0;
      height: 0;
      border-left: 30px solid #ffffff;
      border-top: 20px solid transparent;
      border-bottom: 20px solid transparent;
      margin-left: 8px;
    }

    .demo-video-3d-icons {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      pointer-events: none;
      z-index: 1;
    }

    .demo-icon-1,
    .demo-icon-2,
    .demo-icon-3 {
      position: absolute;
      width: 60px;
      height: 60px;
      background: linear-gradient(135deg, var(--pink-main) 0%, var(--pink-neon) 100%);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
      box-shadow: 
        0 8px 20px rgba(255, 31, 140, 0.3),
        inset 0 2px 4px rgba(255, 255, 255, 0.3);
      transform: perspective(500px) rotateY(-15deg) rotateX(10deg);
      animation: float 3s ease-in-out infinite;
    }

    .demo-icon-1 {
      top: -30px;
      left: 10%;
      animation-delay: 0s;
    }

    .demo-icon-2 {
      top: -30px;
      right: 10%;
      animation-delay: 1s;
    }

    .demo-icon-3 {
      bottom: -30px;
      left: 50%;
      transform: translateX(-50%) perspective(500px) rotateY(15deg) rotateX(-10deg);
      animation-delay: 2s;
    }

    @keyframes float {
      0%, 100% { transform: translateY(0) perspective(500px) rotateY(-15deg) rotateX(10deg); }
      50% { transform: translateY(-15px) perspective(500px) rotateY(-15deg) rotateX(10deg); }
    }

    @keyframes fadeInUp {
      from {
        opacity: 0;
        transform: translateY(30px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    @media (max-width: 768px) {
      .demo-video-section {
        margin: 40px auto;
        padding: 50px 15px;
        border-radius: 20px;
      }

      .demo-video-headline {
        font-size: 28px;
      }

      .demo-video-subtitle {
        font-size: 20px;
        margin-bottom: 30px;
      }

      .demo-video-text {
        font-size: 32px;
        letter-spacing: 0.1em;
      }

      .demo-video-play-icon {
        width: 80px;
        height: 80px;
      }

      .demo-video-play-icon::before {
        border-left-width: 24px;
        border-top-width: 16px;
        border-bottom-width: 16px;
      }

      .demo-icon-1,
      .demo-icon-2,
      .demo-icon-3 {
        width: 45px;
        height: 45px;
        font-size: 20px;
      }
    }

      
      
      .video-optimization-banner .banner-main-section {
      background: linear-gradient(135deg, #f8fafc 0%, #ffffff 50%, #f0f9ff 100%);
      padding: 40px 20px;
      position: relative;
      overflow: hidden;
    }

    .video-optimization-banner .banner-main-section::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: 
        radial-gradient(circle at 10% 20%, rgba(255, 31, 140, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 90% 80%, rgba(255, 138, 60, 0.08) 0%, transparent 50%);
      pointer-events: none;
    }

    .video-optimization-banner .banner-main-container {
      max-width: 1200px;
      margin: 0 auto;
      position: relative;
      z-index: 2;
    }

    .video-optimization-banner .main-section-title {
      font-size: clamp(36px, 5vw, 64px);
      font-weight: 900;
      text-align: center;
      margin-bottom: 12px;
      background: linear-gradient(135deg, #ff1f8c 0%, #ff8a3c 50%, #ff1493 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      line-height: 1.2;
      letter-spacing: -0.02em;
      text-shadow: 0 0 40px rgba(255, 31, 140, 0.2);
      filter: drop-shadow(0 4px 20px rgba(255, 31, 140, 0.15));
    }

    .video-optimization-banner .main-section-subtitle {
      font-size: clamp(18px, 2.2vw, 24px);
      text-align: center;
      color: #333333;
      margin-bottom: 10px;
      max-width: 900px;
      margin-left: auto;
      margin-right: auto;
      line-height: 1.6;
      font-weight: 500;
    }

    .video-optimization-banner .main-section-subtitle .highlight-text {
      font-weight: 700;
      color: #000000;
    }

    .video-optimization-banner .main-section-subtitle .highlight-italic {
      font-style: italic;
      color: #ff1f8c;
      font-weight: 600;
    }

    .video-optimization-banner .main-section-content {
      margin-top: 30px;
    }

    .video-optimization-banner .sad-reality-header {
      font-size: clamp(24px, 3vw, 32px);
      font-weight: 800;
      text-align: center;
      margin-bottom: 25px;
      color: #000000;
      letter-spacing: -0.01em;
    }

    .video-optimization-banner .problems-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 14px;
      max-width: 1000px;
      margin: 0 auto;
    }

    .video-optimization-banner .problem-item {
      background: #ffffff;
      border: 2px solid #e5e7eb;
      border-radius: 16px;
      padding: 18px;
      display: flex;
      align-items: flex-start;
      gap: 14px;
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
      position: relative;
      overflow: hidden;
    }

    .video-optimization-banner .problem-item::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 4px;
      height: 100%;
      background: linear-gradient(180deg, #ff1f8c, #ff8a3c);
      transform: scaleY(0);
      transition: transform 0.3s ease;
    }

    .video-optimization-banner .problem-item:hover {
      border-color: #ff1f8c;
      box-shadow: 0 8px 24px rgba(255, 31, 140, 0.15);
      transform: translateY(-4px);
    }

    .video-optimization-banner .problem-item:hover::before {
      transform: scaleY(1);
    }

    .video-optimization-banner .problem-icon-3d {
      font-size: 36px;
      flex-shrink: 0;
      transform-style: preserve-3d;
      animation: problemIconFloat 4s ease-in-out infinite;
      filter: drop-shadow(0 6px 12px rgba(255, 31, 140, 0.4)) drop-shadow(0 0 20px rgba(255, 138, 60, 0.3));
      text-shadow: 
        2px 2px 0 rgba(255, 31, 140, 0.3),
        -1px -1px 0 rgba(255, 138, 60, 0.3);
      position: relative;
    }

    .video-optimization-banner .problem-item:nth-child(odd) .problem-icon-3d {
      animation-delay: 0s;
    }

    .video-optimization-banner .problem-item:nth-child(even) .problem-icon-3d {
      animation-delay: 2s;
    }

    @keyframes problemIconFloat {
      0%, 100% {
        transform: perspective(800px) rotateY(-15deg) rotateX(10deg) translateZ(20px) translateY(0);
      }
      50% {
        transform: perspective(800px) rotateY(15deg) rotateX(-10deg) translateZ(30px) translateY(-8px);
      }
    }

    .video-optimization-banner .problem-text {
      font-size: clamp(16px, 1.8vw, 18px);
      color: #333333;
      line-height: 1.6;
      font-weight: 500;
    }

    .video-optimization-banner .problem-text .problem-italic {
      font-style: italic;
      color: #ff1f8c;
      font-weight: 600;
    }

    /* Responsive styles for main section */
    @media (max-width: 991px) {
      .video-optimization-banner .banner-main-section {
        padding: 35px 20px;
      }

      .video-optimization-banner .problems-grid {
        grid-template-columns: 1fr;
        gap: 12px;
      }

      .video-optimization-banner .problem-item {
        padding: 16px;
      }
    }

    @media (max-width: 576px) {
      .video-optimization-banner .banner-main-section {
        padding: 30px 15px;
      }

      .video-optimization-banner .problem-item {
        padding: 14px;
        gap: 10px;
      }

      .video-optimization-banner .problem-icon-3d {
        font-size: 28px;
      }
    }

    .video-optimization-banner .optimize-headline {
      font-size: clamp(28px, 3.5vw, 42px);
      font-weight: 800;
      text-align: center;
      margin-bottom: 20px;
      color: #000000;
      text-decoration: underline;
      text-decoration-color: var(--pink-main);
      text-decoration-thickness: 3px;
      text-underline-offset: 10px;
      letter-spacing: -0.01em;
    }

    .video-optimization-banner .optimize-subtext {
      font-size: clamp(18px, 2.2vw, 24px);
      text-align: center;
      color: #333333;
      margin-bottom: 23px;
      max-width: 900px;
      margin-left: auto;
      margin-right: auto;
      line-height: 1.6;
      font-weight: 500;
    }

    .video-optimization-banner .tools-section {
      max-width: 1200px;
      margin: 0 auto;
    }

    .video-optimization-banner .tools-heading {
      font-size: clamp(24px, 3vw, 36px);
      font-weight: 800;
      text-align: center;
      margin-bottom: 30px;
      color: #000000;
      letter-spacing: -0.01em;
    }

    .video-optimization-banner .tools-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 2px;
      background: #000000;
      border: 2px solid #000000;
      border-radius: 12px;
      overflow: hidden;
    }

    .video-optimization-banner .tool-item {
    background: #ffffff;
    padding: 18px 19px;
    display: flex;
    flex-direction: column;
    gap: 3px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
}

    .video-optimization-banner .tool-item::before {
      content: '';
      position: absolute;
      top: 0;
      left: -100%;
      width: 100%;
      height: 100%;
      background: linear-gradient(90deg, transparent, rgba(255, 31, 140, 0.1), transparent);
      transition: left 0.5s ease;
    }

    .video-optimization-banner .tool-item:hover {
      transform: translateY(-4px);
      box-shadow: 0 8px 30px rgba(255, 31, 140, 0.2);
      background: linear-gradient(135deg, #ffffff 0%, #fff5f9 100%);
    }

    .video-optimization-banner .tool-item:hover::before {
      left: 100%;
    }

    .video-optimization-banner .tool-name {
      font-size: clamp(20px, 2.5vw, 28px);
      font-weight: 800;
      color: #000000;
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .video-optimization-banner .tool-icon {
      font-size: 40px;
      display: inline-block;
      position: relative;
      filter: drop-shadow(4px 6px 12px rgba(0, 0, 0, 0.4)) 
              drop-shadow(0 0 20px rgba(255, 31, 140, 0.3));
      transform: perspective(800px) rotateY(-15deg) rotateX(8deg) translateZ(20px);
      transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
      text-shadow: 
        2px 2px 4px rgba(0, 0, 0, 0.3),
        -1px -1px 2px rgba(255, 255, 255, 0.1);
      animation: icon3DFloat 3s ease-in-out infinite;
    }

    .video-optimization-banner .tool-item:nth-child(1) .tool-icon {
      animation-delay: 0s;
    }

    .video-optimization-banner .tool-item:nth-child(2) .tool-icon {
      animation-delay: 0.2s;
    }

    .video-optimization-banner .tool-item:nth-child(3) .tool-icon {
      animation-delay: 0.4s;
    }

    .video-optimization-banner .tool-item:nth-child(4) .tool-icon {
      animation-delay: 0.6s;
    }

    .video-optimization-banner .tool-item:nth-child(5) .tool-icon {
      animation-delay: 0.8s;
    }

    .video-optimization-banner .tool-item:nth-child(6) .tool-icon {
      animation-delay: 1s;
    }

    .video-optimization-banner .tool-item:nth-child(7) .tool-icon {
      animation-delay: 1.2s;
    }

    .video-optimization-banner .tool-item:nth-child(8) .tool-icon {
      animation-delay: 1.4s;
    }

    @keyframes icon3DFloat {
      0%, 100% {
        transform: perspective(800px) rotateY(-15deg) rotateX(8deg) translateZ(20px) translateY(0);
      }
      50% {
        transform: perspective(800px) rotateY(-12deg) rotateX(10deg) translateZ(30px) translateY(-8px);
      }
    }

    .video-optimization-banner .tool-item:hover .tool-icon {
      transform: perspective(800px) rotateY(0deg) rotateX(0deg) translateZ(40px) scale(1.15);
      filter: drop-shadow(6px 8px 16px rgba(0, 0, 0, 0.5)) 
              drop-shadow(0 0 30px rgba(255, 31, 140, 0.5))
              drop-shadow(0 0 40px rgba(255, 215, 0, 0.3));
      animation-play-state: paused;
    }

    .video-optimization-banner .tool-description {
      font-size: clamp(16px, 1.8vw, 18px);
      color: #555555;
      line-height: 1.5;
      font-weight: 400;
    }
    .video-optimization-banner .banner-top {
      background: linear-gradient(135deg, #ffffff 0%, #f5f7fb 100%);
      padding: 20px 32px;
      position: relative;
      overflow: hidden;
      border-radius: 20px;
      box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
      max-width: 1200px;
      margin: 30px auto 32px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      text-align: center;
      flex-direction: column;
  }

    .video-optimization-banner .banner-top::before {
      content: '';
      position: absolute;
      top: -10%;
      left: -10%;
      right: -10%;
      bottom: -10%;
      background:
        radial-gradient(circle at 15% 25%, rgba(59, 130, 246, 0.18) 0%, transparent 55%),
        radial-gradient(circle at 85% 75%, rgba(236, 72, 153, 0.16) 0%, transparent 55%);
      pointer-events: none;
      opacity: 0.9;
    }

    .video-optimization-banner .banner-top .softawe-three,
    .video-optimization-banner .banner-top .softawe-three-head {
      position: relative;
      z-index: 1;
      color: #0f172a;
    }
    .video-optimization-banner .banner-icon-3d {
      position: absolute;
      font-size: 100px;
      opacity: 0.25;
      transform-style: preserve-3d;
      animation-duration: 8s;
      animation-timing-function: ease-in-out;
      animation-iteration-count: infinite;

      line-height: 1;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .video-optimization-banner .banner-icon-3d::before {
      content: '';
      position: absolute;
      top: -10%;
      left: -10%;
      right: -10%;
      bottom: -10%;
      background: radial-gradient(circle, rgba(255, 31, 140, 0.2) 0%, transparent 70%);
      border-radius: 50%;
      z-index: -1;
      animation: iconGlow 3s ease-in-out infinite;
    }

    .video-optimization-banner .banner-icon-3d.icon-1 {
      top: 10%;
      left: 8%;
      animation-name: icon1Float;
      animation-delay: 0s;
    }

    .video-optimization-banner .banner-icon-3d.icon-2 {
      top: 20%;
      right: 10%;
      font-size: 90px;
      animation-name: icon2Float;
      animation-delay: 1.5s;
    }

    .video-optimization-banner .banner-icon-3d.icon-3 {
      bottom: 15%;
      left: 12%;
      font-size: 85px;
      animation-name: icon3Float;
      animation-delay: 3s;
    }

    .video-optimization-banner .banner-icon-3d.icon-4 {
      bottom: 25%;
      right: 8%;
      font-size: 95px;
      animation-name: icon4Float;
      animation-delay: 2s;
    }

    @keyframes icon1Float {
      0%, 100% {
        transform: perspective(1200px) rotateY(-30deg) rotateX(20deg) rotateZ(-5deg) translateZ(80px) translateY(0) scale(1);
        opacity: 0.25;
      }
      50% {
        transform: perspective(1200px) rotateY(-28deg) rotateX(22deg) rotateZ(-3deg) translateZ(100px) translateY(-20px) scale(1.15);
        opacity: 0.4;
      }
    }

    @keyframes icon2Float {
      0%, 100% {
        transform: perspective(1200px) rotateY(30deg) rotateX(-20deg) rotateZ(5deg) translateZ(75px) translateY(0) scale(1);
        opacity: 0.25;
      }
      50% {
        transform: perspective(1200px) rotateY(32deg) rotateX(-22deg) rotateZ(7deg) translateZ(95px) translateY(-20px) scale(1.15);
        opacity: 0.4;
      }
    }

    @keyframes icon3Float {
      0%, 100% {
        transform: perspective(1200px) rotateY(-25deg) rotateX(15deg) rotateZ(8deg) translateZ(70px) translateY(0) scale(1);
        opacity: 0.25;
      }
      50% {
        transform: perspective(1200px) rotateY(-23deg) rotateX(17deg) rotateZ(10deg) translateZ(90px) translateY(-20px) scale(1.15);
        opacity: 0.4;
      }
    }

    @keyframes icon4Float {
      0%, 100% {
        transform: perspective(1200px) rotateY(25deg) rotateX(-15deg) rotateZ(-8deg) translateZ(85px) translateY(0) scale(1);
        opacity: 0.25;
      }
      50% {
        transform: perspective(1200px) rotateY(27deg) rotateX(-17deg) rotateZ(-10deg) translateZ(105px) translateY(-20px) scale(1.15);
        opacity: 0.4;
      }
    }

    @keyframes iconGlow {
      0%, 100% {
        opacity: 0.3;
        transform: scale(1);
      }
      50% {
        opacity: 0.6;
        transform: scale(1.2);
      }
    }

    .video-optimization-banner .banner-container {
      max-width: 1200px;
      margin: 0 auto;
      position: relative;
      z-index: 2;
    }

    .video-optimization-banner .main-headline {
      font-size: clamp(32px, 4.5vw, 56px);
      font-weight: 900;
      line-height: 1.2;
      text-align: center;
      margin-bottom: 20px;
      color: #ffffff;
      letter-spacing: -0.02em;
    }

    .video-optimization-banner .main-headline .videos-highlight {
      position: relative;
      display: inline-block;
      padding: 0 8px;
    }

    .video-optimization-banner .main-headline .videos-highlight::before,
    .video-optimization-banner .main-headline .videos-highlight::after {
      content: '';
      position: absolute;
      top: 50%;
      width: 2px;
      height: 80%;
      background: linear-gradient(180deg, transparent, #ffffff, transparent);
      transform: translateY(-50%);
    }

    .video-optimization-banner .main-headline .videos-highlight::before {
      left: 0;
    }

    .video-optimization-banner .main-headline .videos-highlight::after {
      right: 0;
    }

    .video-optimization-banner .imagine-text {
      font-size: clamp(18px, 2vw, 24px);
      color: rgba(255, 255, 255, 0.9);
      text-align: center;
      margin-bottom: 15px;
      font-weight: 500;
    }

    .video-optimization-banner .benefit-text {
      font-size: clamp(36px, 5vw, 54px);
      font-weight: 900;
      text-align: center;
      background: linear-gradient(135deg, #fff64b 0%, #ff8a3c 50%, #ff1493 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      line-height: 1.1;
      margin-bottom: 40px;
      text-shadow: 0 0 40px rgba(255, 246, 75, 0.3);
      filter: drop-shadow(0 4px 20px rgba(255, 246, 75, 0.2));
      letter-spacing: -0.02em;
    }
    .optim-shade {
    background: #ffffff;
    border-radius: 13px;
    padding: 22px 0 1px;
}
    .video-optimization-banner .banner-body {
      background: #ffffff;
      padding: 60px 20px;
    }
    .video-optimization-banner .banner-top-icons {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      pointer-events: none;
      z-index: 0;
    }

    @media (max-width: 991px) {
      .video-optimization-banner .banner-top {
        padding: 40px 20px;
      }

      .video-optimization-banner .banner-icon-3d {
        font-size: 60px;
      }

      .video-optimization-banner .banner-icon-3d.icon-2 {
        font-size: 55px;
      }

      .video-optimization-banner .banner-icon-3d.icon-3 {
        font-size: 50px;
      }

      .video-optimization-banner .banner-icon-3d.icon-4 {
        font-size: 58px;
      }

      .video-optimization-banner .banner-body {
        padding: 40px 20px;
      }

      .video-optimization-banner .banner-main-section {
        padding: 35px 20px;
      }

      .video-optimization-banner .tools-grid {
        grid-template-columns: 1fr;
      }

      .video-optimization-banner .tool-item {
        padding: 25px 20px;
      }
    }

    @media (max-width: 576px) {
      .video-optimization-banner .banner-top {
        padding: 30px 15px;
      }

      .video-optimization-banner .banner-icon-3d {
        font-size: 45px;
        opacity: 0.1;
      }

      .video-optimization-banner .banner-icon-3d.icon-2 {
        font-size: 40px;
      }

      .video-optimization-banner .banner-icon-3d.icon-3 {
        font-size: 38px;
      }

      .video-optimization-banner .banner-icon-3d.icon-4 {
        font-size: 42px;
      }

      .video-optimization-banner .banner-body {
        padding: 30px 15px;
      }

      .video-optimization-banner .banner-main-section {
        padding: 30px 15px;
      }

      .video-optimization-banner .tool-item {
        padding: 20px 15px;
      }

      .video-optimization-banner .tool-icon {
        font-size: 32px;
        transform: perspective(600px) rotateY(-10deg) rotateX(5deg) translateZ(15px);
      }

      @keyframes icon3DFloat {
        0%, 100% {
          transform: perspective(600px) rotateY(-10deg) rotateX(5deg) translateZ(15px) translateY(0);
        }
        50% {
          transform: perspective(600px) rotateY(-8deg) rotateX(7deg) translateZ(20px) translateY(-6px);
        }
      }
    }

.demo-hero-wrap .video-label {
    height: 538px;
}
       
          
         .comparison-wrap {
      max-width: 1200px;
      margin: 100px auto 80px;
      padding: 0 18px;
      position: relative;
    }

    .comparison-wrap::before {
      content: "";
      position: absolute;
      inset: -150px -200px;
      background:
        radial-gradient(circle at 20% 30%, rgba(255, 31, 140, 0.25), transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(123, 97, 255, 0.25), transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(255, 138, 60, 0.15), transparent 60%);
      z-index: -1;
      filter: blur(60px);
    }

    .comparison-main-title {
      font-size: 32px;
      font-weight: 800;
      text-align: center;
      margin-bottom: 50px;
      background: linear-gradient(135deg, var(--pink-main) 0%, var(--purple-main) 50%, var(--orange-main) 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      text-transform: uppercase;
      letter-spacing: 0.05em;
      position: relative;
      padding: 20px 0;
    }

    .comparison-main-title::after {
      content: "";
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 100px;
      height: 4px;
      background: linear-gradient(90deg, transparent, var(--pink-main), var(--purple-main), transparent);
      border-radius: 2px;
    }

    .comparison-table-wrapper {
      position: relative;
      margin-bottom: 50px;
    }

    .comparison-table {
      display: flex;
      flex-direction: column;
      gap: 0;
      background: rgba(255, 255, 255, 0.95);
      border-radius: 30px;
      overflow: hidden;
      box-shadow: 
        0 20px 60px rgba(255, 31, 140, 0.15),
        0 0 0 1px rgba(255, 255, 255, 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
      backdrop-filter: blur(10px);
      transform: perspective(1000px) rotateX(0deg);
      transition: transform 0.3s ease;
    }

    /* .comparison-table:hover {
      transform: perspective(1000px) rotateX(1deg) translateY(-5px);
    } */

    .comparison-header {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0;
      background: linear-gradient(135deg, 
        rgba(255, 31, 140, 0.1) 0%, 
        rgba(123, 97, 255, 0.1) 100%);
      padding: 30px 20px;
      border-bottom: 2px solid rgba(255, 31, 140, 0.2);
      position: relative;
    }

    .comparison-header::before {
      content: "";
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 2px;
      height: 100%;
      background: linear-gradient(180deg, 
        transparent 0%, 
        rgba(255, 31, 140, 0.3) 20%, 
        rgba(123, 97, 255, 0.3) 80%, 
        transparent 100%);
    }

    .comparison-header-cell {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 15px;
      padding: 0 20px;
      position: relative;
    }

    .comparison-icon-wrapper {
      position: relative;
      width: 80px;
      height: 80px;
    }

    .comparison-icon-3d {
      width: 80px;
      height: 80px;
      border-radius: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 40px;
      font-weight: 900;
      position: relative;
      transform-style: preserve-3d;
      transition: transform 0.3s ease;
    }

    .comparison-icon-3d::before {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: 20px;
      background: inherit;
      filter: blur(20px);
      opacity: 0.6;
      z-index: -1;
      transform: translateZ(-10px);
    }

    .comparison-icon-3d.icon-bad {
      background: linear-gradient(135deg, 
        rgba(239, 68, 68, 0.9) 0%, 
        rgba(220, 38, 38, 0.9) 100%);
      color: white;
      box-shadow: 
        0 10px 30px rgba(239, 68, 68, 0.4),
        inset 0 2px 10px rgba(255, 255, 255, 0.2),
        inset 0 -2px 10px rgba(0, 0, 0, 0.2);
      transform: perspective(1000px) rotateY(-5deg) rotateX(5deg);
    }

    .comparison-icon-3d.icon-good {
      background: linear-gradient(135deg, 
        var(--pink-main) 0%, 
        var(--purple-main) 50%, 
        var(--orange-main) 100%);
      color: white;
      box-shadow: 
        0 10px 30px rgba(255, 31, 140, 0.4),
        inset 0 2px 10px rgba(255, 255, 255, 0.3),
        inset 0 -2px 10px rgba(0, 0, 0, 0.2);
      transform: perspective(1000px) rotateY(5deg) rotateX(5deg);
    }

    .comparison-icon-3d:hover {
      transform: perspective(1000px) rotateY(0deg) rotateX(0deg) scale(1.1) translateZ(20px);
    }

    .comparison-header-title {
      font-size: 20px;
      font-weight: 700;
      text-align: center;
      color: var(--text-main);
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }

    .comparison-header-left .comparison-header-title {
      color: rgba(239, 68, 68, 0.9);
    }

    .comparison-header-right .comparison-header-title {
      background: linear-gradient(135deg, var(--pink-main), var(--purple-main));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .comparison-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0;
      padding: 25px 20px;
      border-bottom: 1px solid rgba(0, 0, 0, 0.05);
      transition: all 0.3s ease;
      position: relative;
    }

    .comparison-row::before {
      content: "";
      position: absolute;
      top: 0;
      left: 50%;
      transform: translateX(-50%);
      width: 1px;
      height: 100%;
      background: linear-gradient(180deg, 
        transparent 0%, 
        rgba(255, 31, 140, 0.1) 50%, 
        transparent 100%);
    }

    .comparison-row:hover {
      background: linear-gradient(90deg, 
        rgba(255, 31, 140, 0.03) 0%, 
        rgba(123, 97, 255, 0.03) 100%);
      transform: translateX(0) scale(1.01);
    }

    .comparison-row:last-child {
      border-bottom: none;
    }

    .comparison-row-final {
      background: linear-gradient(90deg, 
        rgba(239, 68, 68, 0.05) 0%, 
        rgba(255, 31, 140, 0.05) 100%);
      border-top: 2px solid rgba(255, 31, 140, 0.2);
      padding: 30px 20px;
    }

    .comparison-cell {
      display: flex;
      align-items: center;
      gap: 20px;
      padding: 0 20px;
      position: relative;
    }

    .comparison-cell-left {
      border-right: 1px solid rgba(0, 0, 0, 0.05);
    }

    .comparison-row-icon {
      font-size: 40px;
      width: 60px;
      height: 60px;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 15px;
      position: relative;
      transform-style: preserve-3d;
      transition: transform 0.3s ease;
      filter: drop-shadow(0 5px 15px rgba(0, 0, 0, 0.2));
    }

    .comparison-cell-left .comparison-row-icon {
      background: linear-gradient(135deg, 
        rgba(239, 68, 68, 0.15) 0%, 
        rgba(220, 38, 38, 0.15) 100%);
      transform: perspective(500px) rotateY(-10deg);
    }

    .comparison-cell-right .comparison-row-icon {
      background: linear-gradient(135deg, 
        rgba(255, 31, 140, 0.2) 0%, 
        rgba(123, 97, 255, 0.2) 100%);
      transform: perspective(500px) rotateY(10deg);
    }

    .comparison-row:hover .comparison-row-icon {
      transform: perspective(500px) rotateY(0deg) scale(1.15) translateZ(10px);
    }

    .comparison-content {
      flex: 1;
    }

    .comparison-label {
      font-size: 14px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      margin-bottom: 8px;
      color: #6b7280;
    }

    .comparison-text {
      font-size: 16px;
      font-weight: 600;
      line-height: 1.5;
      color: var(--text-main);
    }

    .comparison-cell-left .comparison-text {
      color: #6b7280;
    }

    .comparison-cell-right .comparison-text {
      background: linear-gradient(135deg, var(--pink-main), var(--purple-main));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .comparison-conclusion {
      text-align: center;
      margin-top: 50px;
      padding: 40px;
      background: linear-gradient(135deg, 
        rgba(255, 31, 140, 0.08) 0%, 
        rgba(123, 97, 255, 0.08) 50%, 
        rgba(255, 138, 60, 0.08) 100%);
      border-radius: 25px;
      position: relative;
      overflow: hidden;
      border: 2px solid rgba(255, 31, 140, 0.2);
    }

    .comparison-conclusion::before {
      content: "";
      position: absolute;
      inset: 0;
      background: 
        radial-gradient(circle at 20% 30%, rgba(255, 31, 140, 0.1), transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(123, 97, 255, 0.1), transparent 50%);
      z-index: 0;
    }

    .comparison-conclusion-text {
      font-size: 18px;
      font-weight: 600;
      line-height: 1.7;
      color: var(--text-main);
      position: relative;
      z-index: 1;
      max-width: 900px;
      margin: 0 auto;
    }

    .comparison-conclusion-text strong {
      background: linear-gradient(135deg, var(--pink-main), var(--purple-main));
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      font-weight: 800;
    }

    /* Responsive Styles */
    @media (max-width: 768px) {
      .comparison-main-title {
        font-size: 24px;
        margin-bottom: 30px;
      }

      .comparison-header {
        padding: 20px 15px;
      }

      .comparison-icon-wrapper {
        width: 60px;
        height: 60px;
      }

      .comparison-icon-3d {
        width: 60px;
        height: 60px;
        font-size: 30px;
        border-radius: 15px;
      }

      .comparison-header-title {
        font-size: 16px;
      }

      .comparison-row {
        padding: 20px 15px;
        flex-direction: column;
      }

      .comparison-row {
        grid-template-columns: 1fr;
      }

      .comparison-cell {
        padding: 15px 0;
      }

      .comparison-cell-left {
        border-right: none;
        border-bottom: 1px solid rgba(0, 0, 0, 0.05);
        padding-bottom: 20px;
        margin-bottom: 20px;
      }

      .comparison-row::before {
        display: none;
      }

      .comparison-header::before {
        display: none;
      }

      .comparison-header {
        grid-template-columns: 1fr;
        gap: 30px;
      }

      .comparison-conclusion {
        padding: 30px 20px;
      }

      .comparison-conclusion-text {
        font-size: 16px;
      }
    }

         
           
             position: relative;
      z-index: 1;
      max-width: 1200px;
      margin: 60px auto;
      padding: 80px 20px;
      background: linear-gradient(135deg, #fef3ff 0%, #fff0f8 50%, #f0f9ff 100%);
      border-radius: 30px;
      overflow: hidden;
    }

    .demo-video-section::before {
      content: '';
      position: absolute;
      top: -50%;
      left: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle, rgba(255, 31, 140, 0.1) 0%, transparent 70%);
      animation: pulse 8s ease-in-out infinite;
    }

    @keyframes pulse {
      0%, 100% { transform: scale(1); opacity: 0.5; }
      50% { transform: scale(1.1); opacity: 0.8; }
    }

    .demo-video-container {
      position: relative;
      z-index: 2;
      text-align: center;
    }

    .demo-video-headline {
      font-size: 42px;
      font-weight: 800;
      line-height: 1.2;
      color: var(--pink-main);
      margin-bottom: 20px;
      text-shadow: 0 2px 10px rgba(255, 31, 140, 0.2);
      background: linear-gradient(135deg, #ff1f8c 0%, #ff4fb3 50%, #ff7ac4 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      animation: fadeInUp 0.8s ease-out;
    }

    .demo-video-subtitle {
      font-size: 28px;
      font-weight: 700;
      color: var(--text-main);
      margin-bottom: 50px;
      letter-spacing: 0.05em;
      animation: fadeInUp 1s ease-out;
    }

    .demo-video-wrapper {
      position: relative;
      max-width: 900px;
      margin: 0 auto;
      animation: fadeInUp 1.2s ease-out;
    }

    .demo-video-card {
      position: relative;
      background: linear-gradient(145deg, #ffffff 0%, #f8f9fa 100%);
      border-radius: 24px;
      padding: 4px;
      box-shadow: 
        0 20px 60px rgba(255, 31, 140, 0.2),
        0 0 0 1px rgba(255, 31, 140, 0.1),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
      transform: perspective(1000px) rotateX(2deg);
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .demo-video-card:hover {
      transform: perspective(1000px) rotateX(0deg) translateY(-5px);
      box-shadow: 
        0 30px 80px rgba(255, 31, 140, 0.3),
        0 0 0 1px rgba(255, 31, 140, 0.2),
        inset 0 1px 0 rgba(255, 255, 255, 0.9);
    }

    .demo-video-placeholder {
      width: 100%;
      aspect-ratio: 16 / 9;
      background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
      border-radius: 20px;
      display: flex;
      align-items: center;
      justify-content: center;
      position: relative;
      overflow: hidden;
    }

    .demo-video-placeholder::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: 
        radial-gradient(circle at 30% 30%, rgba(255, 31, 140, 0.3) 0%, transparent 50%),
        radial-gradient(circle at 70% 70%, rgba(79, 172, 254, 0.3) 0%, transparent 50%);
      animation: shimmer 3s ease-in-out infinite;
    }

    @keyframes shimmer {
      0%, 100% { opacity: 0.5; }
      50% { opacity: 1; }
    }

    .demo-video-text {
      position: relative;
      z-index: 2;
      font-size: 48px;
      font-weight: 900;
      color: #ffffff;
      text-transform: uppercase;
      letter-spacing: 0.2em;
      text-shadow: 
        0 0 20px rgba(255, 31, 140, 0.5),
        0 4px 10px rgba(0, 0, 0, 0.3);
      animation: glow 2s ease-in-out infinite alternate;
    }

    @keyframes glow {
      from { text-shadow: 0 0 20px rgba(255, 31, 140, 0.5), 0 4px 10px rgba(0, 0, 0, 0.3); }
      to { text-shadow: 0 0 30px rgba(255, 31, 140, 0.8), 0 4px 15px rgba(0, 0, 0, 0.4); }
    }

    .demo-video-play-icon {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      width: 100px;
      height: 100px;
      background: linear-gradient(135deg, var(--pink-main) 0%, var(--pink-neon) 100%);
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 
        0 10px 30px rgba(255, 31, 140, 0.4),
        inset 0 2px 5px rgba(255, 255, 255, 0.3);
      z-index: 3;
      cursor: pointer;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .demo-video-play-icon:hover {
      transform: translate(-50%, -50%) scale(1.1);
      box-shadow: 
        0 15px 40px rgba(255, 31, 140, 0.6),
        inset 0 2px 5px rgba(255, 255, 255, 0.3);
    }

    .demo-video-play-icon::before {
      content: '';
      width: 0;
      height: 0;
      border-left: 30px solid #ffffff;
      border-top: 20px solid transparent;
      border-bottom: 20px solid transparent;
      margin-left: 8px;
    }

    .demo-video-3d-icons {
      position: absolute;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      pointer-events: none;
      z-index: 1;
    }

    .demo-icon-1,
    .demo-icon-2,
    .demo-icon-3 {
      position: absolute;
      width: 60px;
      height: 60px;
      background: linear-gradient(135deg, var(--pink-main) 0%, var(--pink-neon) 100%);
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 28px;
      box-shadow: 
        0 8px 20px rgba(255, 31, 140, 0.3),
        inset 0 2px 4px rgba(255, 255, 255, 0.3);
      transform: perspective(500px) rotateY(-15deg) rotateX(10deg);
      animation: float 3s ease-in-out infinite;
    }

    .demo-icon-1 {
      top: -30px;
      left: 10%;
      animation-delay: 0s;
    }

    .demo-icon-2 {
      top: -30px;
      right: 10%;
      animation-delay: 1s;
    }

    .demo-icon-3 {
      bottom: -30px;
      left: 50%;
      transform: translateX(-50%) perspective(500px) rotateY(15deg) rotateX(-10deg);
      animation-delay: 2s;
    }

    @keyframes float {
      0%, 100% { transform: translateY(0) perspective(500px) rotateY(-15deg) rotateX(10deg); }
      50% { transform: translateY(-15px) perspective(500px) rotateY(-15deg) rotateX(10deg); }
    }

    @keyframes fadeInUp {
      from {
        opacity: 0;
        transform: translateY(30px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    @media (max-width: 768px) {
      .demo-video-section {
        margin: 40px auto;
        padding: 50px 15px;
        border-radius: 20px;
      }

      .demo-video-headline {
        font-size: 28px;
      }

      .demo-video-subtitle {
        font-size: 20px;
        margin-bottom: 30px;
      }

      .demo-video-text {
        font-size: 32px;
        letter-spacing: 0.1em;
      }

      .demo-video-play-icon {
        width: 80px;
        height: 80px;
      }

      .demo-video-play-icon::before {
        border-left-width: 24px;
        border-top-width: 16px;
        border-bottom-width: 16px;
      }

      .demo-icon-1,
      .demo-icon-2,
      .demo-icon-3 {
        width: 45px;
        height: 45px;
        font-size: 20px;
      }
    }
    .demo-video-wrapper iframe {
    height: 490px;
}
       
       
  .tp-testimonials {
    padding: 80px 16px 30px;
    background: #fff;
  
  }

  .tp-testimonials-inner {
    max-width: 1120px;
    margin: 0 auto;
    text-align: center;
  }

.tp-testimonials-eyebrow {
    margin: 0 0 8px;
    font-size: 28px;
    font-weight: 700;
    text-transform: capitalize;
    color: #ff2b8b;
}

.tp-testimonials-sub {
    margin: 0 0 48px;
    font-size: 26px;
    color: #333;
    font-weight: 700;
    color: #ff2b8b;
}

  .tp-testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    margin-bottom: 10px;
  }

  .tp-test-card {
    position: relative;
    text-align: left;
    padding: 22px 22px 24px;
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.04);
    border: 1px solid rgba(0, 0, 0, 0.03);
    overflow: hidden;
  }

  /* subtle pastel overlays – different vibe for each card */
  .tp-test-card-a { background: linear-gradient(135deg, #ffe5f3 0%, #ffffff 55%, #ffeafc 100%); }
  .tp-test-card-b { background: linear-gradient(135deg, #e3f5ff 0%, #ffffff 55%, #e8f4ff 100%); }
  .tp-test-card-c { background: linear-gradient(135deg, #fff2d9 0%, #ffffff 55%, #ffeedf 100%); }
  .tp-test-card-d { background: linear-gradient(135deg, #e9ffe9 0%, #ffffff 55%, #f0fff2 100%); }
  .tp-test-card-e { background: linear-gradient(135deg, #f3ecff 0%, #ffffff 55%, #f7f0ff 100%); }
  .tp-test-card-f { background: linear-gradient(135deg, #ffeef2 0%, #ffffff 55%, #ffe9eb 100%); }

.tp-test-avatar {
    display: flex;
    align-items: center;
    column-gap: 10px;
}

.tp-test-avatar img {
    width: 60px;
    height: 60px;
    object-fit: cover;
    display: block;
    border-radius: 10000px;
    border: 1px solid #ff3457;
}

  .tp-test-name {
    margin: 0 0 2px;
    font-size: 18px;
    font-weight: 700;
    color: #111;
  }

.tp-test-role {
    margin: 0 0 3px;
    font-size: 13px;
    color: #777;
    font-style: italic;
    line-height: 1.2;
    position: relative;
    top: 3px;
}
  .tp-test-quote {
    margin: 0 0 12px;
    font-size: 16px;
    line-height: 1.5;
    color: #222;
    font-weight: 700;
  }

  .tp-test-details {
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.6;
    color: #444;
  }

  .tp-test-details span {
    color: #ff2b8b;
    font-weight: 700;
  }

  .tp-test-quote span {
    color: #ff2b8b;
    font-weight: 700;
  }

  .tp-test-bottom {
    text-align: center;
  }

 .tp-test-bottom-top {
    margin: 0 0 6px;
    font-size: 21px;
    color: #555;
}

.tp-test-bottom-mid {
    margin: 0 0 4px;
    font-size: 25px;
    font-weight: 600;
}

.tp-test-bottom-bottom {
    margin: 0;
    font-size: 39px;
    font-weight: 800;
    color: #ff2b8b;
    margin: 11px auto 20px;
    display: table;
    background: #fff;
    padding: 4px 17px;
    border-radius: 10px;
}

  .tp-not {
    color: #ff2b8b;
    text-transform: uppercase;
  }

  .tp-results {
    text-transform: uppercase;
  }

  /* Hover effect */
  .tp-test-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 50px rgba(0, 0, 0, 0.08);
    transition: all 0.18s ease;
  }

   
   
        .news-coverage-section {
      position: relative;
      max-width: 1400px;
      margin: 60px auto 80px;
      padding: 80px 30px;
      background: linear-gradient(135deg, 
        #ffffff 0%, 
        #fef3f8 10%, 
        #f0f9ff 25%, 
        #f5f3ff 45%, 
        #fff7ed 65%, 
        #ffffff 100%);
      border-radius: 32px;
      box-shadow: 0 12px 60px rgba(0, 0, 0, 0.1), 0 0 0 1px rgba(255, 31, 140, 0.15);
      overflow: hidden;
    }

    .news-coverage-section::before {
      content: '';
      position: absolute;
      top: -50%;
      left: -50%;
      width: 200%;
      height: 200%;
      background: 
        radial-gradient(circle at 15% 25%, rgba(255, 31, 140, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 85% 75%, rgba(37, 99, 235, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(123, 97, 255, 0.12) 0%, transparent 60%);
      animation: rotateBg 30s linear infinite;
      pointer-events: none;
      z-index: 0;
    }

    @keyframes rotateBg {
      0% { transform: rotate(0deg); }
      100% { transform: rotate(360deg); }
    }

    .news-coverage-container {
      position: relative;
      z-index: 1;
    }

    .news-coverage-header {
      text-align: center;
      margin-bottom: 10px;
    }

    .news-coverage-main-title {
      font-size: 40px;
      font-weight: 900;
      color: var(--text-main);
      line-height: 1.2;
      margin-bottom: 30px;
      letter-spacing: -0.03em;
    }

    .news-coverage-main-title .gradient-highlight {
      background: linear-gradient(135deg, #ff1f8c 0%, #7b61ff 50%, #2563eb 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      font-weight: 900;
    }

    .news-coverage-main-title .highlight-tiktok {
      color: var(--pink-main);
      font-weight: 900;
      text-shadow: 0 2px 12px rgba(255, 31, 140, 0.4);
    }

    .news-articles-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
      gap: 28px;
      margin-bottom: 50px;
    }

    .news-article-card {
      background: #ffffff;
      border-radius: 20px;
      padding: 32px;
      box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.05);
      transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      position: relative;
      overflow: hidden;
      border: 2px solid transparent;
    }

    .news-article-card::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 4px;
      background: linear-gradient(90deg, #ff1f8c, #7b61ff, #2563eb);
      transform: scaleX(0);
      transform-origin: left;
      transition: transform 0.4s ease;
    }

    .news-article-card:hover {
      transform: translateY(-8px);
      box-shadow: 0 16px 50px rgba(255, 31, 140, 0.2), 0 0 0 1px rgba(255, 31, 140, 0.3);
      border-color: rgba(255, 31, 140, 0.3);
    }

    .news-article-card:hover::before {
      transform: scaleX(1);
    }

    .news-article-source {
      display: inline-block;
      font-size: 12px;
      font-weight: 700;
      color: #6b7280;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      margin-bottom: 16px;
      padding: 6px 14px;
      background: linear-gradient(135deg, rgba(255, 31, 140, 0.1), rgba(123, 97, 255, 0.1));
      border-radius: 8px;
    }

    .news-article-badge {
      display: inline-block;
      font-size: 11px;
      font-weight: 800;
      color: #ffffff;
      background: linear-gradient(135deg, #ff1f8c, #ef4444);
      padding: 4px 12px;
      border-radius: 6px;
      margin-bottom: 12px;
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }

    .news-article-headline {
      font-size: 20px;
      font-weight: 700;
      color: var(--text-main);
      line-height: 1.4;
      margin-bottom: 12px;
      letter-spacing: -0.01em;
    }

    .news-article-headline.highlight-box {
      background: linear-gradient(135deg, rgba(255, 31, 140, 0.15), rgba(123, 97, 255, 0.15));
      padding: 16px;
      border-radius: 12px;
      border-left: 4px solid var(--pink-main);
    }

    .news-article-description {
      font-size: 15px;
      color: #6b7280;
      line-height: 1.6;
      margin-top: 12px;
    }

    .news-article-image {
      width: 100%;
      height: 180px;
      object-fit: cover;
      border-radius: 12px;
      margin-top: 16px;
      background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
    }

    .news-coverage-footer {
    text-align: center;
    margin-top: 20px;
    padding: 20px 10px;
    background: linear-gradient(135deg, rgba(255, 31, 140, 0.12) 0%, rgba(123, 97, 255, 0.12) 100%);
    border-radius: 24px;
    border: 2px solid rgba(255, 31, 140, 0.3);
    box-shadow: 0 8px 40px rgba(255, 31, 140, 0.2);
    position: relative;
    overflow: hidden;
}

    .news-coverage-footer::before {
      content: '';
      position: absolute;
      top: -50%;
      right: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle, rgba(255, 255, 255, 0.4) 0%, transparent 70%);
      animation: pulseGlow 4s ease-in-out infinite;
    }
.news-coverage-footer-text {
    font-size: 25px;
    font-weight: 800;
    color: var(--text-main);
    line-height: 1.3;
    position: relative;
    z-index: 1;
    letter-spacing: -0.02em;
    margin: 0;
}

    .news-coverage-footer-text .highlight-goldmine {
      background: linear-gradient(135deg, #ff1f8c 0%, #7b61ff 50%, #2563eb 100%);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      font-weight: 900;
    }

    @media (max-width: 992px) {
      .news-coverage-section {
        padding: 60px 25px;
        margin: 50px auto 60px;
      }

      .news-coverage-main-title {
        font-size: 36px;
      }

      .news-articles-grid {
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 24px;
      }

      .news-coverage-footer-text {
        font-size: 26px;
      }
    }

    @media (max-width: 768px) {
      .news-coverage-section {
        padding: 50px 20px;
        margin: 40px auto 50px;
        border-radius: 24px;
      }

      .news-coverage-main-title {
        font-size: 28px;
        margin-bottom: 24px;
      }

      .news-articles-grid {
        grid-template-columns: 1fr;
        gap: 20px;
        margin-bottom: 40px;
      }

      .news-article-card {
        padding: 24px;
      }

      .news-article-headline {
        font-size: 18px;
      }

      .news-coverage-footer {
        padding: 40px 24px;
        margin-top: 40px;
      }

      .news-coverage-footer-text {
        font-size: 22px;
      }
    }

     
     
  :root{
    --pink-main:#ff1f8c;
    --highlight-yellow:#fff64b;
  }
  .video-optimization-banner span.softawe-three {
    margin: 0 auto;
    display: table;
    font-size: 45px;
    border: 2px solid #ffffff;
    padding: 5px 20px;
    margin-bottom: 14px;
    border-radius: 10px;
    color: #fff !IMPORTANT;
    background: #5b34ff;
}
.video-optimization-banner span.softawe-three-head {
  box-shadow: 0 0 10px 1px #ddd;
  font-size: 54px;
  padding: 11px 40px;
  font-weight: 600;
  color: #008eb9;
  margin: 0px auto 20px;
  display: table;
  border-radius: 12px;
  background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
  color: #fff !important;
}
  .tp-showcase{
    margin:40px auto 30px;
    padding:0 0px;
    text-align:center;
    position:relative;
  }

  .tp-showcase__inner{
    position:relative;
    z-index:1;
  }

  .tp-showcase__pre{
    font-size:15px;
    font-weight:600;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:8px;
  }

  .tp-showcase__title{
    font-size:clamp(26px,3vw,32px);
    line-height:1.35;
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:24px;
    color:#0f172a;
  }
  .tp-showcase__title span{
    color:var(--pink-main);
  }

  /* Collage frame */
   .tp-showcase__frame{
    position:relative;
    max-width:980px;
    margin:0 auto 30px;
    border-radius:28px;
    padding:15px;
    background:
      radial-gradient(circle at 0 0,#f97316,transparent 55%),
      radial-gradient(circle at 100% 0,#22c55e,transparent 50%),
      radial-gradient(circle at 50% 100%,#6366f1,transparent 55%);
    box-shadow:
      0 26px 80px rgba(15,23,42,.55),
      0 0 0 1px rgba(255,255,255,.4);
    overflow:hidden;
  }

  /* subtle animated outer glow */
  .tp-showcase__border{
    position:absolute;
    inset:-80%;
    background:conic-gradient(
      from 140deg,
      #f97316,
      #fb7185,
      #a855f7,
      #22c55e,
      #38bdf8,
      #f97316
    );
    opacity:.32;
    filter:blur(40px);
    animation:tp-orbit 12s linear infinite;
    pointer-events:none;
  }
  @keyframes tp-orbit{
    0%{transform:rotate(0deg);}
    100%{transform:rotate(360deg);}
  }

  /* collage image background */
  .tp-showcase__image{
    position:relative;
    border-radius:22px;
    overflow:hidden;
    background-size:cover;
    background-position:center;
    aspect-ratio:16 / 7;
  }



  .tp-showcase__badge-top{
    font-size:10px;
    letter-spacing:.18em;
    text-transform:uppercase;
    opacity:.8;
  }
  .tp-showcase__badge-main{
    font-size:18px;
    font-weight:800;
    letter-spacing:.06em;
  }
  .tp-showcase__badge-main span{
    margin-left:4px;
    padding:1px 6px;
    border-radius:999px;
    background:linear-gradient(90deg,var(--pink-main),var(--highlight-yellow));
    color:#111827;
    font-size:11px;
    font-weight:800;
  }
  .tp-showcase__badge-sub{
    font-size:11px;
    opacity:.9;
  }

  /* diagonal light sweep */
  .tp-showcase__shine{
    position:absolute;
    inset:0;
    background:linear-gradient(120deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 100%);
    transform:translateX(-120%);
    mix-blend-mode:screen;
    animation:tp-shine 7s ease-in-out infinite;
    pointer-events:none;
  }
  @keyframes tp-shine{
    0%{transform:translateX(-130%);}
    18%{transform:translateX(130%);}
    100%{transform:translateX(130%);}
  }

  /* Text below */
  .tp-showcase__bigline{
    max-width:980px;
    margin:6px auto 6px;
    font-size:16px;
    line-height:1.7;
    font-weight:600;
    color:#111827;
  }
  .tp-showcase__bigline span{
    color:var(--pink-main);
  }

  .tp-showcase__smallline{
    font-size:19px;
    color:#6b7280;
    line-height:1.7;
  }
  .tp-showcase__smallline span{
    font-weight:700;
    color:#111827;
  }

  /* responsive tweaks */
  @media (max-width:768px){
    .tp-showcase__frame{
      border-radius:22px;
      padding:4px;
    }
    .tp-showcase__image{
      aspect-ratio:16 / 9;
    }
    .tp-showcase__badge{
      inset:auto 50% 12px;
      padding:8px 14px 9px;
    }
    .tp-showcase__badge-main{
      font-size:15px;
    }
    .tp-showcase__bigline{
      font-size:15px;
    }
  }
  @media (max-width:480px){
    .tp-showcase{
      margin-top:30px;
    }
    .tp-showcase__title{
      font-size:22px;
    }
    .tp-showcase__badge-sub{
      display:none;
    }
  }
 
<!-- ================== TOKPRIMEAI SHOWCASE SECTION ================== -->
 
  :root{
    --pink-main:#ff1f8c;
    --highlight-yellow:#fff64b;
  }

  .tp-showcase{
    margin:40px auto 30px;
    padding:0 0px;
    text-align:center;
    position:relative;
  }

  .tp-showcase__inner{
    position:relative;
    z-index:1;
  }

  .tp-showcase__pre{
    font-size:15px;
    font-weight:600;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:8px;
  }

  .tp-showcase__title{
    font-size:clamp(26px,3vw,32px);
    line-height:1.35;
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:24px;
    color:#0f172a;
  }
  .tp-showcase__title span{
    color:var(--pink-main);
  }

  /* Collage frame */
   .tp-showcase__frame{
    position:relative;
    max-width:980px;
    margin:0 auto 30px;
    border-radius:28px;
    padding:15px;
    background:
      radial-gradient(circle at 0 0,#f97316,transparent 55%),
      radial-gradient(circle at 100% 0,#22c55e,transparent 50%),
      radial-gradient(circle at 50% 100%,#6366f1,transparent 55%);
    box-shadow:
      0 26px 80px rgba(15,23,42,.55),
      0 0 0 1px rgba(255,255,255,.4);
    overflow:hidden;
  }

  /* subtle animated outer glow */
  .tp-showcase__border{
    position:absolute;
    inset:-80%;
    background:conic-gradient(
      from 140deg,
      #f97316,
      #fb7185,
      #a855f7,
      #22c55e,
      #38bdf8,
      #f97316
    );
    opacity:.32;
    filter:blur(40px);
    animation:tp-orbit 12s linear infinite;
    pointer-events:none;
  }
  @keyframes tp-orbit{
    0%{transform:rotate(0deg);}
    100%{transform:rotate(360deg);}
  }

  /* collage image background */
  .tp-showcase__image{
    position:relative;
    border-radius:22px;
    overflow:hidden;
    background-size:cover;
    background-position:center;
    aspect-ratio:16 / 7;
  }

  /* center badge */
  .tp-showcase__badge{
    position:relative;
    inset:auto 50% 0px;
    transform:translateX(-50%);
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:2px;
    padding:10px 20px 11px;
    border-radius:999px;
    background:rgba(0,0,0,.84);
    color:#f9fafb;
    backdrop-filter:blur(14px);
    box-shadow:
      0 18px 45px rgba(0,0,0,.8),
      0 0 0 1px rgba(148,163,184,.5);
  }

  .tp-showcase__badge-top{
    font-size:10px;
    letter-spacing:.18em;
    text-transform:uppercase;
    opacity:.8;
  }
  .tp-showcase__badge-main{
    font-size:18px;
    font-weight:800;
    letter-spacing:.06em;
  }
  .tp-showcase__badge-main span{
    margin-left:4px;
    padding:1px 6px;
    border-radius:999px;
    background:linear-gradient(90deg,var(--pink-main),var(--highlight-yellow));
    color:#111827;
    font-size:11px;
    font-weight:800;
  }
  .tp-showcase__badge-sub{
    font-size:11px;
    opacity:.9;
  }

  /* diagonal light sweep */
  .tp-showcase__shine{
    position:absolute;
    inset:0;
    background:linear-gradient(120deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 100%);
    transform:translateX(-120%);
    mix-blend-mode:screen;
    animation:tp-shine 7s ease-in-out infinite;
    pointer-events:none;
  }
  @keyframes tp-shine{
    0%{transform:translateX(-130%);}
    18%{transform:translateX(130%);}
    100%{transform:translateX(130%);}
  }

  /* Text below */
  .tp-showcase__bigline{
    max-width:980px;
    margin:6px auto 6px;
    font-size:16px;
    line-height:1.7;
    font-weight:600;
    color:#111827;
  }
  .tp-showcase__bigline span{
    color:var(--pink-main);
  }

  .tp-showcase__smallline{
    font-size:14px;
    color:#6b7280;
    line-height:1.7;
  }
  .tp-showcase__smallline span{
    font-weight:700;
    color:#111827;
  }

  /* responsive tweaks */
  @media (max-width:768px){
    .tp-showcase__frame{
      border-radius:22px;
      padding:4px;
    }
    .tp-showcase__image{
      aspect-ratio:16 / 9;
    }
    .tp-showcase__badge{
      inset:auto 50% 12px;
      padding:8px 14px 9px;
    }
    .tp-showcase__badge-main{
      font-size:15px;
    }
    .tp-showcase__bigline{
      font-size:15px;
    }
  }
  @media (max-width:480px){
    .tp-showcase{
      margin-top:30px;
    }
    .tp-showcase__title{
      font-size:22px;
    }
    .tp-showcase__badge-sub{
      display:none;
    }
  }
 

<!-- =============== MEGA FEATURES – AI VIDEO CREATION SUITE =============== -->
 
  :root{
    --mf-pink:#ff1f8c;
    --mf-blue:#2563eb;
    --mf-purple:#7b61ff;
    --mf-orange:#f97316;
    --mf-bg:#fdf2ff;
    --mf-text:#0f172a;
  }

  .mf-section{
    background:radial-gradient(circle at 0 0,#e0f2fe 0,#fdf2ff 40%,#fff 100%);
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--mf-text);
  }

  .mf-inner{
    max-width:1160px;
    margin:0 auto;
  }

.mf-eyebrow {
    text-align: center;
    font-size: 18px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--mf-blue);
    font-weight: 700;
    margin-bottom: 10px;
    margin: 0 auto 22px;
    display: table;
    border: 1px solid;
    border-radius: 100px;
    padding: 10px 30px;
}

  .mf-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:6px;
  }
  .mf-heading span{
    color:var(--mf-pink);
  }

  .mf-subheading{
    text-align:center;
    font-size:clamp(22px,2.6vw,28px);
    font-weight:800;
    margin-bottom:12px;
  }
  .mf-subheading span{
    color:var(--mf-pink);
  }

.mf-tagline {
    text-align: center;
    font-size: 22px;
    font-style: italic;
    color: var(--mf-pink);
    margin-bottom: 32px;
    font-weight: 700;
}

  /* top tab row */
  .mf-tabs{
    display:flex;
    gap:14px;
    justify-content:space-between;
    flex-wrap:wrap;
    margin:0 auto 24px;
  }

  .mf-tab{
    flex:1 1 160px;
    min-width:140px;
    cursor:pointer;
    border-radius:16px;
    padding:10px 14px;
    border:1px solid rgba(148,163,184,.6);
    background:linear-gradient(135deg,#ffffff,#f5f5ff);
    box-shadow:0 10px 24px rgba(148,163,184,.25);
    display:flex;
    align-items:center;
    gap:10px;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
  }
  .mf-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#ffe4f3,#e0f2fe);
    opacity:0;
    transition:opacity .18s ease;
  }
  .mf-tab-inner{
    position:relative;
    display:flex;
    align-items:center;
    gap:10px;
    width:100%;
  }
  .mf-tab-icon{
    width:30px;
    height:30px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
  }
  .mf-tab-title{
    font-size:14px;
    font-weight:700;
    line-height:1.3;
  }

  .mf-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#ff9ecf,#a5b4fc);
    box-shadow:0 16px 34px rgba(236,72,153,.45);
    transform:translateY(-3px);
  }
  .mf-tab.active::before{
    opacity:.25;
  }

  /* content panel */
.mf-panel-shell {
    margin-top: 6px;
    border-radius: 24px;
    padding: 1px;
    background: linear-gradient(135deg,#ff9ecf,#a5b4fc,#4ade80);
    box-shadow: 0 20px 60px rgba(148,163,184,.55);
    max-width: 1200px !important;
    margin: 20px auto 0;
}
  .mf-panel{
    border-radius:22px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
        align-items: center;
  }

  .mf-panel-copy-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }
  .mf-panel-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .mf-panel-title span{
    color:var(--mf-pink);
  }
  .mf-panel-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }
  .mf-panel-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
    color:#111827;
  }
  .mf-panel-bullets li{
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-bottom:6px;
  }
  .mf-panel-bullets li span.dot{
    font-size:16px;
    line-height:1.2;
    color:var(--mf-pink);
  }

  /* demo side */
  .mf-demo-card{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#fee2e2,#e0f2fe);
    box-shadow:0 16px 40px rgba(15,23,42,.25);
    display:flex;
    flex-direction:column;
    gap:10px;
  }
  .mf-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }
  .mf-demo-title{
    font-size:17px;
    font-weight:700;
    margin-bottom:2px;
  }
  .mf-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.35);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:13px;
    letter-spacing:.18em;
    text-transform:uppercase;
    position:relative;
    overflow:hidden;
  }
 .mf-demo-play {
    position: relative;
    bottom: 0;
    left: 0;
    padding: 0;
    border-radius: 999px;
    background: rgba(15,23,42,.8);
    color: #f9fafb;
    font-size: 11px;
    letter-spacing: .12em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 6px;
}
  .mf-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  /* fade animation when feature changes */
  .mf-panel,
  .mf-demo-card{
    transition:opacity .25s ease,transform .25s ease;
  }
  .mf-panel.is-switching,
  .mf-demo-card.is-switching{
    opacity:1;
    transform:translateY(6px);
  }

  /* responsive */
  @media (max-width:900px){
    .mf-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .mf-section{
      padding:60px 16px 70px;
    }
    .mf-tabs{
      flex-wrap:nowrap;
      overflow-x:auto;
      padding-bottom:4px;
      scrollbar-width:none;
    }
    .mf-tabs::-webkit-scrollbar{display:none;}
    .mf-tab{
      flex:0 0 70%;
    }
  }
 
 
  :root{
    --imgf-pink:#ff1f8c;
    --imgf-blue:#0ea5e9;
    --imgf-mint:#22c55e;
    --imgf-peach:#fb923c;
    --imgf-text:#0f172a;
  }

  .imgf-section{
    background:
      radial-gradient(circle at 0 0,#e0f2fe 0,#ecfdf3 40%,transparent 65%),
      radial-gradient(circle at 100% 0,#fee2e2 0,#fff7ed 40%,transparent 70%),
      #f4fbff;
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--imgf-text);
  }

  .imgf-inner{ max-width:1160px; margin:0 auto; }

  .imgf-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .imgf-heading span{ color:var(--imgf-pink); }

  .imgf-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--imgf-pink);
    margin-bottom:28px;
  }

  /* tabs row */
  .imgf-tabs{
    max-width:760px;
    margin:0 auto 24px;
    display:flex;
    gap:16px;
    justify-content:center;
    flex-wrap:wrap;
  }

  .imgf-tab{
    flex:1 1 220px;
    min-width:220px;
    cursor:pointer;
    border-radius:999px;
    padding:11px 18px;
    border:1px solid rgba(148,163,184,.7);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 26px rgba(148,163,184,.25);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    font-size:15px;
    font-weight:700;
  }
  .imgf-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#a5f3fc,#bef264);
    opacity:0;
    transition:opacity .18s ease;
  }
  .imgf-tab span.label{ position:relative; }
  .imgf-tab span.icon{
    position:relative;
    width:26px;height:26px;border-radius:999px;
    display:flex;align-items:center;justify-content:center;
    font-size:16px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
  }

  .imgf-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#0ea5e9,#22c55e);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(34,197,94,.55);
    transform:translateY(-3px);
  }
  .imgf-tab.active::before{ opacity:.25; }

  /* panel shell */
  .imgf-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#0ea5e9,#22c55e,#fb923c);
    box-shadow:0 20px 60px rgba(15,23,42,.35);
  }

  .imgf-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
  }

  .imgf-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .imgf-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .imgf-title span{ color:var(--imgf-pink); }

  .imgf-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .imgf-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .imgf-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .imgf-bullets li span.dot{
    font-size:16px;
    color:var(--imgf-pink);
  }

  /* demo card */
  .imgf-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fee2e2);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .imgf-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.4);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:13px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    overflow:hidden;
  }
  .imgf-demo-play{
    position: relative;
    bottom: 0;
    left: 0;
    padding: 0;
    border-radius: 999px;
    background: rgba(15,23,42,.86);
    color: #f9fafb;
    font-size: 11px;
    letter-spacing: .12em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 6px;
  }

  .imgf-panel,
  .imgf-demo{
    transition:opacity .1s ease,transform .1s ease;
  }
  .imgf-panel.is-switching,
  .imgf-demo.is-switching{
    opacity:1;
    transform:translateY(3px);
  }

  /* responsive */
  @media (max-width:900px){
    .imgf-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .imgf-section{ padding:60px 16px 70px; }
    .imgf-tabs{
      max-width:none;
      overflow-x:auto;
      flex-wrap:nowrap;
      padding-bottom:4px;
      scrollbar-width:none;
    }
    .imgf-tabs::-webkit-scrollbar{display:none;}
    .imgf-tab{ flex:0 0 80%; }
  }
 
 
  :root{
    --rmx-pink:#ff1f8c;
    --rmx-purple:#7c3aed;
    --rmx-orange:#fb923c;
    --rmx-blue:#0ea5e9;
    --rmx-text:#0f172a;
  }

  .rmx-section{
    background:
      radial-gradient(circle at 0 0,#f5f3ff 0,#fee2e2 40%,transparent 70%),
      radial-gradient(circle at 100% 0,#e0f2fe 0,#fef9c3 40%,transparent 70%),
      #fff7fb;
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--rmx-text);
  }

  .rmx-inner{
    max-width:1160px;
    margin:0 auto;
  }
  .rmx-title {
  font-size: 26px;
  font-weight: 800;
  margin-bottom: 10px;
  color: #ff1f8c;
}
.rmx-desc {
  font-size: 18px;
  line-height: 1.8;
  color: #000;
  margin-bottom: 10px;
}
  .rmx-heading {
    text-align: center;
    font-size: clamp(30px,3.3vw,45px);
    font-weight: 800;
    letter-spacing: .02em;
    margin-bottom: 23px;
}
  .rmx-heading span{
    color:var(--rmx-pink);
  }

  .rmx-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--rmx-pink);
    margin-bottom:28px;
  }

  /* tabs container */
  .rmx-tabs{
    max-width:1080px;
    margin:0 auto 24px;
    display:flex;
    flex-direction:column;
    gap:10px;
  }

  .rmx-tabs-row{
    display:flex;
    gap:14px;
    justify-content:center;
    flex-wrap:wrap;
  }

  .rmx-tabs-row--second{
    margin-top:4px;
  }

  .rmx-tab{
    flex:1 1 0;
    max-width:260px;
    cursor:pointer;
    border-radius:999px;
    padding:10px 18px;
    border:1px solid rgba(148,163,184,.7);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 26px rgba(148,163,184,.25);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    font-size:14px;
    font-weight:700;
    text-align:left;
    white-space:nowrap;
  }
  .rmx-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#a5b4fc,#f472b6);
    opacity:0;
    transition:opacity .18s ease;
  }
  .rmx-tab span.label{
    position:relative;
  }
  .rmx-tab span.icon{
    position:relative;
    width:24px;
    height:24px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .rmx-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#4f46e5,#ec4899);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(147,51,234,.55);
    transform:translateY(-3px);
  }
  .rmx-tab.active::before{
    opacity:.28;
  }

  /* panel shell */
  .rmx-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#4f46e5,#ec4899,#fb923c);
    box-shadow:0 20px 60px rgba(15,23,42,.35);
  }
  .yelow-bk {
  background: #f2ff0a;
  display: inline-block;
  padding: 10px 20px;
  font-size: 24px;
  font-weight: 600;
  border-radius: 10px;
  margin-bottom: 20px;
}
  .rmx-panel {
    border-radius: 24px;
    background: #ffffff;
    padding: 24px 26px 26px;
    display: flex;
    grid-template-columns: minmax(0,1.5fr) minmax(0,1.1fr);
    gap: 26px;
    transition: opacity .25s ease,transform .25s ease;
    align-items: center;
}
  .rmx-panel.is-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .rmx-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .rmx-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .rmx-title span{
    color:var(--rmx-pink);
  }

  .rmx-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .rmx-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .rmx-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .rmx-bullets li span.dot{
    font-size:16px;
    color:var(--rmx-pink);
  }

  /* demo card */
  .rmx-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fce7f3);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;

  }
  .rmx-demo.is-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .rmx-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .rmx-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .rmx-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.4);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .rmx-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.86);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .rmx-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  @media (max-width:900px){
    .rmx-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .rmx-section{
      padding:60px 16px 70px;
    }
    .rmx-tab{
      max-width:none;
      white-space:normal;
    }
    .rmx-demo-video{
      font-size:11px;
    }
  }
 
 
  :root{
    /* dedicated palette for section 4 */
    --disc4-pink:#ff2f92;
    --disc4-teal:#14b8a6;
    --disc4-blue:#2563eb;
    --disc4-yellow:#facc15;
    --disc4-text:#0f172a;
  }

  .disc4-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--disc4-text);
    background:
      radial-gradient(circle at 0 0,#e0f2fe 0,#fef9c3 40%,transparent 70%),
      radial-gradient(circle at 100% 100%,#fce7f3 0,#e0f2fe 40%,transparent 70%),
      #f8fafc;
  }

  .disc4-inner{
    max-width:1160px;
    margin:0 auto;
  }

  .disc4-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .disc4-heading span{
    color:var(--disc4-pink);
  }

  .disc4-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--disc4-pink);
    margin-bottom:26px;
  }

  /* TABS */
  .disc4-tabs{
    max-width:980px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    justify-content:center;
    flex-wrap:wrap;
  }

  .disc4-tab{
    flex:1 1 0;
    max-width:250px;
    border-radius:999px;
    padding:10px 18px;
    border:1px solid rgba(148,163,184,.7);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.25);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    white-space:nowrap;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
  }

  .disc4-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#4ade80,#60a5fa);
    opacity:0;
    transition:opacity .18s ease;
  }

  .disc4-tab span.label{
    position:relative;
  }

  .disc4-tab span.icon{
    position:relative;
    width:24px;
    height:24px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .disc4-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#22c55e,#0ea5e9);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(34,197,94,.55);
    transform:translateY(-3px);
  }
  .disc4-tab.active::before{
    opacity:.25;
  }

  /* PANEL */
  .disc4-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#22c55e,#0ea5e9,#f97316);
    box-shadow:0 20px 60px rgba(15,23,42,.35);
  }

  .disc4-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
       align-items: center;
  }
  .disc4-panel.disc4-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .disc4-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .disc4-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .disc4-title span{
    color:var(--disc4-pink);
  }

  .disc4-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .disc4-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .disc4-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .disc4-bullets li .dot{
    font-size:16px;
    color:var(--disc4-pink);
  }

  /* DEMO CARD */
  .disc4-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#dbeafe,#fef3c7);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .disc4-demo.disc4-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .disc4-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .disc4-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .disc4-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.4);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .disc4-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.86);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .disc4-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  @media (max-width:900px){
    .disc4-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .disc4-section{
      padding:60px 16px 70px;
    }
    .disc4-tab{
      max-width:none;
      white-space:normal;
    }
    .disc4-demo-video{
      font-size:11px;
    }
  }
 
 
  :root{
    /* Dedicated palette for section 5 */
    --spy5-pink:#ff2f92;
    --spy5-purple:#7c3aed;
    --spy5-sky:#0ea5e9;
    --spy5-mint:#22c55e;
    --spy5-text:#020617;
  }

  .spy5-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--spy5-text);
    background:
      radial-gradient(circle at 0 100%,rgba(129,140,248,.24),transparent 60%),
      radial-gradient(circle at 100% 0,rgba(45,212,191,.25),transparent 60%),
      linear-gradient(135deg,#fef3f2,#eef2ff);
  }

  .spy5-inner{
    max-width:1160px;
    margin:0 auto;
  }

  .spy5-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .spy5-heading span{
    color:var(--spy5-pink);
  }

  .spy5-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--spy5-pink);
    margin-bottom:26px;
  }

  /* TABS */
  .spy5-tabs{
    max-width:1000px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:center;
  }

  .spy5-tab{
    flex:1 1 0;
    max-width:260px;
    border-radius:999px;
    padding:10px 18px;
    border:1px solid rgba(148,163,184,.7);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.25);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    white-space:nowrap;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
  }

  .spy5-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#22c55e,#0ea5e9);
    opacity:0;
    transition:opacity .18s ease;
  }

  .spy5-tab span.label{
    position:relative;
  }

  .spy5-tab span.icon{
    position:relative;
    width:24px;
    height:24px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .spy5-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#22c55e,#0ea5e9,#7c3aed);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(76,81,191,.55);
    transform:translateY(-3px);
  }
  .spy5-tab.active::before{ opacity:.25; }

  /* PANEL */
  .spy5-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#22c55e,#0ea5e9,#f97316);
    box-shadow:0 20px 60px rgba(15,23,42,.35);
  }

  .spy5-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .spy5-panel.spy5-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .spy5-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .spy5-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .spy5-title span{
    color:var(--spy5-pink);
  }

  .spy5-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .spy5-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .spy5-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .spy5-bullets li .dot{
    font-size:16px;
    color:var(--spy5-pink);
  }

  /* DEMO CARD */
  .spy5-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fef3c7);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .spy5-demo.spy5-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .spy5-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .spy5-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .spy5-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.4);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .spy5-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.86);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .spy5-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  @media (max-width:900px){
    .spy5-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }

  @media (max-width:640px){
    .spy5-section{
      padding:60px 16px 70px;
    }
    .spy5-tab{
      max-width:none;
      white-space:normal;
    }
    .spy5-demo-video{
      font-size:11px;
    }
  }
 
 
  :root{
    /* Dedicated palette for section 6 */
    --cge6-pink:#ff3b9a;
    --cge6-orange:#fb923c;
    --cge6-blue:#6366f1;
    --cge6-teal:#14b8a6;
    --cge6-text:#020617;
  }

  .cge6-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--cge6-text);
    background:
      radial-gradient(circle at 0 0,rgba(244,114,182,.25),transparent 55%),
      radial-gradient(circle at 100% 100%,rgba(56,189,248,.23),transparent 55%),
      linear-gradient(135deg,#fef9c3,#fef3f2);
  }

  .cge6-inner{
    max-width:1160px;
    margin:0 auto;
  }

  .cge6-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .cge6-heading span{
    color:var(--cge6-pink);
  }

  .cge6-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--cge6-pink);
    margin-bottom:26px;
  }

  /* TABS */
  .cge6-tabs{
    max-width:900px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:center;
  }

  .cge6-tab{
    flex:1 1 0;
    max-width:260px;
    border-radius:999px;
    padding:9px 18px;
    border:1px solid rgba(148,163,184,.75);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.26);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    white-space:nowrap;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
  }

  .cge6-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#f97316,#6366f1);
    opacity:0;
    transition:opacity .18s ease;
  }

  .cge6-tab span.label{
    position:relative;
  }

  .cge6-tab span.icon{
    position:relative;
    width:24px;
    height:24px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .cge6-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#fb923c,#f97316,#6366f1);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(248,113,113,.58);
    transform:translateY(-3px);
  }
  .cge6-tab.active::before{ opacity:.25; }

  /* PANEL */
  .cge6-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#fb923c,#6366f1,#14b8a6);
    box-shadow:0 20px 60px rgba(15,23,42,.36);
  }

  .cge6-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .cge6-panel.cge6-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .cge6-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .cge6-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .cge6-title span{
    color:var(--cge6-pink);
  }

  .cge6-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .cge6-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .cge6-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .cge6-bullets li .dot{
    font-size:16px;
    color:var(--cge6-pink);
  }

  /* DEMO CARD */
  .cge6-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fee2e2);
    box-shadow:0 16px 40px rgba(15,23,42,.28);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .cge6-demo.cge6-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .cge6-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .cge6-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .cge6-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.42);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .cge6-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.9);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .cge6-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  @media (max-width:900px){
    .cge6-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }

  @media (max-width:640px){
    .cge6-section{
      padding:60px 16px 70px;
    }
    .cge6-tab{
      max-width:none;
      white-space:normal;
    }
    .cge6-demo-video{
      font-size:11px;
    }
  }
 
 
  :root{
    --agd7-pink:#ec4899;
    --agd7-indigo:#4f46e5;
    --agd7-sky:#0ea5e9;
    --agd7-text:#020617;
  }

  .agd7-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--agd7-text);
    background:
      radial-gradient(circle at 15% 0,rgba(251,113,133,.3),transparent 55%),
      radial-gradient(circle at 100% 85%,rgba(56,189,248,.35),transparent 55%),
      linear-gradient(135deg,#eff6ff,#fdf2ff);
  }

  .agd7-inner{max-width:1160px;margin:0 auto;}

  .agd7-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .agd7-heading span{color:var(--agd7-pink);}

  .agd7-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--agd7-pink);
    margin-bottom:26px;
  }

  /* TABS */
  .agd7-tabs{
    max-width:640px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:center;
  }

  .agd7-tab{
    flex:1 1 0;
    min-width:190px;
    border-radius:999px;
    padding:9px 18px;
    border:1px solid rgba(148,163,184,.75);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.26);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    white-space:nowrap;
  }

  .agd7-tab span.label{position:relative;}
  .agd7-tab span.icon{
    position:relative;
    width:24px;height:24px;
    border-radius:999px;
    display:flex;align-items:center;justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .agd7-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#ec4899,#4f46e5);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(129,140,248,.6);
    transform:translateY(-3px);
  }

  /* PANEL */
  .agd7-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#ec4899,#4f46e5,#0ea5e9);
    box-shadow:0 20px 60px rgba(15,23,42,.36);
  }

  .agd7-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .agd7-panel.agd7-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .agd7-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .agd7-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .agd7-title span{color:var(--agd7-indigo);}

  .agd7-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .agd7-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .agd7-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .agd7-bullets li .dot{
    font-size:16px;
    color:var(--agd7-pink);
  }

  /* DEMO */
  .agd7-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fce7f3);
    box-shadow:0 16px 40px rgba(15,23,42,.26);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .agd7-demo.agd7-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .agd7-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .agd7-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .agd7-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.42);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .agd7-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.9);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .agd7-demo-play span.icon{
    width:18px;height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#bfdbfe);
    color:#4f46e5;
    font-size:10px;
  }

  @media (max-width:900px){
    .agd7-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .agd7-section{padding:60px 16px 70px;}
    .agd7-tab{white-space:normal;}
    .agd7-demo-video{font-size:11px;}
  }
 
 
  :root{
    --sa8-violet:#8b5cf6;
    --sa8-cyan:#06b6d4;
    --sa8-amber:#f59e0b;
    --sa8-text:#020617;
  }

  .sa8-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--sa8-text);
    background:
      radial-gradient(circle at 10% 0,rgba(251,191,36,.35),transparent 55%),
      radial-gradient(circle at 100% 85%,rgba(59,130,246,.4),transparent 55%),
      linear-gradient(135deg,#eef2ff,#ecfeff);
  }

  .sa8-inner{max-width:1160px;margin:0 auto;}

  .sa8-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .sa8-heading span{color:var(--sa8-amber);}

  .sa8-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--sa8-amber);
    margin-bottom:26px;
  }

  /* TABS */
  .sa8-tabs{
    max-width:800px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:center;
  }

  .sa8-tab{
    flex:1 1 0;
    min-width:200px;
    border-radius:999px;
    padding:9px 18px;
    border:1px solid rgba(148,163,184,.75);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.26);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    white-space:nowrap;
  }

  .sa8-tab span.label{position:relative;}
  .sa8-tab span.icon{
    position:relative;
    width:24px;height:24px;
    border-radius:999px;
    display:flex;align-items:center;justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .sa8-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#8b5cf6,#06b6d4);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(59,130,246,.55);
    transform:translateY(-3px);
  }

  /* PANEL */
  .sa8-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#8b5cf6,#06b6d4,#f59e0b);
    box-shadow:0 20px 60px rgba(15,23,42,.36);
  }

  .sa8-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .sa8-panel.sa8-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .sa8-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .sa8-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .sa8-title span{color:var(--sa8-violet);}

  .sa8-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .sa8-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .sa8-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .sa8-bullets li .dot{
    font-size:16px;
    color:var(--sa8-cyan);
  }

  /* DEMO */
  .sa8-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#e0f2fe,#fef3c7);
    box-shadow:0 16px 40px rgba(15,23,42,.26);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .sa8-demo.sa8-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .sa8-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .sa8-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .sa8-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.42);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .sa8-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.9);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .sa8-demo-play span.icon{
    width:18px;height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#bfdbfe);
    color:#4f46e5;
    font-size:10px;
  }

  @media (max-width:900px){
    .sa8-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .sa8-section{padding:60px 16px 70px;}
    .sa8-tab{white-space:normal;}
    .sa8-demo-video{font-size:11px;}
  }
 
 
  :root{
    --tg9-pink:#ec4899;
    --tg9-indigo:#6366f1;
    --tg9-lime:#a3e635;
    --tg9-text:#020617;
  }

  .tg9-section{
    padding:70px 20px 90px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--tg9-text);
    background:
      radial-gradient(circle at 8% 0,rgba(236,72,153,.35),transparent 55%),
      radial-gradient(circle at 100% 95%,rgba(129,140,248,.45),transparent 55%),
      linear-gradient(135deg,#fdf2ff,#eef2ff);
  }

  .tg9-inner{max-width:1160px;margin:0 auto;}

  .tg9-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .tg9-heading span{color:var(--tg9-pink);}

  .tg9-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--tg9-pink);
    margin-bottom:26px;
  }

  /* TABS */
  .tg9-tabs{
    max-width:860px;
    margin:0 auto 24px;
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    justify-content:center;
  }

  .tg9-tab{
    flex:1 1 0;
    min-width:240px;
    border-radius:999px;
    padding:10px 18px;
    border:1px solid rgba(148,163,184,.75);
    background:linear-gradient(135deg,#ffffff,#f9fafb);
    box-shadow:0 10px 24px rgba(148,163,184,.26);
    display:flex;
    align-items:center;
    justify-content:flex-start;
    gap:10px;
    cursor:pointer;
    font-size:14px;
    font-weight:700;
    position:relative;
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    text-align:left;
  }

  .tg9-tab .label{
    position:relative;
    line-height:1.3;
  }
  .tg9-tab .label small{
    display:block;
    font-size:11px;
    font-weight:600;
    opacity:.8;
  }
  .tg9-tab .icon{
    position:relative;
    width:26px;height:26px;
    border-radius:999px;
    display:flex;align-items:center;justify-content:center;
    font-size:15px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
    flex-shrink:0;
  }

  .tg9-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#ec4899,#6366f1);
    color:#f9fafb;
    box-shadow:0 16px 40px rgba(129,140,248,.55);
    transform:translateY(-3px);
  }

  /* PANEL */
  .tg9-panel-shell{
    margin:0 auto;
    border-radius:26px;
    padding:1px;
    background:linear-gradient(135deg,#ec4899,#6366f1,#a3e635);
    box-shadow:0 20px 60px rgba(15,23,42,.36);
  }

  .tg9-panel{
    border-radius:24px;
    background:#ffffff;
    padding:24px 26px 26px;
    display:grid;
    grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr);
    gap:26px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .tg9-panel.tg9-switching{
    opacity:1;
    transform:translateY(3px);
  }

  .tg9-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }

  .tg9-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .tg9-title span{color:var(--tg9-indigo);}

  .tg9-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }

  .tg9-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .tg9-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .tg9-bullets li .dot{
    font-size:16px;
    color:var(--tg9-pink);
  }

  /* DEMO */
  .tg9-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#f9a8d4,#e0f2fe);
    box-shadow:0 16px 40px rgba(15,23,42,.26);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .tg9-demo.tg9-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .tg9-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .tg9-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .tg9-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.42);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .tg9-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.9);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .tg9-demo-play span.icon{
    width:18px;height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#bfdbfe);
    color:#4f46e5;
    font-size:10px;
  }

  @media (max-width:900px){
    .tg9-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .tg9-section{padding:60px 16px 70px;}
    .tg9-demo-video{font-size:11px;}
  }
 
 
  :root{
    --t10-pink:#ec4899;
    --t10-purple:#a855f7;
    --t10-indigo:#6366f1;
    --t10-cyan:#22d3ee;
    --t10-text:#020617;
  }
.t10-section {
    padding: 60px 20px 60px;
    font-family: "Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color: var(--t10-text);
    background: radial-gradient(circle at 0 0, rgba(236, 72, 153, .45), transparent 55%), radial-gradient(circle at 100% 0, rgba(56, 189, 248, .35), transparent 55%), radial-gradient(circle at 50% 105%, rgba(129, 140, 248, .55), transparent 55%), linear-gradient(135deg, #0f172a40, #14ff053b);
    margin-bottom: 50px;
}

  .t10-inner{max-width:1180px;margin:0 auto;}

.t10-heading {
    text-align: center;
    font-size: clamp(30px,3.4vw,40px);
    font-weight: 800;
    letter-spacing: .03em;
    color: #424242;
    margin-bottom: 8px;
}
  .t10-heading span{color:var(--t10-pink);}

  .t10-tagline{
    text-align:center;
    font-size:clamp(18px,2.1vw,22px);
    font-weight:600;
    color:#000;
    margin-bottom:30px;
  }

  /* FEATURE GRID */
  .t10-grid{
    max-width:980px;
    margin:0 auto 28px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr)); /* 4 + 4 + 2 layout on desktop */
    gap:12px;
  }

  .t10-tab{
    position:relative;
    border-radius:16px;
    padding:10px 10px 10px 14px;
    background:linear-gradient(135deg,rgba(15,23,42,.9),rgba(30,64,175,.85));
    border:1px solid rgba(148,163,184,.6);
    color:#e5e7eb;
    font-size:13px;
    font-weight:600;
    display:flex;
    align-items:center;
    gap:8px;
    cursor:pointer;
    text-align:left;
    box-shadow:0 10px 22px rgba(15,23,42,.7);
    overflow:hidden;
    transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease,opacity .18s ease;
  }

  .t10-tab .num{
    width:22px;height:22px;
    border-radius:999px;
    display:flex;
    align-items:center;justify-content:center;
    background:radial-gradient(circle at 30% 20%,#f9fafb,#fee2e2);
    color:#020617;
    font-size:11px;
    font-weight:800;
    flex-shrink:0;
  }
  .t10-tab .label{
    line-height:1.3;
  }

  .t10-tab::before{
    content:"";
    position:absolute;
    inset:-40%;
    background:conic-gradient(from 180deg,var(--t10-pink),var(--t10-indigo),var(--t10-cyan),var(--t10-pink));
    opacity:0;
    transition:opacity .2s ease;
    z-index:-1;
  }

  .t10-tab.active{
    border-color:transparent;
    background:radial-gradient(circle at 0 0,rgba(251,113,133,.18),transparent 55%),
               radial-gradient(circle at 100% 100%,rgba(96,165,250,.18),transparent 55%),
               linear-gradient(135deg,rgba(236,72,153,.95),rgba(99,102,241,.92));
    box-shadow:0 18px 40px rgba(59,130,246,.65);
    transform:translateY(-2px);
  }
  .t10-tab.active::before{opacity:.5;}
  .t10-tab:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(15,23,42,.85);}

  /* PANEL WRAP */
  .t10-panel-shell{
    max-width:1040px;
    margin:0 auto;
    padding:1px;
    border-radius:26px;
    background:linear-gradient(135deg,var(--t10-pink),var(--t10-indigo),var(--t10-cyan));
    box-shadow:0 26px 70px rgba(15,23,42,.95);
  }

  .t10-panel{
    border-radius:24px;
    background:radial-gradient(circle at 0 0,#0f172a,#020617 50%,#020617 70%);
    padding:26px 26px 28px;
    display:grid;
    grid-template-columns:minmax(0,1.6fr) minmax(0,1.2fr);
    gap:26px;
    color:#e5e7eb;
    transition:opacity .1s ease,transform .1s ease;
  }
  .t10-panel.t10-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .t10-copy{}
  .t10-eyebrow{
    font-size:12px;
    letter-spacing:.18em;
    text-transform:uppercase;
    font-weight:700;
    color:#9ca3af;
    margin-bottom:6px;
  }
  .t10-title{
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
  }
  .t10-title span{color:#a5b4fc;}
  .t10-desc{
    font-size:15px;
    line-height:1.8;
    color:#d1d5db;
    margin-bottom:10px;
  }

  .t10-bullets{
    list-style:none;
    padding-left:0;
    margin:0;
    font-size:14px;
  }
  .t10-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .t10-bullets .dot{
    color:var(--t10-pink);
    font-size:18px;
    line-height:1;
  }

  /* DEMO CARD */
  .t10-demo{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#f97316,#ec4899);
    box-shadow:0 16px 40px rgba(15,23,42,.9);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .1s ease,transform .1s ease;
  }
  .t10-demo.t10-switching{
    opacity:0;
    transform:translateY(3px);
  }

  .t10-demo-label{
    font-size:12px;
    letter-spacing:.18em;
    text-transform:uppercase;
    font-weight:700;
    color:#fee2e2;
  }
  .t10-demo-title{
    font-size:15px;
    font-weight:700;
    color:#f9fafb;
  }

  .t10-demo-video{
    position:relative;
    border-radius:14px;
    border:1px solid rgba(15,23,42,.9);
    background:#020617;
    padding:36px 16px 30px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:14px;
    text-align:center;
    color:#e5e7eb;
    font-size:11px;
    letter-spacing:.18em;
    text-transform:uppercase;
  }

  /* Decorative mini timeline */
  .t10-timeline{
    width:100%;
    max-width:260px;
    height:56px;
    border-radius:10px;
    background:radial-gradient(circle at 0 0,#0f172a,#020617);
    border:1px solid rgba(148,163,184,.3);
    padding:6px 10px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    position:relative;
    overflow:hidden;
  }
  .t10-timeline .lane{
    height:10px;
    border-radius:999px;
    background:linear-gradient(90deg,rgba(236,72,153,.9),rgba(56,189,248,.9));
  }
  .t10-timeline .lane-b{
    width:80%;
    opacity:.75;
  }
  .t10-timeline .lane-c{
    width:60%;
    opacity:.6;
  }
  .t10-timeline .lane-a{width:100%;}
  .t10-timeline .playhead{
    position:absolute;
    top:0;
    bottom:0;
    left:55%;
    width:2px;
    background:#e5e7eb;
    box-shadow:0 0 8px rgba(248,250,252,.8);
  }

  .t10-demo-play{
    position:absolute;
    left:12px;
    bottom:10px;
    padding:7px 11px;
    border-radius:999px;
    background:rgba(15,23,42,.9);
    border:1px solid rgba(148,163,184,.6);
    display:flex;
    align-items:center;
    gap:6px;
    font-size:10px;
    letter-spacing:.18em;
    text-transform:uppercase;
  }
  .t10-demo-play .play-icon{
    width:18px;height:18px;
    border-radius:999px;
    display:flex;
    align-items:center;justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fee2e2);
    color:#0f172a;
    font-size:10px;
  }

  @media (max-width:900px){
    .t10-panel{
      grid-template-columns:1fr;
      padding:22px 18px 24px;
    }
    .t10-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  }
  @media (max-width:640px){
    .t10-section{padding:70px 16px 80px;}
    .t10-grid{grid-template-columns:minmax(0,1fr);}
    .t10-demo-video{font-size:10px;}
  }
 
<!-- ===================== CTA SECTION ===================== -->


<!-- ===================== CTA STYLES ===================== -->
 
  .tp-cta {
    padding: 80px 16px 30px;
    background: #ffffff;
  }

  .tp-cta-inner {
    max-width: 1080px;
    margin: 0 auto;
    text-align: center;
   
  }

.tp-cta-eyebrow {
    max-width: 960px;
    margin: 24px auto 0;
    font-size: 18px;
    line-height: 1.6;
    color: #000;
    font-weight: 500;
    text-align: center;
}

.tp-cta-title {
    margin: 20px auto 0px;
    font-size: 32px;
    line-height: 1.3;
    font-weight: 600;
    color: #000;
    text-align: center;
}

  .tp-cta-title span {
    font-weight: 700;
  }

  .tp-cta-button {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px 64px;
    border-radius: 999px;
    background: linear-gradient(90deg, #ff7a3c 0%, #ff3f7c 40%, #b027ff 100%);
    color: #ffffff;
    text-decoration: none;
    font-weight: 800;
    font-size: 26px;
    letter-spacing: 0.02em;
    box-shadow: 0 18px 40px rgba(255, 67, 132, 0.35);
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
    margin-bottom: 26px;
  }

  .tp-cta-button-line1 {
    text-transform: none;
  }

  .tp-cta-button-line2 {
    font-size: 24px;
    margin-top: 4px;
  }

  .tp-cta-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 45px rgba(255, 67, 132, 0.45);
    filter: brightness(1.05);
  }

  .tp-cta-subline {
    margin: 0 auto 26px;
    font-size: 17px;
    color: #222222;
  }

  .tp-cta-subline .divider {
    margin: 0 8px;
    opacity: 0.45;
  }

  .tp-cta-trust {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 18px;
    margin-bottom: 40px;
  }

  .tp-cta-payments img {
    height: 40px;
    margin: 0 4px;
    object-fit: contain;
  }

  .tp-cta-guarantee img {
    height: 64px;
    object-fit: contain;
  }

  .tp-cta-bottom {
    margin: 0;
    font-size: 24px;
    line-height: 1.4;
    font-weight: 600;
    color: #111111;
  }

  /* -------- Responsive tweaks -------- */
  @media (max-width: 768px) {
    .tp-cta {
      padding: 60px 16px 80px;
    }

    .tp-cta-title {
      font-size: 24px;
    }

    .tp-cta-button {
      width: 100%;
      max-width: 420px;
      padding: 20px 20px;
      font-size: 22px;
    }

    .tp-cta-button-line2 {
      font-size: 20px;
    }

    .tp-cta-bottom {
      font-size: 20px;
    }

    .tp-cta-trust {
      gap: 12px;
    }

    .tp-cta-payments img {
      height: 32px;
    }

    .tp-cta-guarantee img {
      height: 56px;
    }
  }
 


<!-- ===================== TESTIMONIALS STYLES ===================== -->
 
  .tp-testimonials {
    padding: 80px 16px 30px;
    background: #fff;
  
  }

  .tp-testimonials-inner {
    max-width: 1180px;
    margin: 0 auto;
    text-align: center;
  }

.tp-testimonials-eyebrow {
    margin: 0 0 8px;
    font-size: 28px;
    font-weight: 700;
    text-transform: capitalize;
    color: #ff2b8b;
}

.tp-testimonials-sub {
    margin: 0 0 48px;
    font-size: 28px;
    color: #333;
    font-weight: 700;
    color: #ff2b8b;
}

  .tp-testimonials-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
    margin-bottom: 10px;
  }

  .tp-test-card {
    position: relative;
    text-align: left;
    padding: 22px 22px 24px;
    border-radius: 24px;
    background: #ffffff;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.04);
    border: 1px solid rgba(0, 0, 0, 0.03);
    overflow: hidden;
  }

  /* subtle pastel overlays – different vibe for each card */
  .tp-test-card-a { background: linear-gradient(135deg, #ffe5f3 0%, #ffffff 55%, #ffeafc 100%); }
  .tp-test-card-b { background: linear-gradient(135deg, #e3f5ff 0%, #ffffff 55%, #e8f4ff 100%); }
  .tp-test-card-c { background: linear-gradient(135deg, #fff2d9 0%, #ffffff 55%, #ffeedf 100%); }
  .tp-test-card-d { background: linear-gradient(135deg, #e9ffe9 0%, #ffffff 55%, #f0fff2 100%); }
  .tp-test-card-e { background: linear-gradient(135deg, #f3ecff 0%, #ffffff 55%, #f7f0ff 100%); }
  .tp-test-card-f { background: linear-gradient(135deg, #ffeef2 0%, #ffffff 55%, #ffe9eb 100%); }

.tp-test-avatar {
    display: flex;
    align-items: center;
    column-gap: 10px;
}

.tp-test-avatar img {
    width: 60px;
    height: 60px;
    object-fit: cover;
    display: block;
    border-radius: 10000px;
    border: 1px solid #ff3457;
}

  .tp-test-name {
    margin: 0 0 2px;
    font-size: 18px;
    font-weight: 700;
    color: #111;
  }

.tp-test-role {
    margin: 0 0 3px;
    font-size: 13px;
    color: #777;
    font-style: italic;
    line-height: 1.2;
    position: relative;
    top: 3px;
}
  .tp-test-quote {
    margin: 0;
    font-size: 15px;
    line-height: 1.6;
    color: #222;
  }

  .tp-test-quote span {
    color: #ff2b8b;
    font-weight: 700;
  }

  .tp-test-bottom {
    text-align: center;
  }

 .tp-test-bottom-top {
    margin: 0 0 6px;
    font-size: 21px;
    color: #555;
}

.tp-test-bottom-mid {
    margin: 0 0 4px;
    font-size: 25px;
    font-weight: 600;
}

.tp-test-bottom-bottom {
    margin: 0;
    font-size: 39px;
    font-weight: 800;
    color: #ff2b8b;
    margin: 11px auto 20px;
    display: table;
    background: #fff;
    padding: 4px 17px;
    border-radius: 10px;
}

  .tp-not {
    color: #ff2b8b;
    text-transform: uppercase;
  }

  .tp-results {
    text-transform: uppercase;
  }

  /* Hover effect */
  .tp-test-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 22px 50px rgba(0, 0, 0, 0.08);
    transition: all 0.18s ease;
  }

  /* Responsive */
  @media (max-width: 992px) {
    .tp-testimonials-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @media (max-width: 640px) {
    .tp-testimonials {
      padding: 60px 16px 70px;
    }

    .tp-testimonials-grid {
      grid-template-columns: minmax(0, 1fr);
    }

    .tp-test-card {
      padding: 18px 18px 20px;
    }
  }
 

 
  /* Space Grotesk everywhere for this section */
  @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

  :root {
    --tp-body-size: 15px;
    --tp-head-size: 20px;
  }

  .tp-income {
    padding: 90px 16px 100px;
    background: radial-gradient(circle at top, #ffe9ff 0, #fdf7ff 35%, #f3fbff 75%, #ecfff9 100%);
    font-family: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  }

  .tp-income-inner {
    max-width: 1160px;
    margin: 0 auto;
    color: #111;
    font-size: var(--tp-body-size);
  }

  /* Top heading block */
  .tp-income-head {
    text-align: center;
    margin-bottom: 52px;
  }

  .tp-income-highlight {
    display: inline-block;
    padding: 8px 24px;
    border-radius: 999px;
    background: linear-gradient(90deg, #ffe600, #ffef8a);
    font-weight: 800;
    font-size: var(--tp-head-size);
  }

.tp-income-eyebrow {
    margin: 10px 0 14px;
    color: #555;
    font-size: var(--tp-body-size);
    font-size: 20px;
}

  .tp-income-lead {
    margin: 0 0 12px;
    line-height: 1.6;
    font-size: var(--tp-body-size);
  }

  .tp-income-lead em {
    font-style: italic;
  }
.tp-income-intro {
    margin: 0;
    font-size: var(--tp-body-size);
    font-weight: 500;
    font-size: 20px;
    margin: 41px 0 0;
}

  /* Grid */
  .tp-income-grid {
    margin-top: 38px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 22px;
  }

  .money-card {
    position: relative;
    padding: 20px 22px 22px;
    border-radius: 20px;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.03);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.05);
    overflow: hidden;
  }

  /* Soft gradient strip in the corner */
  .money-card::before {
    content: "";
    position: absolute;
    inset: -40px -40px auto auto;
    background: radial-gradient(circle at top right, rgba(255, 91, 165, 0.35), transparent 60%);
    opacity: 0.75;
    pointer-events: none;
  }

  /* Color variations per card */
  .money-card-2::before { background: radial-gradient(circle at top right, rgba(255, 132, 91, 0.35), transparent 60%); }
  .money-card-3::before { background: radial-gradient(circle at top right, rgba(255, 208, 0, 0.35), transparent 60%); }
  .money-card-4::before { background: radial-gradient(circle at top right, rgba(0, 193, 255, 0.35), transparent 60%); }
  .money-card-5::before { background: radial-gradient(circle at top right, rgba(123, 104, 238, 0.35), transparent 60%); }
  .money-card-6::before { background: radial-gradient(circle at top right, rgba(0, 214, 170, 0.35), transparent 60%); }
  .money-card-7::before { background: radial-gradient(circle at top right, rgba(255, 145, 0, 0.35), transparent 60%); }
  .money-card-8::before { background: radial-gradient(circle at top right, rgba(0, 132, 255, 0.35), transparent 60%); }
  .money-card-9::before { background: radial-gradient(circle at top right, rgba(234, 95, 172, 0.35), transparent 60%); }
  .money-card-10::before { background: radial-gradient(circle at top right, rgba(0, 200, 120, 0.35), transparent 60%); }

  .money-card-header {
    display: grid;
    grid-template-columns: auto auto 1fr;
    align-items: center;
    column-gap: 10px;
    margin-bottom: 10px;
    position: relative;
    z-index: 1;
  }

  .money-card-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    background: #fff;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
  }

  .money-card-icon {
    font-size: 20px;
  }

  .money-card-title {
    margin: 0;
    font-size: var(--tp-head-size);
    line-height: 1.35;
    font-weight: 700;
  }

.money-card-text {
    margin: 0 0 4px;
    font-size: var(--tp-body-size);
    line-height: 1.6;
    position: relative;
    z-index: 1;
    font-size: 16px;
}

  .money-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.10);
    transition: all 0.2s ease;
  }

  /* Bottom pink callout */
  .tp-income-bottom {
    margin-top: 46px;
    text-align: center;
  }

  .tp-income-bottom-line1 {
    margin: 0 0 6px;
    font-size: var(--tp-body-size);
  }

  .tp-income-bottom-line1 span {
    color: #ff2b8b;
    font-weight: 600;
  }

.tp-income-bottom-line2 {
    margin: 0;
    font-size: var(--tp-head-size);
    font-weight: 700;
    color: #ff2b8b;
    box-shadow: 0 0 10px 1px #ddd;
    margin: 0 auto;
    display: table;
    padding: 14px 22px;
    background: #fff;
}

  /* Responsive */
  @media (max-width: 900px) {
    .tp-income {
      padding: 70px 16px 80px;
    }
    .tp-income-grid {
      grid-template-columns: minmax(0, 1fr);
    }
  }
 


 
  /* Use once globally; if you already imported Space Grotesk, you can remove this */
  @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

  :root {
    --tp-body-size: 15px;
    --tp-head-size: 20px;
  }

  .tp-mid-cta {
    padding: 80px 16px 70px;
    background: #ffffff;
    font-family: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  }

  .tp-mid-inner {
    max-width: 960px;
    margin: 0 auto;
    text-align: center;
    font-size: var(--tp-body-size);
    color: #111111;
  }

  /* CTA button */
  .tp-mid-button {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 22px 72px;
    border-radius: 999px;
    background: linear-gradient(90deg, #ff7a3c 0%, #ff3f7c 40%, #b027ff 100%);
    box-shadow: 0 18px 40px rgba(255, 67, 132, 0.35);
    text-decoration: none;
    color: #ffffff;
    font-weight: 800;
    letter-spacing: 0.02em;
    margin-bottom: 16px;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
  }

  .tp-mid-btn-line1 {
    font-size: var(--tp-head-size);
  }

  .tp-mid-btn-line2 {
    font-size: var(--tp-head-size);
    margin-top: 4px;
  }

  .tp-mid-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 22px 48px rgba(255, 67, 132, 0.45);
    filter: brightness(1.05);
  }

  /* Subline */
  .tp-mid-subline {
    margin: 0 0 16px;
    font-size: var(--tp-body-size);
    color: #222222;
  }

  /* Payment row */
  .tp-mid-trust {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    margin-bottom: 32px;
    flex-wrap: wrap;
  }

  .tp-mid-trust img {
    height: 40px;
    object-fit: contain;
  }

  /* Benefit headline */
  .tp-mid-benefit {
    margin: 0 0 34px;
    font-size: var(--tp-head-size);
    font-weight: 700;
    line-height: 1.5;
  }

  /* Soft divider */
  .tp-mid-divider {
    width: 120px;
    height: 3px;
    margin: 0 auto 26px;
    border-radius: 999px;
    background: linear-gradient(90deg, #ff2b8b, #ff824d);
    opacity: 0.8;
  }

  /* Teaser line */
  .tp-mid-teaser {
    margin: 0 0 10px;
    font-size: var(--tp-body-size);
    color: #111111;
  }

  /* Comparison heading */
  .tp-mid-compare {
    margin: 0;
    font-size: var(--tp-head-size);
    font-weight: 800;
    color: #ff2b2b;
  }

  /* Responsive tweaks */
  @media (max-width: 768px) {
    .tp-mid-button {
      width: 100%;
      max-width: 420px;
      padding: 18px 24px;
    }

    .tp-mid-trust img {
      height: 32px;
    }
  }
 

 
/* Base */
#tp-video-models, #tp-video-models *{
  font-family:"Space Grotesk",system-ui,sans-serif;
}

.tp-video-models{
  position:relative;
  padding:90px 20px;
  overflow:hidden;
}

/* TokPrimeAI background */
.tp-vm-bg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(700px 300px at 20% 0%, rgba(255,77,141,.12), transparent 60%),
    radial-gradient(700px 300px at 80% 0%, rgba(14,165,233,.12), transparent 60%),
    linear-gradient(#fdfdff, #f8f9ff);
  z-index:-1;
}

/* Intro */
.tp-vm-intro{text-align:center;max-width:960px;margin:0 auto 40px}
.tp-vm-pill{
  display:inline-block;
  padding:10px 22px;
  border-radius:999px;
  font-weight:900;
  font-size:13px;
  letter-spacing:.2em;
  background:#ffffff;
  border:2px solid rgba(99,102,241,.45);
  color:#4f46e5;
}
.tp-vm-title{font-size:40px;font-weight:900;margin:18px 0}
.tp-vm-title .pink{color:#ff4d8d}
.tp-vm-sub{color:#475569;font-size:17px}

/* Grid */
.tp-vm-grid{
  max-width:1160px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
}

/* Cards */
.tp-vm-card{
  border-radius:24px;
  padding:22px;
  border:1px solid rgba(148,163,184,.4);
  box-shadow:0 18px 46px rgba(15,23,42,.08);
  transition:.25s;
}
.tp-vm-card:hover{transform:translateY(-4px)}

/* Spacing fixes */
.tp-vm-top{
  display:flex;
  gap:8px;
  margin-bottom:10px;
  flex-wrap:wrap;
}
.tp-vm-name{
  font-weight:800;
  font-size:18px;
  margin-bottom:10px;
}

/* Backgrounds */
.model-fast{background:#f5f9ff}
.model-pro-t2v{background:#faf5ff}
.model-pro-i2v{background:#f3fcf7}
.model-pro-s2v{background:#fff8ec;border:2px solid rgba(251,146,60,.25)}

/* Headline highlight */
.tp-vm-headline{margin:12px 0 14px}
.tp-hl{
  display:inline-block;
  padding:6px 14px;
  border-radius:12px;
  font-weight:900;
  position:relative;
}
.tp-hl::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:12px;
  filter:blur(10px);
  opacity:.45;
  z-index:-1;
}

/* Highlight colors */
.model-fast .tp-hl{background:#eef4ff}
.model-fast .tp-hl::after{background:#c7dcff}
.model-pro-t2v .tp-hl{background:#f4ecff}
.model-pro-t2v .tp-hl::after{background:#d8c8ff}
.model-pro-i2v .tp-hl{background:#ecfff4}
.model-pro-i2v .tp-hl::after{background:#b7f0d6}
.model-pro-s2v .tp-hl{background:#fff3dc}
.model-pro-s2v .tp-hl::after{background:#ffd9a6}

/* Recommended glow */
.recommended{
  box-shadow:0 0 0 2px rgba(34,197,94,.35),
             0 0 24px rgba(34,197,94,.22);
}

/* Badges */
.tp-badge{
  padding:6px 14px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
}
.tp-badge.fast{background:#e0ecff;color:#1d4ed8}
.tp-badge.pro{background:#ede9fe;color:#6d28d9}
.tp-badge.coming{background:#ffedd5;color:#c2410c}

.tp-rec{
  background:#22c55e;
  color:#fff;
  font-weight:800;
  font-size:12px;
  padding:6px 14px;
  border-radius:999px;
}

/* Responsive */
@media(max-width:1100px){
  .tp-vm-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
  .tp-vm-grid{grid-template-columns:1fr}
}
 
 
  /* If already imported globally, you can remove this import */
  @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

  :root {
    --tp-body-size: 15px;
    --tp-head-size: 20px;
  }

  .tp-compare {
    padding: 80px 16px 90px;
    background: radial-gradient(circle at top left, #ffe9b3 0, #fff7e6 30%, #eef5ff 70%, #e5f8ff 100%);
    font-family: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #111;
  }

  .tp-compare-inner {
    max-width: 1120px;
    margin: 0 auto;
    text-align: center;
    font-size: var(--tp-body-size);
  }

  .tp-compare-head {
    margin-bottom: 28px;
  }
.tp-compare-title {
    margin: 0 0 6px;
    font-size: 23px;
    font-weight: 800;
    background: linear-gradient(90deg, #ff4f5e, #a347ff);
    -webkit-background-clip: text;
    color: transparent;
    border: 2px solid #ff4f5e;
    margin: 0 auto 13px;
    display: table;
    padding: 12px 12px;
    border-radius: 7px;
}
.tp-compare-subtitle {
    margin: 0;
    font-size: var(--tp-body-size);
    color: #444;
    font-size: 17px;
} 

  .tp-compare-card {
    margin-top: 30px;
    border-radius: 26px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 28px 80px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.9);
    overflow: hidden;
  }

  .tp-compare-table-wrap {
    overflow-x: auto;
  }

  .tp-compare-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 880px;
    text-align: left;
  }

  .tp-compare-table thead {
    background: linear-gradient(90deg, #f5f9ff, #fdfdff);
  }

  .tp-compare-table th,
  .tp-compare-table td {
    padding: 14px 18px;
    border-bottom: 1px solid rgba(15, 23, 42, 0.06);
    font-size: var(--tp-body-size);
  }

  .tp-compare-table th {
    font-weight: 600;
    color: #555;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-size: 13px;
  }

  .tp-compare-table tbody tr:nth-child(even):not(.is-best) {
    background: #fafbff;
  }

  .tp-compare-table tbody tr:hover {
    background: #f3f7ff;
  }

  .tp-compare-table td:first-child,
  .tp-compare-table th:first-child {
    width: 52px;
    text-align: center;
  }

  .tool-name {
    display: block;
    font-weight: 600;
  }

  .tool-name.primary {
    color: #0f9b4f;
  }

  .tool-tag {
    display: inline-block;
    margin-top: 4px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #eef2ff;
    font-size: 11px;
    color: #4b5aff;
    font-weight: 500;
  }

  .price-main,
  .limit-main {
    display: block;
    font-weight: 500;
  }

  .price-note {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    color: #6b7280;
  }

  .is-best {
    background: linear-gradient(90deg, #ebfff1, #e9fff9);
    box-shadow: inset 0 0 0 1px rgba(16, 185, 129, 0.16);
  }

  .best-col {
    text-align: right;
    white-space: nowrap;
  }

  .best-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    border-radius: 999px;
    background: linear-gradient(90deg, #22c55e, #16a34a);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
  }

  /* Bottom statement */
.tp-compare-bottom {
    margin: 26px auto 0;
    max-width: 880px;
    font-size: 20px;
    line-height: 1.5;
    font-weight: 600;
    color: #111;
    box-shadow: 0 0 10px 1px #ddd;
    background: #fff;
    padding: 10px 10px;
    border-radius: 6px;
}

  .tp-compare-bottom span {
    color: #ff2b8b;
  }

  /* Responsive */
  @media (max-width: 768px) {
    .tp-compare {
      padding: 70px 12px 80px;
    }

    .tp-compare-title {
      font-size: 22px;
    }

    .tp-compare-card {
      border-radius: 20px;
    }
  }
 
 
/* Space Grotesk only for this section */
#tp-trust,
#tp-trust *{
  font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

.tp-trust{
  padding: 80px 20px;
  background:
    radial-gradient(circle at 10% 10%, rgba(255,77,141,.14), transparent 55%),
    radial-gradient(circle at 90% 20%, rgba(34,197,94,.10), transparent 55%),
    radial-gradient(circle at 50% 100%, rgba(14,165,233,.10), transparent 60%);
}

.tp-trust-wrap{
  max-width: 1160px;
  margin: 0 auto;
}

.tp-trust-pill-wrap{
  display:flex;
  justify-content:center;
  margin-bottom: 16px;
}

.tp-trust-pill{
  padding: 12px 30px;
  border-radius: 999px;
  border: 2px solid rgba(64,115,255,.55);
  background: rgba(255,255,255,.55);
  backdrop-filter: blur(8px);
  font-weight: 900;
  letter-spacing: .26em;
  text-transform: uppercase;
  font-size: 14px;
  color: #3b6bff;
  box-shadow: 0 12px 28px rgba(59,107,255,.18);
}

/* Heavier headline + emphasis */
.tp-trust-title{
  text-align:center;
  font-size: clamp(30px, 3.2vw, 44px);
  font-weight: 950;
  letter-spacing: -0.02em;
  line-height: 1.08;
  margin: 0 0 12px;
  color: #0f172a;
  position: relative;
  display: inline-block;
  left: 50%;
  transform: translateX(-50%);
}

.tp-trust-title .pink{ color: #ff4d8d; }

.tp-trust-sub{
  text-align:center;
  max-width: 960px;
  margin: 0 auto 28px;
  font-size: 16px;
  line-height: 1.75;
  font-weight: 550;
  color: #334155;
}

.tp-trust-sub strong{
  font-weight: 900;
  color: #0f172a;
}

/* Shining headline ONLY on headline hover */
.tp-trust-title::after{
  content:"";
  position:absolute;
  top:-10%;
  left:-60%;
  width: 60%;
  height: 140%;
  transform: skewX(-18deg);
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.0),
    rgba(255,255,255,.65),
    rgba(255,255,255,.0),
    transparent
  );
  opacity: 0;
  pointer-events:none;
}

.tp-trust-title:hover{
  text-shadow: 0 10px 30px rgba(255,77,141,.12), 0 10px 30px rgba(14,165,233,.10);
}

.tp-trust-title:hover::after{
  opacity: 1;
  animation: tpShine 1.15s ease-in-out 1;
}

@keyframes tpShine{
  0%   { left:-60%; opacity:0; }
  10%  { opacity:1; }
  55%  { opacity:1; }
  100% { left:120%; opacity:0; }
}

/* Main card */
.tp-trust-card{
  border-radius: 26px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255,77,141,.9), rgba(14,165,233,.85), rgba(34,197,94,.85));
  box-shadow: 0 22px 70px rgba(15,23,42,.18);
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
}

.tp-trust-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 26px 80px rgba(15,23,42,.22);
  filter: saturate(1.05);
}

.tp-trust-card-inner{
  border-radius: 25px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  padding: 26px;
  display: grid;
  grid-template-columns: 1.6fr .9fr;
  gap: 22px;
}

.tp-trust-kicker{
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #64748b;
  margin-bottom: 10px;
}

.tp-trust-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.tp-trust-item{
  border-radius: 18px;
  border: 1px solid rgba(148,163,184,.45);
  background: linear-gradient(135deg, rgba(255,255,255,.85), rgba(248,250,252,.9));
  box-shadow: 0 12px 30px rgba(15,23,42,.08);
  padding: 14px 14px 12px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.tp-trust-item:hover{
  transform: translateY(-2px);
  border-color: rgba(255,77,141,.35);
  box-shadow: 0 16px 36px rgba(15,23,42,.10);
}

.tp-trust-item-top{
  display:flex;
  align-items:center;
  gap: 10px;
  margin-bottom: 6px;
}

.tp-ic{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: radial-gradient(circle at 30% 20%, #fff, #e5e7eb);
  box-shadow: 0 8px 16px rgba(15,23,42,.12);
  font-size: 16px;
}

.tp-trust-item h3{
  margin:0;
  font-size: 15px;
  font-weight: 950;
  color: #0f172a;
}

.tp-trust-item p{
  margin:0;
  font-size: 13.5px;
  line-height: 1.65;
  color:#475569;
}

/* Right column */
.tp-trust-right{
  display:flex;
  flex-direction: column;
  gap: 14px;
}

.tp-trust-badge{
  border-radius: 18px;
  border: 1px solid rgba(148,163,184,.45);
  background: linear-gradient(135deg, rgba(2,6,23,.92), rgba(15,23,42,.92));
  color: #e2e8f0;
  padding: 14px 14px 12px;
  box-shadow: 0 14px 40px rgba(2,6,23,.25);
}

.tp-trust-badge-top{
  display:flex;
  align-items:center;
  gap: 10px;
  margin-bottom: 8px;
}

.tp-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 18px rgba(34,197,94,.7);
}

.tp-trust-badge-title{
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 12px;
}

.tp-trust-badge-sub{
  font-size: 13.5px;
  color: rgba(226,232,240,.92);
}

.tp-trust-mini{
  border-radius: 18px;
  border: 1px solid rgba(148,163,184,.45);
  background: linear-gradient(135deg, rgba(255,255,255,.9), rgba(248,250,252,.92));
  padding: 14px 14px 12px;
  box-shadow: 0 12px 30px rgba(15,23,42,.08);
}

.tp-trust-mini-title{
  font-weight: 950;
  font-size: 15px;
  color: #0f172a;
  margin-bottom: 6px;
}

.tp-trust-mini-desc{
  margin: 0 0 10px;
  font-size: 13.5px;
  line-height: 1.65;
  color:#475569;
}

.tp-trust-bullets{
  list-style: none;
  padding:0;
  margin:0 0 10px;
  display:flex;
  flex-direction: column;
  gap: 8px;
}

.tp-trust-bullets li{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  font-size: 13.5px;
  color:#334155;
}

.tp-trust-bullets .chk{
  width: 18px;
  height: 18px;
  border-radius: 6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(34,197,94,.15);
  color: #16a34a;
  font-weight: 950;
  flex: 0 0 18px;
  margin-top: 1px;
}

.tp-trust-footer{
  font-size: 12.5px;
  color:#0f172a;
  font-weight: 900;
  padding-top: 10px;
  border-top: 1px solid rgba(148,163,184,.35);
}

/* Responsive */
@media (max-width: 980px){
  .tp-trust-card-inner{ grid-template-columns: 1fr; }
  .tp-trust-grid{ grid-template-columns: 1fr; }
  .tp-trust-title{
    left:auto;
    transform:none;
    display:block;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .tp-trust-card,
  .tp-trust-item,
  .tp-trust-title::after{
    animation: none !important;
    transition: none !important;
  }
}
 

 
  :root{
    --tp-pink:#ec4899;
    --tp-purple:#8b5cf6;
    --tp-indigo:#4f46e5;
    --tp-emerald:#22c55e;
    --tp-red:#ef4444;
    --tp-text:#0f172a;
  }

  .tp-offer{
    padding:60px 16px 60px;
    font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    color:var(--tp-text);
    background:
      radial-gradient(circle at 0 0,rgba(236,72,153,.16),transparent 55%),
      radial-gradient(circle at 100% 0,rgba(56,189,248,.16),transparent 55%),
      radial-gradient(circle at 50% 100%,rgba(129,140,248,.22),transparent 55%),
      #f9fafb;
  }

  .tp-offer-inner{
    max-width:1180px;
    margin:0 auto;
  }

  .tp-offer-headline{
    text-align:center;
    margin-bottom:34px;
  }
  .tp-offer-headline h2{
    font-size:clamp(26px,3vw,38px);
    font-weight:800;
    letter-spacing:.03em;
    color:#111827;
    margin-bottom:6px;
  }
  .tp-offer-headline h2 span {
    display: block;
    background: linear-gradient(120deg, var(--tp-pink), var(--tp-purple), var(--tp-indigo));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin: 0 auto;
    display: table;
    border-bottom: 4px solid #ec4899;
}
.tp-offer-headline p {
    font-size: 21px;
    color: #6b7280;
    margin-top: 18px;
}

  /* MAIN CARD */
  .tp-offer-card{
    display:grid;
    grid-template-columns:minmax(0,1.4fr) minmax(0,1.1fr);
    gap:32px;
    padding:22px;
    border-radius:26px;
    background:
      radial-gradient(circle at 0 0,rgba(236,72,153,.12),transparent 60%),
      radial-gradient(circle at 100% 0,rgba(14,165,233,.12),transparent 60%),
      #ffffff;
    box-shadow:0 28px 80px rgba(15,23,42,.12);
    border:1px solid rgba(148,163,184,.35);
  }

  /* LEFT LIST */
  .tp-offer-left{
    display:flex;
    flex-direction:column;
    gap:14px;
  }

  .tp-offer-row{
    display:flex;
    gap:12px;
    padding:12px 12px 12px 10px;
    border-radius:18px;
    background:rgba(248,250,252,.9);
    border:1px solid rgba(209,213,219,.8);
    box-shadow:0 8px 18px rgba(15,23,42,.04);
  }

  .tp-offer-icon{
    width:26px;
    height:26px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    font-size:14px;
    font-weight:800;
    color:white;
  }
  .tp-offer-icon.positive{
    background:radial-gradient(circle at 30% 20%,#bbf7d0,#22c55e);
    box-shadow:0 0 0 3px rgba(34,197,94,.25);
  }
  .tp-offer-icon.negative{
    background:radial-gradient(circle at 30% 20%,#fee2e2,#ef4444);
    box-shadow:0 0 0 3px rgba(239,68,68,.25);
  }

  .tp-offer-copy h3{
    font-size:15px;
    font-weight:700;
    margin-bottom:4px;
    color:#111827;
  }
  .tp-offer-copy p{
    font-size:13px;
    line-height:1.6;
    color:#4b5563;
  }

  /* RIGHT MOCKUP */
  .tp-offer-right{
    display:flex;
    align-items:center;
    justify-content:center;
  }

  .tp-offer-mockup-wrap{
    position:relative;
    width:100%;
    max-width:420px;
    aspect-ratio:3/4;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .tp-offer-glow{
    position:absolute;
    inset:8%;
    border-radius:32px;
    background:radial-gradient(circle at 50% 10%,rgba(251,191,36,.85),transparent 55%),
               radial-gradient(circle at 50% 60%,rgba(236,72,153,.8),transparent 70%);
    filter:blur(3px);
    opacity:.95;
  }
  .tp-offer-mockup{
    position:relative;
    width:100%;
    height:100%;
    object-fit:contain;
  }

  .tp-offer-badge{
    position:absolute;
    bottom:14px;
    left:50%;
    transform:translateX(-50%);
    padding:7px 16px;
    border-radius:999px;
    background:rgba(15,23,42,.92);
    border:1px solid rgba(248,250,252,.75);
    font-size:11px;
    letter-spacing:.16em;
    text-transform:uppercase;
    color:#f9fafb;
    display:flex;
    align-items:center;
    gap:6px;
    box-shadow:0 12px 25px rgba(15,23,42,.6);
  }
  .tp-offer-badge::before{
    content:"⏳";
    font-size:13px;
  }

  /* CTA STRIP */
  .tp-offer-cta{
    margin-top:34px;
    text-align:center;
    padding:18px 16px 8px;
  }
  .tp-offer-cta h3 {
    font-size: clamp(19px,2.2vw,28px);
    font-weight: 800;
    margin-bottom: 10px;
    color: #37c300;
    font-size: 40px;
}
  .tp-offer-cta h3 span:nth-of-type(1){
    color:var(--tp-pink);
  }
  .tp-offer-cta h3 span:nth-of-type(2){
    background:linear-gradient(120deg,var(--tp-purple),var(--tp-indigo));
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  .tp-offer-cta p {
    max-width: 1030px;
    margin: 0 auto;
    font-size: 20px;
    color: #000000;
    line-height: 1.7;
}
.price-highlight {
  color: #facc15;
  font-size: 26px;
  font-weight: 900;
  text-shadow: 0 0 20px rgba(250, 204, 21, 0.6);
}
.calculations-intro {
  font-size: 21px;
  color: #000;
  max-width: 900px;
  margin: 0 auto;
  line-height: 1.6;
}
.calculations-proposition {
    color: #000;
}
.card-title {
    font-size: 20px;
    font-weight: 700;
    color: #000;
    margin-bottom: 18px;
    line-height: 1.3;
}
.calculation-formula {
    font-size: 18px;
    color: #000;
    font-weight: 600;
}
.calculation-benefit {
    font-size: 15px;
    color: #000;
    font-style: italic;
    margin-top: 8px;
}
.cta-title {
    font-size: 29px;
    font-weight: 800;
    color: #000;
    margin-bottom: 15px;
    line-height: 1.3;
}
.cta-benefits {
    font-size: 18px;
    color: #000;
    line-height: 1.6;
    max-width: 900px;
    margin: 0 auto;
}
.cta-benefits strong {
    color: #ff3cf0;
    font-weight: 700;
}
.calculations-intro strong {
  color: #facc15;
  font-weight: 600;
}
  /* RESPONSIVE */
  @media (max-width:960px){
    .tp-offer-card{
      grid-template-columns:1fr;
      padding:18px;
    }
    .tp-offer-right{
      order:-1;
    }
  }
  @media (max-width:640px){
    .tp-offer{
      padding:70px 14px 80px;
    }
    .tp-offer-row{
      padding:10px 10px 11px;
    }
  }
 

<!-- ================== TOKPRIMEAI SHOWCASE SECTION ================== -->
 
  :root{
    --pink-main:#ff1f8c;
    --highlight-yellow:#fff64b;
  }

  .tp-showcase{
    margin:40px auto 80px;
    padding:0 20px;
    text-align:center;
    position:relative;
  }

  .tp-showcase__inner{
    position:relative;
    z-index:1;
  }

  .tp-showcase__pre{
    font-size:15px;
    font-weight:600;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:8px;
  }

  .tp-showcase__title{
    font-size:clamp(26px,3vw,32px);
    line-height:1.35;
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:24px;
    color:#0f172a;
  }
  .tp-showcase__title span{
    color:var(--pink-main);
  }

  /* Collage frame */
   .tp-showcase__frame{
    position:relative;
    max-width:980px;
    margin:0 auto 30px;
    border-radius:28px;
    padding:15px;
    background:
      radial-gradient(circle at 0 0,#f97316,transparent 55%),
      radial-gradient(circle at 100% 0,#22c55e,transparent 50%),
      radial-gradient(circle at 50% 100%,#6366f1,transparent 55%);
    box-shadow:
      0 26px 80px rgba(15,23,42,.55),
      0 0 0 1px rgba(255,255,255,.4);
    overflow:hidden;
  }

  /* subtle animated outer glow */
  .tp-showcase__border{
    position:absolute;
    inset:-80%;
    background:conic-gradient(
      from 140deg,
      #f97316,
      #fb7185,
      #a855f7,
      #22c55e,
      #38bdf8,
      #f97316
    );
    opacity:.32;
    filter:blur(40px);
    animation:tp-orbit 12s linear infinite;
    pointer-events:none;
  }
  @keyframes tp-orbit{
    0%{transform:rotate(0deg);}
    100%{transform:rotate(360deg);}
  }

  /* collage image background */
  .tp-showcase__image{
    position:relative;
    border-radius:22px;
    overflow:hidden;
    background-size:cover;
    background-position:center;
    aspect-ratio:16 / 7;
  }

  /* center badge */  

  .tp-showcase__badge-top{
    font-size:10px;
    letter-spacing:.18em;
    text-transform:uppercase;
    opacity:.8;
  }
  .tp-showcase__badge-main{
    font-size:18px;
    font-weight:800;
    letter-spacing:.06em;
  }
  .tp-showcase__badge-main span{
    margin-left:4px;
    padding:1px 6px;
    border-radius:999px;
    background:linear-gradient(90deg,var(--pink-main),var(--highlight-yellow));
    color:#111827;
    font-size:11px;
    font-weight:800;
  }
  .tp-showcase__badge-sub{
    font-size:11px;
    opacity:.9;
  }

  /* diagonal light sweep */
  .tp-showcase__shine{
    position:absolute;
    inset:0;
    background:linear-gradient(120deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 100%);
    transform:translateX(-120%);
    mix-blend-mode:screen;
    animation:tp-shine 7s ease-in-out infinite;
    pointer-events:none;
  }
  @keyframes tp-shine{
    0%{transform:translateX(-130%);}
    18%{transform:translateX(130%);}
    100%{transform:translateX(130%);}
  }

  /* Text below */
  .tp-showcase__bigline{
    max-width:980px;
    margin:6px auto 6px;
    font-size:16px;
    line-height:1.7;
    font-weight:600;
    color:#111827;
  }
  .tp-showcase__bigline span{
    color:var(--pink-main);
  }

  .tp-showcase__smallline{
    font-size:14px;
    color:#6b7280;
    line-height:1.7;
  }
  .tp-showcase__smallline span{
    font-weight:700;
    color:#111827;
  }

  /* responsive tweaks */
  @media (max-width:768px){
    .tp-showcase__frame{
      border-radius:22px;
      padding:4px;
    }
    .tp-showcase__image{
      aspect-ratio:16 / 9;
    }
    .tp-showcase__badge{
      inset:auto 50% 12px;
      padding:8px 14px 9px;
    }
    .tp-showcase__badge-main{
      font-size:15px;
    }
    .tp-showcase__bigline{
      font-size:15px;
    }
  }
  @media (max-width:480px){
    .tp-showcase{
      margin-top:30px;
    }
    .tp-showcase__title{
      font-size:22px;
    }
    .tp-showcase__badge-sub{
      display:none;
    }
  }
 
 
  /* Import once globally if not already done */
  @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

  :root {
    --tp-body-size: 15px;
    --tp-head-size: 20px;
  }

  .tp-guarantee {
    position: relative;
    padding: 90px 16px 90px;
    background-color: #020617; /* deep slate */
    background-image:
      linear-gradient(0deg, rgba(148,163,184,0.12) 1px, transparent 1px),
      linear-gradient(90deg, rgba(148,163,184,0.12) 1px, transparent 1px);
    background-size: 80px 80px;
    font-family: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont,
                 "Segoe UI", sans-serif;
    color: #e5e7eb;
    overflow: hidden;
  }

  .tp-guarantee-overlay {
    position: absolute;
    inset: -30%;
    background:
      radial-gradient(circle at top left, rgba(56,189,248,0.30), transparent 55%),
      radial-gradient(circle at bottom right, rgba(244,63,94,0.25), transparent 55%);
    opacity: 0.9;
    pointer-events: none;
  }

  .tp-guarantee-inner {
    position: relative;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1.1fr);
    gap: 40px;
    align-items: center;
    z-index: 1;
  }

  /* LEFT COPY */
  .tp-guarantee-copy {
    text-align: left;
    font-size: var(--tp-body-size);
  }

  .tp-guarantee-kicker {
    margin: 0 0 10px;
    font-size: var(--tp-head-size);
    font-weight: 700;
    color: #f9fafb;
  }

  .tp-guarantee-title {
    margin: 0 0 20px;
    font-size: 26px; /* hero within this section */
    line-height: 1.25;
    font-weight: 800;
    background: linear-gradient(90deg, #fb7185, #f9a8d4);
    -webkit-background-clip: text;
    color: transparent;
  }

  .tp-guarantee-text p {
    margin: 0 0 6px;
    font-size: var(--tp-body-size);
    line-height: 1.7;
  }

  .tp-guarantee-highlight {
    margin-top: 14px;
    font-weight: 500;
  }

  .tp-guarantee-highlight span {
    color: #fbbf24;
    font-weight: 700;
  }

  .tp-guarantee-bold {
    margin-top: 12px;
    font-weight: 700;
    font-size: var(--tp-body-size);
  }

  .tp-guarantee-footer {
    margin-top: 18px;
    font-size: var(--tp-head-size);
    font-weight: 500;
  }

  .tp-guarantee-footer span {
    color: #fb7185;
    font-weight: 700;
  }

  /* RIGHT VISUALS */
  .tp-guarantee-visual {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .tp-guarantee-mockup {
    position: relative;
    max-width: 420px;
    width: 100%;
    transform: translateY(4px);
  }

  .guarantee-product {
    width: 100%;
    display: block;
    border-radius: 22px;
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.7);
  }

  .guarantee-badge {
    position: absolute;
    right: -14%;
    top: 5%;
    width: 46%;
    max-width: 220px;
    filter: drop-shadow(0 22px 60px rgba(0,0,0,0.8));
  }

  .tp-guarantee-mockup::before {
    content: "";
    position: absolute;
    inset: auto 8% -18px 8%;
    height: 40px;
    background: radial-gradient(circle at 50% 0,
                rgba(15,23,42,0.65), transparent 70%);
    opacity: 0.9;
    z-index: -1;
  }

  /* Hover micro animation */
  .tp-guarantee-mockup:hover {
    transform: translateY(0);
    transition: transform 0.25s ease;
  }

  /* Responsive */
  @media (max-width: 960px) {
    .tp-guarantee-inner {
      grid-template-columns: minmax(0, 1fr);
      text-align: center;
    }

    .tp-guarantee-copy {
      text-align: center;
    }

    .tp-guarantee-visual {
      order: -1;
    }

    .tp-guarantee-mockup {
      max-width: 360px;
      margin: 0 auto 10px;
    }

    .guarantee-badge {
      right: -4%;
      top: -4%;
    }
  }

  @media (max-width: 640px) {
    .tp-guarantee {
      padding: 70px 16px 70px;
    }

    .tp-guarantee-title {
      font-size: 22px;
    }

    .tp-guarantee-footer {
      font-size: 18px;
    }
  }
 
   
    :root{
      --tp-bg: #ffffff;
      --tp-border: #f02fc2;
      --tp-border2: #6094ea;
      --tp-accent: #ff3b8d;
      --tp-accent-soft: rgba(255,59,141,.1);
      --tp-text-main:#101118;
      --tp-text-muted:#6b7280;
      --tp-success:#14b8a6;
      --tp-radius-xl: 28px;
      --tp-radius-lg: 22px;
      --tp-shadow-soft: 0 28px 70px rgba(15,23,42,.12);
      --tp-shadow-hover: 0 32px 90px rgba(15,23,42,.22);
      --tp-gradient: linear-gradient(135deg,#ff8a00,#ff3b8d,#7c3aed);
    }

    *{
      box-sizing:border-box;
      margin:0;
      padding:0;
    }

    body{
      font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
      background:#ffffff;
      color:var(--tp-text-main);
      -webkit-font-smoothing:antialiased;
    }

    .tp-page-wrap{
      min-height:100vh;
      display:flex;
      justify-content:center;
      padding:72px 16px 120px;
      background:
        radial-gradient(circle at top left,rgba(255,138,0,.06),transparent 55%),
        radial-gradient(circle at bottom right,rgba(96,148,234,.09),transparent 55%);
    }

    .tp-pricing-shell{
      width:100%;
      max-width:900px;
      margin-inline:auto;
    }

    /* ---------- Headline ---------- */

.tp-top-note {
    text-align: center;
    font-size: 19px;
    text-transform: capitalize;
    letter-spacing: 0;
    color: var(--tp-accent);
    margin-bottom: 10px;
    font-weight: 600;
}

    .tp-main-headline{
      text-align:center;
      font-size:48px;
      line-height:1.15;
      font-weight:700;
      margin-bottom:10px;
    }
.tp-main-headline span {
    background: var(--tp-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    border: 2px solid #b83bc1;
    padding: 0 11px;
    border-radius: 11px;
}

    .tp-sub-headline{
      text-align:center;
      font-size:18px;
      color:var(--tp-text-muted);
      margin-bottom:26px;
    }

    /* ---------- Main card ---------- */
    .tp-pricing-grid {
      display: flex !important;
      align-items: flex-start;
  }
    .tp-pricing-card {
    position: relative;
    background: rgba(255,255,255,.96);
    border-radius: var(--tp-radius-xl);
    padding: 26px 26px 30px;
    box-shadow: var(--tp-shadow-soft);
    border: 1px solid transparent;
    background-image: linear-gradient(#ffffff,#ffffff),
        linear-gradient(135deg,var(--tp-border),var(--tp-border2));
    background-origin: border-box;
    background-clip: padding-box,border-box;
    overflow: hidden;
    width: 50%;
}

    .tp-pricing-card::before{
      content:"";
      position:absolute;
      inset:-120px;
      background:
        radial-gradient(circle at 10% 0,rgba(255,138,0,.12),transparent 55%),
        radial-gradient(circle at 90% 100%,rgba(96,148,234,.18),transparent 55%);
      opacity:.6;
      pointer-events:none;
      z-index:-1;
    }

    .tp-ribbon{
      position:absolute;
      top:28px;
      right:16px;
      padding:6px 14px;
      border-radius:999px;
      font-size:11px;
      font-weight:600;
      letter-spacing:.14em;
      text-transform:uppercase;
      color:#fff;
      background:var(--tp-gradient);
      box-shadow:0 12px 30px rgba(124,58,237,.45);
    }

    .tp-pricing-header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    margin-bottom: 22px;
    justify-content: center;
}

    .tp-plan-title{
      font-size:22px;
      font-weight:700;
      display:flex;
      align-items:center;
      gap:10px;
    }
    .tp-plan-stars{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:2px;
      font-size:16px;
    }

    .tp-plan-tag{
      font-size:11px;
      text-transform:uppercase;
      letter-spacing:.16em;
      color:var(--tp-text-muted);
    }

    .tp-price-wrap{
      margin-left:auto;
      text-align:right;
    }

    .tp-price-main{
      font-size:34px;
      font-weight:700;
    }
    .tp-price-main span{
      font-size:22px;
      font-weight:500;
      color:var(--tp-text-muted);
      text-decoration:line-through;
      margin-right:8px;
    }

    .tp-price-sub{
      font-size:16px;
      color:var(--tp-text-muted);
    }

    /* ---------- CTA ---------- */

  .tp-cta-wrap {
    margin: 12px 0 22px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    flex-direction: column;
}

  .tp-cta-main {
    /* flex: 1 1 220px; */
    padding: 12px 20px;
    border-radius: 999px;
    border: none;
    cursor: pointer;
    font-size: 18px;
    font-weight: 600;
    color: #fff;
    background: var(--tp-gradient);
    box-shadow: 0 15px 40px rgba(124,58,237,.5);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    transition: all .18s ease-out;
}

    .tp-cta-main span.small{
      font-size:14px;
      font-weight:500;
      opacity:.85;
      text-transform:uppercase;
      letter-spacing:.16em;
    }

    .tp-cta-main:hover{
      transform:translateY(-1px) scale(1.02);
      box-shadow:0 21px 58px rgba(124,58,237,.65);
    }

 .tp-cta-note {
    /* flex: 1 1 160px; */
    font-size: 17px;
    color: var(--tp-text-muted);
    line-height: 1.4;
    text-align: center;
}

    .tp-cta-note strong{
      color:var(--tp-success);
      font-weight:600;
    }

    /* ---------- Coupon bar ---------- */

  .tp-coupon-bar {
    margin: 0 0 18px;
    padding: 10px 16px;
    border-radius: 999px;
    background: rgba(15,23,42,.02);
    border: 1px dashed rgba(148,163,184,.8);
    font-size: 18px;
    display: flex;
    align-items: center;
    gap: 10px;
    text-align: center;
    justify-content: center;
}

    .tp-coupon-pill{
      padding:4px 10px;
      border-radius:999px;
      background:rgba(56,189,248,.16);
      color:#0369a1;
      font-weight:600;
      font-size:11px;
      text-transform:uppercase;
      letter-spacing:.14em;
    }

    .tp-coupon-code{
      font-weight:600;
      font-size:12px;
      padding:3px 9px;
      border-radius:999px;
      background:#0f172a;
      color:#e5e7eb;
      margin-left:4px;
    }

    /* ---------- Features list ---------- */

    .tp-pricing-features{
      display:grid;
      grid-template-columns:1fr; /* SINGLE COLUMN */
      gap:14px;
      margin:20px 0 24px;
      text-align:left;
    }

    .tp-feature-card{
      position:relative;
      padding:13px 14px 12px 14px;
      border-radius:20px;
      background:rgba(255,255,255,.96);
      border:1px solid rgba(226,232,240,.9);
      box-shadow:0 10px 25px rgba(15,23,42,.04);
      display:flex;
      gap:12px;
      align-items:flex-start;
      overflow:hidden;
      transition:
        box-shadow .18s ease-out,
        transform .18s ease-out,
        border-color .18s ease-out,
        background .18s ease-out;
    }

    .tp-feature-card::after{
      content:"";
      position:absolute;
      inset:0;
      opacity:0;
      background:radial-gradient(circle at top left,rgba(255,138,0,.14),transparent 60%);
      pointer-events:none;
      transition:opacity .18s ease-out;
    }

    .tp-feature-icon{
      position:relative;
      flex:0 0 40px;
      height:40px;
      border-radius:18px;
      background:radial-gradient(circle at 15% 0,rgba(255,255,255,.9),transparent 50%),var(--tp-gradient);
      display:flex;
      align-items:center;
      justify-content:center;
      box-shadow:0 10px 25px rgba(124,58,237,.45);
      color:#fff;
      font-size:20px;
    }

    .tp-feature-text{
      position:relative;
      z-index:1;
    }

    .tp-feature-title{
      font-size:21px;
      font-weight:600;
      margin-bottom:3px;
    }
    .tp-feature-bullets li {
    margin: 3px 0;
}
.tp-feature-bullets {
    list-style: none;
    font-size: 17px;
    color:#000;
    line-height: 1.45;
    padding: 0;
}

    .tp-feature-bullets li::before{
      content:"•";
      margin-right:4px;
      color:var(--tp-accent);
    }

    /* Hover glow */
    .tp-feature-card:hover{
      transform:translateY(-3px);
      box-shadow:var(--tp-shadow-hover);
      border-color:rgba(251,113,133,.9);
      background:linear-gradient(135deg,#ffffff,rgba(254,242,242,.92));
    }
    .tp-feature-card:hover::after{
      opacity:.9;
    }

    /* ---------- Guarantee / footer ---------- */

    .tp-footer-row{
      display:flex;
      flex-wrap:wrap;
      gap:14px;
      align-items:center;
      justify-content:space-between;
      font-size:11px;
      color:var(--tp-text-muted);
    }

    .tp-guarantee{
      display:flex;
      align-items:center;
      gap:8px;
    }

    .tp-guarantee span.badge{
      padding:5px 10px;
      border-radius:999px;
      background:rgba(22,163,74,.08);
      color:#15803d;
      font-size:10px;
      font-weight:600;
      text-transform:uppercase;
      letter-spacing:.16em;
    }

.tp-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    width: 100%;
}
.tp-badge-pill {
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(15,23,42,.03);
    border: 1px solid rgba(226,232,240,.9);
    font-size: 16px;
}

    /* ---------- Reveal animation on scroll ---------- */

.reveal {
    opacity: 1;
    transform: translateY(24px);
    transition: opacity .55s cubic-bezier(.19,1,.22,1),
                 transform .55s cubic-bezier(.19,1,.22,1);
    max-width: 100%;
    margin: 0 auto;
    width: 100%;
}
    .reveal.visible{
      opacity:1;
      transform:translateY(0);
    }

    /* responsive tweaks */
    @media (max-width:640px){
      .tp-pricing-card{
        padding:20px 18px 22px;
      }
      .tp-pricing-header{
        flex-direction:column;
        align-items:flex-start;
      }
      .tp-price-wrap{
        text-align:left;
        margin-left:0;
      }
      .tp-cta-wrap{
        flex-direction:column;
        align-items:stretch;
      }
      .tp-footer-row{
        flex-direction:column;
        align-items:flex-start;
      }
      .tp-badges{
        justify-content:flex-start;
      }
    }
   
   
  /* Import once globally if not already done */
  @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

  :root {
    --tp-body-size: 15px;
    --tp-head-size: 20px;
  }

  .tp-guarantee {
    position: relative;
    padding: 90px 16px 90px;
    background-color: #020617; /* deep slate */
    background-image:
      linear-gradient(0deg, rgba(148,163,184,0.12) 1px, transparent 1px),
      linear-gradient(90deg, rgba(148,163,184,0.12) 1px, transparent 1px);
    background-size: 80px 80px;
    font-family: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont,
                 "Segoe UI", sans-serif;
    color: #e5e7eb;
    overflow: hidden;
  }

  .tp-guarantee-overlay {
    position: absolute;
    inset: -30%;
    background:
      radial-gradient(circle at top left, rgba(56,189,248,0.30), transparent 55%),
      radial-gradient(circle at bottom right, rgba(244,63,94,0.25), transparent 55%);
    opacity: 0.9;
    pointer-events: none;
  }

  .tp-guarantee-inner {
    position: relative;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1.1fr);
    gap: 40px;
    align-items: center;
    z-index: 1;
  }

  /* LEFT COPY */
  .tp-guarantee-copy {
    text-align: left;
    font-size: var(--tp-body-size);
  }

  .tp-guarantee-kicker {
    margin: 0 0 10px;
    font-size: var(--tp-head-size);
    font-weight: 700;
    color: #f9fafb;
  }

  .tp-guarantee-title {
    margin: 0 0 20px;
    font-size: 26px; /* hero within this section */
    line-height: 1.25;
    font-weight: 800;
    background: linear-gradient(90deg, #fb7185, #f9a8d4);
    -webkit-background-clip: text;
    color: transparent;
  }

  .tp-guarantee-text p {
    margin: 0 0 6px;
    font-size: var(--tp-body-size);
    line-height: 1.7;
  }

  .tp-guarantee-highlight {
    margin-top: 14px;
    font-weight: 500;
  }

  .tp-guarantee-highlight span {
    color: #fbbf24;
    font-weight: 700;
  }

  .tp-guarantee-bold {
    margin-top: 12px;
    font-weight: 700;
    font-size: var(--tp-body-size);
  }

  .tp-guarantee-footer {
    margin-top: 18px;
    font-size: var(--tp-head-size);
    font-weight: 500;
  }

  .tp-guarantee-footer span {
    color: #fb7185;
    font-weight: 700;
  }

  /* RIGHT VISUALS */
  .tp-guarantee-visual {
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .tp-guarantee-mockup {
    position: relative;
    max-width: 420px;
    width: 100%;
    transform: translateY(4px);
  }

  .guarantee-product {
    width: 100%;
    display: block;
    border-radius: 22px;
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.7);
  }

  .guarantee-badge {
    position: absolute;
    right: -14%;
    top: 5%;
    width: 46%;
    max-width: 220px;
    filter: drop-shadow(0 22px 60px rgba(0,0,0,0.8));
  }

  .tp-guarantee-mockup::before {
    content: "";
    position: absolute;
    inset: auto 8% -18px 8%;
    height: 40px;
    background: radial-gradient(circle at 50% 0,
                rgba(15,23,42,0.65), transparent 70%);
    opacity: 0.9;
    z-index: -1;
  }

  /* Hover micro animation */
  .tp-guarantee-mockup:hover {
    transform: translateY(0);
    transition: transform 0.25s ease;
  }

  /* Responsive */
  @media (max-width: 960px) {
    .tp-guarantee-inner {
      grid-template-columns: minmax(0, 1fr);
      text-align: center;
    }

    .tp-guarantee-copy {
      text-align: center;
    }

    .tp-guarantee-visual {
      order: -1;
    }

    .tp-guarantee-mockup {
      max-width: 360px;
      margin: 0 auto 10px;
    }

    .guarantee-badge {
      right: -4%;
      top: -4%;
    }
  }

  @media (max-width: 640px) {
    .tp-guarantee {
      padding: 70px 16px 70px;
    }

    .tp-guarantee-title {
      font-size: 22px;
    }

    .tp-guarantee-footer {
      font-size: 18px;
    }
  }
 


<!-- ================== TOKPRIMEAI SHOWCASE SECTION ================== -->
 
  :root{
    --pink-main:#ff1f8c;
    --highlight-yellow:#fff64b;
  }

  .tp-showcase{
    margin:40px auto 30px;
    padding:0 0px;
    text-align:center;
    position:relative;
  }

  .tp-showcase__inner{
    position:relative;
    z-index:1;
  }

  .tp-showcase__pre{
    font-size:15px;
    font-weight:600;
    letter-spacing:.18em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:8px;
  }

  .tp-showcase__title{
    font-size:clamp(26px,3vw,32px);
    line-height:1.35;
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:24px;
    color:#0f172a;
  }
  .tp-showcase__title span{
    color:var(--pink-main);
  }

  /* Collage frame */
   .tp-showcase__frame{
    position:relative;
    max-width:980px;
    margin:0 auto 30px;
    border-radius:28px;
    padding:15px;
    background:
      radial-gradient(circle at 0 0,#f97316,transparent 55%),
      radial-gradient(circle at 100% 0,#22c55e,transparent 50%),
      radial-gradient(circle at 50% 100%,#6366f1,transparent 55%);
    box-shadow:
      0 26px 80px rgba(15,23,42,.55),
      0 0 0 1px rgba(255,255,255,.4);
    overflow:hidden;
  }

  /* subtle animated outer glow */
  .tp-showcase__border{
    position:absolute;
    inset:-80%;
    background:conic-gradient(
      from 140deg,
      #f97316,
      #fb7185,
      #a855f7,
      #22c55e,
      #38bdf8,
      #f97316
    );
    opacity:.32;
    filter:blur(40px);
    animation:tp-orbit 12s linear infinite;
    pointer-events:none;
  }
  @keyframes tp-orbit{
    0%{transform:rotate(0deg);}
    100%{transform:rotate(360deg);}
  }

  /* collage image background */
  .tp-showcase__image{
    position:relative;
    border-radius:22px;
    overflow:hidden;
    background-size:cover;
    background-position:center;
    aspect-ratio:16 / 7;
  }

  /* center badge */

  .tp-showcase__badge-top{
    font-size:10px;
    letter-spacing:.18em;
    text-transform:uppercase;
    opacity:.8;
  }
  .tp-showcase__badge-main{
    font-size:18px;
    font-weight:800;
    letter-spacing:.06em;
  }
  .tp-showcase__badge-main span{
    margin-left:4px;
    padding:1px 6px;
    border-radius:999px;
    background:linear-gradient(90deg,var(--pink-main),var(--highlight-yellow));
    color:#111827;
    font-size:11px;
    font-weight:800;
  }
  .tp-showcase__badge-sub{
    font-size:11px;
    opacity:.9;
  }

  /* diagonal light sweep */
  .tp-showcase__shine{
    position:absolute;
    inset:0;
    background:linear-gradient(120deg,rgba(255,255,255,0) 0%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 100%);
    transform:translateX(-120%);
    mix-blend-mode:screen;
    animation:tp-shine 7s ease-in-out infinite;
    pointer-events:none;
  }
  @keyframes tp-shine{
    0%{transform:translateX(-130%);}
    18%{transform:translateX(130%);}
    100%{transform:translateX(130%);}
  }

  /* Text below */
  .tp-showcase__bigline{
    max-width:980px;
    margin:6px auto 6px;
    font-size:16px;
    line-height:1.7;
    font-weight:600;
    color:#111827;
  }
  .tp-showcase__bigline span{
    color:var(--pink-main);
  }

  .tp-showcase__smallline{
    font-size:14px;
    color:#6b7280;
    line-height:1.7;
  }
  .tp-showcase__smallline span{
    font-weight:700;
    color:#111827;
  }

  /* responsive tweaks */
  @media (max-width:768px){
    .tp-showcase__frame{
      border-radius:22px;
      padding:4px;
    }
    .tp-showcase__image{
      aspect-ratio:16 / 9;
    }
    .tp-showcase__badge{
      inset:auto 50% 12px;
      padding:8px 14px 9px;
    }
    .tp-showcase__badge-main{
      font-size:15px;
    }
    .tp-showcase__bigline{
      font-size:15px;
    }
  }
  @media (max-width:480px){
    .tp-showcase{
      margin-top:30px;
    }
    .tp-showcase__title{
      font-size:22px;
    }
    .tp-showcase__badge-sub{
      display:none;
    }
  }
 

 
  /* Import once globally; remove if already included */
  @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

  :root {
    --tp-body-size: 15px;
    --tp-head-size: 20px;
  }

  .tp-strip {
    padding: 40px 16px 50px;
    background: #ffffff;
    font-family: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont,
                 "Segoe UI", sans-serif;
  }

  .tp-strip-inner {
    max-width: 980px;
    margin: 0 auto;
    text-align: center;
    font-size: var(--tp-body-size);
    color: #111111;
  }

  .tp-strip-line {
    margin: 0 0 14px;
    font-size: var(--tp-body-size);
    color: #1f2933;
  }

  .tp-strip-icons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    margin-bottom: 26px;
    flex-wrap: wrap;
  }

  .tp-strip-icons img {
    height: 40px;
    object-fit: contain;
    filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.08));
  }

  .tp-strip-benefit {
    margin: 0;
    font-size: var(--tp-head-size);
    font-weight: 800;
    line-height: 1.5;

    /* Gradient text like “Coming Soon” */
    background: linear-gradient(90deg, #ff2f92 0%, #8b5cf6 50%, #3b82f6 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
  }

  @media (max-width: 768px) {
    .tp-strip {
      padding: 32px 12px 40px;
    }

    .tp-strip-icons img {
      height: 34px;
    }
  }
 

 
  @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

  :root {
    --tp-body-size: 15px;
    --tp-head-size: 20px;
  }

.tp-faq {
    padding: 30px 16px 60px;
    background: #ffffff;
    font-family: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont,
                 "Segoe UI", sans-serif;
}

  .tp-faq-inner {
    max-width: 1120px;
    margin: 0 auto;
    font-size: var(--tp-body-size);
    color: #111827;
  }

  .tp-faq-head {
    text-align: center;
    margin-bottom: 32px;
  }

  /* Headings = question size (23px) + 7 = 30px */
  .tp-faq-title {
    margin: 0 0 8px;
    font-size: 30px;
    font-weight: 800;
    background: linear-gradient(90deg, #ff2f92, #ff6bb0);
    -webkit-background-clip: text;
    color: transparent;
  }

  .tp-faq-subtitle {
    margin: 0;
    font-size: 30px;
    font-weight: 700;
    color: #111827;
  }

  /* 2-column grid */
  .tp-faq-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px 20px;
  }

  .tp-faq-item {
    position: relative;
    border-radius: 18px;
    border: 1px solid rgba(15, 23, 42, 0.08);
    box-shadow: 0 14px 40px rgba(15, 23, 42, 0.04);
    background: #ffffff;
    overflow: hidden;
    transition:
      box-shadow 0.25s ease,
      border-color 0.25s ease,
      transform 0.25s ease,
      background 0.25s ease;
  }

  /* Glow pulse ring */
  .tp-faq-item::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    opacity: 0;
    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.0);
    transition: opacity 0.25s ease;
  }

  .tp-faq-item.is-open {
    border-color: rgba(59, 130, 246, 0.6);
    box-shadow:
      0 0 0 1px rgba(59, 130, 246, 0.45),
      0 20px 55px rgba(59, 130, 246, 0.45);
    transform: translateY(-2px);
    background: linear-gradient(135deg, #ffffff, #f0f9ff);
  }

  .tp-faq-item.is-open::before {
    opacity: 1;
    animation: faqGlow 1.6s ease-in-out infinite;
  }

  @keyframes faqGlow {
    0% {
      box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.0);
    }
    50% {
      box-shadow: 0 0 0 10px rgba(59, 130, 246, 0.20);
    }
    100% {
      box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.0);
    }
  }

  .tp-faq-question {
    width: 100%;
    padding: 14px 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    font-size: 23px; /* 20 + 3 */
    font-weight: 600;
    text-align: left;
    background: #f3f4ff;
    border: none;
    cursor: pointer;
    color: #0369a1;
    position: relative;
    z-index: 1;
    transition: background 0.18s ease, color 0.18s ease, transform 0.18s ease;
  }

  .tp-faq-item:nth-child(odd) .tp-faq-question {
    background: #f9fafb;
  }

  .tp-faq-question:hover {
    background: #e0f2fe;
    color: #0f172a;
    transform: translateY(-1px);
  }

  .tp-faq-item.is-open .tp-faq-question {
    background: linear-gradient(90deg, #e0f2fe, #eff6ff);
    color: #0f172a;
  }

  .tp-faq-icon {
    flex-shrink: 0;
    width: 26px;
    height: 26px;
    border-radius: 999px;
    border: 1px solid rgba(15, 23, 42, 0.18);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    font-weight: 700;
    background: #ffffff;
    transition: background 0.25s ease, color 0.25s ease, transform 0.25s ease;
  }

  .tp-faq-item.is-open .tp-faq-icon {
    background: #0f172a;
    color: #ffffff;
    transform: rotate(180deg) scale(1.05);
  }

  .tp-faq-answer {
    max-height: 0;
    overflow: hidden;
    padding: 0 16px;
    background: #ffffff;
    transition: max-height 0.25s ease, padding-top 0.25s ease, padding-bottom 0.25s ease;
    position: relative;
    z-index: 1;
  }

  .tp-faq-item.is-open .tp-faq-answer {
    max-height: 500px;
    padding-top: 10px;
    padding-bottom: 14px;
  }

  .tp-faq-answer p {
    margin: 0 0 6px;
    font-size: var(--tp-body-size);
    line-height: 1.7;
  }

  /* Support line = question (23px) + 3 = 26px */
  .tp-faq-support {
    margin: 34px 0 0;
    text-align: center;
    font-size: 26px;
    color: #111827;
    font-weight: 600;
  }

  .tp-faq-support a {
    color: #2563eb;
    text-decoration: underline;
    text-decoration-thickness: 1.5px;
    text-underline-offset: 3px;
    font-weight: 700;
  }

  .tp-faq-support a:hover {
    color: #1d4ed8;
  }

  @media (max-width: 900px) {
    .tp-faq-list {
      grid-template-columns: minmax(0, 1fr);
    }
  }

  @media (max-width: 768px) {
    .tp-faq {
      padding: 70px 12px 80px;
    }

    .tp-faq-title {
      font-size: 26px;
    }

    .tp-faq-subtitle {
      font-size: 24px;
    }
  }
   
  /* Font import (remove if you already import Space Grotesk globally) */
  @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

  :root {
    --tp-body-size: 15px;
    --tp-head-size: 20px;
  }

  .tp-hero {
    padding: 80px 16px 70px;
    background: radial-gradient(circle at top, #ffe4ff 0, #ffffff 45%, #f7fbff 100%);
    font-family: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont,
                 "Segoe UI", sans-serif;
    text-align: center;
    color: #050816;
  }

  .tp-hero-inner {
    max-width: 1050px;
    margin: 0 auto;
  }

  /* Brand name */
  .tp-hero-brand {
    display: inline-block;
    margin-bottom: 10px;
    font-size: calc(var(--tp-head-size) + 4px); /* 24px */
    font-weight: 800;
    letter-spacing: 0.05em;
    text-transform: capitalize;
    background: linear-gradient(90deg, #ff2f92, #ff7ae5);
    -webkit-background-clip: text;
    color: transparent;
  }

  /* Yellow strapline pill */
  .tp-hero-strap {
    display: inline-block;
    padding: 6px 18px;
    border-radius: 999px;
    background: #fff700;
    color: #111827;
    font-size: var(--tp-body-size);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    box-shadow: 0 12px 30px rgba(250, 204, 21, 0.4);
    margin-bottom: 26px;
  }

  /* Main headline */
  .tp-hero-title {
    margin: 0 0 20px;
    font-size: calc(var(--tp-head-size) + 8px); /* 28px */
    line-height: 1.35;
    font-weight: 800;
  }

  .tp-hero-title .accent {
    color: #ff2f92;
  }

  .tp-hero-sub {
    margin: 0;
    font-size: var(--tp-body-size);
    line-height: 1.9;
    color: #111827;
  }

  .tp-hero-sub .accent {
    color: #ff2f92;
    font-weight: 600;
  }

  .tp-hero-break {
    display: none;
  }

  /* Subtle hover “alive” effect on highlight text */
  .tp-hero-title .accent,
  .tp-hero-sub .accent {
    position: relative;
    transition: text-shadow 0.2s ease, transform 0.2s ease;
  }

  .tp-hero-title .accent:hover,
  .tp-hero-sub .accent:hover {
    text-shadow: 0 0 18px rgba(255, 47, 146, 0.5);
    transform: translateY(-1px);
  }

  @media (max-width: 900px) {
    .tp-hero {
      padding: 70px 14px 60px;
    }

    .tp-hero-title {
      font-size: 24px;
    }

    .tp-hero-break {
      display: inline;
    }
  }

  @media (max-width: 640px) {
    .tp-hero-title {
      font-size: 22px;
    }

    .tp-hero-strap {
      font-size: 13px;
      padding: 6px 14px;
    }
  }
  


  
  @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');

  .tp-footer {
    background: radial-gradient(circle at top, #111827 0, #020617 50%, #000000 100%);
    color: #e5e7eb;
    padding: 60px 20px 35px;
    font-family: "Space Grotesk", system-ui, -apple-system, BlinkMacSystemFont,
                 "Segoe UI", sans-serif;
    font-size: 14px;
  }

  .tp-footer-inner {
    max-width: 1120px;
    margin: 0 auto;
  }

  .tp-footer-brand-row {
    display: flex;
    justify-content: center;
    margin-bottom: 18px;
  }

  .tp-footer-logo {
    display: inline-flex;
    align-items: center;
    gap: 10px;
  }

  .tp-footer-logo-mark {
    width: 40px;
    height: 40px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at top left, #22d3ee, #0f172a);
    border: 1px solid #4b5563;
    font-weight: 700;
    font-size: 16px;
  }

  .tp-footer-logo-text {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 0.06em;
  }

  .tp-footer-separator {
    border: none;
    border-top: 1px solid #374151;
    margin: 10px 0 18px;
  }

  .tp-footer-separator--soft {
    opacity: 0.6;
    margin: 20px 0;
  }

  .tp-footer-disclaimer {
    line-height: 1.8;
    margin: 0;
    color: #d1d5db;
    font-size: 15px;
}

  .tp-footer-columns {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 36px;
    margin: 10px 0 20px;
  }

  .tp-footer-col h3 {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 8px;
    color: #f9fafb;
  }

  .tp-footer-col p {
    margin: 0 0 8px;
    line-height: 1.7;
    color: #d1d5db;
    font-size: 15px;
}

  /* Center disclaimer block */
  .tp-footer-center-note {
    text-align: center;
    max-width: 900px;
    margin: 24px auto 0;
    line-height: 1.8;
    color: #d1d5db;
    font-size: 15px;
}
  .tp-footer-lifetime {
    margin: 16px 0 8px;
    font-size: 13px;
    color: #9ca3af;
    text-align: left;
  }

  .tp-footer-payments {
    display: flex;
    gap: 14px;
    justify-content: flex-start;
    margin: 14px 0 18px;
  }

  .tp-footer-payments img {
    height: 26px;
    object-fit: contain;
    filter: drop-shadow(0 4px 10px rgba(0,0,0,0.7));
    opacity: 0.95;
  }

  .tp-footer-bottom {
    border-top: 1px solid #374151;
    padding-top: 14px;
    margin-top: 6px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    font-size: 14px;
    color: #9ca3af;
  }

  .tp-footer-links {
    display: flex;
    gap: 18px;
    flex-wrap: wrap;
  }

  .tp-footer-links a {
    color: #e5e7eb;
    text-decoration: none;
    font-size: 14px;
    position: relative;
  }

  .tp-footer-links a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: -2px;
    width: 0;
    height: 1px;
    background: linear-gradient(90deg, #22d3ee, #60a5fa);
    transition: width 0.2s ease;
  }

  .tp-footer-links a:hover::after {
    width: 100%;
  }

  @media (max-width: 900px) {
    .tp-footer-columns {
      grid-template-columns: minmax(0, 1fr);
      gap: 24px;
    }

    .tp-footer-center-note {
      margin-top: 20px;
    }

    .tp-footer-payments {
      justify-content: center;
    }
  }

  @media (max-width: 640px) {
    .tp-footer {
      padding: 50px 16px 30px;
    }

    .tp-footer-bottom {
      flex-direction: column;
      align-items: flex-start;
      gap: 8px;
    }
  }
  


  
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600;700&display=swap');

.tp-sticky-bar {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 24px);
  max-width: 1200px;
  z-index: 999999;

  background: rgba(15, 15, 15, 0.5); /* ✅ 50% transparent */
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);

  border-radius: 14px;
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.08),
    0 10px 40px rgba(0,0,0,0.45);

  font-family: "Space Grotesk", sans-serif;
}

.tp-sticky-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 14px 18px;
}

.tp-sticky-text {
  color: #ffffff;
  font-size: 15px;
  line-height: 1.4;
}

.tp-green {
  color: #22c55e;
  font-weight: 700;
}

.tp-sticky-btn {
  background: linear-gradient(90deg, #38bdf8, #60a5fa);
  color: #ffffff;
  text-decoration: none;

  padding: 12px 22px;
  border-radius: 10px;

  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.04em;

  box-shadow:
    0 6px 20px rgba(56,189,248,0.5),
    inset 0 0 0 1px rgba(255,255,255,0.2);

  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.tp-sticky-btn:hover {
  transform: translateY(-2px);
  box-shadow:
    0 10px 30px rgba(56,189,248,0.8),
    inset 0 0 0 1px rgba(255,255,255,0.25);
}

.tp-hide-mobile {
  display: inline;
}

/* ✅ Mobile adjustments */
@media (max-width: 768px) {
  .tp-sticky-inner {
    flex-direction: column;
    text-align: center;
    gap: 10px;
  }

  .tp-hide-mobile {
    display: none;
  }

  .tp-sticky-btn {
    width: 100%;
    text-align: center;
  }
}
  
  
   .hero-wrap {
      text-align: center;
    }

  

    .danger-boxes .container-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

    .danger-box {
      background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
      border: 2px solid #ef4444;
      border-radius: 12px;
      padding: 28px 32px;
      display: flex;
      align-items: center;
      gap: 20px;
      box-shadow: 0 4px 12px rgba(239, 68, 68, 0.15);
      position: relative;
      overflow: hidden;
      transition: transform 0.2s ease, box-shadow 0.2s ease;
    }

    .danger-box:hover {
      transform: translateY(-2px);
      box-shadow: 0 6px 16px rgba(239, 68, 68, 0.25);
    }

    .danger-box::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 3px;
      background: linear-gradient(90deg, #ef4444, #dc2626, #ef4444);
      animation: dangerPulse 2s ease-in-out infinite;
    }

    @keyframes dangerPulse {
      0%, 100% { opacity: 1; }
      50% { opacity: 0.7; }
    }

    .danger-box-icon {
      flex-shrink: 0;
      width: 48px;
      height: 48px;
      background: #ef4444;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 2px 8px rgba(239, 68, 68, 0.3);
    }

    .danger-box-icon svg {
      width: 24px;
      height: 24px;
      fill: #ffffff;
    }

    .danger-box-content {
      flex: 1;
    }
    section.vsl-header-section span.softawe-three-head.mt-0 {
    font-size: 60px;
}
    .vsl-header-section{
      max-width: 1100px;
      margin: 0 auto;
      padding: 0px 16px 46px;
      display:flex;
      flex-direction:column;
      gap: 20px;
    }

    /* ====== Common Box Style ====== */
    .vsl-box{
      border-radius: 14px;
      padding: 30px 28px;
      text-align:center;
      border: 1px solid rgba(0,0,0,0.08);
      box-shadow: 0 14px 40px rgba(0,0,0,0.08);
    }

    .vsl-box p{ margin: 0; }
    .vsl-strong{ font-weight: 800; }

    /* ====== Box 1: Light Red ====== */
    .vsl-box-red{ background:#fff1f2; }
    .vsl-text-red{
      color:#c62828;
      font-size:18px;
      line-height:1.65;
      font-weight:600;
    }

    /* ====== Box 2: Light Green ====== */
    .vsl-box-green{ background:#effff4; }
    .vsl-heading{
      margin: 0 0 14px 0;
      font-size: 30px;
      font-weight: 900;
      line-height: 1.18;
      color:#0b5d1e;
      letter-spacing: -0.2px;
    }
    .vsl-highlight{ color:#0f8a2b; }
    .vsl-text{
      font-size:18px;
      line-height:1.65;
      color:#1f3d2b;
      font-weight:600;
      margin:0;
    }

    /* ====== Box 3: White, Blue Text ====== */
 .vsl-box-white-blue {
    color: #fff !important;
    border: 1px solid #e6ecff;
    box-shadow: 0 14px 40px rgba(20,60,255,0.06);
    background: linear-gradient(90deg, #ff4f7b, #17b0ff);
}
    .vsl-text-blue{
      font-size:20px;
      line-height:1.65;
      color:#fff;
      font-weight:700;
    }

    /* ====== Box 4: White, Gradient Text ====== */
    .vsl-box-white-gradient{
      background:#fff;
      border: 1px solid rgba(0,0,0,0.10);
    }
    .vsl-presenting{
      margin: 0 0 10px 0;
      font-size:16px;
      color:#666;
      font-weight:700;
      letter-spacing:0.2px;
    }
    .vsl-gradient-heading{
      margin:0;
      font-size:36px;
      font-weight:1000;
      line-height:1.18;
      letter-spacing:-0.3px;

      /* Gradient text */
      background: linear-gradient(90deg, #ff416c, #ff4b2b, #ffb347, #00c6ff);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      color: transparent;
    }
    .vsl-gradient-heading span{
      display:block;
      margin-top: 10px;
      font-size: 28px;
      font-weight: 1000;
    }
    .videoo-embed {
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
}
.videoo-embed iframe {
    width: 100%;
    height: 520px;
    border: 0;
    display: block;
}
.how-it-works-header {
    text-align: center;
    margin-bottom: 20px;
}
.how-it-works-title {
    font-size: 28px;
    font-weight: 800;
    color: #000;
    margin-bottom: 12px;
    text-shadow: 2px 2px 12px rgba(0, 0, 0, 0.3);
    letter-spacing: -0.5px;
}
.title-accent {
    display: inline-block;
    font-size: 32px;
    font-weight: 600;
    color: #ffd700;
    text-shadow: 0 0 20px rgba(255, 215, 0, 0.6);
    margin-left: 10px;
}
.how-it-works-subtitle {
    font-size: 20px;
    color: #000;
    font-weight: 500;
    text-shadow: 1px 1px 6px rgba(0, 0, 0, 0.2);
    margin: 0;
}

    /* ====== Responsive ====== */
    @media (max-width: 768px){
      .vsl-box{ padding: 22px 18px; }
      .vsl-text-red, .vsl-text{ font-size:16px; }
      .vsl-heading{ font-size:22px; }
      .vsl-text-blue{ font-size:17px; }
      .vsl-gradient-heading{ font-size:24px; }
      .vsl-gradient-heading span{ font-size:20px; }
    }
    .danger-box-title {
    font-size: 20px;
    font-weight: 700;
    color: #991b1b;
    margin-bottom: 0;
    line-height: 1.3;
    text-align: left;
}

    .danger-box-title .highlight {
      color: #dc2626;
      text-transform: uppercase;
    }

    .danger-box-text {
      font-size: 16px;
      color: #7f1d1d;
      line-height: 1.6;
      margin: 0 0 8px 0;
    }

    .danger-box-text:last-child {
      margin-bottom: 0;
    }

    @media (max-width: 768px) {
      .danger-boxes {
        padding: 30px 16px;
        margin-bottom: 24px;
      }

      .danger-boxes .container-inner {
        grid-template-columns: 1fr;
        gap: 20px;
      }

      .danger-box {
        padding: 24px 20px;
      }

      .danger-box-icon {
        width: 44px;
        height: 44px;
      }

      .danger-box-icon svg {
        width: 22px;
        height: 22px;
      }

      .danger-box-title {
        font-size: 20px;
      }

      .danger-box-text {
        font-size: 15px;
      }
    }
.hero-pre {
    font-size: 16px;
    font-weight: 600;
    color: #00ad4f;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 22px;
    position: relative;
    z-index: 9;
}

    .hero-heading,
    .hero-sub {
      font-size: clamp(30px, 3.6vw, 33px);
      line-height: 1.25;
      font-weight: 700;
      letter-spacing: -0.02em;
      margin-bottom: 8px;
    }

    .hero-heading .pink,
    .hero-sub .pink {
      color: var(--pink-main);
    }

    .hero-sub {
    margin-bottom: 3px;
}

 .hero-body {
    font-size: 22px;
    line-height: 1.5;
    color: #fff;
    margin: 0;
}

    p.hero-body span {
    background: linear-gradient(90deg, #f97316, #fb7185, #a855f7, #0ea5e9, #22c55e);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: 600;
}
.hero-cta {
    display: inline-block;
    margin-bottom: 13px;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.5;
    padding: 8px 14px;
    border-radius: 6px;
    background: linear-gradient(90deg, #ec4899, #a855f7, #3b82f6, #06b6d4);
    color: #fff;
}
    /* ================== SECTION 2: VIDEO + MAIN CTA BUTTON ================== */

    .section-wrap {
      /* max-width: 1120px; */
      margin: 0 auto 20px;
      padding: 0 18px;
      text-align: center;
    }

    .video-shell {
    max-width: 960px;
    margin: 40px auto 10px;
    border-radius: 18px;
    border: 2px solid #ff1f8c;
    aspect-ratio: 16 / 9;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
}

  .video-shell-left {
    flex: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    border: 2px solid #ff1f8c;
    border-radius: 22px;
}

  .jv-video-text {
    font-size: clamp(48px, 6vw, 72px);
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #111827;
    text-align: center;
  }

  .video-shell-right {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 30px 20px;
    background: #ffffff;
  }

  .contact-heading {
    font-size: clamp(16px, 1.8vw, 20px);
    font-weight: 600;
    color: #111827;
    margin-bottom: 20px;
    text-align: left;
    line-height: 1.4;
  }

  .contact-box {
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 12px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    padding: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  }

  .contact-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 18px;
    color: #ffffff;
    text-decoration: none;
    font-size: clamp(13px, 1.4vw, 16px);
    font-weight: 600;
    transition: all 0.3s ease;
    border-radius: 12px;
    position: relative;
    overflow: hidden;
    background: linear-gradient(135deg, var(--gradient-start, #6264a7), var(--gradient-end, #7b61ff));
  }

  .contact-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0.95;
    transition: opacity 0.3s ease;
  }

  .contact-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    color: #ffffff;
  }

  .contact-item:hover .contact-text,
  .contact-item:hover .contact-icon {
    color: #ffffff;
  }

  .contact-item:hover .contact-icon svg {
    fill: #ffffff;
  }

  .contact-item:hover::before {
    opacity: 1;
  }

  .contact-icon {
    font-size: 24px;
    line-height: 1;
    z-index: 1;
    position: relative;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
  }

  .contact-icon svg {
    width: 24px;
    height: 24px;
    fill: currentColor;
  }

  .contact-text {
    z-index: 1;
    position: relative;
    flex: 1;
  }

  .contact-teams {
    background: linear-gradient(135deg, #6264a7 0%, #7b61ff 50%, #a855f7 100%);
  }

  .contact-teams::before {
    background: linear-gradient(135deg, #7b61ff, #a855f7);
  }

  .contact-facebook {
    background: linear-gradient(135deg, #1877f2 0%, #42a5f5 50%, #2563eb 100%);
  }

  .contact-facebook::before {
    background: linear-gradient(135deg, #2563eb, #3b82f6);
  }

  .contact-whatsapp {
    background: linear-gradient(135deg, #25d366 0%, #22c55e 50%, #10b981 100%);
  }

  .contact-whatsapp::before {
    background: linear-gradient(135deg, #22c55e, #10b981);
  }

  .contact-email {
    background: linear-gradient(135deg, #ff1f8c 0%, #ec4899 50%, #f472b6 100%);
  }

  .contact-email::before {
    background: linear-gradient(135deg, #ec4899, #f472b6);
  }

    .video-label {
      font-size: 40px;
      letter-spacing: 0.14em;
      text-transform: uppercase;
    }

    .cta-button-wrap {
      margin-top: 10px;
      margin-bottom: 14px;
    }

    .cta-button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      padding: 20px 40px;
          border-radius: 14px;
      border: none;
      cursor: pointer;
      font-size: 34px;
      font-weight: 800;
      color: #ffffff;
      letter-spacing: 0.03em;
      white-space: normal;
      text-align: center;
      background-image: linear-gradient(90deg, var(--orange-main), var(--pink-main), var(--purple-main));
      box-shadow: 0 18px 40px rgba(255, 105, 180, 0.55);
      transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
    }

    .cta-button span.arrows {
      margin-left: 14px;
      font-size: 30px;
    }

    .cta-button:hover {
      transform: translateY(-2px);
      filter: brightness(1.04);
      box-shadow: 0 22px 60px rgba(255, 105, 180, 0.75);
    }

    .cta-button:active {
      transform: translateY(1px);
      box-shadow: 0 12px 30px rgba(255, 105, 180, 0.5);
    }

   .cta-subline {
    margin-top: 19px;
    font-size: 21px;
    font-weight: 500;
    color: #fff;
}
.benefits span {
    color: #fff;
}
    .payment-row {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 14px;
      margin-top: 18px;
      margin-bottom: 17px;
      flex-wrap: wrap;
    }

    .pay-badge {
      min-width: 80px;
      padding: 6px 12px;
      border-radius: 10px;
      font-size: 13px;
      font-weight: 600;
      background: #f3f4f6;
      border: 1px solid #e5e7eb;
    }

    .guarantee-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 6px 12px;
      border-radius: 999px;
      background: #fff7e0;
      border: 1px solid #fbbf24;
      font-size: 13px;
      font-weight: 600;
      color: #92400e;
    }

    .guarantee-badge span.icon {
      font-size: 18px;
    }

    .benefits {
      font-size: 28px;
      font-weight: 600;
      line-height: 1.6;
      margin-top: 12px;
    }
.benefits span:last-child {
    font-size: 24px;
}
    .benefits span {
      display: block;
    }
    .how-it-works-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  position: relative;
}
.paypal-wrap h1 {
  color: #fff;
  font-size: 30px;
  font-weight: 800;
  margin-bottom: 20px;
}
.paypal-wrap h1 span {
  background: linear-gradient(90deg, #ff4f7b, #17b0ff);
  padding: 4px 10px;
  display: inline-block;
  position: relative;
  top: 4px;
  border-radius: 5px;
}
.how-it-works-item {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 16px 16px;
    background: rgba(255, 255, 255, 0.98);
    border-radius: 16px;
    margin-bottom: 15px;
    position: relative;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    border: 2px solid transparent;
}

.how-it-works-item:hover {
  transform: translateX(10px);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
  border-color: rgba(102, 126, 234, 0.3);
  background: #ffffff;
}

.how-it-works-item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  background: linear-gradient(180deg, #667eea 0%, #764ba2 100%);
  border-radius: 20px 0 0 20px;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.how-it-works-item:hover::before {
  opacity: 1;
}

.step-connector {
  position: absolute;
  left: 65px;
  top: 100%;
  width: 2px;
  height: 18px;
  background: linear-gradient(180deg, rgba(102, 126, 234, 0.4) 0%, transparent 100%);
  z-index: 0;

    display:none;
}

.step-connector-last {
  display: none;
}

.step-icon-wrapper {
  position: relative;
  flex-shrink: 0;
  z-index: 2;
}

.step-icon {
  width: 50px;
  height: 50px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 20px rgba(102, 126, 234, 0.3);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.step-icon::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.3) 0%, transparent 70%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.how-it-works-item:hover .step-icon::before {
  opacity: 1;
}

.how-it-works-item:hover .step-icon {
  transform: scale(1.1) rotate(5deg);
  box-shadow: 0 12px 30px rgba(102, 126, 234, 0.4);
}

.step-icon svg {
  width: 25px;
  height: 25px;
  color: #ffffff;
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.2));
}

.step-number {
  position: absolute;
  top: -12px;
  right: -12px;
  width: 36px;
  height: 36px;
  background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
  color: #ffffff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  box-shadow: 0 4px 12px rgba(238, 90, 111, 0.4);
  border: 3px solid #ffffff;
  z-index: 3;
  display:none;
}

.step-content {
  flex: 1;
  padding-top: 5px;
}

.step-title {
    font-size: 18px;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.4;
    margin: 0;
    transition: color 0.3s ease;
    text-align: left;
}

.how-it-works-item:hover .step-title {
  color: #667eea;
}

/* Color variations for each step */
.how-it-works-item:nth-child(1) .step-icon {
  background: linear-gradient(135deg, #ec4899 0%, #be185d 100%);
  box-shadow: 0 8px 20px rgba(236, 72, 153, 0.3);
}

.how-it-works-item:nth-child(1):hover .step-icon {
  box-shadow: 0 12px 30px rgba(236, 72, 153, 0.4);
}

.how-it-works-item:nth-child(1)::before {
  background: linear-gradient(180deg, #ec4899 0%, #be185d 100%);
}

.how-it-works-item:nth-child(1):hover .step-title {
  color: #ec4899;
}

.how-it-works-item:nth-child(2) .step-icon {
  background: linear-gradient(135deg, #3b82f6 0%, #1e40af 100%);
  box-shadow: 0 8px 20px rgba(59, 130, 246, 0.3);
}

.how-it-works-item:nth-child(2):hover .step-icon {
  box-shadow: 0 12px 30px rgba(59, 130, 246, 0.4);
}

.how-it-works-item:nth-child(2)::before {
  background: linear-gradient(180deg, #3b82f6 0%, #1e40af 100%);
}

.how-it-works-item:nth-child(2):hover .step-title {
  color: #3b82f6;
}

.how-it-works-item:nth-child(3) .step-icon {
  background: linear-gradient(135deg, #f97316 0%, #c2410c 100%);
  box-shadow: 0 8px 20px rgba(249, 115, 22, 0.3);
}

.how-it-works-item:nth-child(3):hover .step-icon {
  box-shadow: 0 12px 30px rgba(249, 115, 22, 0.4);
}

.how-it-works-item:nth-child(3)::before {
  background: linear-gradient(180deg, #f97316 0%, #c2410c 100%);
}

.how-it-works-item:nth-child(3):hover .step-title {
  color: #f97316;
}

.how-it-works-item:nth-child(4) .step-icon {
  background: linear-gradient(135deg, #10b981 0%, #047857 100%);
  box-shadow: 0 8px 20px rgba(16, 185, 129, 0.3);
}

.how-it-works-item:nth-child(4):hover .step-icon {
  box-shadow: 0 12px 30px rgba(16, 185, 129, 0.4);
}

.how-it-works-item:nth-child(4)::before {
  background: linear-gradient(180deg, #10b981 0%, #047857 100%);
}

.how-it-works-item:nth-child(4):hover .step-title {
  color: #10b981;
}

.how-it-works-item:nth-child(5) .step-icon {
  background: linear-gradient(135deg, #8b5cf6 0%, #6d28d9 100%);
  box-shadow: 0 8px 20px rgba(139, 92, 246, 0.3);
}

.how-it-works-item:nth-child(5):hover .step-icon {
  box-shadow: 0 12px 30px rgba(139, 92, 246, 0.4);
}

.how-it-works-item:nth-child(5)::before {
  background: linear-gradient(180deg, #8b5cf6 0%, #6d28d9 100%);
}

.how-it-works-item:nth-child(5):hover .step-title {
  color: #8b5cf6;
}
section.hero-wrap .step-content {
    padding: 0;
}
/* Responsive Design */
@media (max-width: 768px) {
  .how-it-works-section {
    padding: 40px 0;
  }

  .how-it-works-title {
    font-size: 36px;
  }

  .title-accent {
    font-size: 24px;
    display: block;
    margin-left: 0;
    margin-top: 10px;
  }

  .how-it-works-subtitle {
    font-size: 18px;
  }

  .how-it-works-item {
    padding: 20px 15px;
    gap: 15px;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .how-it-works-item:hover {
    transform: translateY(-5px);
  }

  .step-connector {
    display: none;
  }

  .step-icon {
    width: 70px;
    height: 70px;
  }

  .step-icon svg {
    width: 25px;
    height: 25px;
  }

  .step-title {
    font-size: 20px;
  }

  .how-it-works-item::before {
    width: 100%;
    height: 5px;
    border-radius: 20px 20px 0 0;
    top: 0;
    left: 0;
  }
}

@media (max-width: 480px) {
  .how-it-works-title {
    font-size: 28px;
  }

  .title-accent {
    font-size: 20px;
  }

  .how-it-works-subtitle {
    font-size: 16px;
  }

  .step-title {
    font-size: 18px;
  }

  .how-it-works-item {
    padding: 20px 15px;
  }
}

  
  
  .keyword-outer {
  padding: 60px 20px 0px;
  background: 
    radial-gradient(ellipse 120% 100% at 0% 0%, rgba(139, 92, 246, 0.15), transparent 50%),
    radial-gradient(ellipse 100% 120% at 100% 100%, rgba(236, 72, 153, 0.12), transparent 50%),
    radial-gradient(ellipse 80% 80% at 50% 50%, rgba(59, 130, 246, 0.08), transparent 60%),
    radial-gradient(ellipse 100% 100% at 80% 20%, rgba(251, 191, 36, 0.1), transparent 50%),
    linear-gradient(135deg, #f8fafc 0%, #ffffff 50%, #f1f5f9 100%);
  position: relative;
  overflow: hidden;
  margin-top: 60px;
}

.keyword-outer::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: 
    radial-gradient(circle at 20% 30%, rgba(139, 92, 246, 0.2), transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(236, 72, 153, 0.15), transparent 40%),
    radial-gradient(circle at 50% 50%, rgba(59, 130, 246, 0.1), transparent 50%);
  animation: gradientShift 15s ease infinite;
  pointer-events: none;
  z-index: 0;
}

.keyword-outer::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: 
    linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, 0.5) 50%, transparent 100%);
  pointer-events: none;
  z-index: 0;
}

@keyframes gradientShift {
  0%, 100% {
    transform: translate(0, 0) scale(1);
    opacity: 1;
  }
  50% {
    transform: translate(5%, 5%) scale(1.1);
    opacity: 0.8;
  }
}

.keyword-header {
  text-align: center;
  margin-bottom: 30px;
  position: relative;
  z-index: 1;
}

.keyword-decorative-line {
  margin-bottom: 32px;
  display: flex;
  justify-content: center;
  opacity: 0.9;
  filter: drop-shadow(0 4px 8px rgba(139, 92, 246, 0.2));
}

.keyword-decorative-line img {
  max-width: 220px;
  height: auto;
  animation: float 3s ease-in-out infinite;
}

@keyframes float {
  0%, 100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-8px);
  }
}

.keyword-main-title {
  font-size: clamp(36px, 4.5vw, 56px);
  font-weight: 900;
  line-height: 1.15;
  color: #0f172a;
  margin-bottom: 28px;
  letter-spacing: -0.03em;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.05);
}

.keyword-main-title .grad-blue {
  background: linear-gradient(135deg, #8b5cf6 0%, #3b82f6 50%, #06b6d4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  position: relative;
  display: inline-block;
  filter: drop-shadow(0 2px 8px rgba(139, 92, 246, 0.3));
}

.keyword-main-title .border-dot {
  position: relative;
  background: linear-gradient(135deg, #ec4899 0%, #f43f5e 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 900;
  display: inline-block;
  filter: drop-shadow(0 2px 8px rgba(236, 72, 153, 0.3));
}

.keyword-main-title .border-dot::after {
  content: '';
  position: absolute;
  bottom: 6px;
  left: 0;
  right: 0;
  height: 12px;
  background: linear-gradient(90deg, 
    rgba(236, 72, 153, 0.4) 0%, 
    rgba(244, 63, 94, 0.3) 50%, 
    rgba(236, 72, 153, 0.2) 100%);
  border-radius: 6px;
  z-index: -1;
  animation: underlinePulse 2s ease-in-out infinite;
}

@keyframes underlinePulse {
  0%, 100% {
    opacity: 0.6;
    transform: scaleX(1);
  }
  50% {
    opacity: 0.8;
    transform: scaleX(1.05);
  }
}

.keyword-subtitle {
  font-size: clamp(20px, 2.5vw, 28px);
  font-weight: 600;
  color: #475569;
  margin: 0;
  letter-spacing: -0.01em;
}

.keyword-subtitle .keyword-highlight {
  background: linear-gradient(135deg, #8b5cf6 0%, #6366f1 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 800;
  position: relative;
  display: inline-block;
}

.keyword-content-wrapper {
  max-width: 1280px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 21px;
  align-items: center;
  position: relative;
  z-index: 1;
}

.keyword-editor-preview {
  position: relative;
  padding: 30px;
}

.keyword-editor-preview::before {
  content: '';
  position: absolute;
  inset: -30px;
  background: 
    radial-gradient(circle at 30% 30%, rgba(139, 92, 246, 0.3), transparent 50%),
    radial-gradient(circle at 70% 70%, rgba(236, 72, 153, 0.25), transparent 50%),
    linear-gradient(135deg, rgba(59, 130, 246, 0.2), rgba(139, 92, 246, 0.15));
  border-radius: 40px;
  filter: blur(40px);
  z-index: -1;
  opacity: 0.7;
  animation: glowPulse 4s ease-in-out infinite;
}

@keyframes glowPulse {
  0%, 100% {
    opacity: 0.6;
    transform: scale(1);
  }
  50% {
    opacity: 0.8;
    transform: scale(1.05);
  }
}

.keyword-editor-preview::after {
  content: '';
  position: absolute;
  inset: -10px;
  border-radius: 28px;
  background: linear-gradient(135deg, 
    rgba(139, 92, 246, 0.4), 
    rgba(236, 72, 153, 0.3), 
    rgba(59, 130, 246, 0.4));
  z-index: -2;
  filter: blur(20px);
  opacity: 0.5;
}

.lapi {
  position: relative;
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 
    0 25px 70px rgba(139, 92, 246, 0.25),
    0 10px 30px rgba(236, 72, 153, 0.15),
    0 0 0 1px rgba(255, 255, 255, 0.8),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  padding: 16px;
  transform: perspective(1200px) rotateY(-3deg) rotateX(3deg);
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
}

.lapi:hover {
  transform: perspective(1200px) rotateY(0deg) rotateX(0deg) scale(1.02);
  box-shadow: 
    0 35px 100px rgba(139, 92, 246, 0.35),
    0 15px 40px rgba(236, 72, 153, 0.2),
    0 0 0 1px rgba(255, 255, 255, 1),
    inset 0 1px 0 rgba(255, 255, 255, 1);
}

.lapi img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  transition: transform 0.5s ease;
}

.lapi:hover img {
  transform: scale(1.01);
}

.keyword-features-grid {
  display: flex;
  grid-template-columns: 3fr;
  gap: 19px;
}

.keyword-feature-card {
  position: relative;
  padding: 24px 18px;
  border-radius: 24px;
  background: #fff;
  box-shadow: 
    0 12px 40px rgba(0, 0, 0, 0.1),
    0 4px 12px rgba(0, 0, 0, 0.05),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
  border: 1px solid rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
  opacity: 0;
  transform: translateY(30px);
  animation: fadeInUp 0.7s ease forwards;
}

.keyword-feature-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.8), transparent);
  opacity: 0;
  transition: opacity 0.4s ease;
}

.keyword-feature-card:hover::after {
  opacity: 1;
}

.keyword-feature-card:nth-child(1) {
  animation-delay: 0.1s;
  background: linear-gradient(135deg, 
    #fff7ed 0%, 
    #ffedd5 50%, 
    #fed7aa 100%);
}

.keyword-feature-card:nth-child(1)::before {
  background: linear-gradient(135deg, #f97316, #fb923c, #fbbf24);
}

.keyword-feature-card:nth-child(2) {
  animation-delay: 0.2s;
  background: linear-gradient(135deg, 
    #e0f2fe 0%, 
    #bae6fd 50%, 
    #7dd3fc 100%);
}

.keyword-feature-card:nth-child(2)::before {
  background: linear-gradient(135deg, #0ea5e9, #3b82f6, #06b6d4);
}

.keyword-feature-card:nth-child(3) {
  animation-delay: 0.3s;
  background: linear-gradient(135deg, 
    #f3e8ff 0%, 
    #e9d5ff 50%, 
    #ddd6fe 100%);
}

.keyword-feature-card:nth-child(3)::before {
  background: linear-gradient(135deg, #a855f7, #8b5cf6, #7c3aed);
}

.keyword-feature-card:nth-child(4) {
  animation-delay: 0.4s;
  background: linear-gradient(135deg, 
    #ecfdf5 0%, 
    #d1fae5 50%, 
    #a7f3d0 100%);
}

.keyword-feature-card:nth-child(4)::before {
  background: linear-gradient(135deg, #10b981, #22c55e, #34d399);
}

@keyframes fadeInUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.keyword-feature-card::before {
  content: '';
  position: absolute;
  inset: -3px;
  border-radius: 27px;
  opacity: 0;
  z-index: -1;
  filter: blur(16px);
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  animation: borderGlow 3s ease-in-out infinite;
}

@keyframes borderGlow {
  0%, 100% {
    opacity: 0;
    transform: scale(1);
  }
  50% {
    opacity: 0.3;
    transform: scale(1.02);
  }
}

.keyword-feature-card:hover::before {
  opacity: 0.6 !important;
  transform: scale(1.05);
  animation: none;
}

.keyword-feature-card:hover {
  transform: translateY(-8px) scale(1.02);
  box-shadow: 
    0 25px 60px rgba(0, 0, 0, 0.15),
    0 8px 20px rgba(0, 0, 0, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 1);
}

.keyword-feature-icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 22px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 
    0 10px 25px rgba(0, 0, 0, 0.12),
    0 4px 10px rgba(0, 0, 0, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 1);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.keyword-feature-icon::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 16px;
  opacity: 0;
  transition: opacity 0.4s ease;
}

.keyword-feature-card:hover .keyword-feature-icon {
  transform: scale(1.15) rotate(8deg);
  box-shadow: 
    0 15px 35px rgba(0, 0, 0, 0.18),
    0 6px 15px rgba(0, 0, 0, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 1);
}

.keyword-feature-card:hover .keyword-feature-icon::before {
  opacity: 0.3;
}

.keyword-feature-1 .keyword-feature-icon {
  color: #ea580c;
  background: linear-gradient(135deg, #fff7ed 0%, #fed7aa 100%);
}

.keyword-feature-1 .keyword-feature-icon::before {
  background: linear-gradient(135deg, rgba(249, 115, 22, 0.2), rgba(251, 146, 60, 0.2));
}

.keyword-feature-2 .keyword-feature-icon {
  color: #0284c7;
  background: linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%);
}

.keyword-feature-2 .keyword-feature-icon::before {
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.2), rgba(59, 130, 246, 0.2));
}

.keyword-feature-3 .keyword-feature-icon {
  color: #9333ea;
  background: linear-gradient(135deg, #f3e8ff 0%, #e9d5ff 100%);
}

.keyword-feature-3 .keyword-feature-icon::before {
  background: linear-gradient(135deg, rgba(168, 85, 247, 0.2), rgba(139, 92, 246, 0.2));
}

.keyword-feature-4 .keyword-feature-icon {
  color: #16a34a;
  background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
}

.keyword-feature-4 .keyword-feature-icon::before {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.2), rgba(34, 197, 94, 0.2));
}

.keyword-feature-icon svg {
  width: 28px;
  height: 28px;
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

.keyword-feature-title {
  font-size: 22px;
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 16px 0;
  line-height: 1.3;
  letter-spacing: -0.01em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.keyword-feature-text {
  font-size: 15px;
  line-height: 1.8;
  color: #475569;
  margin: 0;
  font-weight: 500;
}

/* Responsive Design */
@media (max-width: 1024px) {
  .keyword-content-wrapper {
    grid-template-columns: 1fr;
    gap: 60px;
  }
  
  .keyword-editor-preview {
    order: 1;
    padding: 25px;
  }
  
  .keyword-features-grid {
    order: 2;
  }
  
  .lapi {
    transform: none;
    max-width: 100%;
  }
  
  .lapi:hover {
    transform: scale(1.02);
  }
  
  .keyword-editor-preview::before {
    inset: -20px;
    filter: blur(30px);
  }
}

@media (max-width: 768px) {
  .keyword-outer {
    padding: 80px 16px 100px;
  }
  
  .keyword-header {
    margin-bottom: 60px;
  }
  
  .keyword-feature-card {
    padding: 28px 30px;
  }
  
  .keyword-feature-icon {
    width: 50px;
    height: 50px;
  }
  
  .keyword-feature-icon svg {
    width: 24px;
    height: 24px;
  }
  
  .keyword-feature-title {
    font-size: 20px;
  }
  
  .keyword-feature-text {
    font-size: 14px;
  }
}

@media (max-width: 480px) {
  .keyword-outer {
    padding: 60px 12px 80px;
  }
  
  .keyword-main-title {
    font-size: 28px;
  }
  
  .keyword-subtitle {
    font-size: 18px;
  }
  
  .keyword-features-grid {
    gap: 24px;
  }
  
  .keyword-feature-card {
    padding: 24px 26px;
  }
  
  .keyword-feature-icon {
    width: 48px;
    height: 48px;
    margin-bottom: 14px;
  }
  
  .keyword-feature-title {
    font-size: 18px;
    margin-bottom: 10px;
  }
  
  .keyword-feature-text {
    font-size: 13px;
    line-height: 1.7;
  }
}
.ai-feature-split{
    padding: 44px 16px;
    /*font-family: "Space Grotesk", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;*/
    background:
      radial-gradient(1200px 700px at 25% 5%, rgba(255, 178, 216, 0.35), transparent 55%),
      radial-gradient(1000px 650px at 70% 10%, rgba(170, 220, 255, 0.35), transparent 55%),
      radial-gradient(900px 650px at 60% 85%, rgba(202, 180, 255, 0.30), transparent 55%),
      linear-gradient(180deg, #f7f6ff 0%, #ffffff 60%, #f7f6ff 100%);
  }

  .ai-split-wrap{
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1.35fr 0.65fr;
    gap: 24px;
    align-items: stretch; /* equal height columns */
  }

  /* ========= LEFT IMAGE (MAKE COLORFUL / NO DULL FILM) ========= */
  .ai-left{
    border-radius: 18px;
    overflow: hidden;
    background: #0f0f14;
    border: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 22px 70px rgba(0,0,0,0.18);
    aspect-ratio: 2047 / 1923;
    width: 100%;
    position: relative;
  }

 .ai-left-img{
  width: 100%;
  height: 100%;
  display: block;

  /* KEY FIX */
  object-fit: contain;

  /* Optional: center image nicely */
  object-position: center center;

  /* Keep it colorful */
  filter: saturate(1.18) contrast(1.06) brightness(1.03);

  background: #0f0f14; /* fills empty space if any */
}

.ai-left{
  padding: 12px;
}


  /* Optional: subtle vibrant glow edge (NOT a film overlay) */
  .ai-left::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.35);
  }

  /* ========= RIGHT CARDS (MATCH HEIGHT + HOVER POPUP) ========= */
  .ai-right{
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .rf-card{
    flex: 1;
    border-radius: 18px;
    padding: 16px 16px;
    border: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 14px 40px rgba(0,0,0,0.08);
    position: relative;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
  }

  /* inner soft highlight */
  .rf-card::before{
    content:"";
    position:absolute;
    inset:0;
    background: radial-gradient(700px 240px at 15% 10%, rgba(255,255,255,0.55), transparent 60%);
    pointer-events:none;
  }

  /* POPUP animation on hover */
  .rf-card:hover{
    transform: translateY(-10px) scale(1.03);
    box-shadow:
      0 26px 70px rgba(0,0,0,0.16),
      0 0 0 2px rgba(255,255,255,0.55),
      0 0 55px var(--glow);
    filter: saturate(1.08);
  }

  /* shimmer sweep on hover */
  .rf-card::after{
    content:"";
    position:absolute;
    top:-40%;
    left:-70%;
    width: 60%;
    height: 200%;
    transform: rotate(18deg);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.30), transparent);
    opacity: 0;
    pointer-events:none;
  }
  .rf-card:hover::after{
    opacity: 1;
    animation: rf-sheen 1.2s ease forwards;
  }
  @keyframes rf-sheen{
    0% { left:-70%; }
    100% { left:130%; }
  }

  .rf-row{
    display: flex;
    gap: 12px;
    align-items: flex-start;
    position: relative;
    z-index: 2;
  }

  /* icon badge like your screenshot */
  .rf-icon{
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    font-size: 22px;
    background: rgba(255,255,255,0.55);
    box-shadow: 0 12px 28px rgba(0,0,0,0.12);
    flex: 0 0 auto;
  }

  /* small headline like you want */
  .rf-title{
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
    color: rgba(17,24,39,0.90);
    margin: 2px 0 6px;
  }

  .rf-desc{
    font-size: 13.5px;
    line-height: 1.6;
    font-weight: 500;
    color: rgba(17,24,39,0.62);
  }

  /* Pastel card colors like your reference */
  .rf-peach { background: #fdeedc; --glow: rgba(255,140,40,0.50); }
  .rf-blue  { background: #eaf6ff; --glow: rgba(35,140,255,0.45); }
  .rf-purple{ background: #f2ecff; --glow: rgba(146,70,255,0.45); }
  .rf-mint  { background: #eaffeF; --glow: rgba(15,180,120,0.45); }
  .rf-pink  { background: #ffeaf3; --glow: rgba(255,70,150,0.45); }

  /* ========= RESPONSIVE ========= */
  @media (max-width: 1024px){
    .ai-split-wrap{
      grid-template-columns: 1fr;
    }
    .ai-right{
      height: auto;
    }
    .rf-card{
      flex: unset;
    }
  }
  
  
  .capabilities-outer {
  padding: 60px 20px;

  position: relative;
  overflow: hidden;
}
.proof-wrap.proof-wall .proof-card h4 {
  font-size: 20px;
}
.capabilities-outer::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  /* background: 
    radial-gradient(circle at 20% 30%, rgba(139, 92, 246, 0.15), transparent 40%),
    radial-gradient(circle at 80% 70%, rgba(236, 72, 153, 0.12), transparent 40%),
    radial-gradient(circle at 50% 50%, rgba(59, 130, 246, 0.08), transparent 50%);
  animation: gradientShift 15s ease infinite; */
  pointer-events: none;
  z-index: 0;
}

.capabilities-header {
  text-align: center;
  margin-bottom: 70px;
  position: relative;
  z-index: 1;
}
.alex-card img {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 100px;
    object-position: top;
}
.alex-card {
    display: flex;
    align-items: center;
    column-gap: 10px;
}
.capabilities-main-title {
  font-size: clamp(32px, 4vw,40px);
  font-weight: 900;
  line-height: 1.2;
  color: #0f172a;
  margin: 0;
  letter-spacing: -0.02em;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.05);
}

.capabilities-main-title .capabilities-highlight {
  background: linear-gradient(135deg, #ec4899 0%, #f43f5e 50%, #ef4444 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  position: relative;
  display: inline-block;
  filter: drop-shadow(0 2px 8px rgba(236, 72, 153, 0.3));
}

.capabilities-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  max-width: 1600px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}

.capability-card {
  position: relative;
  padding: 35px 20px;
  border-radius: 28px;
  background: #ffffff;
  box-shadow: 
    0 20px 60px rgba(0, 0, 0, 0.06),
    0 8px 24px rgba(0, 0, 0, 0.03),
    inset 0 1px 0 rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  overflow: hidden;
  opacity: 0;
  transform: translateY(40px);
  animation: fadeInUpCapability 0.8s ease forwards;
}

@keyframes fadeInUpCapability {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.capability-card::before {
  content: '';
  position: absolute;
  inset: -4px;
  border-radius: 32px;
  opacity: 0;
  z-index: -1;
  filter: blur(20px);
  transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
  animation: borderGlowCapability 3s ease-in-out infinite;
}

@keyframes borderGlowCapability {
  0%, 100% {
    opacity: 0;
    transform: scale(1);
  }
  50% {
    opacity: 0.25;
    transform: scale(1.02);
  }
}

.capability-card:hover::before {
  opacity: 0.7 !important;
  transform: scale(1.05);
  animation: none;
}

.capability-card:hover {
  transform: translateY(-12px) scale(1.02);
  box-shadow: 
    0 30px 80px rgba(0, 0, 0, 0.12),
    0 12px 32px rgba(0, 0, 0, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 1);
}

.capability-number {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  font-weight: 800;
  background: rgba(255, 255, 255, 0.9);
  color: #64748b;
  border-radius: 12px;
  box-shadow: 
    0 4px 12px rgba(0, 0, 0, 0.08),
    0 2px 4px rgba(0, 0, 0, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 1);
  z-index: 2;
  transition: all 0.3s ease;
  border: 1px solid rgba(0, 0, 0, 0.05);
}

.capability-card:hover .capability-number {
  transform: scale(1.1) rotate(5deg);
  box-shadow: 
    0 6px 16px rgba(0, 0, 0, 0.12),
    0 3px 6px rgba(0, 0, 0, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 1);
}

.capability-icon {
  width: 72px;
  height: 72px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 28px;
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 
    0 12px 32px rgba(0, 0, 0, 0.1),
    0 4px 12px rgba(0, 0, 0, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 1);
  transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.capability-icon::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 20px;
  opacity: 0;
  transition: opacity 0.5s ease;
}

.capability-card:hover .capability-icon {
  transform: scale(1.2) rotate(8deg);
  box-shadow: 
    0 18px 45px rgba(0, 0, 0, 0.15),
    0 6px 18px rgba(0, 0, 0, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 1);
}

.capability-card:hover .capability-icon::before {
  opacity: 0.3;
}

.capability-icon svg {
  width: 36px;
  height: 36px;
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.1));
  transition: all 0.3s ease;
}

.capability-title {
  font-size: 24px;
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 18px 0;
  line-height: 1.3;
  letter-spacing: -0.01em;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.capability-text {
  font-size: 16px;
  line-height: 1.75;
  color: #475569;
  margin: 0 0 16px 0;
  font-weight: 500;
}

.capability-demo {
  margin-top: 14px;
  padding-top: 0;
  border-top: 0;
}

.demo-placeholder {
  background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
  border-radius: 12px;
  padding: 60px 20px;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  color: #64748b;
  margin-bottom: 8px;
  border: 2px dashed rgba(100, 116, 139, 0.2);
  transition: all 0.3s ease;
}

.capability-card:hover .demo-placeholder {
  background: linear-gradient(135deg, #e2e8f0 0%, #cbd5e1 100%);
  border-color: rgba(100, 116, 139, 0.3);
}

.demo-controls {
  text-align: center;
  font-size: 12px;
  color: #94a3b8;
  font-weight: 500;
  letter-spacing: 0.5px;
}

/* Individual Card Gradients & Colors - Light & Subtle */
.capability-card-1 {
  animation-delay: 0.1s;
  background: linear-gradient(135deg, #ffffff 0%, #fffbf5 50%, #fff8f0 100%);
  border: 1px solid rgba(255, 237, 213, 0.5);
}

.capability-card-1::before {
  background: linear-gradient(135deg, rgba(255, 183, 77, 0.15), rgba(255, 204, 128, 0.12));
}

.capability-card-1 .capability-icon {
  color: #ff9800;
  background: linear-gradient(135deg, #fff8f0 0%, #fff3e0 100%);
}

.capability-card-1 .capability-icon::before {
  background: linear-gradient(135deg, rgba(255, 152, 0, 0.15), rgba(255, 183, 77, 0.12));
}

.capability-card-2 {
  animation-delay: 0.15s;
  background: linear-gradient(135deg, #ffffff 0%, #f0f9ff 50%, #e0f2fe 100%);
  border: 1px solid rgba(186, 230, 253, 0.5);
}

.capability-card-2::before {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.12), rgba(96, 165, 250, 0.1));
}

.capability-card-2 .capability-icon {
  color: #2196f3;
  background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
}

.capability-card-2 .capability-icon::before {
  background: linear-gradient(135deg, rgba(33, 150, 243, 0.15), rgba(66, 165, 245, 0.12));
}

.capability-card-3 {
  animation-delay: 0.2s;
  background: linear-gradient(135deg, #ffffff 0%, #faf5ff 50%, #f3e8ff 100%);
  border: 1px solid rgba(221, 214, 254, 0.5);
}

.capability-card-3::before {
  background: linear-gradient(135deg, rgba(168, 85, 247, 0.12), rgba(192, 132, 252, 0.1));
}

.capability-card-3 .capability-icon {
  color: #9c27b0;
  background: linear-gradient(135deg, #f3e5f5 0%, #e1bee7 100%);
}

.capability-card-3 .capability-icon::before {
  background: linear-gradient(135deg, rgba(156, 39, 176, 0.15), rgba(171, 71, 188, 0.12));
}

.capability-card-4 {
  animation-delay: 0.25s;
  background: linear-gradient(135deg, #ffffff 0%, #f0fdf4 50%, #dcfce7 100%);
  border: 1px solid rgba(187, 247, 208, 0.5);
}

.capability-card-4::before {
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.12), rgba(74, 222, 128, 0.1));
}

.capability-card-4 .capability-icon {
  color: #4caf50;
  background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);
}

.capability-card-4 .capability-icon::before {
  background: linear-gradient(135deg, rgba(76, 175, 80, 0.15), rgba(102, 187, 106, 0.12));
}

.capability-card-5 {
  animation-delay: 0.3s;
  background: linear-gradient(135deg, #ffffff 0%, #fffbeb 50%, #fef3c7 100%);
  border: 1px solid rgba(254, 240, 138, 0.5);
}

.capability-card-5::before {
  background: linear-gradient(135deg, rgba(251, 191, 36, 0.12), rgba(253, 224, 71, 0.1));
}

.capability-card-5 .capability-icon {
  color: #ffc107;
  background: linear-gradient(135deg, #fff9c4 0%, #fff59d 100%);
}

.capability-card-5 .capability-icon::before {
  background: linear-gradient(135deg, rgba(255, 193, 7, 0.15), rgba(255, 213, 79, 0.12));
}

.capability-card-6 {
  animation-delay: 0.35s;
  background: linear-gradient(135deg, #ffffff 0%, #fdf2f8 50%, #fce7f3 100%);
  border: 1px solid rgba(251, 207, 232, 0.5);
}

.capability-card-6::before {
  background: linear-gradient(135deg, rgba(236, 72, 153, 0.12), rgba(244, 114, 182, 0.1));
}

.capability-card-6 .capability-icon {
  color: #e91e63;
  background: linear-gradient(135deg, #fce4ec 0%, #f8bbd0 100%);
}

.capability-card-6 .capability-icon::before {
  background: linear-gradient(135deg, rgba(233, 30, 99, 0.15), rgba(244, 67, 54, 0.12));
}

.capability-card-7 {
  animation-delay: 0.4s;
  background: linear-gradient(135deg, #ffffff 0%, #eef2ff 50%, #e0e7ff 100%);
  border: 1px solid rgba(199, 210, 254, 0.5);
}

.capability-card-7::before {
  background: linear-gradient(135deg, rgba(99, 102, 241, 0.12), rgba(129, 140, 248, 0.1));
}

.capability-card-7 .capability-icon {
  color: #3f51b5;
  background: linear-gradient(135deg, #e3eaf9 0%, #c5cae9 100%);
}

.capability-card-7 .capability-icon::before {
  background: linear-gradient(135deg, rgba(63, 81, 181, 0.15), rgba(92, 107, 192, 0.12));
}

.capability-card-8 {
  animation-delay: 0.45s;
  background: linear-gradient(135deg, #ffffff 0%, #ecfdf5 50%, #d1fae5 100%);
  border: 1px solid rgba(167, 243, 208, 0.5);
}

.capability-card-8::before {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.12), rgba(52, 211, 153, 0.1));
}

.capability-card-8 .capability-icon {
  color: #009688;
  background: linear-gradient(135deg, #e0f2f1 0%, #b2dfdb 100%);
}

.capability-card-8 .capability-icon::before {
  background: linear-gradient(135deg, rgba(0, 150, 136, 0.15), rgba(38, 166, 154, 0.12));
}

.capability-card-9 {
  animation-delay: 0.5s;
  background: linear-gradient(135deg, #ffffff 0%, #fef2f2 50%, #fee2e2 100%);
  border: 1px solid rgba(254, 202, 202, 0.5);
}

.capability-card-9::before {
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.12), rgba(248, 113, 113, 0.1));
}

.capability-card-9 .capability-icon {
  color: #f44336;
  background: linear-gradient(135deg, #ffebee 0%, #ffcdd2 100%);
}

.capability-card-9 .capability-icon::before {
  background: linear-gradient(135deg, rgba(244, 67, 54, 0.15), rgba(239, 83, 80, 0.12));
}

.capability-card-10 {
  animation-delay: 0.55s;
  background: linear-gradient(135deg, #ffffff 0%, #faf5ff 50%, #f3e8ff 100%);
  border: 1px solid rgba(221, 214, 254, 0.5);
}

.capability-card-10::before {
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.12), rgba(167, 139, 250, 0.1));
}

.capability-card-10 .capability-icon {
  color: #7b1fa2;
  background: linear-gradient(135deg, #f3e5f5 0%, #e1bee7 100%);
}

.capability-card-10 .capability-icon::before {
  background: linear-gradient(135deg, rgba(123, 31, 162, 0.15), rgba(142, 36, 170, 0.12));
}

/* Responsive Design for Capabilities Section */
@media (max-width: 1200px) {
  .capabilities-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
  }
}

@media (max-width: 1024px) {
  .capabilities-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
  }
  
  .capability-card {
    padding: 36px 28px;
  }
}

@media (max-width: 768px) {
  .capabilities-outer {
    padding: 80px 16px;
    margin-top: 60px;
  }
  
  .capabilities-header {
    margin-bottom: 50px;
  }
  
  .capabilities-main-title {
    font-size: 28px;
  }
  
  .capability-card {
    padding: 32px 24px;
    border-radius: 24px;
  }
  
  .capability-icon {
    width: 64px;
    height: 64px;
    margin-bottom: 24px;
  }
  
  .capability-icon svg {
    width: 32px;
    height: 32px;
  }
  
  .capability-title {
    font-size: 22px;
    margin-bottom: 16px;
  }
  
  .capability-text {
    font-size: 15px;
    margin-bottom: 20px;
  }
  
  .capability-number {
    top: 18px;
    right: 18px;
    width: 40px;
    height: 40px;
    font-size: 16px;
  }
  
  .capabilities-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .capabilities-outer {
    padding: 60px 12px;
  }
  
  .capabilities-main-title {
    font-size: 24px;
  }
  
  .capabilities-grid {
    gap: 24px;
  }
  
  .capability-card {
    padding: 28px 20px;
  }
  
  .capability-icon {
    width: 56px;
    height: 56px;
    margin-bottom: 20px;
  }
  
  .capability-icon svg {
    width: 28px;
    height: 28px;
  }
  
  .capability-title {
    font-size: 20px;
    margin-bottom: 14px;
  }
  
  .capability-text {
    font-size: 14px;
    line-height: 1.7;
  }
  
  .capability-number {
    top: 16px;
    right: 16px;
    width: 36px;
    height: 36px;
    font-size: 14px;
  }
  
  .demo-placeholder {
    padding: 50px 16px;
    font-size: 14px;
  }
}

section.consimption-bk {
  background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-con-bk/public");
  background-repeat: no-repeat;
  background-size: cover;
  padding: 60px 0 60px;
  margin-top: 50px;
}
.zig-line img {
  width: 100%;
}
section.consimption-bk h6 {
  font-size: 31px;
  color: #A937F2;
  margin: 21px auto 20px;
  display: table;
  background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-head-brd/public");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding: 18px 30px;
}
section.consimption-bk h5 {
  font-size: 55px;
  text-align: center;
  font-family: "Space Grotesk", sans-serif;
  font-weight: bold;
}
span.pink-grad {
  background: linear-gradient(to left, #A937F2, #ED4F44);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
section.consimption-bk h4 {
  background: #FFEC6F;
  margin: 0 auto;
  display: table;
  padding: 10px 20px;
  border-radius: 9px;
  font-size: 25px;
  font-family: "Space Grotesk", sans-serif;
}
.comp-desc img {
  width: 100%;
}
section.consimption-bk h3 {
  font-size: 61px;
  text-align: center;
  margin: 19px 0 36px;
  font-weight: 700;
}
span.pink-grad {
  background: linear-gradient(to left, #A937F2, #ED4F44);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
section.consimption-bk h3 span.under-grad {
  border-bottom: 5px solid #ff00da;
}
.comp-desc {
  text-align: center;
  margin-top: 60px;
}
    
      
.proof-wrap.proof-wall {
  margin: 0px auto 0px;
  padding: 100px 0;
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 50%, #e2e8f0 100%);
  position: relative;
  overflow: hidden;
}

    .proof-wrap.proof-wall .proof-heading {
      text-align: center;
      margin-bottom: 30px;
      font-size: 20px;
      font-weight: 700;
      color: #4b5563;
    }

    .proof-wrap.proof-wall .proof-heading span {
    color: #ffaa12;
    font-size: 33px;
    background: #fff;
    padding: 11px 40px;
    border-radius: 10px;
    box-shadow: 0 0 10px 1px #dddd;
    margin-bottom: 30px;
    display: inline-block;
}

    .proof-wrap.proof-wall .proof-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 20px;
    }

   .proof-wrap.proof-wall .proof-card {
    border-radius: 18px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
    box-shadow: 0 20px 60px rgba(15, 23, 42, 0.12);
    background: #ffffff;
}

  

 .proof-wrap.proof-wall .proof-name {
    font-size: 18px;
    font-weight: 700;
    text-align: left;
}

.proof-wrap.proof-wall .proof-subtitle {
    font-size: 14px;
    font-weight: 700;
    text-align: left;
}

    .proof-wrap.proof-wall .proof-story {
      font-size: 14px;
      line-height: 1.8;
      max-width: 320px;
      color: #111827;
    }

    .proof-wrap.proof-wall .proof-story em {
      font-style: italic;
    }

    .proof-wrap.proof-wall .proof-highlight {
      font-weight: 800;
      color: var(--pink-main);
    }

    .proof-wrap.proof-wall .proof-img-wrap {
      margin-top: 6px;
      max-width: 100%;
    }

    .proof-wrap.proof-wall .proof-img-wrap img {
      max-width: 100%;
      height: auto;
      display: block;
      border-radius: 16px;
      box-shadow: 0 14px 34px rgba(15, 23, 42, 0.18);
    }

        
          
        section.modern-table-section {
  background: #ffffff;
  padding: 80px 0;
  position: relative;
  overflow: hidden;
}

section.modern-table-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(169, 55, 242, 0.3), transparent);
}

.modern-table-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

.modern-table-header {
  text-align: center;
  margin-bottom: 50px;
}

.modern-table-title {
  font-size: 48px;
  font-weight: 700;
  margin-bottom: 15px;
  font-family: "Space Grotesk", sans-serif;
  color: #111827;
  line-height: 1.2;
}

.modern-table-title.brutal-truth-title {
  font-size: 42px;
  color: #ED4F44;
  line-height: 1.3;
  max-width: 1100px;
  margin: 0 auto 50px;
}

.modern-table-title .gradient-text {
  background: linear-gradient(135deg, #A937F2 0%, #ED4F44 50%, #ff1f8c 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.modern-table-subtitle {
  font-size: 20px;
  color: #6b7280;
  font-weight: 400;
  margin: 0;
}

.modern-table-container {
  background: #ffffff;
  border-radius: 24px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.05);
}

.modern-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Space Grotesk", sans-serif;
}

.modern-table thead {
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
}

.modern-table thead th {
  padding: 24px 30px;
  text-align: left;
  font-size: 16px;
  font-weight: 700;
  color: #111827;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-size: 14px;
  border-bottom: 2px solid rgba(169, 55, 242, 0.1);
}

.cost-comparison-table thead th {
  text-align: left;
}

.cost-comparison-table thead th:first-child {
  text-align: left;
}

.modern-table tbody tr {
  transition: all 0.3s ease;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.modern-table tbody tr:last-child {
  border-bottom: none;
}

.modern-table tbody tr:hover {
  transform: translateX(5px);
  box-shadow: 0 4px 20px rgba(169, 55, 242, 0.15);
}

.modern-table tbody td {
  padding: 28px 30px;
  font-size: 16px;
  color: #111827;
  vertical-align: middle;
}

.modern-table tbody td:first-child {
  font-weight: 700;
  color: #111827;
}

.cost-comparison-table tbody td {
  position: relative;
  text-align: left;
  vertical-align: middle;
}
section.featues-lsut {
    padding: 55px 0 0;
}section.featues-lsut h3 {
    font-size: 47px;
    color: #fff;
    background-image: linear-gradient(to right, #F49428, #7D3EF2, #27F093);
    border-radius: 10px;
    margin: 0 auto 20px;
    display: table;
    padding: 28px 31px;
}
.feature-inner {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(148, 163, 184, .55);
    height: 100%;
}
.feature-inner img {
    width: 100%;
    height: 225px;
    object-fit: cover;
}
.feature-inner p {
    text-align: center;
    padding: 0 14px;
    margin: 19px 0 18px;
}
.the-feature h2 {
  text-align: center;
  font-size: 35px;
}
section.featues-lsut h4 {
    font-size: 39px;
    text-align: center;
    font-family: "Space Grotesk", sans-serif;
    box-shadow: 0 0 10px 1px #ddd;
    margin: 0 auto;
    display: table;
    padding: 20px 40px;
    border-radius: 10px;
    font-weight: bold;
    margin-bottom: 30px;
    margin-top: 30px;
}
section.featues-lsut .col-md-4 {
    margin-bottom: 20px;
}
.cost-comparison-table tbody td:first-child {
  display: block;
  font-weight: 700;
  color: #111827;
  text-align: left;
}

.cost-comparison-table tbody td:nth-child(2),
.cost-comparison-table tbody td:nth-child(3) {
  color: #ED4F44;
  font-weight: 600;
}

.cost-comparison-table tbody td strong {
  font-size: 16px;
  font-weight: 700;
  color: #111827;
}

.cost-comparison-table .zero-cost {
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  color: #10b981;
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(34, 197, 94, 0.15) 100%);
  position: relative;
}

.cost-comparison-table .zero-cost::before {
  content: '✓';
  display: inline-block;
  margin-right: 8px;
  font-size: 20px;
}

.cost-comparison-table .zero-cost strong {
  font-size: 24px;
  color: #10b981;
}

.source-tag {
  display: inline-block;
  font-size: 11px;
  color: #6b7280;
  background: #f3f4f6;
  padding: 3px 8px;
  border-radius: 4px;
  margin-left: 8px;
  font-weight: 400;
}

.table-icon {
  font-size: 24px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 10px;
  flex-shrink: 0;
}
/* Gradient Row Styles */
.gradient-row-1 {
  background: linear-gradient(135deg, rgba(169, 55, 242, 0.08) 0%, rgba(237, 79, 68, 0.08) 100%);
}

.gradient-row-1:hover {
  background: linear-gradient(135deg, rgba(169, 55, 242, 0.15) 0%, rgba(237, 79, 68, 0.15) 100%);
}

.gradient-row-2 {
  background: linear-gradient(135deg, rgba(255, 31, 140, 0.08) 0%, rgba(255, 107, 179, 0.08) 100%);
}

.gradient-row-2:hover {
  background: linear-gradient(135deg, rgba(255, 31, 140, 0.15) 0%, rgba(255, 107, 179, 0.15) 100%);
}

.gradient-row-3 {
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.08) 0%, rgba(59, 130, 246, 0.08) 100%);
}

.gradient-row-3:hover {
  background: linear-gradient(135deg, rgba(139, 92, 246, 0.15) 0%, rgba(59, 130, 246, 0.15) 100%);
}

.gradient-row-4 {
  background: linear-gradient(135deg, rgba(236, 72, 153, 0.08) 0%, rgba(244, 63, 94, 0.08) 100%);
}

.gradient-row-4:hover {
  background: linear-gradient(135deg, rgba(236, 72, 153, 0.15) 0%, rgba(244, 63, 94, 0.15) 100%);
}

.gradient-row-5 {
  background: linear-gradient(135deg, rgba(255, 138, 0, 0.08) 0%, rgba(255, 59, 141, 0.08) 100%);
}

.gradient-row-5:hover {
  background: linear-gradient(135deg, rgba(255, 138, 0, 0.15) 0%, rgba(255, 59, 141, 0.15) 100%);
}

.gradient-row-6 {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.08) 0%, rgba(34, 197, 94, 0.08) 100%);
}

.gradient-row-6:hover {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(34, 197, 94, 0.15) 100%);
}

/* Status Badges */
.status-badge {
  display: inline-block;
  padding: 6px 16px;
  border-radius: 20px;
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.status-badge.success {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(34, 197, 94, 0.15) 100%);
  color: #059669;
  border: 1px solid rgba(16, 185, 129, 0.3);
}

.status-badge.warning {
  background: linear-gradient(135deg, rgba(251, 191, 36, 0.15) 0%, rgba(245, 158, 11, 0.15) 100%);
  color: #d97706;
  border: 1px solid rgba(251, 191, 36, 0.3);
}

/* Trend Indicators */
.trend-up {
  color: #059669;
  font-weight: 700;
  font-size: 15px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.trend-up::before {
  content: 'â†‘';
  font-size: 18px;
}

/* Cost Statements Section */
.cost-statements {
  margin-top: 50px;
  text-align: center;
}

.cost-statement {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 40px;
  line-height: 1.4;
}

.highlight-red {
  color: #ED4F44;
}

.problem-heading {
  font-size: 36px;
  font-weight: 700;
  margin: 40px 0 30px;
  line-height: 1.3;
}

.limitations-list {
  max-width: 900px;
  margin: 0 auto;
  text-align: left;
}

.limitation-item {
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 20px;
  line-height: 1.5;
  padding-left: 30px;
  position: relative;
}

.limitation-item::before {
  content: '•';
  position: absolute;
  left: 0;
  font-size: 28px;
  line-height: 1;
}

.limitation-item.final-statement {
  font-size: 24px;
  font-weight: 700;
  margin-top: 30px;
  padding-top: 20px;
  border-top: 2px solid rgba(237, 79, 68, 0.2);
}

/* Responsive Design */
@media (max-width: 768px) {
  section.modern-table-section {
    padding: 60px 0;
  }

  .modern-table-title {
    font-size: 36px;
  }

  .modern-table-title.brutal-truth-title {
    font-size: 28px;
    line-height: 1.4;
  }

  .modern-table-subtitle {
    font-size: 18px;
  }

  .modern-table-container {
    border-radius: 16px;
    overflow-x: auto;
  }

  .modern-table {
    min-width: 700px;
  }

  .modern-table thead th,
  .modern-table tbody td {
    padding: 20px 16px;
    font-size: 14px;
  }

  .cost-comparison-table .zero-cost {
    font-size: 20px;
  }

  .cost-comparison-table .zero-cost strong {
    font-size: 20px;
  }

  .cost-statement {
    font-size: 22px;
  }

  .problem-heading {
    font-size: 28px;
  }

  .limitation-item {
    font-size: 18px;
  }

  .limitation-item.final-statement {
    font-size: 20px;
  }

  .table-icon {
    width: 36px;
    height: 36px;
    font-size: 20px;
  }
}

@media (max-width: 480px) {
  .modern-table-title {
    font-size: 28px;
  }

  .modern-table-title.brutal-truth-title {
    font-size: 22px;
  }

  .modern-table-subtitle {
    font-size: 16px;
  }

  .modern-table-wrapper {
    padding: 0 15px;
  }

  .cost-statement {
    font-size: 18px;
  }

  .problem-heading {
    font-size: 24px;
  }

  .limitation-item {
    font-size: 16px;
    padding-left: 25px;
  }

  .limitation-item.final-statement {
    font-size: 18px;
  }
}
        
          
        section.modern-features-section {
  background: #ffffff;
  padding: 10px 0 60px;
  position: relative;
}

.modern-features-wrapper {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 20px;
}

/* Header Section */
.modern-features-header {
  text-align: center;
  margin-bottom: 60px;
}

.header-line-1 {
  font-size: 20px;
  color: #000000;
  margin-bottom: 8px;
  font-weight: 400;
}

.header-line-2 {
  font-size: 24px;
  color: #000000;
  font-weight: 700;
  margin-bottom: 20px;
}

.header-line-3 {
  font-size: 20px;
  color: #ED4F44;
  margin-bottom: 15px;
  font-weight: 500;
  line-height: 1.5;
}

.header-line-4 {
  font-size: 22px;
  color: #0ea5e9;
  margin-bottom: 10px;
  font-weight: 600;
}

.header-line-5 {
  font-size: 72px;
  color: #22c55e;
  font-weight: 800;
  margin: 0;
  font-family: "Space Grotesk", sans-serif;
  line-height: 1.1;
}

/* Product Showcase Container */
.product-showcase-container {
  display: flex;
  gap: 0;
  align-items: start;
  position: relative;
  width: 100%;
  max-width: 100%;
}



.product-box-wrapper {
  padding-right: 30px;
}

.features-list-wrapper {
  padding-left: 30px;
}

/* Left Side: Product Box */
.product-box-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  perspective: 1500px;
  perspective-origin: center center;
  min-width: 0;
  width: 100%;
}

.product-box-3d {
  position: relative;
  width: 100%;
  max-width: 500px;
  height: 600px;
  transform-style: preserve-3d;
  transform: rotateY(-20deg) rotateX(3deg);
}

.box-face {
  position: absolute;
  display: flex;
  flex-direction: column;
  padding: 30px;
  box-sizing: border-box;
  backface-visibility: hidden;
}

.box-front {
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #A937F2 0%, #7c3aed 100%);
  border-radius: 8px;
  box-shadow: 0 25px 70px rgba(169, 55, 242, 0.5);
  color: #ffffff;
  transform: translateZ(0);
}

.box-top-text {
  font-size: 24px;
  font-weight: 700;
  margin-bottom: 20px;
  text-align: center;
  color: #ffffff;
}

.box-burst-design {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 30px 0;
  height: 180px;
}

.burst-circle {
  width: 150px;
  height: 150px;
  background: radial-gradient(circle, #ffd700 0%, #ff8c00 100%);
  border-radius: 50%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 30px rgba(255, 215, 0, 0.6);
}

.burst-lines {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: 
    radial-gradient(circle at center, transparent 35%, rgba(255, 215, 0, 0.3) 35%, rgba(255, 215, 0, 0.3) 37%, transparent 37%),
    repeating-conic-gradient(from 0deg, transparent 0deg 8deg, rgba(255, 140, 0, 0.4) 8deg 12deg);
}

.burst-lines::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: radial-gradient(circle at center, transparent 45%, rgba(255, 215, 0, 0.2) 45%, rgba(255, 215, 0, 0.2) 47%, transparent 47%);
}

.ai-logo-small {
  position: relative;
  z-index: 2;
  background: #ffffff;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 18px;
  color: #A937F2;
  border-radius: 6px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.box-description-text {
  font-size: 14px;
  line-height: 1.6;
  text-align: center;
  margin-bottom: 20px;
  color: #ffffff;
  font-weight: 400;
}

.box-bottom-text {
  font-size: 16px;
  text-align: center;
  color: #ffffff;
  font-weight: 500;
  margin-top: auto;
  padding-top: 20px;
}

.box-side {
  width: 80px;
  height: 100%;
  background: linear-gradient(135deg, #ED4F44 0%, #dc2626 100%);
  border-radius: 0 8px 8px 0;
  right: -80px;
  top: 0;
  transform: rotateY(90deg) translateZ(0);
  transform-origin: left center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 20px 10px;
  color: #ffffff;
  box-shadow: 5px 0 20px rgba(237, 79, 68, 0.3);
}

.side-ai-logo {
  background: #ffffff;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 14px;
  color: #ED4F44;
  border-radius: 4px;
  margin-bottom: 20px;
}

.side-text-vertical {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: 2px;
}

.side-barcode {
  width: 30px;
  height: 120px;
  background: repeating-linear-gradient(
    to bottom,
    #ffffff 0px,
    #ffffff 8px,
    transparent 8px,
    transparent 12px
  );
  margin-top: auto;
}

/* Right Side: Features List */
.features-list-wrapper {
  padding: 0;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  min-width: 0;
  width: 50%;
  box-sizing: border-box;
}
.box-cover {
  width: 50%;
  padding-right: 40px;
}
.box-cover img {
  width: 100%;
}
.features-list {
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.feature-item {
  font-size: 17px;
  line-height: 1.7;
  color: #000000;
  padding: 25px 30px;
  position: relative;
  word-wrap: break-word;
  overflow-wrap: break-word;
  max-width: 100%;
  border-radius: 16px;
  display: flex;
  align-items: flex-start;
  gap: 20px;
  transition: all 0.3s ease;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
}

.feature-item:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
}

.feature-icon {
  flex-shrink: 0;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.feature-icon svg {
  width: 28px;
  height: 28px;
  stroke-width: 2.5;
}

.feature-content {
  flex: 1;
  min-width: 0;
}

.feature-item strong {
  font-weight: 700;
  color: #000000;
}

/* Gradient Box Styles for Each Feature Item */
.feature-item-1 {
  background: linear-gradient(135deg, rgba(169, 55, 242, 0.15) 0%, rgba(237, 79, 68, 0.15) 50%, rgba(255, 31, 140, 0.1) 100%);
  border: 1px solid rgba(169, 55, 242, 0.2);
}

.feature-item-1 .feature-icon {
  color: #A937F2;
  background: linear-gradient(135deg, rgba(169, 55, 242, 0.2) 0%, rgba(237, 79, 68, 0.2) 100%);
}

.feature-item-2 {
  background: linear-gradient(135deg, rgba(255, 31, 140, 0.15) 0%, rgba(255, 107, 179, 0.15) 50%, rgba(236, 72, 153, 0.1) 100%);
  border: 1px solid rgba(255, 31, 140, 0.2);
}

.feature-item-2 .feature-icon {
  color: #ff1f8c;
  background: linear-gradient(135deg, rgba(255, 31, 140, 0.2) 0%, rgba(255, 107, 179, 0.2) 100%);
}

.feature-item-3 {
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.15) 0%, rgba(59, 130, 246, 0.15) 50%, rgba(37, 99, 235, 0.1) 100%);
  border: 1px solid rgba(14, 165, 233, 0.2);
}

.feature-item-3 .feature-icon {
  color: #0ea5e9;
  background: linear-gradient(135deg, rgba(14, 165, 233, 0.2) 0%, rgba(59, 130, 246, 0.2) 100%);
}

.feature-item-4 {
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.15) 0%, rgba(16, 185, 129, 0.15) 50%, rgba(5, 150, 105, 0.1) 100%);
  border: 1px solid rgba(34, 197, 94, 0.2);
}

.feature-item-4 .feature-icon {
  color: #22c55e;
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.2) 0%, rgba(16, 185, 129, 0.2) 100%);
}

.feature-item-5 {
  background: linear-gradient(135deg, rgba(124, 58, 237, 0.15) 0%, rgba(168, 85, 247, 0.15) 50%, rgba(139, 92, 246, 0.1) 100%);
  border: 1px solid rgba(124, 58, 237, 0.2);
}

.feature-item-5 .feature-icon {
  color: #7c3aed;
  background: linear-gradient(135deg, rgba(124, 58, 237, 0.2) 0%, rgba(168, 85, 247, 0.2) 100%);
}

/* Responsive Design */
@media (max-width: 1024px) {
  .product-showcase-container {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .product-showcase-container::before {
    display: none;
  }

  .product-box-wrapper {
    width: 100%;
    max-width: 100%;
    padding-right: 0;
  }

  .features-list-wrapper {
    padding-left: 0;
  }

  .product-box-3d {
    transform: rotateY(-10deg) rotateX(3deg);
  }
}

@media (max-width: 768px) {
  section.dark-background-section {
    padding: 40px 0;
  }

  section.modern-features-section {
    padding: 60px 0;
  }

  .header-line-5 {
    font-size: 48px;
  }

  .header-line-3 {
    font-size: 18px;
  }

  .product-box-3d {
    max-width: 400px;
    height: 500px;
    transform: rotateY(-5deg);
  }

  .box-top-text {
    font-size: 20px;
  }

  .box-description-text {
    font-size: 12px;
  }

  .box-bottom-text {
    font-size: 14px;
  }

  .feature-item {
    font-size: 16px;
    margin-bottom: 20px;
  }
}

@media (max-width: 480px) {
  section.dark-background-section {
    padding: 30px 0;
  }

  .header-line-5 {
    font-size: 36px;
  }

  .product-box-3d {
    max-width: 100%;
    height: 450px;
    transform: none;
  }

  .box-burst-design {
    height: 140px;
  }

  .burst-circle {
    width: 120px;
    height: 120px;
  }

  .feature-item {
    font-size: 15px;
    padding: 20px 20px;
    gap: 15px;
    word-wrap: break-word;
    overflow-wrap: break-word;
  }

  .feature-icon {
    width: 45px;
    height: 45px;
  }

  .feature-icon svg {
    width: 24px;
    height: 24px;
  }
}
section.demo-video {
  padding: 60px 0;
  background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-demo-bk/public");
  text-align: center;
  background-size: cover;
  background-repeat: no-repeat;
}
section.demo-video h3 {
  font-size: 55px;
  margin: 0 auto 104px;
  display: table;
  position: relative;
}section.demo-video h3::before {
  position: absolute;
  left: -100px;
  top: 30px;
  content: "";
  width: 80px;
  height: 80px;
  background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-ar-right/public");
}
section.demo-video h3::after {
  position: absolute;
  right: -100px;
  top: 30px;
  content: "";
  width: 80px;
  height: 80px;
  background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-ar-left/public");
}
span.pink-grad {
  background: linear-gradient(to left, #A937F2, #ED4F44);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.vimo-video {
  margin: 0 auto;
  display: table;
  /* background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-frame/public"); */
  background-size: 100% 100%;
  padding: 9px;
  width: 100%;
  max-width: 83%;
  position: relative;
}
.vimo-video::before {
  background-image: url(https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-frame/public);
  position: absolute;
  content: "";
  left: -78px;
  top: -28px;
  width: 117%;
  height: 113%;
  z-index: 9;
  background-size: 100% 100%;
  pointer-events: none;
}
.vimo-video iframe {
  width: 100%;
  height: 674px;
}
section.function-points {
  padding: 50px 0;
  text-align: center;
}
section.function-points h2 {
  font-size: 40px;
  font-weight: 800;
  margin-bottom: 30px;
}
section.vid-support {
  padding: 50px 0;
}
section.vid-support h3 {
  text-align: center;
  font-size: 47px;
  font-weight: 800;
}
span.pink-grad {
  background: linear-gradient(to left, #A937F2, #ED4F44);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
section.vid-support  h4 {
  font-size: 30px;
  text-align: center;
  color: #0066ff;
}
section.never-before img {
  width: 100%;
}
section.never-before {
  padding: 55px 0;
  background: #181a2b;
}
section.never-before h3 {
  text-align: center;
  color: #fff;
  font-size: 44px;
  font-weight: 800;
}
section.vid-support img {
  width: 100%;
  margin: -30px 0 0;
}
span.much-time {
  font-size: 32px;
  text-align: center;
  font-weight: bold;
  display: table;
  width: 100%;
  margin: -40px 0 0;
  color: #0022ff;
}
section.vid-support h6 {
  background: #f5ff31;
  margin: 0 auto;
  display: table;
  font-size: 23px;
  padding: 10px 30px;
  border-radius: 10px;
  font-weight: 800;
  margin: 12px auto 20px;
}section.vid-support h5 {
  text-align: center;
  color: red;
}

          
               
              section.demo-video {
  padding: 60px 0;
  background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-demo-bk/public");
  text-align: center;
  background-size: cover;
  background-repeat: no-repeat;
}
section.demo-video h3 {
  font-size: 55px;
  margin: 0 auto 104px;
  display: table;
  position: relative;
}section.demo-video h3::before {
  position: absolute;
  left: -100px;
  top: 30px;
  content: "";
  width: 80px;
  height: 80px;
  background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-ar-right/public");
}
section.demo-video h3::after {
  position: absolute;
  right: -100px;
  top: 30px;
  content: "";
  width: 80px;
  height: 80px;
  background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-ar-left/public");
}
span.pink-grad {
  background: linear-gradient(to left, #A937F2, #ED4F44);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.vimo-video {
  margin: 0 auto;
  display: table;
  /* background-image: url("https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-frame/public"); */
  background-size: 100% 100%;
  padding: 9px;
  width: 100%;
  max-width: 83%;
  position: relative;
}
.vimo-video::before {
  background-image: url(https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-frame/public);
  position: absolute;
  content: "";
  left: -78px;
  top: -28px;
  width: 117%;
  height: 113%;
  z-index: 9;
  background-size: 100% 100%;
  pointer-events: none;
}
.vimo-video iframe {
  width: 100%;
  height: 674px;
}
section.function-points {
  padding: 50px 0;
  text-align: center;
}
section.function-points h2 {
  font-size: 40px;
  font-weight: 800;
  margin-bottom: 30px;
}
section.vid-support {
  padding: 50px 0;
}
section.vid-support h3 {
  text-align: center;
  font-size: 47px;
  font-weight: 800;
}
span.pink-grad {
  background: linear-gradient(to left, #A937F2, #ED4F44);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
section.vid-support  h4 {
  font-size: 30px;
  text-align: center;
  color: #0066ff;
}
section.never-before img {
  width: 100%;
}
section.never-before {
  padding: 55px 0;
  background: #181a2b;
}
section.never-before h3 {
  text-align: center;
  color: #fff;
  font-size: 44px;
  font-weight: 800;
}
section.vid-support img {
  width: 100%;
  margin: -30px 0 0;
}
span.much-time {
  font-size: 32px;
  text-align: center;
  font-weight: bold;
  display: table;
  width: 100%;
  margin: -40px 0 0;
  color: #0022ff;
}
section.vid-support h6 {
  background: #f5ff31;
  margin: 0 auto;
  display: table;
  font-size: 23px;
  padding: 10px 30px;
  border-radius: 10px;
  font-weight: 800;
  margin: 12px auto 20px;
}section.vid-support h5 {
  text-align: center;
  color: red;
}
section.insta-reals {
  padding: 70px 0;
  text-align: center;
}

section.insta-reals h2 {
    margin-bottom: 30px;
    font-size: 2rem;
}
span.pink {
    background: linear-gradient(90deg, #f97316, #fb7185, #a855f7, #0ea5e9, #22c55e);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: 600;
}

                
                   
                .mf-section{
    background:radial-gradient(circle at 0 0,#e0f2fe 0,#fdf2ff 40%,#fff 100%);
    padding:70px 20px 90px;
    /*      font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;*/
    color:var(--mf-text);
  }

  .mf-inner{
    max-width:1160px;
    margin:0 auto;
  }

.mf-eyebrow {
    text-align: center;
    font-size: 18px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--mf-blue);
    font-weight: 700;
    margin-bottom: 10px;
    margin: 0 auto 22px;
    display: table;
    border: 1px solid;
    border-radius: 100px;
    padding: 10px 30px;
}

  .mf-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:6px;
  }
  .mf-heading span{
    color:var(--mf-pink);
  }

  .mf-subheading{
    text-align:center;
    font-size:clamp(22px,2.6vw,28px);
    font-weight:800;
    margin-bottom:12px;
  }
  .mf-subheading span{
    color:var(--mf-pink);
  }

.mf-tagline {
    text-align: center;
    font-size: 22px;
    font-style: italic;
    color: var(--mf-pink);
    margin-bottom: 32px;
    font-weight: 700;
}

  /* top tab row */
  .mf-tabs{
    display:flex;
    gap:14px;
    /* justify-content:space-between; */
    flex-wrap:wrap;
    margin:0 auto 24px;
  }
  .mf-tab {
    flex: initial;
    /* min-width: 140px; */
    cursor: pointer;
    border-radius: 16px;
    padding: 10px 14px;
    border: 1px solid rgba(148,163,184,.6);
    background: linear-gradient(135deg,#ffffff,#f5f5ff);
    box-shadow: 0 10px 24px rgba(148,163,184,.25);
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;
    overflow: hidden;
    transition: transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease;
    width: 19%;
}
  .mf-tab::before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,#ffe4f3,#e0f2fe);
    opacity:0;
    transition:opacity .18s ease;
  }
  .mf-tab-inner{
    position:relative;
    display:flex;
    align-items:center;
    gap:10px;
    width:100%;
  }
  .mf-tab-icon{
    width:30px;
    height:30px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
    background:radial-gradient(circle at 30% 20%,#ffffff,#e5e7eb);
    box-shadow:0 6px 12px rgba(15,23,42,.25);
  }
  .mf-tab-title{
    font-size:14px;
    font-weight:700;
    line-height:1.3;
  }

  .mf-tab.active{
    border-color:transparent;
    background:linear-gradient(135deg,#ff9ecf,#a5b4fc);
    box-shadow:0 16px 34px rgba(236,72,153,.45);
    transform:translateY(-3px);
  }
  .mf-tab.active::before{
    opacity:.25;
  }

  /* content panel */
  .mf-panel-shell{
    margin-top:6px;
    border-radius:24px;
    padding:1px;
    background:linear-gradient(135deg,#ff9ecf,#a5b4fc,#4ade80);
    box-shadow:0 20px 60px rgba(148,163,184,.55);
  }
  .mf-panel {
    border-radius: 22px;
    background: #ffffff;
    padding: 24px 26px 26px;
    display: grid;
    grid-template-columns: minmax(0,1.5fr) minmax(0,1.1fr);
    gap: 26px;
    align-items: center;
}

  .mf-panel-copy-eyebrow{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
    margin-bottom:4px;
  }
  .mf-panel-title {
    font-size: 25px;
    font-weight: 800;
    margin-bottom: 10px;
    line-height: 1.4;
    margin: 14px 0 0;
}
  .mf-panel-title span{
    color:var(--mf-pink);
  }
  .mf-panel-desc{
    font-size:15px;
    line-height:1.8;
    color:#4b5563;
    margin-bottom:10px;
  }
  .mf-panel-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
    color:#111827;
  }
  .mf-panel-bullets li{
    display:flex;
    align-items:flex-start;
    gap:8px;
    margin-bottom:6px;
  }
  .mf-panel-bullets li span.dot{
    font-size:16px;
    line-height:1.2;
    color:var(--mf-pink);
  }

  /* demo side */
  .mf-demo-card{
    border-radius:18px;
    padding:14px 16px 18px;
    background:radial-gradient(circle at 0 0,#fee2e2,#e0f2fe);
    box-shadow:0 16px 40px rgba(15,23,42,.25);
    display:flex;
    flex-direction:column;
    gap:10px;
  }
  .mf-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }
  .mf-demo-title{
    font-size:17px;
    font-weight:700;
    margin-bottom:2px;
  }
  .mf-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.35);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:13px;
    letter-spacing:.18em;
    text-transform:uppercase;
    position:relative;
    overflow:hidden;
  }
 .mf-demo-play {
    position: relative;
    bottom: 0;
    left: 0;
    padding: 0;
    border-radius: 999px;
    background: rgba(15,23,42,.8);
    color: #f9fafb;
    font-size: 11px;
    letter-spacing: .12em;
    text-transform: uppercase;
    display: flex;
    align-items: center;
    gap: 6px;
}
  .mf-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  /* fade animation when feature changes */
  .mf-panel,
  .mf-demo-card{
    transition:opacity .25s ease,transform .25s ease;
  }
  .mf-panel.is-switching,
  .mf-demo-card.is-switching{
    opacity:1;
    transform:translateY(6px);
  }

  /* responsive */
  @media (max-width:900px){
    .mf-panel{
      grid-template-columns:1fr;
      padding:20px 18px 22px;
    }
  }
  @media (max-width:640px){
    .mf-section{
      padding:60px 16px 70px;
    }
    .mf-tabs{
      flex-wrap:nowrap;
      overflow-x:auto;
      padding-bottom:4px;
      scrollbar-width:none;
    }
    .mf-tabs::-webkit-scrollbar{display:none;}
    .mf-tab{
      flex:0 0 70%;
    }
  }
                  
                   
                  .comparison-table-section {
  background: #ffffff;
  padding: 80px 0;
  position: relative;
  overflow: hidden;
}

.comparison-table-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(169, 55, 242, 0.3), transparent);
}

.comparison-table-wrapper {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 20px;
}

.comparison-table-section .container {
  max-width: 1300px;
  margin: 0 auto;
}

.comparison-table-header {
  text-align: center;
  margin-bottom: 50px;
}

.comparison-table-title {
  font-size: 42px;
  font-weight: 700;
  margin-bottom: 15px;
  font-family: "Space Grotesk", sans-serif;
  color: #111827;
  line-height: 1.2;
}

.comparison-table-subtitle {
  font-size: 20px;
  color: #6b7280;
  font-weight: 400;
  margin: 0;
  max-width: 900px;
  margin: 0 auto;
}

.comparison-table-container {
  background: #ffffff;
  border-radius: 24px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08);
  overflow-x: auto;
  border: 1px solid rgba(0, 0, 0, 0.05);
}

.comparison-table {
  width: 100%;
  border-collapse: collapse;
  font-family: "Space Grotesk", sans-serif;
  min-width: 1000px;
}

.comparison-table thead {
  background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
}

.comparison-table thead th {
  padding: 24px 20px;
  text-align: center;
  font-size: 14px;
  font-weight: 700;
  color: #111827;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  border-bottom: 2px solid rgba(169, 55, 242, 0.1);
  vertical-align: top;
}

.comparison-table thead th:first-child {
  text-align: left;
  width: 250px;
}

.comparison-table tbody td:first-child {
  text-align: left;
  font-weight: 700;
}



.comparison-table thead th.best-choice {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(34, 197, 94, 0.15) 100%);
  border: 2px solid rgba(16, 185, 129, 0.3);
  position: relative;
}

.platform-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.platform-header strong {
  font-size: 16px;
  color: #fff;
  font-weight: 700;
}

.platform-desc {
  font-size: 11px;
  color: #ffff;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.4;
}

.best-badge {
  display: inline-block;
  background: linear-gradient(135deg, #10b981, #22c55e);
  color: #ffffff;
  font-size: 11px;
  font-weight: 700;
  padding: 4px 12px;
  border-radius: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.3);
}

.comparison-table tbody tr {
  transition: all 0.3s ease;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

.comparison-table tbody tr:hover {
  background: rgba(169, 55, 242, 0.03);
}

.comparison-table tbody tr:last-child {
  border-bottom: none;
}

.comparison-table tbody td {
  padding: 20px;
  font-size: 15px;
  color: #111827;
  vertical-align: middle;
  text-align: center;
}


.comparison-table tbody td.best-choice {
  background: rgba(16, 185, 129, 0.05);
  font-weight: 600;
}

/* Feature status styles */
.feature-yes {
  color: #10b981 !important;
  font-weight: 700 !important;
  position: relative;
}

.feature-yes::before {
  content: '✓';
  display: inline-block;
  margin-right: 6px;
  font-size: 18px;
  font-weight: 700;
}

.feature-no {
  color: #ef4444 !important;
  font-weight: 600 !important;
}

.feature-limited {
  color: #f97316 !important;
  font-weight: 600 !important;
}

.price-unlimited {
  color: #10b981 !important;
  font-weight: 700 !important;
  font-size: 16px !important;
}

.price-unlimited::before {
  content: '✓';
  display: inline-block;
  margin-right: 6px;
  font-size: 18px;
  font-weight: 700;
}

/* Responsive styles */
@media (max-width: 1200px) {
  .comparison-table-title {
    font-size: 36px;
  }
  
  .comparison-table-subtitle {
    font-size: 18px;
  }
}

@media (max-width: 768px) {
  .comparison-table-section {
    padding: 60px 0;
  }
  
  .comparison-table-title {
    font-size: 28px;
  }
  
  .comparison-table-subtitle {
    font-size: 16px;
  }
  
  .comparison-table-wrapper {
    padding: 0 15px;
  }
  
  .comparison-table-container {
    border-radius: 16px;
  }
  
  .comparison-table thead th {
    padding: 16px 12px;
    font-size: 12px;
  }
  
  .comparison-table tbody td {
    padding: 16px 12px;
    font-size: 13px;
  }
  
  .platform-header strong {
    font-size: 14px;
  }
  
  .platform-desc {
    font-size: 10px;
  }
  
  .best-badge {
    font-size: 10px;
    padding: 3px 10px;
  }
}

                    
                  

  
    .aivideo-comparison-section {
    background: #fbf8ff;
    padding: 40px 20px;
    position: relative;
}

.aivideo-comparison-wrap {
    max-width: 1150px;
    margin: 0 auto;
    padding: 40px 22px 30px;
    text-align: center;
    position: relative;
    box-shadow: 0 0 10px 1px #ddd;
    border-radius: 20px;
}

    .aivideo-comparison-title {
      font-size: 42px;
      font-weight: 800;
      color: #000;
      margin-bottom: 12px;
      letter-spacing: 0.02em;
    }

    .aivideo-comparison-subtitle {
      font-size: 17px;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #000;
      margin-bottom: 40px;
      line-height: 1.6;
    }

    .aivideo-comparison-subtitle span.pain {
      color: #ff1f8c;
      font-weight: 700;
    }

    .aivideo-comparison-subtitle span.gain {
      color: #4ade80;
      font-weight: 700;
    }

    .aivideo-comparison-card-shell {
      position: relative;
      border-radius: 26px;
      padding: 1px;
      background: linear-gradient(135deg, #ff9ad5, #ffb347, #4ade80, #38bdf8);
      box-shadow:
        0 24px 80px rgba(248, 113, 113, 0.28),
        0 0 0 1px rgba(255, 255, 255, 0.8);
    }

    .aivideo-comparison-grid {
      border-radius: 24px;
      background: #1a1a1a;
      overflow: hidden;
    }

    .aivideo-comparison-header {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      font-size: 20px;
      font-weight: 700;
      text-align: left;
    }

    .aivideo-comparison-header-cell {
      padding: 18px 22px;
      display: flex;
      align-items: center;
      gap: 12px;
      position: relative;
      overflow: hidden;
    }

    .aivideo-comparison-header-cell.left {
      background: linear-gradient(90deg, rgba(255, 31, 140, 0.2), rgba(255, 31, 140, 0.15));
      border-right: 1px solid rgba(255, 255, 255, 0.1);
      color: #ff1f8c;
    }

    .aivideo-comparison-header-cell.right {
      background: linear-gradient(90deg, rgba(74, 222, 128, 0.2), rgba(74, 222, 128, 0.15));
      color: #4ade80;
    }

    .aivideo-comparison-header-icon {
      width: 30px;
      height: 30px;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
      background: rgba(255, 255, 255, 0.1);
      box-shadow: 0 6px 16px rgba(0, 0, 0, 0.3);
      flex-shrink: 0;
    }

    .aivideo-comparison-header-cell.left .aivideo-comparison-header-icon {
      color: #ff1f8c;
    }

    .aivideo-comparison-header-cell.right .aivideo-comparison-header-icon {
      color: #4ade80;
    }

    .aivideo-comparison-header-pill {
      font-size: 14px;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      padding: 2px 8px;
      border-radius: 999px;
      border: 1px solid rgba(255, 255, 255, 0.2);
      background: rgba(255, 255, 255, 0.1);
      color: #fff;
      display: inline-block;
      margin-right: 8px;
    }

    .aivideo-comparison-header-title {
      font-size: 21px;
      font-weight: 700;
    }

    .aivideo-comparison-rows {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    .aivideo-comparison-row {
      display: contents;
    }

    .aivideo-comparison-cell {
    padding: 16px 22px;
    font-size: 17px;
    text-align: left;
    line-height: 1.7;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    position: relative;
    transition: background 0.2s ease, box-shadow 0.2s ease, transform 0.18s ease;
    color: #000;
    align-items: center;
}
.aivideo-comparison-cell.left {
    background: #fff5f7;
    border-right: 1px solid rgba(255, 255, 255, 0.08);
    border-left: 3px solid rgba(255, 31, 140, 0.6);
}
.aivideo-comparison-cell.right {
    background: #ecfdf3;
    border-left: 3px solid rgba(74, 222, 128, 0.6);
}

.aivideo-comparison-row:nth-child(2n) .aivideo-comparison-cell.left {
    background: #f8ecef;
}
.aivideo-comparison-row:nth-child(2n) .aivideo-comparison-cell.right {
    background: #e0ffed;
}

    .aivideo-comparison-cell span.pain {
      color: #ff1f8c;
      font-weight: 600;
    }

    .aivideo-comparison-cell span.gain {
      color: #4ade80;
      font-weight: 600;
    }


    @media (max-width: 960px) {
      .aivideo-comparison-section {
        padding: 60px 16px;
      }

      .aivideo-comparison-wrap {
        padding: 30px 16px 45px;
      }

      .aivideo-comparison-title {
        font-size: 32px;
      }

      .aivideo-comparison-subtitle {
        font-size: 14px;
      }

      .aivideo-comparison-card-shell {
        box-shadow:
          0 16px 50px rgba(248, 113, 113, 0.25),
          0 0 0 1px rgba(255, 255, 255, 0.8);
      }

      .aivideo-comparison-header,
      .aivideo-comparison-rows {
        grid-template-columns: 1fr;
      }

      .aivideo-comparison-header-cell.left,
      .aivideo-comparison-cell.left {
        border-right: none;
      }

      .aivideo-comparison-cell {
        border-top: 1px solid rgba(255, 255, 255, 0.1);
      }

      .aivideo-comparison-row:hover .aivideo-comparison-cell.left,
      .aivideo-comparison-row:hover .aivideo-comparison-cell.right {
        transform: translateX(0);
      }
    }
                        
                           
    .comparison-section {
      padding: 50px 20px;
      position: relative;
      overflow: hidden;
      background: linear-gradient(180deg, #e8f8ef 0%, #eef8f2 50%, #e2f2e8 100%);
  }

.comparison-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(135deg, rgba(135, 86, 255, 0.03) 0%, rgba(112, 52, 255, 0.03) 100%);
  pointer-events: none;
}

.comparison-header {
  text-align: center;
  margin-bottom: 30px;
  position: relative;
  z-index: 1;
}

.comparison-title {
    font-size: 22px;
    font-weight: 700;
    color: #1e293b;
    margin: 0 0 14px 0;
    text-align: center;
    line-height: 1.35;
}
.highlight-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 24px;
  margin-top: 35px;
}
.comparison-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 24px;
    margin-top: 35px;
}
.comparison-subtitle {
  font-size: 20px;
  color: #4a5568;
  font-weight: 500;
  max-width: 840px;
  margin: 0 auto;
  line-height: 1.6;
}

.comparison-table-wrapper {
  position: relative;
  z-index: 1;
  overflow-x: auto;
  border-radius: 20px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
  background: #ffffff;
  padding: 2px;
  background: #fff;
}
.pricing-comparison-header {
  text-align: center;
  margin: 60px 0 40px;
  position: relative;
  z-index: 1;
}

.pricing-comparison-title {
  font-size: 42px;
  font-weight: 800;
  color: #2d3748;
  margin-bottom: 20px;
  background: linear-gradient(135deg, #47f50b 0%, #06d918 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.pricing-comparison-intro {
  font-size: 18px;
  color: #4a5568;
  font-weight: 500;
  max-width: 900px;
  margin: 0 auto;
  line-height: 1.7;
}

.pricing-table-wrapper {
  position: relative;
  z-index: 1;
  overflow-x: auto;
  border-radius: 20px;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
  background: #ffffff;
  padding: 2px;
  background: linear-gradient(135deg, rgba(251, 191, 36, 0.1) 0%, rgba(217, 119, 6, 0.1) 100%);
  margin-bottom: 40px;
}

.pricing-comparison-table {
  width: 100%;
  border-collapse: collapse;
  background: #ffffff;
  border-radius: 18px;
  overflow: hidden;
  min-width: 900px;
  table-layout: fixed;
}
.pricing-comparison-table thead {
  background: linear-gradient(135deg, #61f50b 0%, #0f9400 100%);
}

.pricing-comparison-table thead th {
  padding: 25px 20px;
  text-align: center;
  color: #ffffff;
  font-weight: 700;
  font-size: 16px;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
}

.pricing-comparison-table thead th:last-child {
  border-right: none;
}

.pricing-sno-col {
  width: 8%;
  background: linear-gradient(135deg, #4a5568 0%, #2d3748 100%);
}

.pricing-editor-col {
  width: 25%;
  text-align: left !important;
}

.pricing-range-col {
  width: 33%;
}

.pricing-limit-col {
  width: 34%;
}

.pricing-comparison-table tbody tr {
  border-bottom: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.pricing-comparison-table tbody tr:hover {
  background: linear-gradient(135deg, rgba(251, 191, 36, 0.08) 0%, rgba(217, 119, 6, 0.08) 100%);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.pricing-comparison-table tbody tr:nth-child(even) {
  background: linear-gradient(135deg, rgba(254, 252, 232, 0.5) 0%, rgba(253, 250, 230, 0.5) 100%);
}

.pricing-comparison-table tbody tr:nth-child(even):hover {
  background: linear-gradient(135deg, rgba(251, 191, 36, 0.12) 0%, rgba(217, 119, 6, 0.12) 100%);
}

.best-value-row {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(5, 150, 105, 0.15) 100%) !important;
  border: 2px solid rgba(16, 185, 129, 0.3);
  position: relative;
}

.best-value-row:nth-child(even) {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(5, 150, 105, 0.15) 100%) !important;
}

.best-value-row::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #10b981 0%, #059669 100%);
}

.best-value-row:hover {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.2) 0%, rgba(5, 150, 105, 0.2) 100%) !important;
  box-shadow: 0 6px 20px rgba(16, 185, 129, 0.2);
}

.pricing-comparison-table tbody td {
  padding: 20px;
  text-align: center;
  font-size: 15px;
  font-weight: 500;
  border-right: 1px solid #e2e8f0;
  vertical-align: top;
}

.pricing-comparison-table tbody td.pricing-limit {
  vertical-align: middle;
}

.pricing-comparison-table tbody td:last-child {
  border-right: none;
}

.pricing-sno {
  text-align: center !important;
  font-weight: 700;
  color: #4a5568;
  background: linear-gradient(135deg, rgba(237, 242, 247, 0.5) 0%, rgba(226, 232, 240, 0.5) 100%);
  font-size: 16px;
}

.pricing-editor {
  text-align: left !important;
  padding-left: 25px !important;
}

.pricing-editor strong {
  display: block;
  font-size: 17px;
  font-weight: 700;
  color: #2d3748;
  margin-bottom: 6px;
}

.pricing-desc {
  display: block;
  font-size: 13px;
  color: #718096;
  font-weight: 400;
  font-style: italic;
}

.pricing-range {
  color: #2d3748;
  line-height: 1.6;
}

.pricing-range small {
  display: block;
  font-size: 12px;
  color: #718096;
  margin-top: 6px;
  font-style: italic;
}

.pricing-range.best-value {
  color: #059669;
  font-weight: 700;
  font-size: 16px;
}

.pricing-limit {
  color: #2d3748;
  line-height: 1.6;
  position: relative;
}

.pricing-limit small {
  display: block;
  font-size: 12px;
  color: #718096;
  margin-top: 6px;
  font-style: italic;
}

.pricing-limit.best-value {
  color: #059669;
  font-weight: 700;
  font-size: 16px;
}

.pricing-limit.best-value > div {
  margin-bottom: 8px;
}

.best-value-badge {
  display: block;
  background: linear-gradient(135deg, #10b981 0%, #059669 100%);
  color: #ffffff;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
  margin-top: 10px;
  width: fit-content;
  margin-left: auto;
  margin-right: auto;
}

.pricing-comparison-footer {
  text-align: center;
  margin-top: 40px;
  position: relative;
  z-index: 1;
}

.pricing-conclusion {
    font-size: 18px;
    color: #2d3748;
    font-weight: 600;
    max-width: 1000px;
    margin: 0 auto;
    line-height: 1.8;
    padding: 25px 30px;
    background: linear-gradient(135deg, rgb(86 255 182 / 8%) 0%, rgb(52 255 129 / 8%) 100%);
    border-radius: 15px;
    border-left: 4px solid #00e959;
    text-align: left;
}
section.commercial-plans.oto-one-commercial-plans {
    background-image: url(https://imagedelivery.net/gmO3Si5-ALsji_V36_2olg/aivideo-alert-bk/public);
    background-size: 100%;
    background-repeat: repeat;
    padding-bottom: 60px;
    padding-top:40px;
}
section.commercial-plans.oto-one-commercial-plans h1 {
    font-size: 44px;
    text-align: center;
    font-weight: 900;
    margin-bottom: 20px;
}
section.commercial-plans.oto-one-commercial-plans h2 {
    font-size: 36px;
    color: #0036B5;
    text-align: center;
    margin-bottom: 30px;
    font-weight: 900;
}
.commercialplans-inner {
    background: #2c48ff;
    border: 1px solid #70707021;
    border-radius: 6px;
    padding: 15px 20px 20px;
}
img.comm-logo {
    margin: 40px auto 34px;
    display: table;
}
.commercialplans-inner ul {
    padding: 0;
    box-shadow: 0 0 10px 1px #ddddddbf;
    background: #fff;
    border-radius: 10px;
    padding: 35px 30px 80px;
}
.commercialplans-inner ul li {
    list-style: none;
    font-size: 20px;
    padding-left: 40px;
    line-height: 30px;
    position: relative;
    padding: 12px 0 12px 41px;
    font-weight: 500;
    color: #20253D;
    border-bottom: 1px solid #ddd;
}
.faq-section {
      padding: 80px 0;
    }

    .faq-title {
      font-weight: 700;
      margin-bottom: 50px;
    }

    .accordion-item {
      border: 1px solid #e5e7eb;
      border-radius: 10px;
      overflow: hidden;
      margin-bottom: 20px;
      background: #fff;
    }

    .accordion-button {
      font-weight: 600;
      color: #2563eb;
      background: #ffffff;
      padding: 18px 20px;
    }

    .accordion-button:not(.collapsed) {
      background: #f1f5ff;
      color: #1e40af;
      box-shadow: none;
    }

    .accordion-button:focus {
      box-shadow: none;
    }

    .accordion-body {
      color: #374151;
      line-height: 1.7;
      font-size: 15px;
    }
a.price-btn {
    margin: 20px auto 0;
    display: table;
}
.oto-cards img:first-child {
    max-width: 340px;
    margin: 0 auto;
    display: table;
}
.commercialplans-inner ul li img {
    position: absolute;
    left: 10px;
    max-width: 23px;
}
section.commercial-plans.oto-one-commercial-plans p {
    font-size: 24px;
    color:#000;
    text-align: center;
}
.oto-cards img {
    width: 100%;
    max-width: 340px;
    margin: 0 auto;
    display: table;
}
/* Responsive Design for Pricing Table */
@media (max-width: 1200px) {
  .pricing-comparison-title {
    font-size: 36px;
  }
  
  .pricing-comparison-intro {
    font-size: 16px;
  }
}

@media (max-width: 768px) {
  .pricing-comparison-header {
    margin: 40px 0 30px;
  }
  
  .pricing-comparison-title {
    font-size: 28px;
  }
  
  .pricing-comparison-intro {
    font-size: 15px;
    padding: 0 10px;
  }
  
  .pricing-table-wrapper {
    border-radius: 15px;
    margin-bottom: 30px;
  }
  
  .pricing-comparison-table {
    font-size: 13px;
  }
  
  .pricing-comparison-table thead th {
    padding: 18px 12px;
    font-size: 14px;
  }
  
  .pricing-comparison-table tbody td {
    padding: 15px 12px;
    font-size: 13px;
  }
  
  .pricing-editor strong {
    font-size: 15px;
  }
  
  .pricing-desc {
    font-size: 12px;
  }
  
  .pricing-conclusion {
    font-size: 16px;
    padding: 20px 15px;
  }
}

/* ========== MODERN PRICING SECTION ========== */
.modern-pricing-section {
  padding: 80px 20px;
  background: linear-gradient(135deg, #f8f9ff 0%, #ffffff 50%, #f0f4ff 100%);
  position: relative;
  overflow: hidden;
}

.modern-pricing-section::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: radial-gradient(circle at 20% 50%, rgba(109, 68, 255, 0.05) 0%, transparent 50%),
              radial-gradient(circle at 80% 80%, rgba(255, 31, 140, 0.05) 0%, transparent 50%);
  pointer-events: none;
}

.pricing-hero {
  text-align: center;
  margin-bottom: 60px;
  position: relative;
  z-index: 1;
}

.pricing-main-title {
  font-size: 42px;
  font-weight: 800;
  color: #1a1a2e;
  margin: 0 0 20px;
  line-height: 1.2;
  letter-spacing: -0.5px;
}

.pricing-subtitle {
  font-size: 28px;
  font-weight: 700;
  background: linear-gradient(135deg, #6d44ff 0%, #8756ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  margin: 0;
  line-height: 1.3;
}

.pricing-card-wrapper {
  max-width: 1000px;
  margin: 0 auto;
  background: #ffffff;
  border-radius: 32px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.08), 0 0 0 1px rgba(0, 0, 0, 0.04);
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.pricing-logo-box {
  background: linear-gradient(135deg, #6d44ff 0%, #8756ff 100%);
  padding: 40px 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  position: relative;
  overflow: hidden;
}

.pricing-logo-box::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: linear-gradient(45deg, transparent, rgba(255, 255, 255, 0.1), transparent);
  animation: shine 3s infinite;
}

@keyframes shine {
  0% { transform: translateX(-100%) translateY(-100%) rotate(45deg); }
  100% { transform: translateX(100%) translateY(100%) rotate(45deg); }
}

.pricing-logo-icon {
  width: 60px;
  height: 60px;
  background: #ffffff;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  font-weight: 800;
  color: #6d44ff;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.pricing-logo-text {
  font-size: 32px;
  font-weight: 800;
  color: #ffffff;
  letter-spacing: -0.5px;
}

.pricing-features-grid {
  padding: 40px 30px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  background: #ffffff;
}

.feature-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 16px;
  border-radius: 12px;
  background: #f8f9ff;
  transition: all 0.3s ease;
  border: 1px solid transparent;
}

.feature-item:hover {
  background: linear-gradient(135deg, #f0f4ff 0%, #ffffff 100%);
  border-color: rgba(109, 68, 255, 0.2);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(109, 68, 255, 0.1);
}

.feature-number {
  min-width: 32px;
  height: 32px;
  background: linear-gradient(135deg, #6d44ff 0%, #8756ff 100%);
  color: #ffffff;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 700;
  flex-shrink: 0;
}

.feature-text {
    font-size: 15px;
    line-height: 1.5;
    color: #2d3748;
    font-weight: 500;
    display: flex;
    flex-wrap: wrap;
}

.pricing-cta-section {
  background: linear-gradient(135deg, #6d44ff 0%, #8756ff 100%);
  padding: 50px 30px;
  text-align: center;
  position: relative;
}

.pricing-amount-box {
  margin-bottom: 30px;
}

.pricing-amount {
  font-size: 56px;
  font-weight: 900;
  color: #ffa500;
  text-shadow: 0 2px 10px rgba(255, 165, 0, 0.3);
  display: inline-block;
  letter-spacing: -1px;
}

.pricing-buy-button {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, #ffd700 0%, #ffed4e 100%);
  color: #1a1a2e;
  font-size: 20px;
  font-weight: 800;
  padding: 20px 50px;
  border-radius: 16px;
  text-decoration: none;
  box-shadow: 0 8px 30px rgba(255, 215, 0, 0.4), 0 0 0 0 rgba(255, 215, 0, 0.7);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 30px;
}

.pricing-buy-button::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0;
  height: 0;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.5);
  transform: translate(-50%, -50%);
  transition: width 0.6s, height 0.6s;
}

.pricing-buy-button:hover::before {
  width: 300px;
  height: 300px;
}

.pricing-buy-button:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 12px 40px rgba(255, 215, 0, 0.5), 0 0 0 4px rgba(255, 215, 0, 0.3);
}

.pricing-buy-button:active {
  transform: translateY(-1px) scale(0.98);
}

.button-arrow {
  transition: transform 0.3s ease;
}

.pricing-buy-button:hover .button-arrow {
  transform: translateX(4px);
}

.pricing-guarantee-badge {
  margin-bottom: 25px;
}

.guarantee-seal {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 100px;
  background: linear-gradient(135deg, #ffd700 0%, #ffed4e 100%);
  border-radius: 50%;
  box-shadow: 0 4px 20px rgba(255, 215, 0, 0.4);
  border: 4px solid #ffffff;
}

.guarantee-text {
  font-size: 10px;
  font-weight: 800;
  color: #1a1a2e;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  line-height: 1.2;
}

.guarantee-percent {
  font-size: 24px;
  font-weight: 900;
  color: #1a1a2e;
  line-height: 1;
}

.pricing-payment-methods {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-bottom: 15px;
  flex-wrap: wrap;
}

.payment-logo {
  height: 30px;
  width: auto;
  filter: brightness(0) invert(1);
  opacity: 0.9;
}

.payment-text {
  color: #ffffff;
  font-size: 16px;
  font-weight: 600;
  opacity: 0.9;
}

.pricing-powered-by {
  color: rgba(255, 255, 255, 0.7);
  font-size: 12px;
  margin: 0;
  font-weight: 500;
}

.pricing-footer-info {
  padding: 40px 30px;
  background: #ffffff;
  text-align: center;
}

.pricing-guarantee-full {
  margin-bottom: 30px;
}

.guarantee-seal-large {
  display: inline-block;
  background: linear-gradient(135deg, #ffd700 0%, #ffed4e 100%);
  padding: 12px 30px;
  border-radius: 50px;
  box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3);
  border: 2px solid #ffffff;
}

.guarantee-seal-large span {
  font-size: 16px;
  font-weight: 800;
  color: #1a1a2e;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.pricing-no-download {
  font-size: 20px;
  font-weight: 700;
  color: #1a1a2e;
  margin: 0 0 30px;
}

.pricing-compatibility {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 40px;
  flex-wrap: wrap;
}

.compat-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  color: #6d44ff;
  transition: transform 0.3s ease;
}

.compat-item:hover {
  transform: translateY(-3px);
}

.compat-item svg {
  width: 32px;
  height: 32px;
}

.compat-item span {
  font-size: 14px;
  font-weight: 600;
  color: #2d3748;
}

/* Responsive Design */
@media (max-width: 768px) {
  .modern-pricing-section {
    padding: 50px 15px;
  }

  .pricing-main-title {
    font-size: 28px;
  }

  .pricing-subtitle {
    font-size: 20px;
  }

  .pricing-logo-box {
    padding: 30px 20px;
    flex-direction: column;
    gap: 15px;
  }

  .pricing-logo-icon {
    width: 50px;
    height: 50px;
    font-size: 20px;
  }

  .pricing-logo-text {
    font-size: 24px;
  }

  .pricing-features-grid {
    grid-template-columns: 1fr;
    padding: 30px 20px;
    gap: 15px;
  }

  .feature-item {
    padding: 14px;
  }

  .feature-text {
    font-size: 14px;
  }

  .pricing-cta-section {
    padding: 40px 20px;
  }

  .pricing-amount {
    font-size: 42px;
  }

  .pricing-buy-button {
    font-size: 18px;
    padding: 18px 40px;
    width: 100%;
    max-width: 300px;
    justify-content: center;
  }

  .pricing-footer-info {
    padding: 30px 20px;
  }

  .pricing-compatibility {
    gap: 30px;
  }

  .compat-item svg {
    width: 28px;
    height: 28px;
  }
}

@media (max-width: 480px) {
  .pricing-main-title {
    font-size: 24px;
  }

  .pricing-subtitle {
    font-size: 18px;
  }

  .pricing-amount {
    font-size: 36px;
  }

  .pricing-buy-button {
    font-size: 16px;
    padding: 16px 30px;
  }

  .guarantee-seal {
    width: 80px;
    height: 80px;
  }

  .guarantee-text {
    font-size: 9px;
  }

  .guarantee-percent {
    font-size: 20px;
  }
}
>
body {
  font-family: 'Inter', sans-serif;
  background: radial-gradient(circle at top, #eef2ff, #f8fafc);
}

/* SECTION */
.faq-section {
  padding: 100px 0;
  position: relative;
}

/* TITLE */
.faq-title {
  font-size: 38px;
  font-weight: 800;
  background: linear-gradient(90deg, #2563eb, #7c3aed);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 20px;
}

.faq-subtitle {
  color: #6b7280;
  max-width: 720px;
  margin: auto;
  margin-bottom: 60px;
}

/* FAQ CARD */
.accordion-item {
  background: rgba(255, 255, 255, 0.85);
  border-radius: 18px;
  border: none;
  margin-bottom: 24px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.06);
  transition: all 0.3s ease;
}

.accordion-item:hover {
  transform: translateY(-6px);
  box-shadow: 0 18px 40px rgba(0,0,0,0.12);
}

/* BUTTON */
.accordion-button {
  border-radius: 18px;
  padding: 22px 24px;
  font-weight: 600;
  font-size: 16px;
  color: #111827;
  background: transparent;
}

.accordion-button:focus {
  box-shadow: none;
}

.accordion-button:not(.collapsed) {
  background: transparent;
  color: #2563eb;
}

/* REMOVE DEFAULT ICON */
.accordion-button::after {
  background-image: none;
  content: "+";
  font-size: 28px;
  font-weight: 400;
  color: #2563eb;
  transition: transform 0.3s ease;
}

.accordion-button:not(.collapsed)::after {
  content: "";
}

/* NUMBER BADGE */
.faq-number {
  width: 36px;
  height: 36px;
  background: linear-gradient(135deg, #2563eb, #7c3aed);
  color: #fff;
  font-weight: 700;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 14px;
  flex-shrink: 0;
}

.comparison-table {
  width: 100%;
  border-collapse: collapse;
  background: #ffffff;
  border-radius: 18px;
  overflow: hidden;
  min-width: 1000px;
}

.comparison-table thead {
  background: linear-gradient(135deg, #6d44ff 0%, #8756ff 100%);
}

.comparison-table thead th {
  padding: 25px 20px;
  text-align: center;
  color: #ffffff;
  font-weight: 700;
  font-size: 16px;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
  position: relative;
}

.comparison-table thead th:last-child {
  border-right: none;
}

.comparison-table thead th.feature-col {
  background: linear-gradient(135deg, #4a5568 0%, #2d3748 100%);
  text-align: left;
  font-size: 18px;
  padding-left: 25px;
  color: #fff;
}
.pricing-cta-section a img {
  max-width: 540px;
  margin: 0 0 20px;
}
.platform-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.platform-header strong {
  font-size: 18px;
  font-weight: 800;
}

.platform-desc {
  font-size: 12px;
  font-weight: 400;
  opacity: 0.9;
  line-height: 1.4;
}

.best-badge {
  background: linear-gradient(135deg, #10b981 0%, #059669 100%);
  color: #ffffff;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
}

.platform-col.best-choice {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.15) 0%, rgba(5, 150, 105, 0.15) 100%);
  position: relative;
}

.platform-col.best-choice::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, #10b981 0%, #059669 100%);
}

.comparison-table tbody tr {
  border-bottom: 1px solid #e2e8f0;
  transition: all 0.3s ease;
}

.comparison-table tbody tr:hover {
  background: linear-gradient(135deg, rgba(135, 86, 255, 0.05) 0%, rgba(112, 52, 255, 0.05) 100%);
  transform: scale(1.01);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.comparison-table tbody tr:nth-child(even) {
  background: linear-gradient(135deg, rgba(248, 250, 252, 0.5) 0%, rgba(241, 245, 249, 0.5) 100%);
}

.comparison-table tbody tr:nth-child(even):hover {
  background: linear-gradient(135deg, rgba(135, 86, 255, 0.08) 0%, rgba(112, 52, 255, 0.08) 100%);
}

.comparison-table tbody td {
  padding: 20px;
  text-align: center;
  font-size: 15px;
  font-weight: 500;
  border-right: 1px solid #e2e8f0;
  vertical-align: middle;
}

.comparison-table tbody td:last-child {
  border-right: none;
}

.feature-name {
  text-align: left !important;
  font-weight: 600;
  color: #2d3748;
  padding-left: 25px !important;
}

.feature-value {
  font-weight: 600;
  position: relative;
}

.feature-value.yes {
  color: #059669;
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.1) 0%, rgba(5, 150, 105, 0.1) 100%);
}

.feature-value.yes::before {
  content: 'âœ“';
  display: inline-block;
  margin-right: 8px;
  font-weight: 800;
  color: #10b981;
}

.feature-value.no {
  color: #dc2626;
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.1) 0%, rgba(220, 38, 38, 0.1) 100%);
}

.feature-value.no::before {
  content: 'âœ—';
  display: inline-block;
  margin-right: 8px;
  font-weight: 800;
  color: #ef4444;
}

.feature-value.limited {
  color: #d97706;
  background: linear-gradient(135deg, rgba(251, 146, 60, 0.1) 0%, rgba(217, 119, 6, 0.1) 100%);
}

.feature-value.limited::before {
  content: '~';
  display: inline-block;
  margin-right: 8px;
  font-weight: 800;
  color: #f97316;
}

/* Responsive Design */
@media (max-width: 1200px) {
  .comparison-title {
    font-size: 36px;
  }
  
  .comparison-subtitle {
    font-size: 18px;
  }
}

@media (max-width: 768px) {
  .comparison-section {
    padding: 50px 15px;
  }
  
  .comparison-title {
    font-size: 28px;
  }
  
  .comparison-subtitle {
    font-size: 16px;
    padding: 0 10px;
  }
  
  .comparison-table-wrapper {
    border-radius: 15px;
  }
  
  .comparison-table {
    font-size: 13px;
  }
  
  .comparison-table thead th {
    padding: 18px 12px;
    font-size: 14px;
  }
  
  .comparison-table tbody td {
    padding: 15px 12px;
    font-size: 13px;
  }
  
  .platform-header strong {
    font-size: 16px;
  }
  
  .platform-desc {
    font-size: 11px;
  }
}
      
                            .traffic-intro-section{
      position:relative;
      z-index:1;
      max-width:1180px;
      margin:40px auto 40px;
      padding:40px 30px;
      background:linear-gradient(135deg, 
        #fef3f8 0%, 
        #f0f9ff 25%, 
        #f5f3ff 50%, 
        #fff7ed 75%, 
        #ffffff 100%);
      border-radius:16px;
      box-shadow:0 4px 20px rgba(0, 0, 0, 0.06);
      overflow:hidden;
    }

    .traffic-intro-section::before{
      content:'';
      position:absolute;
      top:0;
      left:0;
      right:0;
      bottom:0;
      background:radial-gradient(circle at 20% 30%, rgba(255, 31, 140, 0.08) 0%, transparent 50%),
                  radial-gradient(circle at 80% 70%, rgba(37, 99, 235, 0.08) 0%, transparent 50%),
                  radial-gradient(circle at 50% 50%, rgba(123, 97, 255, 0.06) 0%, transparent 50%);
      pointer-events:none;
      z-index:0;
    }

    .traffic-intro-content{
      position:relative;
      z-index:1;
      text-align:center;
      max-width:900px;
      margin:0 auto;
    }

    .traffic-intro-title{
      font-size:32px;
      font-weight:700;
      color:#111827;
      line-height:1.4;
      margin-bottom:24px;
      letter-spacing:-0.02em;
    }

    .traffic-intro-title .highlight{
      color:var(--pink-main);
      font-weight:800;
    }

    .traffic-intro-subtitle{
      font-size:20px;
      font-weight:500;
      color:#000;
      line-height:1.6;
      margin-bottom:20px;
    }

    .traffic-intro-description{
      font-size:18px;
      font-weight:400;
      color:#000;
      line-height:1.7;
      margin-top:28px;
    }

    .traffic-intro-description .bold-text{
      font-weight:600;
      color:#000;
    }

    @media (max-width: 768px) {
      .traffic-intro-section{
        margin:40px auto 30px;
        padding:35px 20px;
      }

      .traffic-intro-title{
        font-size:24px;
        margin-bottom:18px;
      }

      .traffic-intro-subtitle{
        font-size:18px;
        margin-bottom:16px;
      }

      .traffic-intro-description{
        font-size:16px;
        margin-top:20px;
      }
    }
                            
                             
                               .tiktok-agency-section {
      position: relative;
      max-width: 100%;
      margin: 60px auto 40px;
      padding: 50px 20px;
      overflow: hidden;
    }

    .tiktok-agency-section::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: 
        radial-gradient(circle at 10% 20%, rgba(255, 31, 140, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 90% 80%, rgba(37, 99, 235, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(123, 97, 255, 0.08) 0%, transparent 70%);
      pointer-events: none;
      z-index: 0;
    }

    .tiktok-agency-content {
    position: relative;
    z-index: 1;
    max-width: 1180px;
    margin: 0 auto;
}
    .tiktok-agency-header {
      text-align: center;
      margin-bottom: 50px;
    }

    .tiktok-agency-intro {
      font-size: 24px;
      font-weight: 600;
      color: #374151;
      line-height: 1.6;
      margin-bottom: 20px;
    }

    .tiktok-agency-title {
      font-size: 48px;
      font-weight: 900;
      background: linear-gradient(135deg, #ff1f8c, #7b61ff, #2563eb);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      line-height: 1.2;
      margin-bottom: 30px;
      letter-spacing: 0.05em;
      max-width: 800px;
      margin: 0 auto;
    }

    .tiktok-agency-steps {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
      margin-top: 50px;
    }

    .agency-step-card {
      position: relative;
      background: linear-gradient(135deg, #ffffff 0%, #fafafa 100%);
      border-radius: 24px;
      padding: 25px 18px;
      box-shadow: 
        0 20px 60px rgba(0, 0, 0, 0.12),
        0 0 0 1px rgba(0, 0, 0, 0.05);
      transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      overflow: hidden;
      border: 1px solid rgba(255, 255, 255, 0.8);
      backdrop-filter: blur(10px);
    }

    .agency-step-card::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 6px;
      border-radius: 24px 24px 0 0;
      z-index: 1;
    }

    .agency-step-card.step-1::before {
      background: linear-gradient(90deg, #ff8a3c, #ff6b35);
    }

    .agency-step-card.step-2::before {
      background: linear-gradient(90deg, #10b981, #22c55e);
    }

    .agency-step-card.step-3::before {
      background: linear-gradient(90deg, #2563eb, #3b82f6);
    }

    .agency-step-card::after {
      content: '';
      position: absolute;
      inset: -2px;
      border-radius: 24px;
      background: linear-gradient(135deg, transparent, rgba(255, 31, 140, 0.1), transparent);
      opacity: 0;
      transition: opacity 0.4s ease;
      z-index: -1;
    }

    .agency-step-card:hover::after {
      opacity: 1;
    }

    .agency-step-card:hover {
      transform: translateY(-8px);
      box-shadow: 
        0 30px 80px rgba(0, 0, 0, 0.18),
        0 0 40px rgba(0, 0, 0, 0.08);
    }

    .agency-step-card.step-1:hover {
      box-shadow: 
        0 30px 80px rgba(0, 0, 0, 0.18),
        0 0 50px rgba(255, 138, 60, 0.2);
    }

    .agency-step-card.step-2:hover {
      box-shadow: 
        0 30px 80px rgba(0, 0, 0, 0.18),
        0 0 50px rgba(16, 185, 129, 0.2);
    }

    .agency-step-card.step-3:hover {
      box-shadow: 
        0 30px 80px rgba(0, 0, 0, 0.18),
        0 0 50px rgba(37, 99, 235, 0.2);
    }

    .agency-step-badge {
      display: inline-block;
      padding: 8px 20px;
      border-radius: 12px;
      font-size: 14px;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: 0.1em;
      color: #ffffff;
      margin-bottom: 0px;
      box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    }

    .agency-step-badge.step-1 {
      background: linear-gradient(135deg, #ff8a3c, #ff6b35);
    }

    .agency-step-badge.step-2 {
      background: linear-gradient(135deg, #10b981, #22c55e);
    }

    .agency-step-badge.step-3 {
      background: linear-gradient(135deg, #2563eb, #3b82f6);
    }

    .agency-step-icon {
      width: 100%;
      height: 200px;
      margin: 20px 0 30px;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 20px;
      overflow: hidden;
      box-shadow: 
        inset 0 2px 10px rgba(255, 255, 255, 0.5),
        0 8px 25px rgba(0, 0, 0, 0.1);
    }

    .agency-step-card.step-1 .agency-step-icon {
      background: linear-gradient(135deg, 
        rgba(255, 240, 230, 0.9) 0%, 
        rgba(255, 218, 185, 0.8) 50%,
        rgba(255, 200, 150, 0.7) 100%);
    }

    .agency-step-card.step-2 .agency-step-icon {
      background: linear-gradient(135deg, 
        rgba(230, 255, 250, 0.9) 0%, 
        rgba(200, 255, 235, 0.8) 50%,
        rgba(170, 255, 220, 0.7) 100%);
    }

    .agency-step-card.step-3 .agency-step-icon {
      background: linear-gradient(135deg, 
        rgba(235, 245, 255, 0.9) 0%, 
        rgba(200, 230, 255, 0.8) 50%,
        rgba(170, 215, 255, 0.7) 100%);
    }

    .agency-step-icon::before {
      content: '';
      position: absolute;
      inset: 0;
      background: 
        radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.4) 0%, transparent 50%),
        radial-gradient(circle at 70% 70%, rgba(0, 0, 0, 0.05) 0%, transparent 50%);
      z-index: 0;
    }

    .agency-step-icon::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      border-radius: 20px;
      padding: 2px;
      background: linear-gradient(135deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.1));
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      z-index: 0;
    }

    .agency-step-icon-3d {
      position: relative;
      z-index: 1;
      font-size: 140px;
      filter: 
        drop-shadow(0 15px 35px rgba(0, 0, 0, 0.25))
        drop-shadow(0 5px 15px rgba(0, 0, 0, 0.15));
      transform-style: preserve-3d;
      transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
      text-shadow: 
        2px 2px 4px rgba(0, 0, 0, 0.1),
        -1px -1px 2px rgba(255, 255, 255, 0.3);
    }

    .agency-step-card.step-1 .agency-step-icon-3d {
      filter: 
        drop-shadow(0 15px 35px rgba(255, 138, 60, 0.3))
        drop-shadow(0 5px 15px rgba(255, 107, 53, 0.2));
    }

    .agency-step-card.step-2 .agency-step-icon-3d {
      filter: 
        drop-shadow(0 15px 35px rgba(16, 185, 129, 0.3))
        drop-shadow(0 5px 15px rgba(34, 197, 94, 0.2));
    }

    .agency-step-card.step-3 .agency-step-icon-3d {
      filter: 
        drop-shadow(0 15px 35px rgba(37, 99, 235, 0.3))
        drop-shadow(0 5px 15px rgba(59, 130, 246, 0.2));
    }

    .agency-step-card:hover .agency-step-icon-3d {
      transform: translateY(-8px) rotateY(8deg) scale(1.05);
    }

    .agency-step-headline {
    font-size: 19px;
    font-weight: 800;
    color: #111827;
    line-height: 1.3;
    margin-bottom: 10px;
}
.agency-step-body {
    font-size: 15px;
    color: #6b7280;
    line-height: 1.7;
    font-weight: 400;
    margin: 0;
}
    .agency-step-body strong {
      color: #374151;
      font-weight: 600;
    }

    @media (max-width: 1024px) {
      .tiktok-agency-steps {
        grid-template-columns: 1fr;
        gap: 25px;
      }

      .tiktok-agency-title {
        font-size: 32px;
      }
    }

    @media (max-width: 768px) {
      .tiktok-agency-section {
        margin: 40px auto 30px;
        padding: 35px 15px;
      }

      .tiktok-agency-intro {
        font-size: 18px;
      }

      .tiktok-agency-title {
        font-size: 28px;
      }

      .agency-step-card {
        padding: 28px 22px;
      }

      .agency-step-icon {
        height: 160px;
      }

      .agency-step-icon-3d {
        font-size: 60px;
      }

      .agency-step-headline {
        font-size: 20px;
      }

      .agency-step-body {
        font-size: 15px;
      }
    }

                              
                                 
                               .reseller-hero-section {
      position: relative;
      z-index: 1;
      max-width: 1180px;
      margin: 40px auto;
      padding: 40px 18px;
      overflow: hidden;
    }

    .reseller-hero-bg {
      position: absolute;
      inset: 0;
      background: 
        radial-gradient(circle at 20% 30%, rgba(255, 31, 140, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(37, 99, 235, 0.15) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(123, 97, 255, 0.12) 0%, transparent 60%),
        linear-gradient(135deg, rgba(255, 138, 60, 0.08) 0%, rgba(16, 185, 129, 0.08) 100%);
      border-radius: 32px;
      z-index: 0;
    }

    .reseller-hero-content {
      position: relative;
      z-index: 1;
      text-align: center;
    }

    .reseller-hero-title {
    font-size: 38px;
    font-weight: 900;
    line-height: 1.3;
    margin-bottom: 30px;
    background: linear-gradient(135deg, #ff1f8c 0%, #7b61ff 50%, #2563eb 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-transform: capitalize;
    letter-spacing: -0.02em;
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s ease, transform 0.8s ease;
    position: relative;
    padding: 0 20px;
}

    .reseller-hero-title::before {
      content: '';
      position: absolute;
      top: -15px;
      left: 50%;
      transform: translateX(-50%);
      width: 120px;
      height: 4px;
      background: linear-gradient(90deg, #ff1f8c, #7b61ff, #2563eb);
      border-radius: 2px;
    }

    .reseller-hero-title::after {
      content: '';
      position: absolute;
      bottom: -15px;
      left: 50%;
      transform: translateX(-50%);
      width: 120px;
      height: 4px;
      background: linear-gradient(90deg, #2563eb, #7b61ff, #ff1f8c);
      border-radius: 2px;
    }

    .reseller-hero-title.show {
      opacity: 1;
      transform: translateY(0);
    }

    .reseller-hero-subtitle {
      font-size: 28px;
      font-weight: 700;
      line-height: 1.4;
      margin-bottom: 0px;
      color: #1f2937;
      max-width: 800px;
      margin-left: auto;
      margin-right: auto;

      transform: translateY(30px);
      transition: opacity 0.8s ease 0.2s, transform 0.8s ease 0.2s;
    }

    .reseller-hero-subtitle.show {
      opacity: 1;
      transform: translateY(0);
    }

    .reseller-video-container {
      position: relative;
      max-width: 1050px;
      margin: 0 auto 50px;
      padding-bottom: 6%;
      border-radius: 24px;
      overflow: hidden;
      box-shadow: 
        0 25px 80px rgba(0, 0, 0, 0.2),
        0 0 0 1px rgba(255, 255, 255, 0.1);
      background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
      border: 2px solid rgba(255, 255, 255, 0.8);
      backdrop-filter: blur(20px);
      -webkit-backdrop-filter: blur(20px);

      transform: translateY(40px);
      transition: opacity 0.8s ease 0.4s, transform 0.8s ease 0.4s;
    }

    .reseller-video-container::before {
      content: '';
      position: absolute;
      inset: -3px;
      border-radius: 24px;
      background: linear-gradient(135deg, #ff1f8c, #7b61ff, #2563eb, #10b981);
      opacity: 0.6;
      z-index: -1;
      filter: blur(20px);
      animation: gradientShift 8s ease infinite;
      background-size: 200% 200%;
    }

    @keyframes gradientShift {
      0%, 100% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
    }

    .reseller-video-container.show {
      opacity: 1;
      transform: translateY(0);
    }

    .reseller-video-placeholder {
      width: 100%;
      aspect-ratio: 16 / 9;
      display: flex;
      align-items: center;
      justify-content: center;
      background: 
        linear-gradient(135deg, rgba(255, 31, 140, 0.1) 0%, rgba(123, 97, 255, 0.1) 50%, rgba(37, 99, 235, 0.1) 100%),
        radial-gradient(circle at center, rgba(255, 255, 255, 0.9) 0%, rgba(248, 250, 252, 0.9) 100%);
      color: #1f2937;
      font-size: 24px;
      font-weight: 700;
      font-family: "Space Grotesk", sans-serif;
      letter-spacing: 0.05em;
    }

    .reseller-benefit-text {
      font-size: 22px;
      font-weight: 600;
      line-height: 1.6;
      color: #10b981;
      max-width: 900px;
      margin: 17px auto 0;
      text-align: center;
      opacity: 1;
      transform: translateY(30px);
      transition: opacity 0.8s ease 0.6s, transform 0.8s ease 0.6s;
    }

    .reseller-benefit-text.show {
      opacity: 1;
      transform: translateY(0);
    }

    .reseller-benefit-text strong {
      background: linear-gradient(135deg, #10b981, #22c55e);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    @media (max-width: 768px) {
      .reseller-hero-section {
        margin: 40px auto;
        padding: 40px 18px;
      }

      .reseller-hero-title {
        font-size: 32px;
        padding: 0 10px;
        line-height: 1.4;
      }

      .reseller-hero-title::before,
      .reseller-hero-title::after {
        width: 80px;
        height: 3px;
      }

      .reseller-hero-subtitle {
        font-size: 20px;
        margin-bottom: 40px;
      }

      .reseller-video-container {
        margin-bottom: 40px;
      }

      .reseller-benefit-text {
        font-size: 18px;
      }
    }
                                
                                
   .world-best-section {
      position: relative;
      padding: 50px 20px;
      overflow: hidden;
      background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 50%, #f0f0f0 100%);
      min-height: auto;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .world-best-container {
      position: relative;
      max-width: 1000px;
      width: 100%;
      z-index: 2;
    }

    .world-best-content {
      text-align: left;
      position: relative;
      z-index: 3;
    }

    .world-best-headline {
      margin-bottom: 40px;
      line-height: 1.3;
      text-align: center;
    }

    .gradient-text-main {
      display: block;
      font-size: 48px;
      font-weight: 900;
      color: #ff1f8c;
      margin-bottom: 15px;
      letter-spacing: -1px;
      line-height: 1.2;
    }

    .gradient-text-sub {
      display: block;
      font-size: 36px;
      font-weight: 700;
      color: #ff1f8c;
      letter-spacing: -0.5px;
      line-height: 1.3;
    }

    .testimonial-box {
      background: #ffffff;
      border: 3px solid #000000;
      border-radius: 12px;
      padding: 40px;
      box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
      position: relative;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .testimonial-box:hover {
      transform: translateY(-5px);
      box-shadow: 0 25px 70px rgba(0, 0, 0, 0.2);
    }

    .testimonial-header {
      margin-bottom: 25px;
    }

    .testimonial-title {
      font-size: 28px;
      font-weight: 800;
      color: #111827;
      line-height: 1.3;
      margin: 0;
    }

    .testimonial-content {
      color: #111827;
    }

    .testimonial-paragraph {
      font-size: 17px;
      line-height: 1.8;
      margin-bottom: 18px;
      color: #111827;
    }

    .testimonial-paragraph strong {
      font-weight: 700;
      color: #111827;
    }

    .testimonial-advice {
      font-size: 18px;
      line-height: 1.8;
      margin-top: 30px;
      margin-bottom: 25px;
      padding: 20px;
      background: linear-gradient(135deg, rgba(255, 31, 140, 0.1), rgba(122, 60, 255, 0.1));
      border-left: 4px solid #ff1f8c;
      border-radius: 8px;
    }

    .testimonial-advice strong {
      font-weight: 700;
      color: #111827;
    }

    .highlight-advice {
      background: linear-gradient(135deg, #ff1f8c, #7a3cff);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      font-weight: 800;
    }

    .testimonial-signature {
      margin-top: 30px;
      padding-top: 20px;
      border-top: 2px solid #e5e7eb;
    }

    .signature-name {
      font-size: 20px;
      font-weight: 700;
      color: #111827;
      margin-bottom: 12px;
      font-style: italic;
    }

    .signature-rating {
      display: flex;
      gap: 5px;
    }

    .star {
      font-size: 24px;
      color: #fbbf24;
      filter: drop-shadow(0 2px 4px rgba(251, 191, 36, 0.3));
      animation: star-twinkle 2s ease-in-out infinite;
    }

    .star:nth-child(1) { animation-delay: 0s; }
    .star:nth-child(2) { animation-delay: 0.2s; }
    .star:nth-child(3) { animation-delay: 0.4s; }
    .star:nth-child(4) { animation-delay: 0.6s; }

    .world-best-bg-elements {
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      overflow: hidden;
    }

    .bg-gradient-orb {
      position: absolute;
      border-radius: 50%;
      filter: blur(100px);
      opacity: 0.15;
      animation: float-orb 20s ease-in-out infinite;
    }

    .orb-1 {
      width: 500px;
      height: 500px;
      background: linear-gradient(135deg, rgba(255, 31, 140, 0.3), rgba(255, 107, 107, 0.3));
      top: -150px;
      left: -150px;
      animation-delay: 0s;
    }

    .orb-2 {
      width: 450px;
      height: 450px;
      background: linear-gradient(135deg, rgba(122, 60, 255, 0.3), rgba(168, 85, 247, 0.3));
      bottom: -150px;
      right: -150px;
      animation-delay: 5s;
    }

    .orb-3 {
      width: 400px;
      height: 400px;
      background: linear-gradient(135deg, rgba(0, 212, 255, 0.2), rgba(6, 182, 212, 0.2));
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      animation-delay: 10s;
    }

    .orb-4 {
      width: 350px;
      height: 350px;
      background: linear-gradient(135deg, rgba(250, 204, 21, 0.2), rgba(251, 191, 36, 0.2));
      top: 20%;
      right: 10%;
      animation-delay: 15s;
    }

    @keyframes gradient-shift {
      0% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
      100% { background-position: 0% 50%; }
    }

    @keyframes pulse-glow {
      0%, 100% {
        box-shadow: 0 0 20px rgba(255, 31, 140, 0.3);
      }
      50% {
        box-shadow: 0 0 40px rgba(255, 31, 140, 0.6);
      }
    }

    @keyframes rotate-3d {
      0%, 100% {
        transform: rotateY(0deg) rotateX(0deg);
      }
      25% {
        transform: rotateY(90deg) rotateX(10deg);
      }
      50% {
        transform: rotateY(180deg) rotateX(0deg);
      }
      75% {
        transform: rotateY(270deg) rotateX(-10deg);
      }
    }

    @keyframes float-3d {
      0%, 100% {
        transform: translateY(0px) rotateX(0deg) rotateY(0deg);
      }
      33% {
        transform: translateY(-15px) rotateX(10deg) rotateY(5deg);
      }
      66% {
        transform: translateY(-5px) rotateX(-5deg) rotateY(-5deg);
      }
    }

    @keyframes float-orb {
      0%, 100% {
        transform: translate(0, 0) scale(1);
      }
      25% {
        transform: translate(50px, -50px) scale(1.1);
      }
      50% {
        transform: translate(-30px, 30px) scale(0.9);
      }
      75% {
        transform: translate(30px, 50px) scale(1.05);
      }
    }

    @keyframes star-twinkle {
      0%, 100% {
        transform: scale(1);
        opacity: 1;
      }
      50% {
        transform: scale(1.2);
        opacity: 0.8;
      }
    }

    @media (max-width: 768px) {
      .world-best-section {
        padding: 50px 15px;
        min-height: auto;
      }

      .gradient-text-main {
        font-size: 32px;
      }

      .gradient-text-sub {
        font-size: 24px;
      }

      .testimonial-box {
        padding: 25px 20px;
      }

      .testimonial-title {
        font-size: 22px;
      }

      .testimonial-paragraph {
        font-size: 15px;
        margin-bottom: 15px;
      }

      .testimonial-advice {
        font-size: 16px;
        padding: 15px;
      }
    }
      
       
       .success-stories-section {
      position: relative;
      padding: 50px 20px;
      overflow: hidden;
      background: linear-gradient(135deg, #0a0a0a 0%, #1a1a2e 50%, #16213e 100%);
      min-height: auto;
    }

    .success-stories-container {
      position: relative;
      max-width: 1400px;
      margin: 0 auto;
      z-index: 2;
    }

    .success-stories-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 40px;
      position: relative;
    }
    .success-story-card {
    position: relative;
    padding: 25px 20px 12px;
    border-radius: 30px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.05) 0%, rgba(255, 255, 255, 0.02) 100%);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    overflow: hidden;
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    opacity: 0;
    transform: translateY(50px);
    animation: fadeInUp 0.8s ease forwards;
}

    .success-story-card:nth-child(2) {
      animation-delay: 0.2s;
    }

    @keyframes fadeInUp {
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }

    .success-story-card:hover {
      transform: translateY(-10px) scale(1.02);
      box-shadow: 0 30px 80px rgba(0, 0, 0, 0.4);
    }

    .story-glow {
      position: absolute;
      top: -50%;
      left: -50%;
      width: 200%;
      height: 200%;
      background: radial-gradient(circle, rgba(255, 31, 140, 0.3) 0%, transparent 70%);
      opacity: 0;
      transition: opacity 0.4s ease;
      pointer-events: none;
    }

    .success-story-card:hover .story-glow {
      opacity: 1;
    }

    .story-card-1 {
      background: linear-gradient(135deg, 
        rgba(255, 31, 140, 0.1) 0%, 
        rgba(250, 204, 21, 0.1) 50%, 
        rgba(122, 60, 255, 0.1) 100%);
    }

    .story-card-1 .story-glow {
      background: radial-gradient(circle, rgba(255, 31, 140, 0.4) 0%, transparent 70%);
    }

    .story-card-2 {
      background: linear-gradient(135deg, 
        rgba(122, 60, 255, 0.1) 0%, 
        rgba(59, 130, 246, 0.1) 50%, 
        rgba(16, 185, 129, 0.1) 100%);
    }

    .story-card-2 .story-glow {
      background: radial-gradient(circle, rgba(122, 60, 255, 0.4) 0%, transparent 70%);
    }

    .story-icon-3d {
      position: absolute;
      top: 30px;
      right: 30px;
      font-size: 60px;
      filter: drop-shadow(0 10px 20px rgba(0, 0, 0, 0.3));
      transform: perspective(1000px) rotateY(-15deg) rotateX(5deg);
      transition: transform 0.4s ease;
      z-index: 1;
    }

    .success-story-card:hover .story-icon-3d {
      transform: perspective(1000px) rotateY(0deg) rotateX(0deg) scale(1.1);
    }

    .story-headline {
      font-size: 24px;
      font-weight: 800;
      line-height: 1.4;
      margin-bottom: 25px;
      background: linear-gradient(135deg, #ffffff 0%, #f0f0f0 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      position: relative;
      z-index: 2;
    }

    .star-icon {
      display: inline-block;
      font-size: 28px;
      filter: drop-shadow(0 2px 4px rgba(255, 215, 0, 0.5));
      margin-right: 8px;
    }

    .story-content {
      position: relative;
      z-index: 2;
    }

    .story-text {
      font-size: 16px;
      line-height: 1.8;
      color: rgba(255, 255, 255, 0.9);
      margin-bottom: 18px;
    }

    .highlight-number {
      background: linear-gradient(135deg, #ff1f8c 0%, #facc15 50%, #7a3cff 100%);
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
      font-weight: 800;
      font-size: 18px;
    }

    .story-frustrations {
      margin: 25px 0;
      padding: 20px;
      background: rgba(255, 255, 255, 0.05);
      border-radius: 15px;
      border: 1px solid rgba(255, 255, 255, 0.1);
    }

    .frustration-item {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 12px;
      font-size: 15px;
      color: rgba(255, 255, 255, 0.85);
    }

    .frustration-item:last-child {
      margin-bottom: 0;
    }

    .frustration-icon {
      color: #ef4444;
      font-size: 20px;
      font-weight: bold;
      width: 24px;
      height: 24px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: rgba(239, 68, 68, 0.2);
      border-radius: 50%;
      flex-shrink: 0;
    }

    .story-conclusion {
      font-size: 17px;
      line-height: 1.8;
      color: rgba(255, 255, 255, 0.95);
      margin: 25px 0;
      font-weight: 600;
    }

    .story-quote {
      margin-top: 30px;
      padding: 20px 25px;
      background: linear-gradient(135deg, rgba(255, 31, 140, 0.2) 0%, rgba(122, 60, 255, 0.2) 100%);
      border-left: 4px solid;
      border-image: linear-gradient(135deg, #ff1f8c, #7a3cff) 1;
      border-radius: 10px;
      font-size: 18px;
      font-weight: 700;
      font-style: italic;
      color: #ffffff;
      text-align: center;
      position: relative;
      overflow: hidden;
    }

    .story-quote::before {
      content: '"';
      position: absolute;
      top: -10px;
      left: 15px;
      font-size: 80px;
      color: rgba(255, 255, 255, 0.1);
      font-family: serif;
    }

    .story-author {
      margin-top: 35px;
      padding-top: 25px;
      border-top: 1px solid rgba(255, 255, 255, 0.1);
      position: relative;
      z-index: 2;
    }

    .author-name {
      font-size: 18px;
      font-weight: 700;
      color: #ffffff;
      margin-bottom: 10px;
    }

    .author-rating {
      display: flex;
      gap: 5px;
    }

    .star-gold {
      font-size: 24px;
      filter: drop-shadow(0 2px 4px rgba(255, 215, 0, 0.5));
      animation: starTwinkle 2s ease-in-out infinite;
    }

    .star-gold:nth-child(1) { animation-delay: 0s; }
    .star-gold:nth-child(2) { animation-delay: 0.2s; }
    .star-gold:nth-child(3) { animation-delay: 0.4s; }
    .star-gold:nth-child(4) { animation-delay: 0.6s; }
    .star-gold:nth-child(5) { animation-delay: 0.8s; }

    @keyframes starTwinkle {
      0%, 100% { transform: scale(1); opacity: 1; }
      50% { transform: scale(1.2); opacity: 0.8; }
    }

    .success-stories-bg-elements {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      overflow: hidden;
      z-index: 1;
      pointer-events: none;
    }

    .bg-orb {
      position: absolute;
      border-radius: 50%;
      filter: blur(80px);
      opacity: 0.3;
      animation: floatOrb 20s ease-in-out infinite;
    }

    .orb-1 {
      width: 400px;
      height: 400px;
      background: linear-gradient(135deg, #ff1f8c, #facc15);
      top: -100px;
      left: -100px;
      animation-delay: 0s;
    }

    .orb-2 {
      width: 350px;
      height: 350px;
      background: linear-gradient(135deg, #7a3cff, #3b82f6);
      top: 50%;
      right: -150px;
      animation-delay: 5s;
    }

    .orb-3 {
      width: 300px;
      height: 300px;
      background: linear-gradient(135deg, #facc15, #10b981);
      bottom: -100px;
      left: 20%;
      animation-delay: 10s;
    }

    .orb-4 {
      width: 380px;
      height: 380px;
      background: linear-gradient(135deg, #ec4899, #7a3cff);
      bottom: -150px;
      right: 10%;
      animation-delay: 15s;
    }

    @keyframes floatOrb {
      0%, 100% {
        transform: translate(0, 0) scale(1);
      }
      33% {
        transform: translate(30px, -30px) scale(1.1);
      }
      66% {
        transform: translate(-20px, 20px) scale(0.9);
      }
    }

    /* Responsive Design */
    @media (max-width: 1024px) {
      .success-stories-grid {
        grid-template-columns: 1fr;
        gap: 30px;
      }

      .success-story-card {
        padding: 35px 30px;
      }

      .story-headline {
        font-size: 22px;
      }
    }

    @media (max-width: 768px) {
      .success-stories-section {
        padding: 60px 15px;
      }

      .success-story-card {
        padding: 30px 25px;
        border-radius: 25px;
      }

      .story-headline {
        font-size: 20px;
      }

      .story-text {
        font-size: 15px;
      }

      .story-icon-3d {
        font-size: 50px;
        top: 20px;
        right: 20px;
      }
    }

    /* ================== WORLD'S BEST SECTION ================== */
    .world-best-section {
      position: relative;
      padding: 50px 20px;
      overflow: hidden;
      background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 50%, #f0f0f0 100%);
      min-height: auto;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .world-best-container {
      position: relative;
      max-width: 1000px;
      width: 100%;
      z-index: 2;
    }

    .world-best-content {
      text-align: left;
      position: relative;
      z-index: 3;
    }

    .world-best-headline {
      margin-bottom: 40px;
      line-height: 1.3;
      text-align: center;
    }

    .gradient-text-main {
      display: block;
      font-size: 48px;
      font-weight: 900;
      color: #ff1f8c;
      margin-bottom: 15px;
      letter-spacing: -1px;
      line-height: 1.2;
    }

    .gradient-text-sub {
      display: block;
      font-size: 36px;
      font-weight: 700;
      color: #ff1f8c;
      letter-spacing: -0.5px;
      line-height: 1.3;
    }

    .testimonial-box {
      background: #ffffff;
      border: 3px solid #000000;
      border-radius: 12px;
      padding: 40px;
      box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
      position: relative;
      transition: transform 0.3s ease, box-shadow 0.3s ease;
    }

    .testimonial-box:hover {
      transform: translateY(-5px);
      box-shadow: 0 25px 70px rgba(0, 0, 0, 0.2);
    }

    .testimonial-header {
      margin-bottom: 25px;
    }

    .testimonial-title {
      font-size: 28px;
      font-weight: 800;
      color: #111827;
      line-height: 1.3;
      margin: 0;
    }

    .testimonial-content {
      color: #111827;
    }

    .testimonial-paragraph {
      font-size: 17px;
      line-height: 1.8;
      margin-bottom: 18px;
      color: #111827;
    }

    .testimonial-paragraph strong {
      font-weight: 700;
      color: #111827;
    }

    .testimonial-advice {
      font-size: 18px;
      line-height: 1.8;
      margin-top: 30px;
      margin-bottom: 25px;
      padding: 20px;
      background: linear-gradient(135deg, rgba(255, 31, 140, 0.1), rgba(122, 60, 255, 0.1));
      border-left: 4px solid #ff1f8c;
      border-radius: 8px;
    }

    .testimonial-advice strong {
      font-weight: 700;
      color: #111827;
    }

    .highlight-advice {
      background: linear-gradient(135deg, #ff1f8c, #7a3cff);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      font-weight: 800;
    }

    .testimonial-signature {
      margin-top: 30px;
      padding-top: 20px;
      border-top: 2px solid #e5e7eb;
    }

    .signature-name {
      font-size: 20px;
      font-weight: 700;
      color: #111827;
      margin-bottom: 12px;
      font-style: italic;
    }

    .signature-rating {
      display: flex;
      gap: 5px;
    }

    .star {
      font-size: 24px;
      color: #fbbf24;
      filter: drop-shadow(0 2px 4px rgba(251, 191, 36, 0.3));
      animation: star-twinkle 2s ease-in-out infinite;
    }

    .star:nth-child(1) { animation-delay: 0s; }
    .star:nth-child(2) { animation-delay: 0.2s; }
    .star:nth-child(3) { animation-delay: 0.4s; }
    .star:nth-child(4) { animation-delay: 0.6s; }

    .world-best-bg-elements {
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      overflow: hidden;
    }

    .bg-gradient-orb {
      position: absolute;
      border-radius: 50%;
      filter: blur(100px);
      opacity: 0.15;
      animation: float-orb 20s ease-in-out infinite;
    }

    .orb-1 {
      width: 500px;
      height: 500px;
      background: linear-gradient(135deg, rgba(255, 31, 140, 0.3), rgba(255, 107, 107, 0.3));
      top: -150px;
      left: -150px;
      animation-delay: 0s;
    }

    .orb-2 {
      width: 450px;
      height: 450px;
      background: linear-gradient(135deg, rgba(122, 60, 255, 0.3), rgba(168, 85, 247, 0.3));
      bottom: -150px;
      right: -150px;
      animation-delay: 5s;
    }

    .orb-3 {
      width: 400px;
      height: 400px;
      background: linear-gradient(135deg, rgba(0, 212, 255, 0.2), rgba(6, 182, 212, 0.2));
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      animation-delay: 10s;
    }

    .orb-4 {
      width: 350px;
      height: 350px;
      background: linear-gradient(135deg, rgba(250, 204, 21, 0.2), rgba(251, 191, 36, 0.2));
      top: 20%;
      right: 10%;
      animation-delay: 15s;
    }

    @keyframes gradient-shift {
      0% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
      100% { background-position: 0% 50%; }
    }

    @keyframes pulse-glow {
      0%, 100% {
        box-shadow: 0 0 20px rgba(255, 31, 140, 0.3);
      }
      50% {
        box-shadow: 0 0 40px rgba(255, 31, 140, 0.6);
      }
    }

    @keyframes rotate-3d {
      0%, 100% {
        transform: rotateY(0deg) rotateX(0deg);
      }
      25% {
        transform: rotateY(90deg) rotateX(10deg);
      }
      50% {
        transform: rotateY(180deg) rotateX(0deg);
      }
      75% {
        transform: rotateY(270deg) rotateX(-10deg);
      }
    }

    @keyframes float-3d {
      0%, 100% {
        transform: translateY(0px) rotateX(0deg) rotateY(0deg);
      }
      33% {
        transform: translateY(-15px) rotateX(10deg) rotateY(5deg);
      }
      66% {
        transform: translateY(-5px) rotateX(-5deg) rotateY(-5deg);
      }
    }

    @keyframes float-orb {
      0%, 100% {
        transform: translate(0, 0) scale(1);
      }
      25% {
        transform: translate(50px, -50px) scale(1.1);
      }
      50% {
        transform: translate(-30px, 30px) scale(0.9);
      }
      75% {
        transform: translate(30px, 50px) scale(1.05);
      }
    }

    @keyframes star-twinkle {
      0%, 100% {
        transform: scale(1);
        opacity: 1;
      }
      50% {
        transform: scale(1.2);
        opacity: 0.8;
      }
    }

    @media (max-width: 768px) {
      .world-best-section {
        padding: 50px 15px;
        min-height: auto;
      }

      .gradient-text-main {
        font-size: 32px;
      }

      .gradient-text-sub {
        font-size: 24px;
      }

      .testimonial-box {
        padding: 25px 20px;
      }

      .testimonial-title {
        font-size: 22px;
      }

      .testimonial-paragraph {
        font-size: 15px;
        margin-bottom: 15px;
      }

      .testimonial-advice {
        font-size: 16px;
        padding: 15px;
      }
    }

        
        
  section.save-bndl {
    padding: 30px 0;
    text-align: center;
}
    
  
  /* =========================================================
     TokPrimeAI Ultra Pro Max – Section (scoped)
     Matches screenshot layout (centered, big title, bricks)
     Prefix: tpu3-
     ========================================================= */

  .tpu3-wrap{
    font-family:"Space Grotesk",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
    padding: 28px 18px;
    background: #ffffff;
  }

  .tpu3-card{
    max-width: 1080px;
    margin: 0 auto;
    border-radius: 22px;
    background:
      radial-gradient(900px 420px at 50% -25%, rgba(255,0,92,.10), rgba(255,255,255,0) 60%),
      linear-gradient(180deg, #ffffff 0%, #fff7fb 100%);
    border: 1px solid rgba(11,11,15,.10);
    box-shadow: 0 18px 60px rgba(11,11,15,.08);
    overflow: hidden;
    padding: 26px 22px;
    text-align:center;
  }

  /* Top stickers row */
  .tpu3-stickers{
    display:flex;
    flex-wrap:wrap;
    gap: 12px;
    align-items:center;
    justify-content:center;
    margin-bottom: 14px;
  }
  .tpu3-pill{
    display:inline-flex;
    align-items:center;
    gap: 10px;
    padding: 12px 16px;
    border-radius: 999px;
    font-weight: 900;
    font-size: 13.5px;
    letter-spacing: .25px;
    border: 1px solid rgba(11,11,15,.10);
    box-shadow: 0 14px 30px rgba(11,11,15,.08);
    background: #fff;
    white-space: nowrap;
  }
  .tpu3-dot{
    width: 10px;
    height: 10px;
    border-radius: 999px;
    flex: 0 0 auto;
    box-shadow: 0 0 0 4px rgba(0,0,0,.06);
    background: #111;
  }
  .tpu3-pill-green{
    background: linear-gradient(135deg, rgba(34,197,94,.18), rgba(16,185,129,.12));
    border-color: rgba(16,185,129,.30);
  }
  .tpu3-pill-green .tpu3-dot{
    background:#10b981;
    box-shadow: 0 0 0 4px rgba(16,185,129,.14);
  }

  .tpu3-pill-yellow{
    background: linear-gradient(135deg, rgba(250,204,21,.30), rgba(245,158,11,.16));
    border-color: rgba(245,158,11,.30);
  }
  .tpu3-pill-yellow .tpu3-dot{
    background:#f59e0b;
    box-shadow: 0 0 0 4px rgba(245,158,11,.14);
  }

  .tpu3-pill-pink{
    background: linear-gradient(135deg, rgba(255,0,92,.12), rgba(140,0,45,.08));
    border-color: rgba(255,0,92,.22);
  }
  .tpu3-pill-pink .tpu3-dot{
    background:#ff005c;
    box-shadow: 0 0 0 4px rgba(255,0,92,.12);
  }

  /* Big title + stars */
  .tpu3-title{
    margin: 8px 0 10px 0;
    font-size: clamp(28px, 3.5vw, 44px);
    line-height: 1.08;
    font-weight: 950;
    letter-spacing: -1px;
  }

  .tpu3-star{
    color:#f59e0b;
    text-shadow: 0 8px 18px rgba(245,158,11,.28);
    font-weight: 950;
  }

  .tpu3-grad{
    background: linear-gradient(90deg, #8c002d, #ff005c);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }

  .tpu3-sub{
    margin: 0 auto 18px auto;
    max-width: 920px;
    font-size: 16px;
    line-height: 1.55;
    font-weight: 650;
    color: rgba(11,11,15,.76);
  }
  .tpu3-sub strong{
    color: rgba(11,11,15,.92);
    font-weight: 850;
  }

  /* Bricks list */
  .tpu3-list{
    max-width: 880px;
    margin: 0 auto;
    display:flex;
    flex-direction:column;
    gap: 12px;
    text-align:left;
  }

  .tpu3-brick{
    background: rgba(255,255,255,.94);
    border: 1px solid rgba(11,11,15,.10);
    border-radius: 18px;
    padding: 16px 16px;
    box-shadow: 0 12px 30px rgba(11,11,15,.07);
    transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
    position: relative;
    overflow:hidden;
  }
  .tpu3-brick::before{
    content:"";
    position:absolute; inset:0;
    background:
      radial-gradient(820px 260px at 10% 0%, rgba(255,0,92,.12), rgba(255,255,255,0) 60%),
      radial-gradient(820px 260px at 110% 110%, rgba(140,0,45,.10), rgba(255,255,255,0) 60%);
    opacity:0;
    transition: opacity 200ms ease;
  }
  .tpu3-brick:hover{
    transform: translateY(-3px) scale(1.008);
    border-color: rgba(255,0,92,.20);
    box-shadow: 0 18px 45px rgba(11,11,15,.10);
  }
  .tpu3-brick:hover::before{ opacity:1; }

  .tpu3-row{
    position:relative; z-index:2;
    display:flex;
    gap: 14px;
    align-items:flex-start;
  }

  .tpu3-ic{
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display:grid;
    place-items:center;
    flex: 0 0 auto;
    color: #fff;
    font-weight: 950;
    background: linear-gradient(135deg, #8c002d, #ff005c);
    box-shadow: 0 12px 26px rgba(255,0,92,.18);
  }

  .tpu3-txt{
    margin: 0;
    font-size: 16.5px;
    line-height: 1.5;
    font-weight: 750;
    color: rgba(11,11,15,.92);
  }
  .tpu3-txt strong{
    color:#0b0b0f;
    font-weight: 950;
  }

  .tpu3-small{
    display:block;
    margin-top: 6px;
    font-size: 13.5px;
    line-height: 1.35;
    font-weight: 650;
    color: rgba(11,11,15,.68);
  }

  /* Quick tip + bottom stickers */
  .tpu3-tip{
    max-width: 880px;
    margin: 14px auto 14px auto;
    padding: 12px 14px;
    border-radius: 14px;
    background: rgba(255,255,255,.88);
    border: 1px dashed rgba(11,11,15,.18);
    text-align:left;
    font-size: 14.5px;
    line-height: 1.5;
  }
  .tpu3-tip b{ font-weight: 900; }

  .tpu3-stickers-bottom{
    margin-top: 10px;
  }

  @media (max-width: 640px){
    .tpu3-card{ padding: 20px 14px; }
    .tpu3-ic{ width: 42px; height: 42px; }
    .tpu3-txt{ font-size: 16px; }
    .tpu3-pill{ font-size: 12.5px; padding: 10px 12px; }
  }
    
  
/* Base */
#tp-video-models, #tp-video-models *{
  font-family:"Space Grotesk",system-ui,sans-serif;
}

.tp-video-models{
  position:relative;
  padding:90px 20px;
  overflow:hidden;
}

/* TokPrimeAI background */
.tp-vm-bg{
  position:absolute;
  inset:0;
  background:
    radial-gradient(700px 300px at 20% 0%, rgba(255,77,141,.12), transparent 60%),
    radial-gradient(700px 300px at 80% 0%, rgba(14,165,233,.12), transparent 60%),
    linear-gradient(#fdfdff, #f8f9ff);
  z-index:-1;
}

/* Intro */
.tp-vm-intro{text-align:center;max-width:960px;margin:0 auto 40px}
.tp-vm-pill{
  display:inline-block;
  padding:10px 22px;
  border-radius:999px;
  font-weight:900;
  font-size:13px;
  letter-spacing:.2em;
  background:#ffffff;
  border:2px solid rgba(99,102,241,.45);
  color:#4f46e5;
}
.tp-vm-title{font-size:40px;font-weight:900;margin:18px 0}
.tp-vm-title .pink{color:#ff4d8d}
.tp-vm-sub{color:#475569;font-size:17px}

/* Grid */
.tp-vm-grid{
  max-width:1160px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
}

/* Cards */
.tp-vm-card{
  border-radius:24px;
  padding:22px;
  border:1px solid rgba(148,163,184,.4);
  box-shadow:0 18px 46px rgba(15,23,42,.08);
  transition:.25s;
}
.tp-vm-card:hover{transform:translateY(-4px)}

/* Spacing fixes */
.tp-vm-top{
  display:flex;
  gap:8px;
  margin-bottom:10px;
  flex-wrap:wrap;
}
.tp-vm-name{
  font-weight:800;
  font-size:18px;
  margin-bottom:10px;
}

/* Backgrounds */
.model-fast{background:#f5f9ff}
.model-pro-t2v{background:#faf5ff}
.model-pro-i2v{background:#f3fcf7}
.model-pro-s2v{background:#fff8ec;border:2px solid rgba(251,146,60,.25)}

/* Headline highlight */
.tp-vm-headline{margin:12px 0 14px}
.tp-hl{
  display:inline-block;
  padding:6px 14px;
  border-radius:12px;
  font-weight:900;
  position:relative;
}
.tp-hl::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius:12px;
  filter:blur(10px);
  opacity:.45;
  z-index:-1;
}

/* Highlight colors */
.model-fast .tp-hl{background:#eef4ff}
.model-fast .tp-hl::after{background:#c7dcff}
.model-pro-t2v .tp-hl{background:#f4ecff}
.model-pro-t2v .tp-hl::after{background:#d8c8ff}
.model-pro-i2v .tp-hl{background:#ecfff4}
.model-pro-i2v .tp-hl::after{background:#b7f0d6}
.model-pro-s2v .tp-hl{background:#fff3dc}
.model-pro-s2v .tp-hl::after{background:#ffd9a6}

/* Recommended glow */
.recommended{
  box-shadow:0 0 0 2px rgba(34,197,94,.35),
             0 0 24px rgba(34,197,94,.22);
}

/* Badges */
.tp-badge{
  padding:6px 14px;
  border-radius:999px;
  font-weight:800;
  font-size:12px;
}
.tp-badge.fast{background:#e0ecff;color:#1d4ed8}
.tp-badge.pro{background:#ede9fe;color:#6d28d9}
.tp-badge.coming{background:#ffedd5;color:#c2410c}

.tp-rec{
  background:#22c55e;
  color:#fff;
  font-weight:800;
  font-size:12px;
  padding:6px 14px;
  border-radius:999px;
}

/* Responsive */
@media(max-width:1100px){
  .tp-vm-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:700px){
  .tp-vm-grid{grid-template-columns:1fr}
}
    
  
/* Space Grotesk only for this section */
#tp-trust,
#tp-trust *{
  font-family:"Space Grotesk",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

.tp-trust{
  padding: 80px 20px;
  background:
    radial-gradient(circle at 10% 10%, rgba(255,77,141,.14), transparent 55%),
    radial-gradient(circle at 90% 20%, rgba(34,197,94,.10), transparent 55%),
    radial-gradient(circle at 50% 100%, rgba(14,165,233,.10), transparent 60%);
}

.tp-trust-wrap{
  max-width: 1160px;
  margin: 0 auto;
}

.tp-trust-pill-wrap{
  display:flex;
  justify-content:center;
  margin-bottom: 16px;
}

.tp-trust-pill{
  padding: 12px 30px;
  border-radius: 999px;
  border: 2px solid rgba(64,115,255,.55);
  background: rgba(255,255,255,.55);
  backdrop-filter: blur(8px);
  font-weight: 900;
  letter-spacing: .26em;
  text-transform: uppercase;
  font-size: 14px;
  color: #3b6bff;
  box-shadow: 0 12px 28px rgba(59,107,255,.18);
}

/* Heavier headline + emphasis */
.tp-trust-title{
  text-align:center;
  font-size: clamp(30px, 3.2vw, 44px);
  font-weight: 950;
  letter-spacing: -0.02em;
  line-height: 1.08;
  margin: 0 0 12px;
  color: #0f172a;
  position: relative;
  display: inline-block;
  left: 50%;
  transform: translateX(-50%);
}

.tp-trust-title .pink{ color: #ff4d8d; }

.tp-trust-sub{
  text-align:center;
  max-width: 960px;
  margin: 0 auto 28px;
  font-size: 16px;
  line-height: 1.75;
  font-weight: 550;
  color: #334155;
}

.tp-trust-sub strong{
  font-weight: 900;
  color: #0f172a;
}

/* Shining headline ONLY on headline hover */
.tp-trust-title::after{
  content:"";
  position:absolute;
  top:-10%;
  left:-60%;
  width: 60%;
  height: 140%;
  transform: skewX(-18deg);
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255,255,255,.0),
    rgba(255,255,255,.65),
    rgba(255,255,255,.0),
    transparent
  );
  opacity: 0;
  pointer-events:none;
}

.tp-trust-title:hover{
  text-shadow: 0 10px 30px rgba(255,77,141,.12), 0 10px 30px rgba(14,165,233,.10);
}

.tp-trust-title:hover::after{
  opacity: 1;
  animation: tpShine 1.15s ease-in-out 1;
}

@keyframes tpShine{
  0%   { left:-60%; opacity:0; }
  10%  { opacity:1; }
  55%  { opacity:1; }
  100% { left:120%; opacity:0; }
}

/* Main card */
.tp-trust-card{
  border-radius: 26px;
  padding: 1px;
  background: linear-gradient(135deg, rgba(255,77,141,.9), rgba(14,165,233,.85), rgba(34,197,94,.85));
  box-shadow: 0 22px 70px rgba(15,23,42,.18);
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
}

.tp-trust-card:hover{
  transform: translateY(-4px);
  box-shadow: 0 26px 80px rgba(15,23,42,.22);
  filter: saturate(1.05);
}

.tp-trust-card-inner{
  border-radius: 25px;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  padding: 26px;
  display: grid;
  grid-template-columns: 1.6fr .9fr;
  gap: 22px;
}

.tp-trust-kicker{
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #64748b;
  margin-bottom: 10px;
}

.tp-trust-grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.tp-trust-item{
  border-radius: 18px;
  border: 1px solid rgba(148,163,184,.45);
  background: linear-gradient(135deg, rgba(255,255,255,.85), rgba(248,250,252,.9));
  box-shadow: 0 12px 30px rgba(15,23,42,.08);
  padding: 14px 14px 12px;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.tp-trust-item:hover{
  transform: translateY(-2px);
  border-color: rgba(255,77,141,.35);
  box-shadow: 0 16px 36px rgba(15,23,42,.10);
}

.tp-trust-item-top{
  display:flex;
  align-items:center;
  gap: 10px;
  margin-bottom: 6px;
}

.tp-ic{
  width: 34px;
  height: 34px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: radial-gradient(circle at 30% 20%, #fff, #e5e7eb);
  box-shadow: 0 8px 16px rgba(15,23,42,.12);
  font-size: 16px;
}

.tp-trust-item h3{
  margin:0;
  font-size: 15px;
  font-weight: 950;
  color: #0f172a;
}

.tp-trust-item p{
  margin:0;
  font-size: 13.5px;
  line-height: 1.65;
  color:#475569;
}

/* Right column */
.tp-trust-right{
  display:flex;
  flex-direction: column;
  gap: 14px;
}

.tp-trust-badge{
  border-radius: 18px;
  border: 1px solid rgba(148,163,184,.45);
  background: linear-gradient(135deg, rgba(2,6,23,.92), rgba(15,23,42,.92));
  color: #e2e8f0;
  padding: 14px 14px 12px;
  box-shadow: 0 14px 40px rgba(2,6,23,.25);
}

.tp-trust-badge-top{
  display:flex;
  align-items:center;
  gap: 10px;
  margin-bottom: 8px;
}

.tp-dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: #22c55e;
  box-shadow: 0 0 18px rgba(34,197,94,.7);
}

.tp-trust-badge-title{
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: 12px;
}

.tp-trust-badge-sub{
  font-size: 13.5px;
  color: rgba(226,232,240,.92);
}

.tp-trust-mini{
  border-radius: 18px;
  border: 1px solid rgba(148,163,184,.45);
  background: linear-gradient(135deg, rgba(255,255,255,.9), rgba(248,250,252,.92));
  padding: 14px 14px 12px;
  box-shadow: 0 12px 30px rgba(15,23,42,.08);
}

.tp-trust-mini-title{
  font-weight: 950;
  font-size: 15px;
  color: #0f172a;
  margin-bottom: 6px;
}

.tp-trust-mini-desc{
  margin: 0 0 10px;
  font-size: 13.5px;
  line-height: 1.65;
  color:#475569;
}

.tp-trust-bullets{
  list-style: none;
  padding:0;
  margin:0 0 10px;
  display:flex;
  flex-direction: column;
  gap: 8px;
}

.tp-trust-bullets li{
  display:flex;
  align-items:flex-start;
  gap: 10px;
  font-size: 13.5px;
  color:#334155;
}

.tp-trust-bullets .chk{
  width: 18px;
  height: 18px;
  border-radius: 6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background: rgba(34,197,94,.15);
  color: #16a34a;
  font-weight: 950;
  flex: 0 0 18px;
  margin-top: 1px;
}

.tp-trust-footer{
  font-size: 12.5px;
  color:#0f172a;
  font-weight: 900;
  padding-top: 10px;
  border-top: 1px solid rgba(148,163,184,.35);
}

/* Responsive */
@media (max-width: 980px){
  .tp-trust-card-inner{ grid-template-columns: 1fr; }
  .tp-trust-grid{ grid-template-columns: 1fr; }
  .tp-trust-title{
    left:auto;
    transform:none;
    display:block;
  }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .tp-trust-card,
  .tp-trust-item,
  .tp-trust-title::after{
    animation: none !important;
    transition: none !important;
  }
}
    
                          
                          .ai-feature-split{
    padding: 44px 16px;
    /*font-family: "Space Grotesk", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;*/
    background:
      radial-gradient(1200px 700px at 25% 5%, rgba(255, 178, 216, 0.35), transparent 55%),
      radial-gradient(1000px 650px at 70% 10%, rgba(170, 220, 255, 0.35), transparent 55%),
      radial-gradient(900px 650px at 60% 85%, rgba(202, 180, 255, 0.30), transparent 55%),
      linear-gradient(180deg, #f7f6ff 0%, #ffffff 60%, #f7f6ff 100%);
  }

  .ai-split-wrap {
    max-width: 1000px;
    margin: 0 auto;
    display: flex;
    grid-template-columns: 1.35fr 0.65fr;
    gap: 24px;
    align-items: stretch;
}

  /* ========= LEFT IMAGE (MAKE COLORFUL / NO DULL FILM) ========= */
  .ai-left{
    border-radius: 18px;
    overflow: hidden;
    background: #0f0f14;
    border: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 22px 70px rgba(0,0,0,0.18);
    aspect-ratio: 2047 / 1923;
    width: 100%;
    position: relative;
  }

 .ai-left-img{
  width: 100%;
  height: 100%;
  display: block;

  /* KEY FIX */
  object-fit: contain;

  /* Optional: center image nicely */
  object-position: center center;

  /* Keep it colorful */
  filter: saturate(1.18) contrast(1.06) brightness(1.03);

  background: #0f0f14; /* fills empty space if any */
}

.ai-left{
  padding: 12px;
}


  /* Optional: subtle vibrant glow edge (NOT a film overlay) */
  .ai-left::after{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.35);
  }

  /* ========= RIGHT CARDS (MATCH HEIGHT + HOVER POPUP) ========= */
  .ai-right{
    height: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
  }

  .rf-card{
    flex: 1;
    border-radius: 18px;
    padding: 16px 16px;
    border: 1px solid rgba(0,0,0,0.06);
    box-shadow: 0 14px 40px rgba(0,0,0,0.08);
    position: relative;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
  }

  /* inner soft highlight */
  .rf-card::before{
    content:"";
    position:absolute;
    inset:0;
    background: radial-gradient(700px 240px at 15% 10%, rgba(255,255,255,0.55), transparent 60%);
    pointer-events:none;
  }

  /* POPUP animation on hover */
  .rf-card:hover{
    transform: translateY(-10px) scale(1.03);
    box-shadow:
      0 26px 70px rgba(0,0,0,0.16),
      0 0 0 2px rgba(255,255,255,0.55),
      0 0 55px var(--glow);
    filter: saturate(1.08);
  }

  /* shimmer sweep on hover */
  .rf-card::after{
    content:"";
    position:absolute;
    top:-40%;
    left:-70%;
    width: 60%;
    height: 200%;
    transform: rotate(18deg);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.30), transparent);
    opacity: 0;
    pointer-events:none;
  }
  .rf-card:hover::after{
    opacity: 1;
    animation: rf-sheen 1.2s ease forwards;
  }
  @keyframes rf-sheen{
    0% { left:-70%; }
    100% { left:130%; }
  }

  .rf-row{
    display: flex;
    gap: 12px;
    align-items: flex-start;
    position: relative;
    z-index: 2;
  }

  /* icon badge like your screenshot */
  .rf-icon{
    width: 46px;
    height: 46px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    font-size: 22px;
    background: rgba(255,255,255,0.55);
    box-shadow: 0 12px 28px rgba(0,0,0,0.12);
    flex: 0 0 auto;
  }

  /* small headline like you want */
  .rf-title{
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
    color: rgba(17,24,39,0.90);
    margin: 2px 0 6px;
  }

  .rf-desc{
    font-size: 13.5px;
    line-height: 1.6;
    font-weight: 500;
    color: rgba(17,24,39,0.62);
  }

  .tok-title {
    flex: 1;
    position: relative;
    z-index: 1;
  }
  
  .rmx-title {
    font-size: 28px;
    font-weight: 800;
    margin-bottom: 14px;
    background: linear-gradient(135deg, #ff1f8c 0%, #6d44ff 50%, #ec4899 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    background-size: 200% 200%;
    animation: textGradient 5s ease infinite;
    line-height: 1.3;
  }
  
  .rmx-title-special {
    font-size: 30px;
  }
  
  .highlight-pink {
    background: linear-gradient(135deg, #ff1f8c 0%, #ec4899 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    position: relative;
  }
  
  @keyframes textGradient {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
  }
  
  .rmx-title span{
    color:var(--rmx-pink);
  }

  .rmx-desc {
    font-size: 18px;
    line-height: 1.8;
    color: #1f2937;
    margin-bottom: 10px;
  }
  
  .rmx-desc strong {
    color: #ff1f8c;
    font-weight: 700;
  }
  
  /* 3D Icon Styles */
  .rmx-icon-wrapper {
    margin-bottom: 16px;
    display: inline-block;
  }
  
  .rmx-3d-icon {
    font-size: 48px;
    display: inline-block;
    transform-style: preserve-3d;
    transition: transform 0.3s ease;
    filter: drop-shadow(0 8px 16px rgba(0, 0, 0, 0.15));
    animation: float3dIcon 3s ease-in-out infinite;
    background: linear-gradient(135deg, rgba(255, 31, 140, 0.1) 0%, rgba(109, 68, 255, 0.1) 100%);
    padding: 12px;
    border-radius: 16px;
    backdrop-filter: blur(10px);
    position: relative;
  }
  
  .rmx-3d-icon::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 16px;
    padding: 2px;
    background: linear-gradient(135deg, #ff1f8c, #6d44ff, #ec4899);
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    opacity: 0.5;
  }
  
  .rmx-panel:hover .rmx-3d-icon {
    transform: translateY(-5px) rotateY(10deg) scale(1.1);
    filter: drop-shadow(0 12px 24px rgba(255, 31, 140, 0.3));
  }
  
  @keyframes float3dIcon {
    0%, 100% {
      transform: translateY(0px) rotateY(0deg);
    }
    50% {
      transform: translateY(-8px) rotateY(5deg);
    }
  }

  .rmx-bullets{
    list-style:none;
    padding-left:0;
    font-size:14px;
  }
  .rmx-bullets li{
    display:flex;
    gap:8px;
    align-items:flex-start;
    margin-bottom:6px;
  }
  .rmx-bullets li span.dot{
    font-size:16px;
    color:var(--rmx-pink);
  }

  /* demo card */
  .rmx-demo{
    border-radius:20px;
    padding:16px 18px 20px;
    background: linear-gradient(135deg, #e0f2fe 0%, #fce7f3 50%, #e0f2fe 100%);
    background-size: 200% 200%;
    animation: demoGradient 6s ease infinite;
    box-shadow: 0 16px 40px rgba(15,23,42,.28),
                0 0 30px rgba(236, 72, 153, 0.15);
    display:flex;
    flex-direction:column;
    gap:10px;
    transition:opacity .25s ease,transform .25s ease, box-shadow .3s ease;
    width: 42%;
    position: relative;
    overflow: hidden;
  }
  
  .rmx-demo::before {
    content: '';
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.3) 0%, transparent 70%);
    animation: shimmer 4s ease-in-out infinite;
  }
  
  @keyframes demoGradient {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
  }
  
  @keyframes shimmer {
    0%, 100% { transform: translate(-50%, -50%) rotate(0deg); }
    50% { transform: translate(-50%, -50%) rotate(180deg); }
  }
  
  .rmx-panel:hover .rmx-demo {
    transform: scale(1.02);
    box-shadow: 0 20px 50px rgba(15,23,42,.35),
                0 0 40px rgba(236, 72, 153, 0.2);
  }
  .rmx-demo.is-switching{
    opacity:0;
    transform:translateY(6px);
  }

  .rmx-demo-label{
    font-size:13px;
    font-weight:700;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:#6b7280;
  }

  .rmx-demo-title{
    font-size:16px;
    font-weight:700;
  }

  .rmx-demo-video{
    flex:1;
    border-radius:14px;
    border:1px dashed rgba(55,65,81,.4);
    background:#020617;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#e5e7eb;
    font-size:12px;
    letter-spacing:.16em;
    text-transform:uppercase;
    position:relative;
    text-align:center;
    padding:0 14px;
    line-height:1.4;
  }

  .rmx-demo-play{
    position:absolute;
    bottom:10px;
    left:10px;
    padding:6px 10px;
    border-radius:999px;
    background:rgba(15,23,42,.86);
    color:#f9fafb;
    font-size:11px;
    letter-spacing:.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .rmx-demo-play span.icon{
    width:18px;
    height:18px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:radial-gradient(circle at 30% 20%,#fefce8,#fed7aa);
    color:#ea580c;
    font-size:10px;
  }

  @media (max-width:900px){
    .rmx-panel{
      grid-template-columns:1fr;
      padding:24px 20px 26px;
    }
    .rmx-3d-icon {
      font-size: 40px;
      padding: 10px;
    }
  }
  @media (max-width:640px){
    .rmx-section{
      padding:60px 16px 70px;
    }
    .rmx-tab{
      max-width:none;
      white-space:normal;
    }
    .rmx-demo-video{
      font-size:11px;
    }
    .rmx-title {
      font-size: 24px;
    }
    .rmx-title-special {
      font-size: 26px;
    }
    .rmx-3d-icon {
      font-size: 36px;
      padding: 8px;
    }
    .rmx-desc {
      font-size: 16px;
    }
  }
 
 
  :root{
    /* dedicated palette for section 4 */
    --disc4-pink:#ff2f92;
    --disc4-teal:#14b8a6;
    --disc4-blue:#2563eb;
    --disc4-yellow:#facc15;
    --disc4-text:#0f172a;
  }

  .disc4-section{
    padding:70px 20px 90px;
    font-family:"Nunito", sans-serif;
    color:var(--disc4-text);
    background:
      radial-gradient(circle at 0 0,#e0f2fe 0,#fef9c3 40%,transparent 70%),
      radial-gradient(circle at 100% 100%,#fce7f3 0,#e0f2fe 40%,transparent 70%),
      #f8fafc;
  }

  .disc4-inner{
    max-width:1160px;
    margin:0 auto;
  }

  .disc4-heading{
    text-align:center;
    font-size:clamp(30px,3.3vw,40px);
    font-weight:800;
    letter-spacing:.02em;
    margin-bottom:10px;
  }
  .disc4-heading span{
    color:var(--disc4-pink);
  }

  .disc4-tagline{
    text-align:center;
    font-size:clamp(18px,2.2vw,22px);
    font-weight:700;
    color:var(--disc4-pink);
    margin-bottom:26px;
  }
  .tokprime-wrapper {
    position: relative;
    max-width: 900px;
    margin: 60px auto -40px;
    padding: 40px 50px;
    text-align: center;
    border-radius: 30px;
    overflow: hidden;
    z-index: 1;
  }
  
  .tokprime-bg {
    position: absolute;
    inset: 0;
    background: 
      linear-gradient(135deg, rgba(255, 31, 140, 0.15) 0%, rgba(109, 68, 255, 0.15) 50%, rgba(236, 72, 153, 0.15) 100%),
      radial-gradient(circle at 20% 30%, rgba(255, 31, 140, 0.2) 0%, transparent 50%),
      radial-gradient(circle at 80% 70%, rgba(109, 68, 255, 0.2) 0%, transparent 50%),
      linear-gradient(135deg, #ffffff 0%, #f8f9ff 50%, #fff5f8 100%);
    background-size: 200% 200%, 100% 100%, 100% 100%, 100% 100%;
    animation: tokprimeGradient 8s ease infinite;
    border: 2px solid transparent;
    border-radius: 30px;
    z-index: 0;
  }
  
  .tokprime-bg::before {
    content: '';
    position: absolute;
    inset: -2px;
    border-radius: 30px;
    padding: 2px;
    background: linear-gradient(135deg, #ff1f8c, #6d44ff, #ec4899, #6d44ff);
    background-size: 300% 300%;
    animation: tokprimeBorder 4s ease infinite;
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    z-index: -1;
  }
  
  @keyframes tokprimeGradient {
    0%, 100% { background-position: 0% 50%, 0% 0%, 0% 0%, 0% 0%; }
    50% { background-position: 100% 50%, 100% 100%, 100% 100%, 0% 0%; }
  }
  
  @keyframes tokprimeBorder {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
  }
  
  .tokprime-icons {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
  }
  
  .tokprime-icon {
    position: absolute;
    font-size: 32px;
    opacity: 0.6;
    animation: tokprimeIconFloat 4s ease-in-out infinite;
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.2));
  }
  
  .tokprime-icon-1 {
    top: 15%;
    left: 8%;
    animation-delay: 0s;
  }
  
  .tokprime-icon-2 {
    top: 20%;
    right: 10%;
    animation-delay: 0.8s;
    font-size: 36px;
  }
  
  .tokprime-icon-3 {
    bottom: 25%;
    left: 12%;
    animation-delay: 1.6s;
  }
  
  .tokprime-icon-4 {
    bottom: 20%;
    right: 8%;
    animation-delay: 2.4s;
    font-size: 38px;
  }
  
  .tokprime-icon-5 {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    animation-delay: 3.2s;
    font-size: 28px;
    opacity: 0.4;
  }
  
  @keyframes tokprimeIconFloat {
    0%, 100% {
      transform: translateY(0px) rotate(0deg) scale(1);
    }
    50% {
      transform: translateY(-15px) rotate(10deg) scale(1.1);
    }
  }
  
  .tokprime {
    position: relative;
    z-index: 2;
    max-width: 100%;
    margin: 0;
    font-size: clamp(24px, 3.5vw, 36px);
    font-weight: 800;
    line-height: 1.4;
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  
  .tokprime-text-1 {
    display: block;
    color: #1f2937;
    font-weight: 700;
  }
  
  .tokprime-premium {
    background: linear-gradient(135deg, #ff1f8c 0%, #ec4899 50%, #6d44ff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 1.1em;
    position: relative;
    display: inline-block;
  }
  
  .tokprime-premium::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, #ff1f8c, #ec4899, #6d44ff);
    border-radius: 2px;
    opacity: 0.6;
  }
  
  .tokprime-text-2 {
    display: block;
    color: #1f2937;
    font-weight: 700;
  }
  
  .tokprime-pro {
    background: linear-gradient(135deg, #6d44ff 0%, #ff1f8c 50%, #ec4899 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-size: 1.15em;
    position: relative;
    display: inline-block;
    animation: tokprimePulse 2s ease-in-out infinite;
  }
  
  .tokprime-deal {
    background: linear-gradient(135deg, #ec4899 0%, #ff1f8c 50%, #6d44ff 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 900;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-size: 1.15em;
    position: relative;
    display: inline-block;
  }
  span.perc-bought {
    background-image: url(../images/perc.png);
    background-repeat: no-repeat;
    width: 464px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 39px;
   font-weight: 800;
    margin: -66px auto 0;
  }
  img.disc-1 {
    position: absolute;
    left: -10px;
    top: 90px;
  }
  img.disc-2 {
    position: absolute;
    right: -38px;
    top: 129px;
  }
  @keyframes tokprimePulse {
    0%, 100% {
      filter: drop-shadow(0 0 5px rgba(255, 31, 140, 0.3));
    }
    50% {
      filter: drop-shadow(0 0 15px rgba(255, 31, 140, 0.6));
    }
  }
  
  .tokprime-shine {
    position: absolute;
    top: -50%;
    left: -50%;
    width: 200%;
    height: 200%;
    background: linear-gradient(
      45deg,
      transparent 30%,
      rgba(255, 255, 255, 0.5) 50%,
      transparent 70%
    );
    animation: tokprimeShine 3s ease-in-out infinite;
    pointer-events: none;
    z-index: 3;
  }
  
  @keyframes tokprimeShine {
    0% {
      transform: translateX(-100%) translateY(-100%) rotate(45deg);
    }
    100% {
      transform: translateX(100%) translateY(100%) rotate(45deg);
    }
  }
  
  .webstories-showcase-outer {
    padding: 72px 20px 80px;
    background: linear-gradient(165deg,
      #fafbff 0%,
      #f5f7ff 18%,
      #f0f4ff 35%,
      #faf8ff 52%,
      #f8fafc 70%,
      #fafbff 88%,
      #f5f7ff 100%);
    position: relative;
    overflow: hidden;
    margin-top: 0px;
    color: #0f172a;
  }
  
  .showcase-3d-bg {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
  }
  
  .showcase-gradient-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.45;
    animation: showcaseOrbFloat 18s ease-in-out infinite;
  }
  
  .showcase-orb-1 {
    width: 420px;
    height: 420px;
    top: -120px;
    right: -80px;
    background: radial-gradient(circle, rgba(167, 139, 250, 0.35) 0%, rgba(196, 181, 253, 0.2) 40%, transparent 70%);
    animation-delay: 0s;
  }
  
  .showcase-orb-2 {
    width: 380px;
    height: 380px;
    bottom: -100px;
    left: -60px;
    background: radial-gradient(circle, rgba(244, 114, 182, 0.3) 0%, rgba(251, 207, 232, 0.15) 40%, transparent 70%);
    animation-delay: -6s;
  }
  
  .showcase-orb-3 {
    width: 320px;
    height: 320px;
    top: 50%;
    left: 50%;
    margin-left: -160px;
    margin-top: -160px;
    background: radial-gradient(circle, rgba(56, 189, 248, 0.25) 0%, rgba(186, 230, 253, 0.12) 45%, transparent 70%);
    animation: showcaseOrbFloatCenter 18s ease-in-out infinite -12s;
  }
  
  .showcase-mesh {
    position: absolute;
    inset: 0;
    background:
      radial-gradient(ellipse 100% 60% at 20% 10%, rgba(167, 139, 250, 0.12), transparent 50%),
      radial-gradient(ellipse 80% 80% at 90% 85%, rgba(244, 114, 182, 0.1), transparent 50%),
      radial-gradient(ellipse 70% 100% at 50% 50%, rgba(56, 189, 248, 0.08), transparent 55%);
    pointer-events: none;
  }
  
  @keyframes showcaseOrbFloat {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(20px, -15px) scale(1.05); }
    66% { transform: translate(-15px, 10px) scale(0.98); }
  }
  
  @keyframes showcaseOrbFloatCenter {
    0%, 100% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(15px, -10px) scale(1.03); }
    66% { transform: translate(-10px, 8px) scale(0.98); }
  }
  
  .showcase-3d-icons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 32px;
    margin-bottom: 28px;
    position: relative;
    z-index: 1;
  }
  
  .showcase-icon-3d {
    width: 56px;
    height: 56px;
    filter: drop-shadow(0 8px 16px rgba(99, 102, 241, 0.2)) drop-shadow(0 4px 8px rgba(0, 0, 0, 0.06));
    transition: transform 0.35s ease, filter 0.35s ease;
  }
  
  .showcase-icon-3d svg {
    width: 100%;
    height: 100%;
    display: block;
  }
  
  .showcase-icon-story { animation: showcaseIconFloat 4s ease-in-out infinite; }
  .showcase-icon-play { animation: showcaseIconFloat 4s ease-in-out infinite 0.4s; }
  .showcase-icon-sparkle { animation: showcaseIconFloat 4s ease-in-out infinite 0.8s; }
  
  .showcase-icon-3d:hover {
    transform: translateY(-6px) scale(1.08);
    filter: drop-shadow(0 12px 24px rgba(99, 102, 241, 0.3)) drop-shadow(0 6px 12px rgba(0, 0, 0, 0.08));
  }
  
  @keyframes showcaseIconFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-6px); }
  }
  
  .webstories-header {
    text-align: center;
    margin-bottom: 56px;
    position: relative;
    z-index: 1;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
  }
  
.webstories-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(167, 139, 250, 0.25);
    padding: 10px 20px;
    border-radius: 100px;
    font-size: 20px;
    font-weight: 700;
    color: #5b21b6;
    letter-spacing: 0.02em;
    margin-bottom: 20px;
    box-shadow: 0 4px 20px rgba(139, 92, 246, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}
  
  .webstories-badge-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: linear-gradient(135deg, #a78bfa, #6366f1);
    box-shadow: 0 0 12px rgba(139, 92, 246, 0.5);
    animation: showcasePulse 2s ease-in-out infinite;
  }
  
  @keyframes showcasePulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.85; transform: scale(1.1); }
  }
  
  .webstories-main-title {
    font-size: 40px;
    font-weight: 800;
    line-height: 1.3;
    color: #0f172a;
    margin-bottom: 20px;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8);
    font-family: 'Nunito', system-ui, -apple-system, sans-serif;
  }
  
  .webstories-highlight {
    background: linear-gradient(135deg, #6366f1 0%, #a78bfa 35%, #ec4899 70%, #f472b6 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: none;
    font-weight: 900;
    animation: showcaseHighlightShine 6s linear infinite;
  }
  
  @keyframes showcaseHighlightShine {
    0% { background-position: 0% center; }
    100% { background-position: 200% center; }
  }
  
  .webstories-source-note {
    display: inline-block;
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(226, 232, 240, 0.9);
    padding: 12px 24px;
    border-radius: 50px;
    font-size: 14px;
    color: #475569;
    margin-top: 20px;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
  }
  
  .source-highlight {
    font-weight: 600;
    margin-right: 8px;
  }
  
  .source-link {
    color: #fff64b;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.3s ease;
  }
  
  .source-link:hover {
    color: #ffd700;
    text-decoration: underline;
  }
  
  .webstories-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    max-width: 1400px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
  }
  
  .webstory-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }
  .webstory-frame img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
  }
  
  .webstory-frame {
    width: 100%;
    max-width: 400px;
    aspect-ratio: 9 / 16;
    border-radius: 24px;
    padding: 0;
    position: relative;
    overflow: hidden;
    transition: transform 0.35s ease, box-shadow 0.35s ease;
    background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%);
    box-shadow:
      0 4px 6px rgba(15, 23, 42, 0.04),
      0 12px 28px rgba(99, 102, 241, 0.08),
      0 0 0 1px rgba(226, 232, 240, 0.8),
      inset 0 1px 0 rgba(255, 255, 255, 0.9);
  }
  
  .webstory-frame::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, transparent 30%),
      radial-gradient(circle at 70% 20%, rgba(167, 139, 250, 0.08), transparent 45%),
      radial-gradient(circle at 30% 80%, rgba(244, 114, 182, 0.06), transparent 45%);
    pointer-events: none;
    z-index: 0;
    border-radius: 20px;
  }
  
  .webstory-frame:hover {
    transform: translateY(-10px) scale(1.02);
    box-shadow:
      0 20px 50px rgba(99, 102, 241, 0.15),
      0 8px 24px rgba(15, 23, 42, 0.1),
      0 0 0 2px rgba(167, 139, 250, 0.2),
      inset 0 1px 0 rgba(255, 255, 255, 1);
  }
  
  .webstory-header-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(15px);
    border-radius: 12px;
    margin-bottom: 8px;
    z-index: 2;
    position: relative;
    border: 1px solid rgba(255, 255, 255, 0.1);
  }
  
  .webstory-logo {
    font-size: 16px;
    font-weight: 700;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 1px;
  }
  
  .webstory-logo.logo-circle {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(10px);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 700;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.2);
  }
  
  .webstory-logo.logo-text {
    font-size: 12px;
    text-transform: lowercase;
    font-weight: 500;
  }
  
  .webstory-controls {
    display: flex;
    gap: 12px;
  }
  
  .control-icon {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 14px;
    opacity: 0.8;
  }
  
  .webstory-content {
    flex: 1;
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.8) 0%, rgba(30, 41, 59, 0.6) 100%);
    z-index: 1;
  }
  
  .webstory-image {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .webstory-image-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.4) 0%, rgba(30, 41, 59, 0.3) 100%);
  }
  
  .placeholder-content {
    text-align: center;
    color: #ffffff;
  }
  
  .placeholder-content .food-icon,
  .placeholder-content .money-icon,
  .placeholder-content .burger-icon,
  .placeholder-content .wildlife-icon {
    font-size: 64px;
    margin-bottom: 12px;
    filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.3));
  }
  
  .placeholder-content p {
    font-size: 18px;
    font-weight: 600;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
  }
  
  .webstory-overlay-text {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 24px 20px;
    background: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.7) 100%);
    z-index: 2;
  }
  
  .overlay-category {
    font-size: 11px;
    font-weight: 600;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 8px;
    opacity: 0.9;
  }
  
  .overlay-title {
    font-size: 24px;
    font-weight: 800;
    color: #ffffff;
    line-height: 1.2;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
  }
  
  .overlay-title-large {
    font-size: 28px;
    font-weight: 900;
    color: #ffffff;
    line-height: 1.2;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
    margin-bottom: 4px;
  }
  
  .overlay-subtitle {
    font-size: 14px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.9);
    text-shadow: 0 1px 5px rgba(0, 0, 0, 0.5);
  }
  
  .overlay-author {
    font-size: 10px;
    font-weight: 500;
    color: rgba(255, 255, 255, 0.8);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 8px;
  }
  
  .webstory-info {
    text-align: center;
    max-width: 400px;
    padding: 4px 0;
  }
  
  .webstories-showcase-outer .webstory-card {
    padding: 20px 16px 24px;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.8);
    box-shadow: 0 4px 20px rgba(99, 102, 241, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transition: box-shadow 0.3s ease, transform 0.3s ease;
  }
  
  .webstories-showcase-outer .webstory-card:hover {
    box-shadow: 0 12px 36px rgba(99, 102, 241, 0.12), inset 0 1px 0 rgba(255, 255, 255, 1);
  }
  
  .webstory-title {
    margin-bottom: 12px;
  }
  
  .webstory-link {
    font-size: 21px;
    font-weight: 700;
    color: #0f172a;
    text-decoration: none;
    transition: color 0.25s ease, transform 0.25s ease;
    display: inline-block;
  }
  
  .webstory-link:hover {
    color: #6366f1;
    transform: translateY(-2px);
  }
  
  .webstory-stats {
    font-size: 24px;
    color: #475569;
    margin-bottom: 8px;
    font-weight: 500;
  }
  
  .webstories-showcase-outer .stats-highlight {
    font-weight: 800;
    background: linear-gradient(135deg, #6366f1 0%, #a78bfa 50%, #ec4899 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 18px;
  }
  
  .webstory-type {
    font-size: 18px;
    color: #64748b;
    font-style: italic;
    margin-top: 4px;
  }
  
  .stats-highlight {
    font-weight: 800;
    background: linear-gradient(135deg, #8b5cf6 0%, #ec4899 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 18px;
  }
  
  /* Responsive Design */
  @media (max-width: 1024px) {
    .webstories-main-title {
      font-size: 36px;
    }
    
    .webstories-grid {
      gap: 32px;
    }
    
    .webstory-frame {
      max-width: 280px;
    }
  }
  
  @media (max-width: 768px) {
    .webstories-showcase-outer {
      padding: 60px 16px 80px;
    }
  
    .showcase-3d-icons {
      gap: 24px;
      margin-bottom: 24px;
    }
  
    .showcase-icon-3d {
      width: 48px;
      height: 48px;
    }
  
    .webstories-badge {
      font-size: 13px;
      padding: 8px 16px;
    }
    
    .webstories-main-title {
      font-size: 28px;
      line-height: 1.4;
    }
    
    .webstories-grid {
      grid-template-columns: 1fr;
      gap: 40px;
    }
    
    .webstory-frame {
      max-width: 100%;
      max-width: 300px;
    }
    
    .webstory-link {
      font-size: 16px;
    }
  
    .webstories-showcase-outer h2.webiste-text {
      font-size: 22px;
      margin-top: 36px;
    }
    
    .overlay-title-large {
      font-size: 24px;
    }
    
    .overlay-title {
      font-size: 20px;
    }
  }
  
  @media (max-width: 480px) {
    .webstories-showcase-outer {
      padding: 50px 12px 70px;
    }
  
    .showcase-3d-icons {
      gap: 16px;
      margin-bottom: 20px;
    }
  
    .showcase-icon-3d {
      width: 44px;
      height: 44px;
    }
    
    .webstories-main-title {
      font-size: 24px;
    }
    
    .webstories-source-note {
      font-size: 12px;
      padding: 10px 20px;
    }
    
    .webstory-frame {
      max-width: 260px;
    }
    
    .webstory-link {
      font-size: 15px;
    }
    
    .webstory-stats {
      font-size: 14px;
    }
    
    .stats-highlight {
      font-size: 16px;
    }
  
    .webstories-showcase-outer h2.webiste-text {
      font-size: 18px;
      margin-top: 32px;
    }
  }
.webstories-showcase-outer h2.webiste-text {
    max-width: 900px;
    text-align: center;
    margin: 48px auto 0;
    font-size: 30px;
    font-weight: 800;
    line-height: 1.4;
    color: #0f172a;
    opacity: 1;
    position: relative;
    z-index: 1;
}
.webstories-showcase-outer h2.webiste-text span {
  background: linear-gradient(135deg, #6366f1 0%, #a78bfa 50%, #ec4899 100%);
  color: #fff;
  padding: 6px 14px;
  display: inline-block;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(99, 102, 241, 0.35);
}  