/* xl - DESKTOP STYLES */ 
      .cai-active-bg-vertical {
        background: #e74dff;
        border-radius: 30px;
      }
      .cai-inactive-bg-vertical {
        background: #e74dff;
        border-radius: 30px;
        border: 1px solid #fff;
      }
      .cai-after-text-vertical,
      .cai-before-text-vertical {
        transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        border-radius: 30px;
        border: 1px solid #fff;
      }
      .cai-after-text-vertical {
        transform: translateY(-55px);
      }
      .cai-before-text-vertical {
        transform: translateY(55px);
      }
      .cai-after-text-vertical.cai-active-bg-vertical {
        border-radius: 13px 13px 0 0;
        border-bottom: none;
        transform: translateY(0);
        cursor: default;
        pointer-events: none;
      }
      .cai-before-text-vertical.cai-active-bg-vertical {
        border-radius: 0 0 13px 13px;
        border-top: none;
        transform: translateY(0);
        cursor: default;
        pointer-events: none;
      }
      .cai-after-text-vertical.cai-inactive-bg-vertical {
        transform: translateY(-55px);
        cursor: pointer;
        pointer-events: auto;
      }
      .cai-before-text-vertical.cai-inactive-bg-vertical {
        transform: translateY(55px);
        cursor: pointer;
        pointer-events: auto;
      }

      .cai-after-image-vertical,
      .cai-before-image-vertical {
        transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
        transform: translateY(0); /* always visible */
      }

      .cai-after-image-vertical.cai-blurred-vertical,
      .cai-before-image-vertical.cai-blurred-vertical {
        filter: blur(4px);
        opacity: 0.9;
      }

      .cai-slider-vertical {
        position: relative;
        width: 100%;
        height: 100%;
        max-width: 1200px;
        /* max-height: 1000px; */
        min-height: 550px;
        /* margin: 0 auto;  */
        overflow: hidden;
        user-select: none;
        cursor: default;
        border-radius: 24px;
        background: linear-gradient(
          214deg,
          rgba(110, 100, 190, 0.8),
          rgba(130, 120, 210, 0.7)
        );
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        box-shadow: 0 8px 32px rgba(90, 80, 170, 0.4);
      }

      .cai-before-container-vertical {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        overflow: hidden;
        user-select: none;
        padding: 15px;
        background: linear-gradient(
          214deg,
          rgba(25, 10, 60, 0.8),
          rgba(37, 20, 79, 0.9),
          rgba(20, 5, 50, 0.7),
          rgba(30, 15, 65, 0.8)
        );
        backdrop-filter: blur(25px);
        -webkit-backdrop-filter: blur(25px);
        box-shadow: 0 8px 32px rgba(15, 5, 40, 0.5);
        -webkit-mask-image: linear-gradient(
          to bottom,
          black 80%,
          transparent 80%
        );
        mask-image: linear-gradient(to bottom, black 80%, transparent 80%);
        transition: none;
      }

      .cai-slider-divider-vertical {
        position: absolute;
        left: 0;
        right: 0;
        height: 2px;
        cursor: default;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: visible;
        top: 80%;
        background: linear-gradient(
          90deg,
          rgb(101, 77, 247) 0%,
          rgb(141, 142, 253) 100%
        );
        z-index: 10;
        pointer-events: none;
      }

      .cai-slider-handle-vertical {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        display: flex;
        flex-direction: column;
        background: transparent;
        overflow: visible;
        white-space: nowrap;
        width: auto;
        z-index: 20;
        gap: 0;
        pointer-events: none;
      }

      .cai-slider-text-vertical {
        flex: 0 0 auto;
        transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        overflow: hidden;
        color: #fff;
        text-align: center;      
        font-size: 11.475px;
        font-style: normal;
        font-weight: 500;
        line-height: 14.344px;
        padding: 10px 14px;
        white-space: nowrap;
        display: flex;
        align-items: center;
        justify-content: center;
        min-height: 36px;
        margin: 0;
        background: #e74dff;
        min-width: 110px;
        position: relative;
        cursor: pointer;
        pointer-events: auto;
      }

      /* Responsive adjustments */
      /* Large screen reveal adjustments */

      @media (max-width: 1024px) {
        /* .cai-slider-vertical {
          height: 90vh;
          min-height: 850px;
        } */		
	  
      .cai-before-text-vertical {
        transform: translateY(40px);
      }
		
      .cai-before-text-vertical.cai-inactive-bg-vertical {
        transform: translateY(40px);
       
      }

        .cai-after-image-vertical {
          padding: 20px 25px;
          transform: translateY(80px) scaleX(0.75) scaleY(0.7);
          /* object-position: center 60%; */
        }
        .cai-before-image-vertical {
          transform: translateY(-50px) scaleX(0.3) scaleY(0.3);
          /* object-position: center 40%; */
        }
      }

    @media (max-width: 912px)  { 
		
		.cai-before-text-vertical {
        transform: translateY(35px);
      }
		
      .cai-before-text-vertical.cai-inactive-bg-vertical {
        transform: translateY(35px);
       
      }
		
	   .cai-after-text-vertical {
        transform: translateY(-50px);
      }      
     
      .cai-after-text-vertical.cai-inactive-bg-vertical {
        transform: translateY(-50px);
      
      }

       .cai-after-image-vertical {
          padding: 10px 15px;
          transform: translateY(105px) scaleX(0.7) scaleY(0.7);
          /* object-position: center 60%; */
        }
        .cai-before-image-vertical {
          transform: translateY(-75px) scaleX(0.29) scaleY(0.29);
          /* object-position: center 40%; */
        }
}

     @media (max-width: 768px) {
       
        .cai-after-image-vertical {
          /* padding: 5px 20px; 
          object-position: center 65%; */
          transform: translateY(140px) scaleX(0.8) scaleY(0.8);
        }
        .cai-before-image-vertical {
          /* object-position: center 35%; */
          transform: translateY(-52px) scaleX(0.4) scaleY(0.4);
        }
        /* .cai-before-container-vertical {
          padding: 15px 30px;
        } */
      }

    @media (max-width: 640px) {
       
        .cai-after-image-vertical {
          /* padding: 5px 20px; 
          object-position: center 65%; */
          transform: translateY(200px) scaleX(0.9) scaleY(0.9);
        }
        .cai-before-image-vertical {
          /* object-position: center 35%; */
          transform: translateY(-70px) scaleX(0.45) scaleY(0.45);
        }
        /* .cai-before-container-vertical {
          padding: 15px 30px;
        } */
      }

    @media (max-width: 540px) {
		
	  .cai-after-text-vertical {
        transform: translateY(-50px);
      }      
     
      .cai-after-text-vertical.cai-inactive-bg-vertical {
        transform: translateY(-50px);
      
      }
		.cai-after-image-vertical {
          /* padding: 5px 20px; 
          object-position: center 65%; */
          transform: translateY(200px) scaleX(0.9) scaleY(0.9);
        }
        .cai-before-image-vertical {
          /* object-position: center 35%; */
          transform: translateY(-70px) scaleX(0.55) scaleY(0.55);
        }
        /* .cai-before-container-vertical {
          padding: 15px 30px;
        } */
      }

      @media (max-width: 480px) {
       
        .cai-after-image-vertical {
          /* padding: 12px 25px; */
          /* object-position: center 70%; */
          transform: translateY(255px) scaleX(1) scaleY(1);
        }
        .cai-before-image-vertical {
          /* object-position: center 30%; */
          transform: translateY(-69px) scaleX(0.62) scaleY(0.62);
          /* transform: translateY(0); */
        }
      }

      @media (max-width: 450px) {
       
        .cai-after-image-vertical {
          /* padding: 12px 25px; */
          /* object-position: center 70%; */
          transform: translateY(255px) scaleX(1) scaleY(1);
        }
        .cai-before-image-vertical {
          /* object-position: center 30%; */
          transform: translateY(-65px) scaleX(0.7) scaleY(0.7);
          /* transform: translateY(0); */
        }
      }

      @media (max-width: 380px) {
        .cai-after-image-vertical {
          /* padding: 12px 25px; */
          /* object-position: center 70%; */
          transform: translateY(280px) scaleX(1) scaleY(1);
        }
        .cai-before-image-vertical {
          /* object-position: center 30%; */
          transform: translateY(-71px) scaleX(0.84) scaleY(0.84);
          /* transform: translateY(0); */
        }
       
      }

   @media (max-width: 345px) {
        .cai-after-image-vertical {
          /* padding: 12px 25px; */
          /* object-position: center 70%; */
          transform: translateY(280px) scaleX(1) scaleY(1);
        }
        .cai-before-image-vertical {
          /* object-position: center 30%; */
          transform: translateY(-66px) scaleX(0.91) scaleY(0.91);
          /* transform: translateY(0); */
        }
       
      }