.events-grid {
     padding-block: 64px;
     background: var(--Brand-600, #1434CB);
     color: #fff;
     position: relative;
     z-index: 0;
 }

 .event-globe {
     position: absolute;
     left: 0;
     bottom: 0;
     width: 200px;
     z-index: -1 !important;
 }

 .event-dot {
     display: flex;
     padding-top: 2px;
 }

 .events-grid::before {
     content: url(../../images/events/flower_375.svg);
     position: absolute;
     right: 0;
     top: 47px;
     max-width: 68px;
 }


 .events-grid * {
     z-index: 1
 }

 .events-grid .section-header {
     text-align: center;
     margin-bottom: 40px !important;
 }

 .events-grid .section-header .section-title {
     color: #fff;
     justify-content: center;
     margin: auto;
 }

 .events-grid .cards-container {
     display: flex;
     flex-direction: column;
     gap: 16px;
 }

 .events-grid .cards-container .card {
     flex: 1;
     position: relative;
     border-radius: 16px;
     min-height: 224px;
     background: var(--Brand-700, #102BA5);
     border: 1px solid var(--Brand-300, #3F71FF);
     box-shadow: 0 4px 20px 0 rgba(0, 0, 0, 0.15);
 }

 .events-grid .cards-container .card img {
     border-radius: 16px 16px 0 0;
 }

 .card-slider {
     position: relative;
     display: block;
     width: 100%;
     overflow: hidden;
     border-radius: 16px 16px 0 0;
     z-index: 2;
 }

 .card-slider .slick-list {
     overflow: hidden;
 }

 .card-slider .slick-track {
     display: flex !important;
 }

 .card-slider .slick-slide {
     height: auto !important;
     display: flex !important;
     align-items: stretch;
     justify-content: center;
 }

 .card-slider .slick-slide img {
     width: 100%;
     height: auto;
     object-fit: cover;
     display: block;
     border-radius: 16px 16px 0 0;
 }

 /* Dots on top of image */
 .card-slider .slick-dots {
     position: absolute;
     bottom: 20px;
     left: 50%;
     transform: translateX(-50%);
     z-index: 3;
     display: flex !important;
     justify-content: center;
     gap: 8px;
 }

 .card-slider .slick-dots li button:before {
     font-size: 10px;
     color: #fff;
     opacity: 0.7;
 }

 .card-slider .slick-dots li.slick-active button:before {
     opacity: 1;
 }

 .events-grid .card-content {
     padding: 24px;
     display: flex;
     flex-direction: column;
     gap: 32px
 }

 .btn.btn-outline-white {
     color: var(--white);
     background: transparent;
     border-color: var(--white);
 }

 .btn.btn-outline-white:where(:hover, :focus) {
     color: var(--blue);
     background: var(--white);
 }

 .cards-text {
     display: flex;
     flex-direction: column;
     gap: 24px
 }

 .events-grid .agile-lottie {
     display: none;
 }

 .events-grid .card-content :is(.heading-2, .heading-3, .heading-4) {
     color: #fff;
 }

 .events-grid .container-custom {
     width: 100%;
     margin: auto
 }

 .event-venue-container {
     display: flex;
     align-items: center;
     gap: 16px;
 }

 .card-translate {
     position: relative;
 }
.card.card-translate .slick-dotted.slick-slider {
  margin-bottom: 0px;
}
 /* design screen 768px and above */
 @media (min-width: 768px) {
     .events-grid::before {
         content: url(../../images/events/flower_1024.svg);
     }

     .events-grid {
         padding-block: 80px;
         background-size: 222px;
     }

     .events-grid .card-content {
         padding: 32px;
         gap: 48px
     }

     .events-grid::before {
         max-width: 124px
     }

     .event-globe {
         width: 295px;
     }

     .events-grid .agile-lottie {
         display: block;
         text-align: center;
         max-width: 410px;
         margin: auto
     }

     .events-grid .section-header {
         margin-bottom: 20px !important;
     }

     .events-grid .cards-container .card {
         min-height: 231px;
     }

     .events-grid .agile-lottie .lottie-img,
     .events-grid .agile-lottie img {
         max-width: 100%;
         margin: auto;
     }

     .events-grid .cards-container {
         flex-direction: row;
         justify-content: center;
         gap: 24px;
     }

     .card-translate {
        bottom: 48px; 
     }

     .events-grid .cards-container .card {
         max-width: 348px;
     }
 }

 @media (min-width: 992px) and (max-width: 1200px) {
     .cta-band .container-sm {
         max-width: 840px;
     }
 }

 /* design screen 1024px = 992px and above */
 @media (min-width: 992px) {
     .events-grid {
         background-size: 295px;
     }

     .events-grid .agile-lottie {
         max-width: 538px
     }

     .card-translate {
        bottom: 72px;  
     }

     .events-grid .section-header {
         margin-bottom: 42px !important;
     }

     .events-grid .cards-container .card {
         max-width: 452px;
     }
 }

 /* design screen 1366px = 1200px and above */
 @media (min-width: 1200px) {
     .events-grid::before {
         content: url(../../images/events/flower_art.svg);
     }

     .events-grid {
         padding-block: 120px;
         background-size: 376px;
     }

     .events-grid .section-header {
         margin-bottom: 68px !important;
     }

     .card-translate {
        bottom: 80px;  
     }

     .events-grid .agile-lottie {
         max-width: 758px
     }

     .events-grid .cards-container .card {
         border-radius: 24px
     }

     .event-globe {
         width: 377px;
     }

     .events-grid .cards-container .card img {
         border-radius: 24px 24px 0 0;
     }

     .card-slider .slick-slide img {
         border-radius: 24px 24px 0 0;
     }

     .events-grid .card-content {
         padding: 56px;
         gap: 60px
     }

     .events-grid .cards-container .card {
         max-width: 599px;
     }

     .event-venue-container {
         gap: 24px;
     }
 }

 @media (min-width: 1200px) and (max-width: 1600px) {
     .cta-band .container-sm {
         max-width: 1009px;
     }
 }

 /* design screen 1920px = 1601px and above */
 @media (min-width: 1601px) {
     .events-grid .section-header {
         margin-bottom: 60px !important;
     }

     .events-grid .cards-container {
         gap: 34px
     }

     .events-grid .card-content {
         gap: 80px
     }

     .events-grid {
         padding-block: 160px;
         background-size: 377px;
     }

     .events-grid .cards-container {
         justify-content: center;
     }

     .events-grid .cards-container .card {
         max-width: 713px;
     }

     .cta-band .container-sm {
         max-width: 1329px !important;
     }
 }