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

*, body{
  font-family: 'Poppins', sans-serif;
}

.testimonials-pricing,
.testimonials-pricing * {
  box-sizing: border-box;
}
.testimonials-pricing {
  background: #ffffff;
  /* Remove the fixed height */
  padding-top: 80px;
  min-height: 100vh;
  position: relative;
  overflow: hidden;
  margin-bottom: 50px; /* Adjust space to prevent overlap */
}

@media (max-width: 1280px) {
  .testimonials-pricing {
      min-height: auto;
      padding-bottom: var(--space-4xl, 50px);
  }
}



.testimonials-wrapper {
  background: #191c1f;
  width: 2208px;
  height: 1454px;
  position: absolute;
  left: calc(50% - 1163px);
  top: -1355px;
  transform-origin: 0 0;
  transform: rotate(-5deg) scale(1, 1);
  overflow: hidden;
}
.ellipse-6 {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 50%;
  width: 616px;
  height: 616px;
  position: absolute;
  right: -242.9px;
  top: -239.99px;
  transform-origin: 0 0;
  transform: rotate(5deg) scale(1, 1);
  filter: blur(150px);
}
.ellipse-7 {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 50%;
  width: 616px;
  height: 616px;
  position: absolute;
  left: -187.19px;
  bottom: -188.59px;
  transform-origin: 0 0;
  transform: rotate(5deg) scale(1, 1);
  filter: blur(150px);
}
.pattern {
  position: absolute;
  inset: 0;
}
.partners-logo-grid {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  position: absolute;
  left: -68.32px;
  top: 1423.46px;
  transform-origin: 0 0;
  transform: rotate(0deg) scale(1, 1);
}
.logo {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo2 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo3 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo4 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo5 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo6 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo7 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo8 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo9 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo10 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo11 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo12 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo13 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo14 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo15 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo16 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo17 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo18 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo19 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo20 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo21 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo22 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.additional-logo-grid {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  position: absolute;
  left: 55.7px;
  top: 5.88px;
  transform-origin: 0 0;
  transform: rotate(0deg) scale(1, 1);
}
.logo23 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo24 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo25 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo26 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo27 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo28 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo29 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo30 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo31 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo32 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo33 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo34 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo35 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo36 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo37 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo38 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo39 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo40 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo41 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo42 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo43 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo44 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.pricing-wrapper {
  background: #191c1f;
  width: 2208px;
  height: 1451px;
  position: absolute;
  left: calc(50% - 1163px);
  bottom: -1550px;
  transform-origin: 0 0;
  transform: rotate(-5deg) scale(1, 1);
  overflow: hidden;
}
.expanded-logo-grid {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: flex-start;
  justify-content: flex-start;
  position: absolute;
  left: -68.06px;
  top: 1420.47px;
  transform-origin: 0 0;
  transform: rotate(0deg) scale(1, 1);
}
.logo45 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo46 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo47 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo48 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo49 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo50 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo51 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo52 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo53 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo54 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo55 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo56 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo57 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo58 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo59 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo60 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo61 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo62 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo63 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo64 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo65 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo66 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo67 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo68 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo69 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo70 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo71 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo72 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo73 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo74 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo75 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo76 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo77 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo78 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo79 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo80 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo81 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo82 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo83 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo84 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo85 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo86 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo87 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.logo88 {
  flex-shrink: 0;
  width: 78px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.ellipse-62 {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 50%;
  width: 616px;
  height: 616px;
  position: absolute;
  left: calc(50% - -730.9px);
  top: calc(50% - 965.49px);
  transform-origin: 0 0;
  transform: rotate(5deg) scale(1, 1);
  filter: blur(160px);
}
.ellipse-72 {
  background: rgba(255, 255, 255, 0.03);
  border-radius: 50%;
  width: 616px;
  height: 616px;
  position: absolute;
  left: -186.92px;
  bottom: -188.6px;
  transform-origin: 0 0;
  transform: rotate(5deg) scale(1, 1);
  filter: blur(160px);
}
.testimonial-details {
  display: flex;
  flex-direction: column;
  /* background: palevioletred; */
  align-items: flex-start;
  justify-content: flex-start;
  width: 100vw;
  /* position: absolute;
  left: 50%;
  translate: -50% -50%;
  top: 50%; */
}

.testimonial-details2 {
  display: flex;
  flex-direction: column;
  gap: 5px;
  /* padding: 60px; */
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  /* width: 1776px; */
  width: 100%;
  position: relative;
}
.security-badge {
  background: rgba(25, 28, 31, 0.05);
  border-radius: 24px;
  padding: 8px 16px 8px 16px;
  display: flex;
  flex-direction: row;
  /* gap: 8px; */
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  position: relative;
}
.material-symbols-shield-with-heart-outline-rounded {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.trusted-platform {
  color: var(--blue-4, #244896);
  text-align: left;
  font-family: "Poppins";
  font-size: 16px;
  font-weight: 500;
  position: relative;
}
.testimonials-text {
  display: flex;
  flex-direction: column;
  /* gap: 96px; */
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}

/* Testimonial card hover effects removed */


.features-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0px 30px;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
  text-align: center;
}
@media (max-width: 1280px) {
  
  .features-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 0px 10px;
  }
} 
.featuresTestimonials {
  color: #191c1f;
  text-align: center;
  font-family: "Poppins", sans-serif;
  font-size: 80px;
  line-height: var(--lh-tight);
  font-weight: 700;
  margin-bottom: var(--space-2xl);
  position: relative;
}


.testimonial-description {
  flex-shrink: 0;
  width: 100%;
  max-width: 728px;
  height: auto;
  position: relative;
  margin: 0 auto;
}
.see-how-slick-pay-has-made-managing-payments-easier-and-more-efficient-for-our-users-from-secure-transactions-to-seamless-financial-solutions-hear-their-stories-and-learn-how-we-ve-helped-simplify-their-day-to-day-operations {
  color: rgba(25, 28, 31, 0.85);
  text-align: center;
  font-family: "Poppins", sans-serif;
  font-size: 24px;
  line-height: var(--lh-relaxed, 1.625);
  font-weight: 600;
  width: 100%;
}
@media (max-width: 1280px) {
  .featuresTestimonials {
    font-size: var(--fs-7xl);
    line-height: var(--lh-tight);
    margin-bottom: var(--space-xl);
  }
}

@media (max-width: 768px) {
  .featuresTestimonials {
    font-size: var(--fs-5xl);
    line-height: var(--lh-snug);
    margin-bottom: var(--space-lg);
  }
}

@media (max-width: 640px) {
  .featuresTestimonials {
    font-size: var(--fs-4xl);
    line-height: var(--lh-snug);
  }
  .testimonial-description{
    width: 100%;
    max-width: 95%;
    height: auto;
    margin: 0 auto;
    padding: 0 10px;
  }
  .see-how-slick-pay-has-made-managing-payments-easier-and-more-efficient-for-our-users-from-secure-transactions-to-seamless-financial-solutions-hear-their-stories-and-learn-how-we-ve-helped-simplify-their-day-to-day-operations{
    font-size: var(--fs-xs, 0.75rem);
  }
  .get-paid-on-your-terms-with-simple-transparent-rates-whether-you-need-instant-transfers-or-scheduled-payouts-choose-the-plan-that-fits-your-cash-flow-best-enjoy-reliable-payments-with-no-hidden-fees {
    width: 100%;
    max-width: 95%;
    font-size: var(--fs-xs, 0.75rem);
    margin: 0 auto;
    padding: 0 10px;
  }
}
.testimonial-cards-container {
  display: flex;
  flex-direction: column; 
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  width: 100%;
  margin-top: 30px;
  position: relative;
}

/* Testimonials Carousel Styles */
.testimonials-carousel-wrapper {
  position: relative;
  width: 100vw;
  padding: 0 60px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}

.testimonials-carousel-container {
  overflow: hidden;
  width: 100%;
  max-width: 1400px;
  position: relative;
  border-radius: 12px;
}

.testimonials-carousel-track {
  display: flex;
  transition: transform 0.35s cubic-bezier(0.4, 0.0, 0.2, 1);
  gap: 20px;
  will-change: transform;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

.testimonial-slide {
  flex: 0 0 calc(33.333% - 14px); /* 3 cards per row on large screens */
  display: flex;
  flex-direction: column;
  min-height: 280px;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
}

/* Navigation Buttons */
.testimonial-nav-btn {
  background: rgba(25, 28, 31, 0.95);
  border: 2px solid rgba(255, 255, 255, 0.15);
  border-radius: 50%;
  width: 52px;
  height: 52px;
  min-width: 52px;
  min-height: 52px;
  max-width: 52px;
  max-height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0.0, 0.2, 1);
  backdrop-filter: blur(20px);
  z-index: 10;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
}

.testimonial-nav-btn::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), transparent);
  border-radius: inherit;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.testimonial-nav-btn:hover::before {
  opacity: 1;
}

.testimonial-nav-btn:active {
  transform: scale(1.02) translateY(0px);
  transition-duration: 0.1s;
}

.testimonial-nav-btn:disabled {
  opacity: 0.4;
  cursor: not-allowed;
  transform: none;
  pointer-events: none;
}

.testimonial-nav-btn svg {
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
  transition: transform 0.3s ease;
  flex-shrink: 0;
}

/* Dots Indicator */
.testimonials-dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 30px;
}

.testimonials-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  cursor: pointer;
  transition: all 0.3s ease;
}

.testimonials-dot.active {
  background: rgba(255, 255, 255, 0.8);
  transform: scale(1.2);
}

/* Large Screens (Desktop) - 3 cards per row with arrows */
@media (min-width: 1281px) {
  .testimonials-carousel-wrapper {
    padding: 0 80px;
  }
  
  .testimonials-carousel-track {
    gap: 24px;
  }
  
  .testimonial-slide {
    flex: 0 0 calc(33.333% - 16px);
  }
  
  .testimonial-nav-btn {
    display: flex;
  }
}

/* Medium Screens (Tablet) - 2 cards per row with arrows */
@media (max-width: 1280px) and (min-width: 769px) {
  .testimonials-carousel-wrapper {
    padding: 0 50px;
    gap: 24px;
  }
  
  .testimonials-carousel-track {
    gap: 24px;
  }
  
  .testimonial-slide {
    flex: 0 0 calc(50% - 12px);
    min-height: 270px;
    transform: translate3d(0, 0, 0);
  }
  
  .testimonial-nav-btn {
    display: flex;
  }
}

/* Mobile Screens - 1 card at a time, touch scrollable, no arrows */
@media (max-width: 768px) {
  .testimonials-carousel-wrapper {
    padding: 0 16px;
    gap: 0;
  }
  
  .testimonials-carousel-container {
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE and Edge */
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch; /* iOS momentum scrolling */
    border-radius: 16px;
    /* Enhanced touch scrolling */
    overscroll-behavior-x: contain;
    scroll-padding: 0 16px;
  }
  
  .testimonials-carousel-container::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
  }
  
  .testimonials-carousel-track {
    gap: 20px;
    padding: 0 4px;
    transition: none; /* Disable transition on mobile for touch scrolling */
    transform: none !important; /* Disable transform on mobile */
    /* Ensure proper spacing */
    padding-right: 16px;
  }
  
  .testimonial-slide {
    flex: 0 0 calc(100vw - 56px); /* Full width minus container padding */
    scroll-snap-align: center;
    scroll-snap-stop: always;
    min-height: 260px;
  }
  
  .testimonial-nav-btn {
    display: none; /* Hide arrows on mobile */
  }
  
  .testimonials-dots {
    margin-top: 24px;
    gap: 12px;
  }
  
  .testimonials-dot {
    width: 10px;
    height: 10px;
    background: rgba(255, 255, 255, 0.4);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  }
  
  .testimonials-dot.active {
    background: rgba(255, 255, 255, 0.9);
    transform: scale(1.3);
  }
}

/* Extra small screens */
@media (max-width: 480px) {
  .testimonials-carousel-wrapper {
    padding: 0 16px;
  }
  
  .testimonials-carousel-track {
    gap: 12px;
  }
  
  .testimonial-slide {
    flex: 0 0 calc(100% - 12px);
  }
}

.testimonial-card,
.testimonial-card-alt,
.testimonial-card3,
.testimonial-card4,
.testimonial-card5,
.testimonial-card6 {
  background: rgba(25, 28, 31, 0.95);
  border-radius: 24px;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.1);
  border-width: 2px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: space-between;
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  min-height: 240px;
  position: relative;
  backdrop-filter: blur(32px);
}
.testimonial-before-div {
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.5);
  border-width: 0px 0px 1px 0px;
  padding: 0px 5px 16px 5px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex: 1;
  position: relative;
}
.div {
  flex-shrink: 0;
  width: 36px;
  height: 26px;
  position: relative;
  overflow: visible;
}
.testimonial {
  color: rgba(255, 255, 255, 0.85);
  text-align: left;
  font-family: "Poppins-Regular", sans-serif;
  font-size: 18px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
.testimonial-author {
  padding: 24px 16px 0px 16px;
  display: flex;
  flex-direction: row;
  gap: 14px;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.avatar {
  flex-shrink: 0;
  width: 54px;
  height: 54px;
  position: relative;
}
.avatar-image {
  background: var(
    --avatar-female-jessamine-mumtaz-with-background,
    linear-gradient(to left, #a5a7ff, #a5a7ff)
  );
  border-radius: 100px;
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0%;
  left: 0%;
  bottom: 0%;
  top: 0%;
  object-fit: cover;
}
.author-details {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: flex-start;
  flex: 1;
  position: relative;
}
.name {
  color: #ffffff;
  text-align: left;
  font-family: "poppins";
  font-size: 12px;
  font-weight: 600;
  position: relative;
  align-self: stretch;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.occupation {
  color: rgba(255, 255, 255, 0.85);
  text-align: left;
  font-family: "Poppins-Regular", sans-serif;
  font-size: 11px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.div2 {
  flex-shrink: 0;
  width: 36px;
  height: 26px;
  position: relative;
  overflow: visible;
}
.avatar-image2 {
  background: var(
    --avatar-male-lawrence-with-background,
    linear-gradient(to left, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2))
  );
  border-radius: 100px;
  width: 100%;
  height: 100%;
  /* position: absolute;
  right: 0%;
  left: 0%;
  bottom: 0%;
  top: 0%; */
  /* object-fit: cover; */
}

.div3 {
  flex-shrink: 0;
  width: 36px;
  height: 26px;
  position: relative;
  overflow: visible;
}
.avatar-image3 {
  background: var(
    --avatar-male-eric-yates-with-background,
    linear-gradient(to left, #b1e0f4, #b1e0f4)
  );
  border-radius: 100px;
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0%;
  left: 0%;
  bottom: 0%;
  top: 0%;
  object-fit: cover;
}


.div4 {
  flex-shrink: 0;
  width: 36px;
  height: 26px;
  position: relative;
  overflow: visible;
}
.selim-bedja {
  border-radius: 100px;
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0%;
  left: 0%;
  bottom: 0%;
  top: 0%;
  object-fit: cover;
}

.div5 {
  flex-shrink: 0;
  width: 36px;
  height: 26px;
  position: relative;
  overflow: visible;
}
.abderahim-abdelaoui {
  border-radius: 100px;
  width: 100%;
  height: 100%;
  position: absolute;
  right: 0%;
  left: 0%;
  bottom: 0%;
  top: 0%;
  object-fit: cover;
}





.div6 {
  flex-shrink: 0;
  width: 36px;
  height: 26px;
  position: relative;
  overflow: visible;
}
.pricing-details {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
  margin-top: 120px;
}

.material-symbols-sell {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  position: relative;
  overflow: visible;
}
.choose-your-plan {
  color: var(--blue-4, #244896);
  text-align: left;
  font-family: "Poppins";
  font-size: 16px;
  font-weight: 500;
  position: relative;
}
.get-paid-on-your-terms-with-simple-transparent-rates-whether-you-need-instant-transfers-or-scheduled-payouts-choose-the-plan-that-fits-your-cash-flow-best-enjoy-reliable-payments-with-no-hidden-fees {
  color: rgba(25, 28, 31, 0.85);
  text-align: center;
  font-family: "poppins";
  font-size: 24px;
  font-weight: 600;
  width: 100%;
  max-width: 728px;
  margin: 0 auto;
}
@media (max-width: 1280px) {
  .get-paid-on-your-terms-with-simple-transparent-rates-whether-you-need-instant-transfers-or-scheduled-payouts-choose-the-plan-that-fits-your-cash-flow-best-enjoy-reliable-payments-with-no-hidden-fees {
    width: 100%;
    max-width: 90%;
    font-size: 14px;
    margin: 0 auto;
  }
}
.plans-container {
  width: 100vw;
  padding: 0 60px;
  box-sizing: border-box;
}

.plans {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
  margin: 30px 0 0;
  position: relative;
}

.pricing-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
  width: 100%;
  align-items: stretch;
}

@media (min-width: 1680px) {
  .plans-container {
    padding: 0 80px;
  }
  
  .pricing-grid {
    gap: 24px;
  }
}
 
@media (max-width: 1280px) {
  .plans-container {
    padding: 0 30px;
  }
  
  .pricing-grid {
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    width: 100%;
  }
  
  .pricing-plan-card {
    width: 100% !important;
    min-height: 220px;
  }
}

@media (max-width: 960px) {
  .plans-container {
    padding: 0 25px;
  }
  
  .pricing-grid {
    grid-template-columns: 1fr 1fr;
    gap: 14px;
  }
}

@media (max-width: 768px) {
  .plans-container {
    padding: 0 16px;
  }
  
  .pricing-grid {
    grid-template-columns: 1fr;
    gap: 14px;
    width: 100%;
  }
  
  .pricing-plan-card {
    padding: 20px;
    min-height: 200px;
    width: 100% !important;
  }
}

@media (max-width: 480px) {
  .plans-container {
    padding: 0 12px;
  }
  
  .pricing-grid {
    gap: 12px;
  }
  
  .pricing-plan-card {
    padding: 16px;
    min-height: 180px;
  }
}

.pricing-plan-card {
  background: rgba(25, 28, 31, 0.95);
  border-radius: 24px;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.1);
  border-width: 2px;
  padding: 24px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
  justify-content: space-between;
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  min-height: 240px;
  position: relative;
  backdrop-filter: blur(32px);
}

/* Pricing plan card hover effects removed */
.text-box {
  display: flex;
  flex-direction: column;
  gap: 16px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex: 1;
  position: relative;
}
.auto {
  color: #ffffff;
  text-align: left;
  font-family: "poppins";
  font-size: 24px;
  font-weight: 600;
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
._2-fee-per-transaction {
  color: #ffffff;
  text-align: left;
  font-family: "Poppins";
  font-size: 20px;
  font-weight: 500;
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.funds-are-transferred-instantly-after-satim-confirms-the-transaction-this-is-the-quickest-option-ensuring-you-receive-your-money-without-any-waiting-time {
  color: rgba(255, 255, 255, 0.85);
  text-align: left;
  font-family: "Poppins-Regular", sans-serif;
  font-size: 16px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.arrow-right {
  border-radius: 100px;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  position: relative;
  overflow: visible;
}
.arrow-right2 {
  border-radius: 100px;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  position: relative;
  overflow: visible;
}
.arrow-right3 {
  display: none;
}

.arrow-right4 {
  border-radius: 100px;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  position: relative;
  overflow: visible;
}
.arrow-right5 {
  border-radius: 100px;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  position: relative;
  overflow: visible;
}
.arrow-right6 {
  border-radius: 100px;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  position: relative;
  overflow: visible;
}
.why-slickpay-section {
  display: flex;
  flex-direction: column;
  gap: 96px;
  align-items: flex-start;
  justify-content: flex-start;
  flex-shrink: 0;
  padding-top: 50px;
  /* width: 1776px; */
  width: 100%;
  margin-top: 30px;
  position: relative;
}
.features-header2 {
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.features2 {
  color: #191c1f;
  text-align: center;
  font-family: "Poppins", sans-serif;
  font-size: 80px;
  line-height: var(--lh-tight);
  font-weight: 700;
  margin-bottom: var(--space-2xl);
  position: relative;
}
@media (max-width: 1280px) {
  .features2{
    font-size: var(--fs-7xl);
    line-height: var(--lh-tight);
    margin-bottom: var(--space-xl);
  }
}

@media (max-width: 768px) {
  .features2 {
    font-size: var(--fs-5xl);
    line-height: var(--lh-snug);
    margin-bottom: var(--space-lg);
  }
}

@media (max-width: 640px) {
  .features2 {
    font-size: var(--fs-4xl);
    line-height: var(--lh-snug);
  }
  .why-slickpay-section {
    gap: 30px;
  }
} 
.feature-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch; /* Equal height for all cards */
  gap: 20px;
  padding: 30px;
  align-self: stretch;
  position: relative;
}

/* Cards with equal width and height */
.why-slickpay-section .feature-card {
  flex: 0 0 calc(33.333% - 14px); /* Fixed width: 3 cards per row */
  min-height: 450px !important; /* Force same height for all cards */
  height: auto !important;
}

/* Medium screens - 2 columns */
@media (max-width: 1280px) {
  .feature-grid {
    padding: 20px;
  }
  
  .why-slickpay-section .feature-card {
    flex: 0 0 calc(50% - 10px); /* Fixed width: 2 cards per row */
    min-height: 400px !important; /* Adjusted height for medium screens */
  }
}

/* Mobile screens - 1 column */
@media (max-width: 768px) {
  .feature-grid {
    padding: 15px;
    gap: 15px;
  }
  
  .why-slickpay-section .feature-card {
    flex: 0 0 100%; /* Fixed width: 1 card per row */
    min-height: 350px !important; /* Adjusted height for mobile screens */
  }
}

.feature-card {
  background: rgba(25, 28, 31, 0.95);
  border-radius: 24px;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.1);
  border-width: 2px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly; /* Even content distribution */
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(32px);
  width: 100%;
  height: 100%;
  gap: 20px;
}



.illustration {
  border-radius: 16px;
  border-width: 2px;
  border-style: solid;
  border-image: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.1) 0%,
    rgba(255, 255, 255, 0) 85.00000238418579%
  );
  border-image-slice: 1;
  align-self: stretch;
  flex-shrink: 0;
  height: 339px;
  position: relative;
  overflow: hidden;
  width: 50%;
}

.progress-chart-wrapper {
  padding: 0px 16px 0px 16px;
  display: flex;
  flex-direction: row;
  gap: 29px;
  align-items: flex-start;
  justify-content: flex-start;
  position: absolute;
  left: 0px;
  top: 56px;
}
.progress-bar-1 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.secondary-progress-bar {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 32px;
  border-width: 1.5px;
  border-style: solid;
  border-image: linear-gradient(
    158.39deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.03) 100%
  );
  border-image-slice: 1;
  padding: 12px;
  width: 8px;
  height: 8px;
  position: absolute;
  left: 0px;
  top: 0px;
  box-shadow: inset 2px 4px 16px 0px rgba(248, 248, 248, 0.06);
  overflow: hidden;
  backdrop-filter: blur(50px);
}
.vector-26 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-2 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-262 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-3 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-263 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-4 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-264 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-5 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-265 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-6 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-266 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-7 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-267 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-8 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-268 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-9 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-269 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-10 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-2610 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-11 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-2611 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-12 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-2612 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-13 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-2613 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-14 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-2614 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-15 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-2615 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-165 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-2616 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-16 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-2617 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-17 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-2618 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.progress-bar-18 {
  flex-shrink: 0;
  width: 8px;
  height: 280px;
  position: relative;
}
.vector-2619 {
  width: 0px;
  height: 264px;
  position: absolute;
  left: 4px;
  top: 16px;
  overflow: visible;
}
.months {
  padding: 0px 16px 0px 16px;
  display: flex;
  flex-direction: row;
  gap: 120px;
  align-items: flex-start;
  justify-content: flex-start;
  position: absolute;
  left: 0px;
  top: 24px;
}
.last-month-label-text {
  color: rgba(255, 255, 255, 0.85);
  text-align: left;
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  position: relative;
  width: 23px;
  height: 16px;
}
.last-month-label-text2 {
  color: rgba(255, 255, 255, 0.85);
  text-align: left;
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  position: relative;
  width: 22px;
  height: 16px;
}
.last-month-label-text3 {
  color: rgba(255, 255, 255, 0.85);
  text-align: left;
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  position: relative;
  width: 20px;
  height: 16px;
}
.last-month-label-text4 {
  color: rgba(255, 255, 255, 0.85);
  text-align: left;
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  position: relative;
}
.progress-bar-32 {
  height: 220px;
  position: absolute;
  right: -41px;
  left: 20px;
  top: 98px;
}
.far-right-progress-bar-container {
  background: rgba(255, 255, 255, 0.01);
  border-radius: 10px;
  border-width: 1.5px;
  border-style: solid;
  border-image: linear-gradient(
    158.39deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.03) 100%
  );
  border-image-slice: 1;
  padding: 4px;
  height: 40px;
  position: absolute;
  right: 0px;
  left: 148px;
  top: calc(50% - 110px);
  box-shadow: inset 2px 4px 16px 0px rgba(248, 248, 248, 0.06);
  overflow: hidden;
  backdrop-filter: blur(50px);
}
.far-right-progress-bar-container2 {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  border-width: 1.5px;
  border-style: solid;
  border-image: linear-gradient(
    158.39deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.03) 100%
  );
  border-image-slice: 1;
  padding: 0px 12px 0px 12px;
  width: 87px;
  height: 32px;
  position: absolute;
  left: 4px;
  top: 50%;
  translate: 0 -50%;
  box-shadow: inset 2px 4px 16px 0px rgba(248, 248, 248, 0.06);
  overflow: hidden;
  backdrop-filter: blur(50px);
}
.header-description {
  color: rgba(255, 255, 255, 0.85);
  text-align: left;
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  opacity: 0.5;
  position: absolute;
  left: 12px;
  top: 8px;
  width: 63px;
  height: 16px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.far-right-progress-bar-container3 {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 10px;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.5);
  border-width: 1.5px;
  padding: 4px;
  height: 40px;
  position: absolute;
  right: 160px;
  left: 0px;
  top: calc(50% - 50px);
  box-shadow: inset 2px 4px 16px 0px rgba(248, 248, 248, 0.06);
  overflow: hidden;
  backdrop-filter: blur(50px);
}
.far-right-progress-bar-container4 {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  border-width: 1.5px;
  border-style: solid;
  border-image: linear-gradient(
    158.39deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.03) 100%
  );
  border-image-slice: 1;
  padding: 0px 12px 0px 12px;
  width: 109px;
  height: 32px;
  position: absolute;
  left: 4px;
  top: 50%;
  translate: 0 -50%;
  box-shadow: inset 2px 4px 16px 0px rgba(248, 248, 248, 0.06);
  overflow: hidden;
  backdrop-filter: blur(50px);
}
.header-description2 {
  color: #ffffff;
  text-align: left;
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  position: absolute;
  left: 12px;
  top: 8px;
  width: 80px;
  height: 16px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.far-right-progress-bar-container5 {
  background: rgba(255, 255, 255, 0.01);
  border-radius: 10px;
  border-width: 1.5px;
  border-style: solid;
  border-image: linear-gradient(
    158.39deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.03) 100%
  );
  border-image-slice: 1;
  padding: 4px;
  height: 40px;
  position: absolute;
  right: 16px;
  left: 298px;
  top: calc(50% - -70px);
  box-shadow: inset 2px 4px 16px 0px rgba(248, 248, 248, 0.06);
  overflow: hidden;
  backdrop-filter: blur(50px);
}
.far-right-progress-bar-container6 {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  border-width: 1.5px;
  border-style: solid;
  border-image: linear-gradient(
    158.39deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.03) 100%
  );
  border-image-slice: 1;
  padding: 0px 12px 0px 12px;
  width: 129px;
  height: 32px;
  position: absolute;
  left: 4px;
  top: 50%;
  translate: 0 -50%;
  box-shadow: inset 2px 4px 16px 0px rgba(248, 248, 248, 0.06);
  overflow: hidden;
  backdrop-filter: blur(50px);
}
.header-description3 {
  color: rgba(255, 255, 255, 0.85);
  text-align: left;
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  opacity: 0.5;
  position: absolute;
  left: 12px;
  top: 8px;
  width: 105px;
  height: 16px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.far-right-progress-bar-container7 {
  background: rgba(255, 255, 255, 0.01);
  border-radius: 10px;
  border-width: 1.5px;
  border-style: solid;
  border-image: linear-gradient(
    158.39deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.03) 100%
  );
  border-image-slice: 1;
  padding: 4px;
  height: 40px;
  position: absolute;
  right: 61px;
  left: 99px;
  top: calc(50% - -10px);
  box-shadow: inset 2px 4px 16px 0px rgba(248, 248, 248, 0.06);
  overflow: hidden;
  backdrop-filter: blur(50px);
}
.far-right-progress-bar-container8 {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  border-width: 1.5px;
  border-style: solid;
  border-image: linear-gradient(
    158.39deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.03) 100%
  );
  border-image-slice: 1;
  padding: 0px 12px 0px 12px;
  width: 112px;
  height: 32px;
  position: absolute;
  left: 4px;
  top: 50%;
  translate: 0 -50%;
  box-shadow: inset 2px 4px 16px 0px rgba(248, 248, 248, 0.06);
  overflow: hidden;
  backdrop-filter: blur(50px);
}
.header-description4 {
  color: rgba(255, 255, 255, 0.85);
  text-align: left;
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  opacity: 0.5;
  position: absolute;
  left: 12px;
  top: 8px;
  width: 88px;
  height: 16px;
  text-overflow: ellipsis;
  overflow: hidden;
}
.user-icon {
  width: 20px;
  height: 20px;
  position: absolute;
  left: 100px;
  top: 76px;
  overflow: visible;
}
.text {
  padding: 0px 24px 0px 24px;
  display: flex;
  flex-direction: column;
  gap: 24px;
  color: white;
  align-items: center;
  justify-content: flex-start;
  align-self: stretch; 
  text-align: center;
  flex-shrink: 0;
  position: relative;
  /* width: 50%;  */
  min-height: 110px;
}
.header-inner {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex-shrink: 0;
  position: relative;
}
.feature-title {
  color: #ffffff;
  text-align: left;
  font-family: "Poppins";
  font-size: 20px;
  font-weight: 500;
  position: relative;
  align-self: stretch;
}
.feature-description {
  color: rgba(255, 255, 255, 0.85);
  text-align: left;
  font-family: "Poppins-Regular", sans-serif;
  font-size: 16px;
  font-weight: 400;
  position: relative;
  align-self: stretch;
}
.illustration2 {
  align-self: stretch;
  flex-shrink: 0;
  height: 315px;
  position: relative;
  overflow: hidden;
  width: 50%;
}
.feature-illustration-box {
  height: auto;
  position: absolute;
  right: 0px;
  left: 0px;
  bottom: 0px;
  top: 0px;
  overflow: visible;
}
.mark {
  position: absolute;
  inset: 0;
}
.datapoint-outer-ellipse {
  background: linear-gradient(
      to left,
      rgba(25, 28, 31, 0.5),
      rgba(25, 28, 31, 0.5)
    ),
    linear-gradient(
      to left,
      rgba(255, 255, 255, 0.01),
      rgba(255, 255, 255, 0.01)
    );
  border-radius: 50%;
  border-width: 1px;
  border-style: solid;
  border-image: linear-gradient(
    158.39deg,
    rgba(255, 255, 255, 0.12) 0%,
    rgba(255, 255, 255, 0.03) 100%
  );
  border-image-slice: 1;
  width: 20px;
  height: 20px;
  position: absolute;
  left: calc(50% - -74px);
  top: calc(50% - 79.5px);
  box-shadow: 0px 32px 24px -16px rgba(0, 0, 0, 0.4),
    inset 0px 0px 8px 0px rgba(248, 248, 248, 0.25);
  backdrop-filter: blur(6px);
}
.datapoint-inner-ellipse {
  background: #ffffff;
  border-radius: 50%;
  width: 10px;
  height: 10px;
  position: absolute;
  left: calc(50% - -79px);
  top: calc(50% - 74.5px);
}
.cursor-02 {
  width: 20px;
  height: 20px;
  position: absolute;
  left: calc(50% -89px);
  top: calc(50% - 64.5px);
  overflow: visible;
}
/* Removed .feature-card2 styles - now using unified .feature-card */
.illustration3 {
  flex-shrink: 0;
  /* width: 846px; */
  width: 50%;
  height: 587px;
  position: relative;
  overflow: visible;
}


/* Removed old .text2, .feature-title2, .header-description6 styles - now using unified classes */
.buttonTestimonial {
  background: rgba(255, 255, 255, 0.85);
  border-radius: 100px;
  border-width: 1px;
  border-style: solid;
  border-image: linear-gradient(
    158.39deg,
    rgba(25, 28, 31, 0.05) 0%,
    rgba(25, 28, 31, 0.01) 100%
  );
  border-image-slice: 1;
  padding: 12px 32px 12px 32px;
  display: flex;
  flex-direction: row;
  gap: 0px;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
  box-shadow: inset 2px 4px 16px 0px rgba(25, 28, 31, 0.1);
  backdrop-filter: blur(50px);
}
.get-started {
  color: rgba(25, 28, 31, 0.85);
  text-align: center;
  font-family: "Poppins";
  font-size: 16px;
  font-weight: 500;
  position: relative;
}
/* Text styling for all feature cards - override conflicting .text styles */
.why-slickpay-section .feature-card .text {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  padding: 0 !important;
  position: static !important;
  height: auto !important;
  flex: 1 !important; /* Allow text to grow and fill available space */
  top: auto !important;
  bottom: auto !important;
  left: auto !important;
  right: auto !important;
  overflow: visible !important;
}

.why-slickpay-section .feature-card .header-inner {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  align-items: center !important;
  width: 100% !important;
  position: static !important;
}

.why-slickpay-section .feature-card .feature-title {
  color: #ffffff !important;
  font-family: "Poppins", sans-serif !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  position: static !important;
  text-align: center !important;
}

.why-slickpay-section .feature-card .feature-description {
  color: rgba(255, 255, 255, 0.85) !important;
  font-family: "Poppins", sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
  margin: 0 !important;
  position: static !important;
  text-align: center !important;
}

/* Video assets styling - make them bigger */
.why-slickpay-section .feature-card .videoAssets {
  width: 100% !important;
  max-width: 280px !important;
  height: 200px !important;
  object-fit: contain !important;
  border-radius: 12px !important;
  position: static !important;
  flex-shrink: 0 !important; /* Prevent video from shrinking */
}

/* Responsive adjustments - larger gifs and more specific selectors */
@media (max-width: 1280px) {
  .why-slickpay-section .feature-card {
    padding: 20px !important;
    gap: 16px !important;
  }
  
  .why-slickpay-section .feature-card .videoAssets {
    max-width: 240px !important;
    height: 180px !important;
  }
  
  .why-slickpay-section .feature-card .feature-title {
    font-size: 18px !important;
  }
  
  .why-slickpay-section .feature-card .feature-description {
    font-size: 15px !important;
  }
}

@media (max-width: 768px) {
  .why-slickpay-section .feature-card {
    padding: 16px !important;
    gap: 12px !important;
  }
  
  .why-slickpay-section .feature-card .videoAssets {
    max-width: 200px !important;
    height: 150px !important;
  }
  
  .why-slickpay-section .feature-card .feature-title {
    font-size: 16px !important;
  }
  
  .why-slickpay-section .feature-card .feature-description {
    font-size: 14px !important;
  }

  .testimonial-group-1 , .testimonial-group-2 , .pricing-row-1 {
    flex-shrink: 0;
    /* width: 1776px; */
    width: 100%;
    height: auto;
    position: static;
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
  }

  .testimonial-group-1 > div, .testimonial-group-2 > div , .pricing-plan-card{
    width: 40%;
  }

}

@media (max-width: 700px) { 
  .testimonial-group-1 > div, .testimonial-group-2 > div , .pricing-plan-card{
    width: 60%;
  }
}