.recent-sec { width: 100%; display: inline-block; padding: 0px 0 0px 0; }
.recent-sec .recent-inner { width: 100%; display: inline-block; padding: 0px 0 0 0;}
.recent-sec .recent-top { align-items: stretch; display: flex; gap: 60px; justify-content: space-between; width: 100%; }
.recent-sec .left { align-items: flex-start; display: flex; flex-direction: column; justify-content: space-between; width: auto; margin: 0; }
.recent-sec .title{ width: 100%; display: inline-block; }
.recent-sec .title .suptitle { margin: 0; font-family:var(--primary_font_semibold);font-weight:600; font-size: 24px; line-height: 34px; }
.recent-sec .title .subtitle { width: 100%; display: inline-block; margin: 0; font-family:var(--primary_font_semibold); font-weight:600;font-size: 36px; line-height: 42px; }

.recent-sec .right { display: inline-block; width: auto; margin: 0; }
.recent-sec .right ul { width: auto; display: flex; align-items: flex-start; justify-content: flex-end; flex-wrap:wrap; gap:30px; padding: 0; margin: 0; }
.recent-sec .right ul li {  display: inline-block; margin: 0; text-align: left; max-width: 100px; }

.recent-sec .right ul li a { width: 100%; display: inline-block; }
.recent-sec .right ul li a .icon { display: inline-block; padding: 10px 15px; text-align: left; width: 100%; background: var(--tertiary_color); line-height: 0; }
.recent-sec .right ul li a .icon img { width: auto; display: inline-block; max-width: 40px; object-fit: contain; object-position: left; }
.recent-sec .right ul li a .label { width: 100%; display: inline-block; padding: 10px 0 0 0; }
.recent-sec .right ul li a .label strong { width: 100%; display: inline-block; font-family:var(--primary_font_semibold); font-weight:600;font-size: 16px; line-height: 18px; color: var(--primary_color); }

.recent-sec .recent-post { display: inline-block; width: 100%; padding:50px 0 0 0; }
.recent-sec .recent-post .cours { display: inline-block; margin: 0; width: 100%; }
.recent-sec .recent-post .cours .bottom, .recent-sec .recent-post .cours .top { display: inline-block; width: 100%; }
.recent-sec .recent-post .cours .bottom { padding: 20px 0 0; position: relative; z-index: 1; }
.recent-sec .recent-post .top .image { display: inline-block; width: 100%;  }
.recent-sec .recent-post .top .image img { display: inline-block; line-height: 0; object-fit: cover; object-position: top; vertical-align: top; width: 100%; height: 230px; }
.recent-sec .recent-post .bottom .title { font-family: var(--secondary_font);display: inline-block; font-size: 20px; font-weight: 500; line-height: 28px; padding: 0; width: 100%; }
.recent-sec .recent-post .bottom .title a{display:block;text-decoration:none;}
.recent-sec .recent-post .bottom .title i {font-family: var(--secondary_font) display: inline-block;  width: 100%; font-weight: 400; }
.recent-sec .recent-post .bottom .info { align-items: center; display: flex; flex-wrap: wrap; gap: 20px; justify-content: flex-start; padding-top: 10px; width: 100%; }
.recent-sec .recent-post .bottom .info div,.recent-sec .recent-post .bottom .info a { text-decoration:none;color: var(--primary_color); display: inline-block; font-size: 14px;  line-height: 22px; margin: 0; position: relative; width: auto; z-index: 1; }
.recent-sec .recent-post .bottom .info div + div:after,.recent-sec .recent-post .bottom .info a + div:after{ background: var(--primary_color); content: ""; height: 50%; left: -10px; position: absolute; top: 50%; transform: translateY(-50%); width: 1px; }

.recent-sec .post_arrows { align-items: center; display: flex; justify-content: center; margin: 50px auto 0 auto; position: relative; width: 100%; z-index: 1; max-width: 280px; }
.recent-sec .post_counter {  font-size: 16px; line-height: 26px; width: auto; display: inline-block; padding: 0; }
.recent-sec .post_arrow.slick-arrow { background-position: center; background-repeat: no-repeat; background-size: contain; width: 18px; height: 18px; cursor: pointer; position: absolute; }
.recent-sec .post_arrow_left { background-image: url(https://25747658.fs1.hubspotusercontent-eu1.net/hubfs/25747658/Luma-arles-2025/left-arrow.png); left:0; }
.recent-sec .post_arrow_right { background-image: url(https://25747658.fs1.hubspotusercontent-eu1.net/hubfs/25747658/Luma-arles-2025/right-arrow.png); right: 0; }

.recent-sec .splide__pagination { bottom: -50px; }
.recent-sec .splide__pagination li button { width: 20px; height: 6px; border: none !important; border-radius: 0; margin: 3px; opacity: 1; background: var(--quaternary_color); }
.recent-sec.small_dots .splide__pagination li button{width:12px;}
.recent-sec .splide__pagination li button.is-active { background: var(--tertiary_color); opacity: 1; transform: scale(1); }

@media(max-width:991px){
  .recent-sec .recent-post .bottom .title{line-height:25px;}
  .recent-sec .title .suptitle { font-size: 20px; line-height: 24px; }
  .recent-sec .title .subtitle { font-size: 26px; line-height: 34px; }
  .recent-sec .recent-top { gap: 30px; }
  .recent-sec .right ul { gap: 20px; }
}

@media(max-width:767px){
  .recent-sec .recent-top { flex-wrap: wrap; }
  .recent-sec .left, .recent-sec .right { width: 100%; }
  .recent-sec .right ul { justify-content: flex-start; flex-wrap: wrap; }
  .recent-sec .right ul li { width: 100%; display: inline-block; max-width: 100%; }
  .recent-sec .right ul li a { display: flex; flex-direction: row-reverse; gap: 16px; }
  .recent-sec .right ul li a .icon { max-width: 70px; text-align: center; padding: 10px; }
  .recent-sec .recent-inner { padding: 40px 0 0; }
  .recent-sec { padding: 40px 0 80px 0; }
  .recent-sec .right ul li a .label { padding: 0; display: flex; align-items: center; justify-content: flex-start; }
  .recent-sec .recent-post .top .image img { height: auto; }
  .recent-sec .recent-post .cours .bottom { background: var(--quaternary_color); padding: 30px 10px; }
  .recent-sec .recent-post .bottom .info { gap: 10px; }
/*   .recent-sec .recent-post .bottom .info div + div:after { left: -5px; } */
/*   .recent-sec .recent-post .bottom .info div { font-size: 12px; line-height: 20px; } */
  .recent-sec .post_arrows { margin: 20px auto 0; }
  .recent-sec .post_arrows { display: none; }
  .recent-sec .container { padding-left: 0; padding-right: 0; }
  .recent-sec .container .recent-top { padding-left: 30px; padding-right: 30px; }
}