/* Start: TDL Main */
.cms_tdl_main { width: 100%; }
@media screen and (min-width: 641px) and (max-width: 1200px) { .cms_tdl_main { display: flex; flex-direction: column; gap: 30px; padding: 30px; } }
@media screen and (min-width: 641px) and (max-width: 959px) { .cms_tdl_main { gap: 15px; } }
/* End: TDL Main */

/* Start: TDL Swiper */
@media screen and (min-width: 1201px) {
    .tdlSwiper .swiper-wrapper { display: flex; flex-wrap: wrap; width: 100%; padding: 25px; box-sizing: border-box; }
    .tdlSwiper .swiper-slide { width: 33.3333%; padding: 5px; }
}
@media screen and (min-width: 641px) and (max-width: 1200px) { .tdlSwiper { overflow: visible; clip-path: inset(-100vw); } }
@media screen and (max-width: 640px) {
    .tdlSwiper .swiper-wrapper { display: flex; flex-wrap: wrap; width: 100%; padding: 25px; box-sizing: border-box; }
    .tdlSwiper .swiper-slide { width: 100%; padding: 5px; }
}
/* End: TDL Swiper */

/* Start: TDL Swiper Buttons */
.tdlSwiper-button-lst { display: flex; align-items: center; gap: 15px; }
.tdlSwiper-button { cursor: pointer; transition: var(--transition); will-change: transform; }
.tdlSwiper-button-prev:not(.swiper-button-disabled):hover { transform: translateX(-5px); }
.tdlSwiper-button-next:not(.swiper-button-disabled):hover { transform: translateX(5px); }
.tdlSwiper-button.swiper-button-disabled { cursor: auto; opacity: 0.3; }
.tdlSwiper-button > svg { display: flex; width: 18px; height: 24px; }
.tdlSwiper-button > svg > path { fill: var(--primary); }
@media screen and (min-width: 1201px) { .tdlSwiper-button-lst { display: none; } }
@media screen and (max-width: 640px) { .tdlSwiper-button-lst { display: none; } }
/* End: TDL Swiper Buttons */

/* Start: TDL Intro */
.cms_tdlIntro_box { display: flex; align-items: flex-end; width: 100%; padding: 37px; background: var(--primary); }
.cms_tdlIntro_box > h2 { color: var(--white); }
@media screen and (max-width: 640px) { .cms_tdlIntro_box { display: none; } }
/* End: TDL Intro */

/* Start: TDL */
.cms_tdl_box { position: relative; width: 100%; }
.cms_tdl_imgContainer { position: relative; z-index: 1; width: 100%; overflow: clip; }
.cms_tdl_imgBox { width: 100%; }
.cms_tdl_imgBox:before { content: ""; position: absolute; z-index: 2; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 100%); }
.cms_tdl_imgBox > picture { display: flex; width: 100%; padding: 0 0 100% 0; }
.cms_tdl_imgBox > picture > img { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-position: center; object-fit: cover; transition: var(--transition); }
.cms_tdl_box:hover .cms_tdl_imgBox > picture > img { transform: scale(1.1); }
.cms_tdl_imgLegend { display: none; }
.cms_tdl_info { position: absolute; z-index: 2 !important; bottom: 38px; left: 50px; transform: translateY(66px); display: flex; flex-direction: column; gap: 16px; width: calc(100% - 100px); transition: var(--transition); will-change: transform; }
.cms_tdl_box:hover .cms_tdl_info { transform: translateY(0); }
.cms_tdl_text h3 { color: var(--white); }
.cms_tdl_box .button-bg { opacity: 0; visibility: hidden; transition: var(--transition); }
.cms_tdl_box:hover .button-bg { opacity: 1; visibility: visible; }
@media screen and (max-width: 640px) {
    .cms_tdl_info { bottom: 30px; left: 30px; transform: none; width: calc(100% - 60px); }
    .cms_tdl_box .button-bg { display: none; }
}
/* End: TDL */