:root {
     --ys-primary: #605BE5;
     --ys-primary-light: #f5f3ff;
     --ys-dark: #0f172a;
     --ys-slate: #64748b;
     --ys-border: #e2e8f0;
 }

 .pricing-table-modern {
     width: 100%;
     border-radius: 15px;
     overflow: hidden;
     border: 1px solid var(--ys-border);
 }

 .pricing-table-modern thead th {
     background: var(--ys-dark);
     color: #fff;
     padding: 20px;
     font-weight: 600;
 }

 .pricing-table-modern td {
     padding: 18px 20px;
     border-bottom: 1px solid var(--ys-border);
     transition: 0.2s;
 }

 .pricing-table-modern tr:hover td {
     background: var(--ys-primary-light);
 }

 .info-pricing .pricing-table-modern tbody tr:nth-child(odd) td {
     background: #f5f3ff;
 }


 .ys-steps-wrapper {
     padding: 50px 0;
     background: #f2eeff;
     position: relative;
 }

 .ys-steps-wrapper .step-path-container {
     position: relative;
     display: flex;
     flex-wrap: wrap;
     gap: 30px;
 }

 .ys-steps-wrapper .step-item-new {
     flex: 1;
     min-width: 300px;
     position: relative;
     padding: 40px;
     border-radius: 24px;
     background: #fff;
     border: 1px solid #f1f5f9;
     transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
     overflow: hidden;
     z-index: 1;
 }

 /* Background Big Number Text */
 .ys-steps-wrapper .step-bg-number {
     position: absolute;
     top: -20px;
     right: -10px;
     font-size: 150px;
     font-weight: 900;
     color: rgba(96, 91, 229, 0.04);
     line-height: 1;
     z-index: -1;
     transition: 0.5s;
     user-select: none;
 }

 .ys-steps-wrapper .step-item-new:hover {
     border-color: var(--ys-primary);
     box-shadow: 0 30px 60px rgba(96, 91, 229, 0.1);
     transform: translateY(-10px);
 }

 .ys-steps-wrapper .step-item-new:hover .step-bg-number {
     color: rgba(96, 91, 229, 0.08);
     transform: scale(1.1) translateX(-20px);
 }

 /* Decorative Icon Circle */
 .ys-steps-wrapper .step-icon-wrap {
     width: 60px;
     height: 60px;
     background: linear-gradient(135deg, var(--ys-primary) 0%, #a78bfa 100%);
     border-radius: 16px;
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 25px;
     color: #fff;
     font-size: 24px;
     box-shadow: 0 10px 20px rgba(96, 91, 229, 0.2);
 }

 .ys-steps-wrapper .step-content h4 {
     font-size: 22px;
     font-weight: 700;
     color: var(--ys-dark);
     margin-bottom: 15px;
 }

 .ys-steps-wrapper .step-content p {
     color: #64748b;
     font-size: 16px;
     line-height: 1.7;
     margin: 0;
 }

 /* Connecting Arrow Line for Desktop */
 @media (min-width: 992px) {
     .ys-steps-wrapper .step-item-new:not(:last-child)::after {
         content: "\f061";
         /* FontAwesome Right Arrow */
         font-family: "Font Awesome 6 Free";
         font-weight: 900;
         position: absolute;
         top: 50%;
         right: -25px;
         transform: translateY(-50%);
         color: var(--ys-primary);
         font-size: 20px;
         opacity: 0.3;
         animation: arrowMove 2s infinite;
     }
 }

 @keyframes arrowMove {

     0%,
     100% {
         transform: translate(0, -50%);
         opacity: 0.3;
     }

     50% {
         transform: translate(10px, -50%);
         opacity: 0.8;
     }
 }

 /* Step badge pill (opt-in via .info-steps) */
 .info-steps .step-badge {
     display: inline-block;
     padding: 4px 14px;
     margin-bottom: 18px;
     border-radius: 50px;
     background: rgba(96, 91, 229, 0.12);
     color: var(--ys-primary);
     font-size: 12px;
     font-weight: 800;
     letter-spacing: .04em;
 }

 @media (min-width: 992px) {
     .info-steps .step-item-new:not(:last-child)::after {
         content: none;
     }
 }